/*----------  フォント設定  ----------*/
html { font: normal 14px/20px "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic Medium", Meiryo, Arial, "Helvetica Neue", "Helvetica", sans-serif; }

/*----------  ページトップ  ----------*/
#page-top { position: fixed; bottom: 20px; right: 20px; }

/*----------  幅調整  ----------*/
body>div.uk-container.uk-container-center { width: 1070px; }
.uk-container { max-width: 1070px; }
body>div.uk-container.uk-container-center>div.uk-grid>div[class*=uk-width-].sidebar { width: 260px; }
body>div.uk-container.uk-container-center>div.uk-grid>div[class*=uk-width-].main_content { width: calc(1070px - 260px - 10px)/*800px*/; }

/*----------  ページ名、指定テキストを非表示に  ----------*/
div.uk-text-small.uk-text-right { visibility: hidden; }
.hidden-text { display: none; }

/*----------  テキストシャドウ  ----------*/
.uk-link-muted, .uk-link-muted a { text-shadow: 2px 2px 3px #999; }

h1 { text-shadow: 2px 2px 3px #000; }
h2, h3 { text-shadow: 2px 2px 3px #ccc; }

/*----------  画像調整  ----------*/
/*---  画像リンク  ---*/
a:hover{
  img { box-shadow: 0 0 3px 0 rgb(0 0 0 / 0.6); opacity: 0.9; transition: 0.1s; }
  .skill_box-icon_overlay img { box-shadow: 0 0 0 0 rgb(0 0 0 / 0); opacity: 0.9; transition: 0.1s; }
}

/*----------  テーブル調整  ----------*/
table.uk-table th, table.uk-table td { padding: 5px; }
.equally { table-layout: fixed; }
.cke_show_borders table.cke_show_border { table-layout: fixed; }
.table_focus { font-weight: bold; background: #fef4f4; }

/*----------  テーブル固定スクロール  ----------*/
.table_overflow:not(body.cke_editable > .table_overflow) {
  width: 100%;
  max-width: 800px;

  --max-height: 560px;
  --border: 1px solid #ccc;
  --background-th: #4d4d4d;
  --background-td: #fff;

  p { margin-bottom: 0; }
  ul { margin-top: 0; }

  table { border: none; }
  th, td { white-space: nowrap; }

  /*------  列 ＆ 行・列 固定  ------*/
  &.is-horizontal, &.is-cross {
    [scope=row] {
      position: sticky;
      left: 0;
      background: none;
      border-left: none;
      border-right: none;
      &::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-left: var(--border);
        border-right: var(--border);
        background: var(--background-th);
        z-index: -1;
      }
    }
    td[scope=row] { &::before { background: var(--background-td); } }
  }

  /*------  行 固定  ------*/
  &.is-vertical {
    max-height: var(--max-height);
    th[scope=col] {
      position: sticky;
      top: 0;
      border-top: none;
      border-bottom: none;
      background: none;
      z-index: 2;
      &::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-top: var(--border);
        border-bottom: var(--border);
        background: var(--background-th);
        z-index: -1;
      }
    }
    tr { border-left: var(--border); }
  }

  /*------  列 固定  ------*/
  &.is-horizontal { tr:first-child { border-top: var(--border); } }

  /*------  行・列 固定  ------*/
  &.is-cross {
    max-height: var(--max-height);
    th[scope=col] {
      &:not(:first-child) {
        position: sticky;
        top: 0;
        border-top: none;
        border-bottom: none;
        background: none;
        z-index: 2;
        &::before {
          content: "";
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          border-top: var(--border);
          border-bottom: var(--border);
          background: var(--background-th);
          z-index: -1;
        }
      }
      &:first-child {
        position: sticky;
        top: 0;
        left: 0;
        border-top: none;
        border-bottom: none;
        border-left: none;
        border-right: none;
        background: none;
        z-index: 3;
        &::before {
          content: "";
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          border-top: var(--border);
          border-bottom: var(--border);
          border-left: var(--border);
          border-right: var(--border);
          background: var(--background-th);
          z-index: -1;
        }
      }
    }
  }
}


/*----------  ボーダーレステーブル  ----------*/
table.nb-table, table.nb-table th, table.nb-table td { border: none; }
/*--- 入れ子用 ---*/
table.nbc-table, table.nbc-table th, table.nbc-table td { border: none; margin: 0px; }
table.nbc-table td { padding: 0px 5px; }

/*----------  メニューのテーブル調整  ----------*/
#wiki_menu table.uk-table { table-layout: fixed; }
#wiki_menu div.uk-overflow-container { margin-top: 5px; margin-bottom: 5px; }

/*----------  メニューのテーブル内リンク  ----------*/
#wiki_menu td { padding: 0; height: 0; }
#wiki_menu td a {
  height: 100%;
  padding: 5px 5px;
  display: flex;
  box-sizing: border-box;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
#wiki_menu td a:hover {
  background-color: rgb(238 238 238 / 0.9);
  box-shadow: 0 0 3px 0 rgb(0 0 0 / 0.6);
  transition: 0.1s;
}
#wiki_menu td a:hover img { box-shadow: none; }


/*----------  見出し調整  ----------*/
#main_content h1 {
  font-size: 20px;
  color: #eee;
  padding: 4px 12px;
  font-weight: bold;
  background: linear-gradient(to right, rgb(42 42 42 / 1) 40%, rgb(42 42 42 / 0.1) 100%);
}

#main_content h2 {
  font-size: 18px;
  font-weight: bold;
  border-left: 3px solid #2a2a2a;
  border-bottom: 1px dotted #ccc;
  padding: 4px 9px;
}

#main_content h3 {
  font-size: 17px;
  font-weight: bold;
  padding: 0px 9px;
  background: linear-gradient(rgba(255, 255, 255, 0) 70%, #eee 70%);
}

*+h1, *+h2, *+h3, *+h4, *+h5, *+h6 { margin-top: 20px; }

/*----------  目次カスタム  ----------*/
.plugin_contents_custom {
    .plugin_contents_list {
        .plugin_contents_header {
            &.header_level1 {
                display: flex;
                background: #eee;
            }
            &.header_level2 {
                display: inline-flex;
                padding: 0;
                margin: 0;
            }
            &.header_level1, &.header_level2 {
                a {
                    height: 100%;
                    padding: 5px 10px;
                    box-sizing: border-box;
                }
            }
        }
    }
}


/*----------  タイトル付きボックス  ----------*/
.box {
  position: relative;
  max-width: 730px;
  margin: 1.9em auto 0;
  padding: 1em 1.5em;
  border: 2px solid #4d4d4d;
  box-shadow: 2px 2px 2px #ccc;
}
.box .box-title {
  position: absolute;
  top: -1.9em;
  left: -2px;
  padding: .2em .8em;
  border-radius: 5px 5px 0 0;
  background-color: #4d4d4d;
  color: #eee;
}
.box p { margin: 0; padding: 0; }


/*----------  グリッド  ----------*/
.grid_container {
  display: inline-flex;
  flex-wrap: wrap;
  /*justify-content: center;*/
  gap: 10px;
  align-items: stretch;
  padding: 10px;
}
.grid_container-frame { background-color: #fff; border: 1px solid #ccc; box-shadow: 1px 1px 5px #ccc; }

.grid_box-img { max-width: 256px; }
/*.grid_box-note { width: 320px; padding: 10px; text-align: left; }*/
.grid_box-thumb {
  display: inline-block;
  width: 80px;
  font-size: 11px;
  text-align: center;
  line-height: 15px;
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 1px 1px 5px #ccc;
  white-space: normal;
}
.grid_box-thumb img { display: block; margin: 0px auto; /*background-color: #4d4d4d;*/ }
.grid_box-thumb-w img { background-color: #fff; }
.grid_box-thumb_title { display: flex; /*height: 2.8em;*/ padding: 3px 1px; justify-content: center; box-sizing: border-box; }
.grid_box-thumb a { display: block; box-sizing: border-box; width: 100%; height: 100%; }
.grid_box-thumb a:hover img { box-shadow: none; }
.grid_box-thumb a:hover {
  background-color: rgb(238 238 238 / 0.9);
  box-shadow: 0 0 3px 0 rgb(0 0 0 / 0.6);
  transition: 0.1s;
}

.grid_card { width: 360px; padding: 5px; display: flex; justify-content: space-between; }
.grid_card-img { display: inline-block; max-width: 80px; vertical-align: top; text-align: center; }
.grid_card-thumb img { max-width: 80px; }
.grid_card-icon img { max-height: 20px; margin: 5px 0; }
.grid_card-icon { display: flex; justify-content: space-around; align-items: center; }
.grid_card-aff { background-color: #f0f0f0; font-size: 12px; letter-spacing: 0.1em; }
.grid_card-profile { display: inline-block; width: calc(360px - 80px - 5px); }
.grid_card-profile2 { display: inline-block; width: calc(360px - 64px - 5px); }
.grid_card-rarity { width: 32px; height: 21px; vertical-align: bottom; }
.grid_card-name { font-size: 15px; font-weight: bold; margin-left: 3px; }
.grid_card-right_icon { position: absolute; right: 5px; top: 3px; img { max-height: 25px; } }
.grid_card-h { font-size: 11px; }

.grid_card-s { width: 210px; }
.grid_card-s > .grid_card-img > .grid_card-thumb img { margin-bottom: 0px; background-color: #4d4d4d; }
.grid_card-s-profile { display: inline-block; width: calc(210px - 80px - 5px); }


/*----------  タブ切り替え（ベース）  ----------*/
.tab_container { overflow: hidden; }
ul.tab_container { margin: 0; }
.tab_container li { list-style: none; }
ul.tab_list > li, ul.tab_list_toggle > li { cursor: pointer; }
ul.tab_data > li, ul.tab_data_toggle > li { display: none; }
ul.tab_data > li.tab_selected, ul.tab_data_toggle > li.tab_selected { display: block; }
/*------  固定スクロール用  ------*/
.tab_container_scloll, .container_scloll { overflow: auto; max-height: 560px; }

/*---------- タブ切り替え（汎用） ----------*/
.tab_switching { padding: 10px; }
.tab_switching_list {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
  margin-bottom: 10px;
  padding: 0;
}
.tab_switching_list li { width: 50px; }
.tab_switching_list > li.tab_selected { background-color: #87cefa; box-shadow: 0 0 3px 3px #87cefa; }
.tab_switching_list > li:not(.tab_selected):hover { opacity: 0.8; }
.tab_switching_list > li > img { max-width: 50px; height: 100%; }
.tab_switching_data {
  border: 1px solid #ccc;
  box-shadow: 1px 1px 5px #ccc;
  margin: 0;
  padding: 0;
}
.tab_switching-title {
  font-size: 15px;
  color: #eee;
  padding: 4px 10px;
  font-weight: bold;
  background: linear-gradient(to right, rgb(50 50 50 / 1) 40%, rgb(0 0 0 / 0) 100%);
}
.tab_switching-detile {
  padding: 10px;
  padding-top: 0;
}


/*----------  テキストサイズ調整  ----------*/
.text-12px { font-size: 12px; }
.text-11px { font-size: 11px; }


/*----------  左右中央寄せ  ----------*/
.left { text-align: left; }
.right { text-align: right; }
.center { text-align: center; }


/*----------  チェックボックス・ラジオボタン調整  ----------*/
.uk-form-controls {
  label {
    display: inline-block;
    margin: 2px 5px;
    &:has(input:checked) {
      background: linear-gradient(rgba(255, 255, 255, 0) 70%, PINK 70%);
    }
  }
}

/*=============================================
=            データベースリスト表示           =
=============================================*/
.dblist_box {
  display: flex;
  flex-direction: column;
  width: 100px;
  font-size: 12px;
  text-align: left;
  line-height: 16px;
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 1px 1px 5px #ccc;
}
.dblist_box-top { display: flex; box-sizing: border-box; width: 100%; height: 100%; }
.dblist_box-bottom { margin-top: auto; }
.dblist_box a { display: flex; box-sizing: border-box; width: 100%; padding: 5px; }
.dblist_box a:hover {
  background-color: rgb(238 238 238 / 0.9);
  box-shadow: 0 0 3px 0 rgb(0 0 0 / 0.6);
  transition: 0.1s;
}

#db_data_list[data-wikidb_id] div.uk-margin-bottom { display: grid; justify-content: center; grid-gap: 10px; align-items: stretch; }

/*-----  昇順・降順並び替え  -----*/
.sort_toggle { position: fixed; cursor: pointer; z-index: 100; }
@media screen and (max-width:767px) { .sort_toggle { bottom: 90px; right: 12px; } }
@media screen and (min-width:768px) { .sort_toggle { bottom: 30px; right: 50px; } }
.uk-icon-button { background: #fcfcfc; box-shadow: 0 0 5px #999; }


/*----------  キャラクターリスト  ----------*/
.cos_name { display: block; }
.chat_group { display: inline-block; background-color: #f0f0f0; border-radius: 5px; padding: 10px; }
.chat_group > span { display: block; text-align: center; margin-top: 3px; }

/*----------  カケジクリスト  ----------*/
.kakejiku-thumb {
  display: inline-block;
  width: 80px;
  font-size: 11px;
  text-align: center;
  line-height: 15px;
}
.kakejiku-thumb img { display: block; margin: 0px auto; }
.kakejiku-thumb_title { display: flex; height: 2.8em; padding: 3px 3px; justify-content: center; }
.kakejiku-thumb a { display: block; box-sizing: border-box; width: 100%; height: 100%; }
.kakejiku-thumb a:hover img { box-shadow: none; }
.kakejiku-thumb a:hover { background-color: rgb(238 238 238 / 0.9); box-shadow: 0 0 3px 0 rgb(0 0 0 / 0.6); transition: 0.1s; }

/*----------  カード表示  ----------*/
/*-----  372px -----*/
/*-- キャラクター --*/
#db_data_list[data-wikidb_id^="character"]:not([class^="uk-overflow-container"]) div.uk-margin-bottom { grid-template-columns: repeat(auto-fit, 372px); }
/*-- カケジク --*/
#db_data_list[data-wikidb_id^="kakejiku"]:not([class^="uk-overflow-container"]) div.uk-margin-bottom { grid-template-columns: repeat(auto-fit, 372px); }
/*-- 武器 --*/
#db_data_list[data-wikidb_id^="weapon"]:not([class^="uk-overflow-container"]) div.uk-margin-bottom { grid-template-columns: repeat(auto-fit, 372px); }
/*-- ツクモ神 --*/
#db_data_list[data-wikidb_id^="tsukumo"]:not([class^="uk-overflow-container"]) div.uk-margin-bottom { grid-template-columns: repeat(auto-fit, 372px); }
/*-- 希少種 --*/
#db_data_list[data-wikidb_id^="kishoshu"]:not([class^="uk-overflow-container"]) div.uk-margin-bottom { grid-template-columns: repeat(auto-fit, 372px); }
/*-----  222px  -----*/
/*-- 遊女 --*/
#db_data_list[data-wikidb_id^="yujo"]:not([class^="uk-overflow-container"]) div.uk-margin-bottom { grid-template-columns: repeat(auto-fit, 222px); }

/*----------  編集用リスト表示  ----------*/
/*-- キャラクター --*/
#db_data_list[data-wikidb_id^="character"] div.uk-margin-bottom,
/*-- プロフィール --*/
#db_data_list[data-wikidb_id^="profile"] div.uk-margin-bottom,
/*-- オトモ行動 --*/
#db_data_list[data-wikidb_id^="ally_actions"] div.uk-margin-bottom,
/*-- カケジク --*/
#db_data_list[data-wikidb_id^="kakejiku"] div.uk-margin-bottom,
/*-- 武器 --*/
#db_data_list[data-wikidb_id^="weapon"] div.uk-margin-bottom,
/*-- ツクモ神 --*/
#db_data_list[data-wikidb_id^="tsukumo"] div.uk-margin-bottom,
/*-- 希少種 --*/
#db_data_list[data-wikidb_id^="kishoshu"] div.uk-margin-bottom,
/*-- 遊女 --*/
#db_data_list[data-wikidb_id^="yujo"] div.uk-margin-bottom { grid-template-columns: repeat(auto-fit, 100px); }

/*#db_data_list[data-wikidb_id^="kishoshu"] div.uk-margin-bottom { grid-template-columns: repeat(auto-fit, 372px); }*/


/*=============================================
=               個別ページ表示                =
=============================================*/
.data_detail_box {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  padding: 5px;
  margin-bottom: 15px;
  background-color: #fff;
  box-shadow: 1px 1px 5px #ccc;
}

.data_img-full { position: relative; display: inline-block; width: calc(100% - 350px - 20px); min-width: 350px; margin: 5px; }
.data_img-full img:not(ul#discovery_data > li img) {
  display: block;
  vertical-align: top;
  background-size: cover;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
}
.data_img-chara img { background-image: url(https://img.wiki3.jp/ragnador/背景画像01.png); }
.data_img-weapon img { background-image: url(https://img.wiki3.jp/ragnador/武器背景.png); }
.data_img-tsukumo img { background-image: url(https://img.wiki3.jp/ragnador/ツクモ神背景.png); }
.data_img-furniture img { background-image: url(https://img.wiki3.jp/ragnador/遊郭家具背景.png); padding: calc((100% - 124px) / 4); }

.data_profile { width: 350px; margin: 5px; }
.data_note { padding: 10px; text-align: left; }
.data_list { border-bottom: 1px solid #ccc; margin-top: 4px; display: flex; }
.data_heading { position: relative; background-color: #f0f0f0; padding: 5px; margin-bottom: 1px; }
.data_heading a { display: flex; width: 100%; }
.data_heading_right_icon img { position: absolute; top: 3px; right: 3px; }
.data_heading a:hover img { box-shadow: none; }
.data_list-half { width: 50%; display: inline-flex; vertical-align: bottom; }
.data_list-half2 { width: 46%; display: inline-flex; vertical-align: bottom; }
.data_list-half3 { width: 54%; display: inline-flex; vertical-align: bottom; }
.data_item-h {
  width: 56px;
  line-height: 28px;
  display: inline-block;
  font-weight: bold;
  color: #eee;
  background-color: #4d4d4d;
  text-align: center;
  border-radius: 0 8px 0 0;
  vertical-align: bottom;
  align-content: center;
}
/*.data_item-d { width: calc(100% - 56px - 9px); display: inline-block; margin: 0 0 2px 9px; align-content: center; }*/
.data_item-d { width: calc(100% - 56px - 9px); display: flex; margin-left: 6px; align-content: center; flex-wrap: wrap; gap: 3px 0; }
.data_item-d img { width: auto; height: 24px; vertical-align: middle; margin: 0 1px; }
.data-item-d-gd { display: flex; }
.data_item-d-bg img { background-color: #66cccc; border: 2px solid #66cccc; border-radius: 3px; }
.data_item-d-space { word-spacing: 4px; }
.data_item-rarity { width: auto; height: 28px; vertical-align: bottom; }
.data_item-name { font-size: 16px; font-weight: bold; line-height: 28px; margin-left: 5px; }
.data_item-icon { display: flex; align-items: center; flex-wrap: wrap;
  img { width: auto; height: 24px; margin-right: 3px; }
}
.data_edit_link { float: right; font-size: 11px; margin-right: 10px; opacity: 0.5; }


/*-- キャラクター用(アバター) --*/
.data_avatar {
  margin-top: 6px;
  background-image: url(https://img.wiki3.jp/ragnador/アバター背景.png);
  background-size: cover;
  overflow: hidden;
}
.data_avatar li { list-style: none; }
ul#data_avatar_list {
  width: 110px;
  height: calc(28px * 7 + 6px);
  font-size: 10.5px;
  margin: 0;
  padding: 0;
  float: right;
  overflow: auto;
  scrollbar-width: none;
}
ul#data_avatar_list > li {
  display: inline-block;
  width: 100%;
  height: 28px;
  line-height: 28px;
  color: #eee;
  background-color: rgb(0 0 0 / 0.4);
  border-bottom: 1px solid rgb(255 255 255 / 0.1);
}
ul#data_avatar_list > li:nth-child(odd) { background-color: rgb(0 0 0 / 0.3); }
ul#data_avatar_list > li:nth-child(even) { background-color: rgb(0 0 0 / 0.5); }
ul#data_avatar_list > li:last-of-type { border-bottom: 0; }
ul#data_avatar_list > li.tab_selected { color: #111; background-color: rgb(255 255 255 / 0.5); }
ul#data_avatar_list > li:not(.tab_selected):hover { opacity: 0.8; }
ul#data_avatar_data { width: calc(100% - 110px); height: calc(28px * 7 + 6px); margin: 0; padding-left: 0; float: left; }
ul#data_avatar_data > li {
  position: relative;
  vertical-align: top;
  height: calc(28px * 7 + 6px - 20px);
}
.data_avatar-rarity { width: auto; height: 16px; margin: 0 2px 0 3px; vertical-align: middle; }
.avatar_img { position: relative; top: 0; right: 0; height: 100%; width: auto; }
.avatar_img img { height: 100%; width: auto; margin-left: 58px; }
.avatar_param { display: inline-block; position: absolute; top: 0; padding-left: 0; }
.avatar_param > li { color: #eee; font-size: 11px; padding: 0 5px; background: rgb(0 0 0 / 0.5); }
.avatar_get {
    position: absolute;
    bottom: -20px;
    width: calc(100% - 8px);
    line-height: 12px;
    color: #eee;
    font-size: 11px;
    padding: 4px;
    background: linear-gradient(to right, rgb(0 0 0 / 0.5) 40%, rgb(0 0 0 / 0) 100%);
}

/*----------  プロフィール  ----------*/
.profile_container { margin: 1em; }
.region_area, .profile_first { margin-bottom: 10px; }
.profile_title { font-weight: bold; }
.profile_text { padding: 10px; border: 1px solid #ccc; background-color: #f0f0f0; }

/*----------  スキル  ----------*/
.skill_container { width: 100%; padding: 5px; }
.skill_box { display: inline-block; vertical-align: top; width: calc(100% - 64px - 5px - 2em); margin: 0 5px 5px; }
.skill_box-icon, .skill_box-ab_icon { position: relative; display: inline-block; vertical-align: top; width: 64px; text-align: center; }
.skill_box-icon img { display: block; width: 100%; height: auto; }
.skill_box-icon_overlay img { position: absolute; bottom: 0%; height: auto; }
.skill_box-title {
  width: fit-content;
  box-sizing: border-box;
  padding: .2em 1em;
  border-radius: 0 8px 0 0;
  background-color: #4d4d4d;
  color: #eee;
}
.skill_box_info { width: 100%; box-sizing: border-box; padding: 1em; border: 1px solid #ccc; box-shadow: 1px 1px 5px #ccc; }

/*--  スキル（タブ切替）  --*/
.tab_skill { overflow: hidden; }
.tab_skill li { list-style: none; }
ul#tab_skill_list { margin: 0; padding: 0; }
ul#tab_skill_list > li { display: inline-flex; flex-wrap: wrap; border-radius: 0 8px 0 0; background-color: #4d4d4d; color: #eee; padding: .2em 1em; }
ul#tab_skill_list > li:not(.tab_selected) { filter: brightness(80%); }
ul#tab_skill_list > li:not(.tab_selected):hover { filter: brightness(100%); }
ul#tab_skill_data { margin: 0; }
ul#tab_skill_data > li.tab_selected { width: 100%; margin: 0; padding: 0; }

/*----------  アビリティ  ----------*/
.skill_box-ab_icon img { width: 50px; }
.skill_box-ab_title {
  width: fit-content;
  box-sizing: border-box;
  padding: .2em .8em .2em 1em;
  border-radius: 0 8px 0 0;
  background-color: #4d4d4d;
  color: #eee;
}
.skill_box span.skill_box-ab_rate { margin-left: .8em; }

/*---------- オトモ行動 ----------*/
.ally_actions { width: calc(100% - 20px); margin: 10px auto; }
.ally_actions img { vertical-align: baseline; }
.ally_container { border: 1px solid #999; }
.ally_container li { list-style: none; }
.ally_data-title {
  font-size: 15px;
  color: #eee;
  padding: 4px 15px;
  font-weight: bold;
  background: linear-gradient(to right, rgb(50 50 50 / 1) 40%, rgb(0 0 0 / 0) 100%);
}
.ally-note { margin: 5px 20px 5px; }
.skill_box-ally, ul#npc_skill_data {
  display: flex;
  flex-wrap: wrap;
  width: calc(100% - 50px);
  margin: 0 auto 15px;
  padding: 10px;
  border: 1px solid #ccc;
  box-shadow: 1px 1px 5px #ccc;
}
.skill_box-ally_ab { width: calc(100% - 64px - 20px); display: flex; flex-flow: column; flex-wrap: wrap; margin-left: 10px; }
.ally_ability { color: #1e90ff; font-size: 15px; font-weight: 600; border-bottom: 1px solid #ccc; padding: 0 5px 5px; }
.ally_ability img { width: 16px; vertical-align: text-top; margin-left: 5px; }
.ally_ability-info { padding: 5px 5px 0; }
.npc_skill { overflow: hidden; }
ul#npc_skill_list {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 15px 22px;
  width: 100%;
  max-width: 450px;
  margin: 0 10px;
  padding: 10px;
}
ul#npc_skill_list > li { width: 40px; height: 40px; line-height: 40px; text-align: center; position: relative; background-size: cover; }
ul#npc_skill_list:not(:first-child) > li:not(:last-child)::after {
  position: absolute;
  top: 25%;
  left: 44px;
  content: '';
  display: inline-flex;
  width: 14px;
  height: 21px;
  background-image: url(https://img.wiki3.jp/ragnador/arr_right.png);
  background-size: contain;
  background-repeat: no-repeat;
}
ul#npc_skill_list > li.tab_selected { background-color: #87cefa; box-shadow: 0 0 3px 3px #87cefa; }
ul#npc_skill_list > li:not(.tab_selected):hover { opacity: 0.8; }
ul#npc_skill_list > li > img { height: 100%; }
ul#npc_skill_list > li span.npc_skill-element { position: absolute; top: -40%; right: -7px; }
ul#npc_skill_list > li span.npc_skill-element img { width: 14px; }
ul#npc_skill_data > li.tab_selected { display: flex; flex-wrap: wrap; width: 100%; }
ul#npc_skill_list > .special_skill,
ul#npc_skill_data  > .special_skill { background-image: url(https://img.wiki3.jp/ragnador/NPCスキル_背景.png); }


/*--  妖気解放（タブ切替）  --*/
.tab_release { margin-top: 0; }
ul#tab_release_list li, ul#tab_release_data li { list-style: none; }
ul#tab_release_list { margin: 0; padding: 0; }
ul#tab_release_list > li { display: inline-flex; flex-wrap: wrap; border-radius: 0 8px 0 0; background-color: #4d4d4d; color: #eee; padding: .2em 1em; }
ul#tab_release_list > li:not(.tab_selected) { filter: brightness(80%); }
ul#tab_release_list > li:not(.tab_selected):hover { filter: brightness(100%); }
ul#tab_release_data { padding: 0; }
ul#tab_release_data > li { display: none; }
ul#tab_release_data > li.tab_selected { display: block; width: 100%; margin: 0; padding: 0; }


/*----------  カケジクデータ  ----------*/
.get_quest { display: block; }

/*-- めっけた --*/
ul#discovery_list {
  display: flex;
  flex-wrap: wrap;
  gap: 1px;
  font-size: 12px;
  margin: 0;
  padding: 0;
  background-color: #ccc;
  border: 1px solid #ccc;
}
ul#discovery_list > li {
  display: inline-block;
  box-sizing: border-box;
  width: calc((100% - 2px) / 3);
  text-align: center;
  background-color: #fff;
  padding: 4px 2px;
}
ul#discovery_list > li.tab_selected { color: #111; background-color: rgb(255 255 255 / 0.5); }
ul#discovery_list > li:not(.tab_selected):hover { opacity: 0.8; }

ul#discovery_data >li img { position: absolute; height: auto; top: 0%; left: 0%; }

/*----------  見聞  ----------*/
.info_box { width: 100%; }
.info_box-title {
  width: 56px;
  line-height: 28px;
  margin-top: 4px;
  font-weight: bold;
  color: #eee;
  background-color: #4d4d4d;
  text-align: center;
  border-radius: 0 8px 0 0;
  vertical-align: bottom;
}
.info_box-cont {
  width: 100%;
  font-size: 12px;
  line-height: 18px;
  box-sizing: border-box;
  padding: 10px;
  border: 1px solid #ccc;
}
.info_box-cont > p { margin-bottom: 0; }


/*----------  限界突破（タブ切替）  ----------*/
.limitbreak { width: calc(100% - 20px); margin: 10px auto; }
.limitbreak_container { margin-top: -2px; border: 1px solid #999; }
.awakening_container { margin-top: -1px; border: 1px solid #999; }
ul#tab_limitbreak_list, ul#tab_limitbreak_data { margin: 0; padding: 0; }
ul#tab_limitbreak_list > li { display: inline-flex; flex-wrap: wrap; border-radius: 0 8px 0 0; background-color: #4d4d4d; color: #eee; padding: 3px 4px; }
ul#tab_limitbreak_list > li:not(.tab_selected) { filter: brightness(60%); }
ul#tab_limitbreak_list > li:not(.tab_selected):hover { filter: brightness(100%); }
ul#tab_limitbreak_list > li > img { width: 13px; }
ul#tab_limitbreak_data > li { display: none; }
body.cke_editable.cke_editable_themed.cke_contents_ltr.cke_show_borders ul#tab_limitbreak_data > li { display: block; }
ul#tab_limitbreak_data > li.tab_selected { display: block; width: 100%; margin: 0; padding: 5px 0; }


/*----------  武器データ  ----------*/


/*----------  モンスターデータ  ----------*/
.ability_icon-30 { width: auto; height: 30px; }
.week_element_icon-24 { width: auto; height: 24px; }

.monster_data-container {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: 10px;
  padding: 10px;
  margin-bottom: 15px;
  background-color: #fff;
  box-shadow: 1px 1px 5px #ccc;

  .monser_data_img-full {
    position: relative;
    display: inline-block;
    width: 320px;
  }
  .monser_data_img-full img {
    display: block;
    background-size: cover;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    margin-bottom: 10px;
  }
  .monster_data-detile {
    width: calc(100% - 10px - 320px);
    table { margin: 0; table-layout: fixed; }
    table th { width: 4em; }
    p { font-size: 12px; }
    table span img { width: auto; height: 24px; }
  }
  .monster_data-name {
    font-size: 16px;
    font-weight: bold;
    line-height: 28px;
    background-color: #f0f0f0;
    padding: 5px;
    margin-bottom: 10px;
  }
  .monster_data-recomend_power {
    display: grid;
    justify-content: center;
    grid-template-columns: 4em 5em;
    text-align: right;
  }
  .status_effect_inline {
    display: grid;
    gap: 3px;
    grid-template-columns: repeat(5, 1fr);
  }
  .monster_data-knowledge {
    color: #2d7091;
    padding: 10px;
    margin-top: 10px;
    background: #ebf7fd;
  }

  @media screen and (max-width: 767px) {
    display: flex;
    .monster_data-detile { width: 100%; min-width: 290px; }
  }
  @media screen and (max-width: 320px) {
    display: flex;
    .ability_icon-30 { width: auto; height: 24px; }
    .monster_data-recomend_power { grid-template-columns: auto; }
  }
}


/*----------  家具データ  ----------*/
.furniture_param { margin-top: 4px; }
.furniture_param img { width: 13px; }
.furniture_param_container { display: block; margin: -1px 0 0 0; padding: 0 3px; border: 1px solid #999; }
.furniture_param_title { display: inline-flex; flex-wrap: wrap; border-radius: 0 8px 0 0; background-color: #4d4d4d; color: #eee; font-weight: bold; padding: 3px 4px; }
.furniture_param_data { line-height: 2em; margin: 0; border-bottom: 1px solid #ccc; }
.furniture_param_data:last-of-type { border-bottom: none; }
.furniture_param_data_h { display: inline-block; width: 40px; }
.furniture_param_data_d { display: inline-block; }

/*----------  ランクアップ（タブ切替）  ----------*/
ul#tab_rankup_list, ul#tab_rankup_data { margin: 0; padding: 0; }
ul#tab_rankup_list > li { display: inline-flex; flex-wrap: wrap; border-radius: 0 8px 0 0; background-color: #4d4d4d; color: #eee; font-weight: bold; padding: 3px 4px; }
ul#tab_rankup_list > li:not(.tab_selected) { filter: brightness(60%); }
ul#tab_rankup_list > li:not(.tab_selected):hover { filter: brightness(100%); }
ul#tab_rankup_list > li > img { width: 13px; }
ul#tab_rankup_data > li { display: none; }
ul#tab_rankup_data > li.tab_selected { display: block; width: 100%; margin: 0; padding: 5px 0; }


/*=============================================
=               ツクモ神成功率計算                =
=============================================*/
.tsukumoProbCalc {
  form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    max-width: 400px;
  }
  input, select { padding: 3px; }
  .tsukumo_tool {
    display: block;
    text-align: center;
    border: solid 1px #666;
    input, select {
      padding: 3px;
      margin: 5px;
    }
    &.tsukumo_tool_how_to { width: 320px; }
  }
  .tsukumo_tool_calc, .tsukumo_tool_calc2 {
    display: flex;
    padding: 5px;
    align-items: flex-end;
    justify-content: center;
    input { margin: 0; }
  }
  .tsukumo_tool_calc2 { align-items: center; margin-bottom: 5px; }
  .tool_title {
    display: block;
    color: #fff;
    font-size: 15px;
    text-align: left;
    font-weight: bold;
    text-shadow: 2px 2px 3px #000;
    background: linear-gradient(to right, rgb(60, 60, 60) 40%, rgba(100, 100, 100, 0.1) 100%);
    padding: 2px 5px;
  }
  .tool_subtitle { display: block; font-size: 0.9em; }
  .tool_calc_symbol { display: block; margin: 2px; }
  .spinner_container {
    margin: 0 4px 8px 4px;
    .spinner_add, .spinner_sub {
      font-weight: bold;
      border-radius: 2px;
      border: solid 1px #666;
      padding: 5px;
      margin: 2px;
      background: #fff;
      cursor: pointer;
      user-select: none;
      &:not(.spinner_disabled):hover { box-shadow: 0 0 2px 0 rgb(0 0 0 / 0.5); }
    }
    .spinner_add { color: firebrick; }
    .spinner_sub { color: darkblue; }
    .spinner_disabled { opacity: 0.5; cursor: inherit; }
  }
  .tsukumoRarity, .tsukumoAwaken {
    display: grid;
    padding: 5px;
    user-select: none;
    input[type="radio"] { display: none; margin: 0; }
    label { padding: 4px; justify-content: center; }
    label:has(input[checked="checked"]) { color: #eee; background: #333; }
  }
  .tsukumoAwaken { grid-auto-flow: column; grid-template-rows: repeat(5, 1fr); column-gap: 5px; }
  .tsukumoSucRateBonus { input { width: 7em; } }
  .tsukumoBasisSucRate,
  .tsukumoAddSucRate { input { width: 6em; text-align: right; } }
  .tsukumoSucRate {
    input {
      width: 11.3em;
      height: 2.5em;
      text-align: right;
      color: firebrick;
      font-size: 15px;
      font-weight: bold;
      margin: 0;
    }
  }
  .tsukumoSucRateMoney { input { text-align: right; } }
  .tsukumo_tool_how_to { ul { text-align: left; padding-left: 20px; margin: 5px; } }
}


/*=============================================
=               絞り込み検索                =
=============================================*/
.search_box {
  form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 10px;
    background: rgba(255, 255, 255, 0.6);
  }
  .search_box_detail {
    width: 100%;
    flex: auto;
    .search_box_details_title {
      display: list-item;
      color: #eee;
      font-size: 15px;
      text-align: center;
      font-weight: bold;
      text-shadow: 2px 2px 3px #000;
      background: #2a2a2a;
      letter-spacing: 0.5em;
      padding: 5px;
      margin-bottom: 10px;
    }
    .search_box_details {
      display: flex;
      gap: 10px;
      flex-direction: column;
      margin-bottom: 10px;
    }
  }
  .search_box_category {
    display: flex;
    flex: auto;
    flex-direction: column;
    background: rgba(255, 255, 255, 0.6);
    border: solid 1px #666;
    .search_box_title {
      display: list-item;
      color: #eee;
      font-size: 15px;
      text-align: left;
      font-weight: bold;
      text-shadow: 2px 2px 3px #000;
      background: #4d4d4d;
      padding: 2px 5px;
      &:last-child { margin-bottom: 10px; }
    }
    .search_box_subtitle { display: block; font-size: 0.9em; margin: 2px; }
    .search_box_group {
      display: flex;
      flex-wrap: wrap;
      gap: 3px;
      box-sizing: border-box;
      padding: 0.5em;
      margin: auto;
      .search_box_item {
        display: contents;
        &.search_box_item_group { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 3px; }
        label {
          min-width: 2.7em;
          text-align: center;
          background: rgba(255, 255, 255, 0.5);
          border: solid 1px #666;
          border-radius: 6px;
          padding: 3px 6px;
          margin: 2px;
          -webkit-user-select: none;
          user-select: none;
          input[type="checkbox"],
          input[type="radio"] { display: none; margin: 0; }
          img { height: 24px; }
          &:has(input:checked) { color: #eee; background: #4d4d4d; }
          /*&:has(input:checked):has(img) { color: #000; background: #87cefa; }*/
          &:not(:has(input:disabled)):hover { box-shadow: 0 0 2px 2px #87cefa; }
          &:has(input:disabled) { opacity: 0.5; cursor: inherit; }
        }
      }
    }
  }
}
.search_list {
  .grid_container { padding-top: 0; }
  .search_list_item.is-hide { display: none; }
  .search_result { text-align: center; background-color: #eee; padding: 0.5em; margin: 10px; }
}
.nav_menu {
  position: relative;
  .nav_menu_wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    z-index: 100;
    .nav_menu_title {
      width: 100%;
      font-size: 15px;
      font-weight: bold;
      background: rgba(255, 255, 255, 0.6);
      align-content: center;
      padding: 7px;
    }
    .nav_menu_reset {
      position: absolute;
      top: 5px;
      right: 70px;
      font-size: 12px;
      background: rgba(255, 255, 255, 0.5);
      border: solid 1px #666;
      border-radius: 10px;
      padding: 3px 6px;
      -webkit-user-select: none;
      user-select: none;
      &:hover { box-shadow: 0 0 2px 2px #87cefa; }
      &:active { color: #eee; background: #4d4d4d; cursor: inherit; }
    }
  }
  .nav_menu_icon { position: absolute; right: 10px; z-index: 101; }
  .nav_menu_icon:after { content: "\f0c9"; }
}
.fixed_item {
  &.is-fixed {
    position: fixed;
    max-width: calc(1070px - 260px - 10px);
    overflow-y: auto;
    max-height: -webkit-fill-available;
    max-height: 100svh;
    scrollbar-width: thin;
    &:not(summary) { scrollbar-gutter: stable; }
  }
}

details {
  &::details-content { opacity: 0; transition: opacity 0.3s, content-visibility 0.2s allow-discrete; }
}
details[open] {
  &::details-content { opacity: 1; }
  .nav_menu_title { display: inline-block; }
  .nav_menu_icon:after { content: "\f00d"; }
}

.change_html { display: none; }

.boxscroll_shadow-bottom { box-shadow: inset 0px -25px 25px -25px #ccc; }
.boxscroll_shadow-top { box-shadow: inset 0px 25px 25px -25px #ccc; }

.tooltip {
  display: inline-flex;
  position: relative;
  text-align: left;
  margin: 0;
  padding: 0;

  .tooltip-hover {
    display: contents;
    &.-top:after { content: ""; position: absolute; left: 0; top: -100%; display: block; width: 100%; height: 100%; }
    &.-bottom:after { content: ""; position: absolute; left: 0; display: block; width: 100%; height: 100%; }
  }
  .tooltip-contents {
    display: none;
    position: absolute;
    width: max-content;
    height: auto;
    box-sizing: border-box;
    left: 0;
    padding: 5px;
    margin: 13px 0;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
    transition: 0.2s ease;
    z-index: 100;
    border: 1px solid rgba(0, 0, 0, 0.2);
  }
  .tooltip-tail {
    --tail_gap: -14px;
    --tail_width: 13px;
    --tail_height: 13px;
    --tail_color: #ccc;
    &.-top {
      display: none;
      &:before {
        content: "";
        position: absolute;
        top: var(--tail_gap);
        left: 50%;
        width: var(--tail_width);
        height: var(--tail_height);
        background: var(--tail_color);
        clip-path: polygon(20% 0, 100% 0%, 50% 100%);
        transform: translateX(-50%);
        z-index: 99;
      }
    }
    &.-bottom {
      display: none;
      &:before {
        content: "";
        position: absolute;
        bottom: var(--tail_gap);
        left: 50%;
        width: var(--tail_width);
        height: var(--tail_height);
        background: var(--tail_color);
        clip-path: polygon(20% 100%, 50% 0, 100% 100%);
        transform: translateX(-50%);
        z-index: 99;
      }
    }
  }
}

/*----------  ポイント・強調  ----------*/
.point { padding: 10px; background-color: #f0f0f0; }
.em_word { color: #009bb3; }


/*----------  回り込み解除  ----------*/
.uk-form-stacked div.character-data, #main_content { display: flow-root; }
.clear { clear: both; }


/*----------  転載予防  ----------*/
#main_content {
  user-select: none;
  -webkit-user-select: none;
  -webkit-user-drag: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -khtml-user-drag: none;
}