/* ブロック要素 */
.article h1, .article h2, .article h3, .article h4, .article h5, .article h6,
.article p, .article hr,
.article table, .article thead, .article tbody, .article tr, .article th, .article td,
/* インライン要素 */
.article span, .article a
{
    /* ブロック・リスト・テーブル要素 */
    background: transparent;
}



/* ==========================================================
 * 00. グローバル設定
 * ========================================================== */

/* 00-01 CSS変数の定義 (下線色・メイン色) */
:root {
    --chii-base-font-color: #5E4240;
    --chii-light-border: #ddd;
    --chii-label-color: #555;
    --chii-data-color: #333;
    --chii-highlight-color: #d9534f;
    --chii-supplement-label-color: #008080;
}

/* 00-02 スクロールバーの幅を小さくする設定 */
.content-box::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}

/* 00-03 スクロールバーの背景色を設定 */
.content-box::-webkit-scrollbar-track {
    background: transparent;
}

/* 00-04 スクロールされる部分（つまみ）のデザインを設定 */
.content-box::-webkit-scrollbar-thumb {
    background-color: #aaa;
    border-radius: 2px;
}

/* 00-05 グローバルリセット: box-sizingを強制適用 */
*, *::before, *::after {
    box-sizing: border-box;
}

/* 00-06 ページの余白を削除し、基準点を左上端に合わせる */
html, body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100%;
    min-height: 100%;
    overflow-x: hidden;
}

/* 00-07 画像要素の設定 */
img {
    max-width: 100%;
    height: auto;
    display: block;
}

/** 【WordPress対策】 グローバルな要素のマージン・パディングをリセット **/
.article h1, .article h4, .article h5, .article h6,
.article p, .article ul, .article ol, .article li,
.article blockquote {
    margin: 0;
    padding: 0;
}
/* 00-08 画像要素の設定 (WordPressテーマによる干渉対策) */
.article img {
    margin: 0;
    padding: 0;
    vertical-align: top;
    box-sizing: border-box; /* themeによる上書き防止 */
}
/* 00-09 画像要素の設定 (WordPressテーマによる干渉対策) */
.article {
    /* 記事全体に対してテーマのスタイルが強く適用されるのを防ぐ */
    box-sizing: border-box;
    overflow-wrap: break-word;
	
	font-size: 16px;
	
}
/* ----------------------------------------------------------------- */

/* ==========================================================
 * 01. 見出しデザイン (section-title)
 * ========================================================== */

/* 01-01 h2 (メイン見出し) のデザイン */
.article h2 {
    /* タイポグラフィ系 */
    font-size: 1.25rem;
    color: var(--chii-base-font-color);
    font-weight: bold;
    line-height: 1;
	
    /* 位置/レイアウト系 */
    display: flex;
    align-items: flex-end;
    min-height: 80px;
    padding: 8px 0 5px 60px;
    margin: 0 0 25px 0;

    /* ボーダー/背景系 */
    border-bottom: 3px solid var(--chii-base-font-color);
    background-position: left bottom;
    background-repeat: no-repeat;
}

/* 01-02 h2 アイコン設定 (ちいかわ) */
.article h2.chii-h2-0 {
    background-image: url('https://game.dqmsl.net/wp-content/uploads/chii/style/h2-chiikawa.webp');
}

/* 01-03 h2 アイコン設定 (ハチワレ) */
.article h2.chii-h2-1 {
    background-image: url('https://game.dqmsl.net/wp-content/uploads/chii/style/h2-hachiware.webp');
}

/* 01-04 h2 アイコン設定 (うさぎ) */
.article h2.chii-h2-2 {
    background-image: url('https://game.dqmsl.net/wp-content/uploads/chii/style/h2-usagi.webp');
}

/* 01-05 h2 アイコン設定 (くりまんじゅう) */
.article h2.chii-h2-3 {
    background-image: url('https://game.dqmsl.net/wp-content/uploads/chii/style/h2-kuri-manju.webp');
}

/* 01-06 h2 アイコン設定 (モモンガ) */
.article h2.chii-h2-4 {
    background-image: url('https://game.dqmsl.net/wp-content/uploads/chii/style/h2-momonga.webp');
}

/* 01-07 h2 アイコン設定 (ラッコ) */
.article h2.chii-h2-5 {
    background-image: url('https://game.dqmsl.net/wp-content/uploads/chii/style/h2-rakko.webp');
}

/* 01-08 h2 アイコン設定 (シーサー) */
.article h2.chii-h2-6 {
    background-image: url('https://game.dqmsl.net/wp-content/uploads/chii/style/h2-shisa.webp');
}

/* 01-09 h3 (サブ見出し) のデザイン */
.article h3 {
    /* タイポグラフィ系 */
    font-size: 1.15rem;
    color: var(--chii-data-color);
    font-weight: bold;

    /* 位置/レイアウト系 */
    padding: 0 0 5px 10px;
    margin: 30px 0 15px 0;

    /* ボーダー/背景系 */
    border-bottom: 1px solid var(--chii-base-font-color);
    border-left: 10px solid var(--chii-base-font-color);
}

/* 01-10 リード情報エリア */
.chii2-lead-info {
    /* タイポグラフィ系 */
    font-size: 0.8em;
    color: #666666;

    /* 位置/レイアウト系 */
    width: 97%;
    margin: 0 auto;
}

/* 01-11 【WordPress対策】 pタグの不要なマージンをリセット (pタグを含むリード情報内の画像を守る) */
.chii2-lead-info p {
    margin: 0;
    padding: 0;
}
/* ----------------------------------------------------------------- */

/* ==========================================================
 * 02. キャラクター基本情報 (chii2-base-info-container)
 * ========================================================== */

/* 02-01 ベースコンテナ: 画像と詳細エリアの横並びを定義 */
.chii2-base-info-container {
    /* 位置/レイアウト系 */
    display: flex;
    align-items: flex-start;
    width: 97%;
    margin: 0 auto;
    gap: 20px;
    padding: 15px;

    /* ボーダー/背景系 */
    box-sizing: border-box;
    border: 1px solid var(--chii-light-border);
    border-radius: 8px;
    background-color: #f9f9f9;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* 02-02 画像エリア (アイコン) */
.chii2-base-info-img {
    /* 位置/レイアウト系 */
    flex-shrink: 0;
    width: 180px;
    max-width: 180px;
    height: auto;

    /* ボーダー/背景系 */
    border-radius: 4px;
    object-fit: contain;
}

/* 02-03 詳細情報エリア (dlリストの親) */
.chii2-info-details-area {
    /* 位置/レイアウト系 */
    flex-grow: 1;
    min-width: 0;
}


/* ==========================================================
 * 03. 定義リスト (dl) のスタイル (基本情報)
 * ========================================================== */

/* 03-01 dlリスト全体の設定 */
.chii2-info-list {
    /* 位置/レイアウト系 */
    margin: 0;
    padding: 0 5px 0 0;
    list-style: none;
    align-items: start;
}

/* 03-02 各項目をラップする行 (dt/ddを横並びにする Flexコンテナ) */
.chii2-base-row {
    /* 位置/レイアウト系 */
    display: flex;
    align-items: center;
    width: 100%;

    /* ボーダー/背景系 */
    border-bottom: 1px dotted #ccc;
}

/* 03-03 dt (項目名/ラベル) */
.chii2-info-list dt {
    /* タイポグラフィ系 */
    color: var(--chii-label-color);
    font-size: 1em;
    /* 位置/レイアウト系 */
    flex-shrink: 0;
    flex-basis: max-content;
    min-width: 110px;
    padding-top: 3px;
    padding-right: 15px;
    padding-bottom: 3px;

    /* ボーダー/背景系 */
    border-bottom: none;
}

/* 03-04 dd (値) */
.chii2-info-list dd {
    /* タイポグラフィ系 */
    color: var(--chii-data-color);
    font-size: 0.9em;
    /* 位置/レイアウト系 */
    flex-grow: 1;
    flex-basis: 0;
    margin-left: 0;
    padding-top: 3px;
    padding-left: 0px;
    padding-bottom: 3px;

    /* ボーダー/背景系 */
    border-bottom: none;
}

/* 03-05 最後の要素の区切り線を削除 */
.chii2-base-row:last-of-type {
    border-bottom: none;
}

/* 03-06 最後の要素のパディング調整 */
.chii2-base-row:last-of-type dt,
.chii2-base-row:last-of-type dd {
    padding-bottom: 0;
    padding-top: 3px;
}

/* 03-07 評価点アイテムの文字装飾 */
.chii2-eval-item {
    font-weight: bold;
    text-shadow: 
        1px 1px 3px rgba(0, 0, 0, 0.7),
        0 0 5px rgba(0, 0, 0, 0.3),
        -1px -1px 0 #fff,
        1px -1px 0 #fff,
        -1px 1px 0 #fff,
        1px 1px 0 #fff;
}

/* 03-08 【WordPress対策】 dl要素のマージンをリセット */
.chii2-info-list, .chii2-base-info-supplement {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
/* ----------------------------------------------------------------- */

/* ==========================================================
 * 04. キャラクター評価点 (chii2-eval-container)
 * ========================================================== */

/* 04-01 評価点のベースコンテナ設定 */
.chii2-eval-container {
    /* 位置/レイアウト系 */
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 97%;
    gap: 10px;
    padding: 10px 15px;
    margin: 15px auto;

    /* ボーダー/背景系 */
    border: 1px solid var(--chii-light-border);
    border-radius: 8px;
    background-color: #f9f9f9;
}

/* 04-02 各評価項目 (dl) の設定 */
.chii2-eval-container dl {
    /* 位置/レイアウト系 */
    flex: 1 1 auto;
    margin: 0;
    padding: 0 5px;
    text-align: center;

    /* ボーダー/背景系 */
    border-right: 1px dotted #ccc;
}

/* 04-03 最後の dl から区切り線を削除 */
.chii2-eval-container dl:last-of-type {
    border-right: none;
}

/* 04-04 dt (項目名) の設定 */
.chii2-eval-container dt {
    /* タイポグラフィ系 */
    font-size: 0.8em;
    color: #666;
    font-weight: normal;

    /* 位置/レイアウト系 */
    margin-bottom: 3px;
}

/* 04-05 dd (点数) の設定 */
.chii2-eval-container dd {
    /* タイポグラフィ系 */
    font-size: 1.2em;
    color: var(--chii-data-color);
    font-weight: bold;

    /* 位置/レイアウト系 */
    margin-left: 0;
}

/* 04-06 総合点 (最後の項目) の特別スタイル */
.chii2-eval-container .chii2-style-right-end,
.chii2-eval-container dl:last-of-type dd {
    /* タイポグラフィ系 */
    color: var(--chii-highlight-color);
}

/* 04-07 総合点の dd のスタイルをさらに強調 */
.chii2-eval-container dl:last-of-type dd {
    /* タイポグラフィ系 */
    font-size: 1.4em;

    /* 装飾 */
    text-shadow: 1px 1px 3px rgba(217, 83, 79, 0.5);
}


/* ==========================================================
 * 05. 補足情報 (chii2-base-info-supplement)
 * ========================================================== */

/* 05-01 親コンテナ (幅とマージンを制御) */
.chii2-supplement-section-container {
    /* 位置/レイアウト系 */
    width: 97%;
    margin: 15px auto;

    /* ボーダー/背景系 */
    border: 1px solid var(--chii-light-border);
    border-radius: 8px;
    background-color: #f9f9f9;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* 05-02 dl要素 */
.chii2-base-info-supplement {
    /* 位置/レイアウト系 */
    padding: 0px 15px;
}

/* 05-03 各項目をラップする行 (dt/ddを横並びにする Flexコンテナ) */
.chii2-supplement-row {
    /* 位置/レイアウト系 */
    display: flex;
    align-items: flex-start;
}


/* 05-04 各項目名 (dt) のスタイル */
.chii2-base-info-supplement dt {
    /* タイポグラフィ系 */
    font-size: 1em;
    color: var(--chii-label-color);

    /* 位置/レイアウト系 */
    flex-shrink: 0;
    flex-basis: max-content;
    min-width: 110px;
    margin-right: 0;
    padding: 2px 5px 0 0;

    /* ボーダー/背景系 */
    border-top: 1px dotted #ccc;
}

/* 05-05 最初のdtの上線を削除 */
.chii2-supplement-row:first-of-type dt {
    border-top: none;
    padding: 0 5px 0 0;
}

/* 05-06 各項目の値 (dd) のスタイル */
.chii2-base-info-supplement dd {
    /* タイポグラフィ系 */
    font-size: 0.9em;
    color: var(--chii-data-color);
    line-height: 1.5;
    text-align: left;

    /* 位置/レイアウト系 */
    flex-grow: 1;
    margin-left: 0;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 0px;
    padding-right: 0px;

    /* ボーダー/背景系 */
    border-top: 1px dotted #ccc;
}

/* 05-07 最初のddの上線をdtに合わせて削除 */
.chii2-supplement-row:first-of-type dd {
    border-top: none;
    padding-top: 0;
}

/* 05-08 最後のdt/ddのパディングと下線を調整 */
.chii2-supplement-row:last-of-type dt,.chii2-supplement-row:last-of-type dd {
    border-bottom: none;
    padding-bottom: 0;
}

/* 05-09 dd内の水平線 (hr) のスタイル */
.chii2-base-info-supplement dd hr {
    /* ボーダー/背景系 */
    border: none;
    border-top: 1px dashed var(--chii-light-border);
    margin: 2px 0;
}

/* 05-10 dd内のサブ情報 (span) のスタイル (ラベル) */
.chii2-item-span-style {
    /* タイポグラフィ系 */
    color: var(--chii-supplement-label-color);
    font-weight: normal;

    /* 位置/レイアウト系 */
    display: block;
    width: auto;
    text-align: left;
}

/* 05-11 dd内のサブ情報 (span) のスタイル (強調ラベル) */
.chii2-item-span-sup-style {
    /* タイポグラフィ系 */
    color: #ff00ff;
    font-weight: normal;

    /* 位置/レイアウト系 */
    display: block;
    width: auto;
    text-align: left;
}

/* 05-12 dd内のサブ情報 (span) のスタイル (数値データ) */
.chii2-item-span-nowrap-style {
    /* タイポグラフィ系 */
    color: var(--chii-data-color);

    /* 位置/レイアウト系 */
    display: block;
    width: auto;
    padding-left: 0px;
}

/* 05-13 補足情報 (pタグ) のスタイル */
.article .chii2-supplement {
    /* タイポグラフィ系 */
    font-size: 0.8em;
    color: #888;

    /* 位置/レイアウト系 */
/* 位置/レイアウト系 */
    width: 97%; 
    /* margin: 5px 1.5% 15px 1.5% !important;  <- これを削除 */
    margin: 5px 1.5% 15px 1.5%; /* !importantを外す */

    /* ボーダー/背景系 */
    box-sizing: border-box;
}

/* ==========================================================
 * 06. テーブル共通設定 (所持ボーナス, ミッション報酬)
 * ========================================================== */

/* 06-01 テーブル全体のベース設定 */
.chii2-possession-bonus {

border-collapse: separate; /* これが最重要 */
    border-spacing: 0;         /* 罫線の隙間をなくす */
    overflow: hidden;          /* 角丸表示のために必要 */
    border-radius: 8px;        /* 角丸の指定 */

    /* 位置/レイアウト系 */
    width: 97%;
    margin: 15px auto;
    border-collapse: collapse;
    overflow: hidden;
border: 1px solid var(--chii-light-border, #ddd);
    /* ボーダー/背景系 */
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
/* テーマの競合を回避し、chii2-possession-bonus の角丸を強制適用 */
/* セレクタの具体性も維持しつつ、border-collapse の適用を保証します */

.article .chii2-possession-bonus {
    /* ----------------------------------------------------------------- */
    /* これがテーマを上書きするための最重要項目です */
    border-collapse: separate !important; 
    /* ----------------------------------------------------------------- */

    border-spacing: 0;         /* 罫線の隙間をなくす (これは !important なしで通常は効くはず) */
    overflow: hidden;          /* 角丸表示のために必要 */
    border-radius: 8px;        /* 角丸の指定 */
}

/* 06-02 ヘッダー (thead) のスタイル */
.chii2-possession-bonus thead tr {
    /* タイポグラフィ系 */
    color: #444;

    /* ボーダー/背景系 */
    background-color: #f0f8ff;
}

/* 06-03 ヘッダーセル (th) の設定 */
.chii2-possession-bonus th {
    /* タイポグラフィ系 */
    font-weight: bold;

    /* 位置/レイアウト系 */
    padding: 10px 5px;
    text-align: center;

    /* ボーダー/背景系 */
    border: 1px solid var(--chii-light-border);
}

/* 06-04 ボディのセル (td) の共通設定 */
.chii2-possession-bonus td {
    /* タイポグラフィ系 */
    color: var(--chii-data-color);
    line-height: 1.4;

    /* 位置/レイアウト系 */
    padding: 10px 5px;
    vertical-align: middle;

    /* ボーダー/背景系 */
    border: 1px solid #eee;
}

/* 06-05 Lv/ランク列 の設定 */
.chii2-possession-bonus-lv {
    /* タイポグラフィ系 */
    color: #444;
    font-weight: bold;

    /* 位置/レイアウト系 */
    width: 10%;
    text-align: center;

    /* ボーダー/背景系 */
    background-color: #f9f9f9;
}

/* 06-06 ボーナス/報酬アイコン列 の設定 */
.chii2-possession-bonus-icon {
    /* 位置/レイアウト系 */
    width: 50px;
    text-align: center;
}

/* 06-07 共通アイコン画像のスタイル */
.chii-table-icon, .chii2-table-icon {
    /* 位置/レイアウト系 */
    max-width: 40px;
    max-height: 40px;
    margin: 0 auto;
    display: block;

    /* ボーダー/背景系 */
    object-fit: contain;
}

/* 06-08 ボーナス/報酬データ列の設定 */
.chii2-possession-bonus-data {
    /* 位置/レイアウト系 */
    width: auto;
}

/* 06-09 データセル内の区切り線 */
.chii2-possession-bonus-data hr {
    /* ボーダー/背景系 */
    border: none;
    border-top: 1px dashed var(--chii-light-border);
    margin: 2px 0;
}

/* 06-10 データセル内のサブ情報 (幅の調整) */
.chii2-possession-bonus-data .chii2-item-span-style {
    width: 30%;
}

/* 06-11 データセル内のサブ情報 (幅の調整) */
.chii2-possession-bonus-data .chii2-item-span-nowrap-style {
    width: 68%;
}

/* ==========================================================
 * 07. キャラクター派生一覧 (chii2-cos-list)
 * ========================================================== */

/* 07-01 親コンテナ */
.chii2-cos-list-container {
    /* 位置/レイアウト系 */
    width: 97%;
    margin: 15px auto;
    padding: 15px;

    /* ボーダー/背景系 */
    border: 1px solid var(--chii-light-border);
    border-radius: 8px;
    background-color: #fcfcfc;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

/* 07-02 ヘッダー/タイトル部分 */
.chii2-cos-list-header {
    /* タイポグラフィ系 */
    font-size: 1.2em;
    color: var(--chii-data-color);
    font-weight: bold;

    /* 位置/レイアウト系 */
    padding-bottom: 8px;
    margin-bottom: 15px;

    /* ボーダー/背景系 */
    border-bottom: 2px solid #e0e0e0;
}

/* 07-03 データリストエリア */
.chii2-cos-list-container>.chii2-cos-list-data {
    /* 位置/レイアウト系 */
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin: 0;
    padding: 10px;
    list-style: none;

    /* ボーダー/背景系 */
    background-color: #ffffff;
    border-radius: 6px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
}

/* 07-04 各アイテムのコンテナ（PCで7列表示） */
.chii2-cos-list-data .chii2-link-icon-style {
    /* 位置/レイアウト系 */
    flex: 0 0 calc((100% - (6 * 4px)) / 7);
    min-width: 80px;
    max-width: 14.285%;
    text-align: center;
    padding: 2px;

    /* ボーダー/背景系 */
    border: 1px solid #ccc;
    border-radius: 6px;
    overflow: hidden;
    background-color: #f9f9f9;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);

    /* その他 */
    transition: all 0.2s ease-in-out;
}

/* 07-05 各アイテムのホバーエフェクト */
.chii2-cos-list-data .chii2-link-icon-style:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
    border-color: var(--chii-supplement-label-color);
}

/* 07-06 リンク要素 */
.chii2-cos-list-data .chii2-link-icon-style a {
    /* タイポグラフィ系 */
    font-size: 0.75em;
    color: var(--chii-data-color);
    font-weight: normal;
    line-height: 1.3;

    /* 位置/レイアウト系 */
    display: block;
    text-decoration: none;
}

/* 07-07 リンク内の画像 */
.chii2-cos-list-data .chii2-table-icon {
    /* 位置/レイアウト系 */
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 auto 3px auto;
    display: block;

    /* ボーダー/背景系 */
    object-fit: contain;
}


/* ==========================================================
 * 99. レスポンシブ調整 (モバイル/600px以下)
 * ========================================================== */

@media (max-width: 600px) {

    /* 99-01 ベースコンテナ (基本情報) */
    .chii2-base-info-container {
        /* 位置/レイアウト系 */
        flex-direction: row;
        width: 99%;
        gap: 10px;
        padding: 10px;
        margin: 0 auto;
        align-items: flex-start;

        /* ボーダー/背景系 */
        box-shadow: none;
    }

    /* 99-02 画像エリア */
    .chii2-base-info-img {
        /* 位置/レイアウト系 */
        width: 70px;
        max-width: 70px;
    }

    /* 99-03 基本情報リスト dt */
    .chii2-info-list dt {
        /* タイポグラフィ系 */
        font-size: 0.9em;
        color: var(--chii-label-color);

        /* 位置/レイアウト系 */
        width: 120px;
        padding-bottom: 5px;
    }

    /* 99-04 基本情報リスト dd */
    .chii2-info-list dd {
        /* タイポグラフィ系 */
        font-size: 0.9em;
        color: var(--chii-data-color);

        /* 位置/レイアウト系 */
        padding-bottom: 5px;
    }

    /* 99-05 Lv/ランク列 の設定 */
    .chii2-possession-bonus-lv {
        width: 18%;
    }

    /* 99-06 評価点コンテナ */
    .chii2-eval-container {
        /* 位置/レイアウト系 */
        flex-wrap: nowrap;
        width: 99%;
        gap: 0;
        padding: 5px 1px;
        margin: 15px auto;
        align-items: flex-start;

        /* ボーダー/背景系 */
        box-shadow: none;
    }

    /* 99-07 評価点項目 (dl) */
    .chii2-eval-container dl {
        /* 位置/レイアウト系 */
        flex: 0 0 20%;
        max-width: 20%;
        padding: 0 1px;

        /* タイポグラフィ系 */
        font-size: 0.7em;
    }

    /* 99-08 評価点項目 (最後の dl) */
    .chii2-eval-container dl:last-of-type {
        flex: 0 0 20%;
        max-width: 20%;
    }

    /* 99-09 評価点 項目名 (dt) */
    .chii2-eval-container dt {
        font-size: 1em;
    }

    /* 99-10 評価点 点数 (dd) */
    .chii2-eval-container dd {
        font-size: 1.2em;
        color: var(--chii-data-color);
    }

    /* 99-11 評価点 総合点 (dd) */
    .chii2-eval-container dl:last-of-type dd {
        color: var(--chii-highlight-color);
    }

    /* 99-12 補足情報コンテナ */
    .chii2-supplement-section-container {
        /* 位置/レイアウト系 */
        width: 99%;
        margin: 15px auto;
    }

    /* 99-13 補足情報 dlの親要素 */
    .chii2-base-info-supplement {
        /* 位置/レイアウト系 */
        width: 99%;
        padding: 0 10px;

        /* タイポグラフィ系 */
        font-size: 0.9em;
    }

    /* 99-14 補足情報 dtの幅調整 */
    .chii2-base-info-supplement dt {
        /* タイポグラフィ系 */
        color: var(--chii-label-color);

        /* 位置/レイアウト系 */
        width: 80px;
    }

    /* 99-15 補足情報 ddの文字色 */
    .chii2-base-info-supplement dd {
        color: var(--chii-data-color);
    }

    /* 99-16 dd内のサブ情報のspanスタイル (ラベル) */
    .chii2-item-span-style, .chii-item-span-sup-style {
        color: var(--chii-supplement-label-color);
    }

    /* 99-17 dd内のサブ情報のspanスタイル (数値) */
    .chii2-item-span-nowrap-style {
        color: var(--chii-data-color);
    }

    /* 99-18 補足情報 (pタグ) のスタイル */
    .chii2-supplement {
        /* タイポグラフィ系 */
        font-size: 0.75em;

        /* 位置/レイアウト系 */
        width: 99%;
        padding-right: 0;
    }

    /* 99-19 テーブル全体の設定 (所持ボーナス) */
    .chii2-possession-bonus {
        /* 位置/レイアウト系 */
        width: 99%;
        margin: 15px auto;

        /* タイポグラフィ系 */
        font-size: 0.9em;

        /* ボーダー/背景系 */
        box-shadow: none;
    }

    /* 99-20 アイコンサイズ */
    .chii-table-icon, .chii2-table-icon {
        /* 位置/レイアウト系 */
        width: 30px;
        max-width: 30px;
        height: 30px;
        max-height: 30px;
    }

    /* 99-21 データセル内のサブ情報 (幅の調整) */
    .chii2-possession-bonus-data .chii2-item-span-style {
        width: 35%;
    }

    /* 99-22 データセル内のサブ情報 (幅の調整) */
    .chii2-possession-bonus-data .chii2-item-span-nowrap-style {
        width: 63%;
    }

    /* 99-23 キャラクター派生一覧 親コンテナ */
    .chii2-cos-list-container {
        /* 位置/レイアウト系 */
        width: 99%;
        padding: 5px;
        margin: 10px auto;

        /* ボーダー/背景系 */
        box-shadow: none;
    }

    /* 99-24 データリストエリア */
    .chii2-cos-list-container>.chii2-cos-list-data {
        /* 位置/レイアウト系 */
        gap: 2px;
        padding: 5px;

        /* ボーダー/背景系 */
        box-shadow: none;
    }

    /* 99-25 各アイテムのコンテナ（スマホで4列表示） */
    .chii2-cos-list-data .chii2-link-icon-style {
        /* 位置/レイアウト系 */
        flex: 0 0 calc((100% - (3 * 2px)) / 4);
        max-width: 25%;
        padding: 2px 1px;
    }

    /* 99-26 リンク内のテキスト */
    .chii2-cos-list-data .chii2-link-icon-style a {
        font-size: 0.65em;
    }
}