/* 記事ページ専用スタイル */

/* 記事全体のレイアウト */
.article-layout {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

/* 記事ヘッダー */
.article-header {
    margin-bottom: 3rem;
    padding-bottom: 1.5rem;
    /* ヘッダー全体をコンパクトに */
    border-bottom: none;
}

.article-title {
    font-size: 2.2rem;
    color: var(--color-text, #222426);
    margin-bottom: 0.5rem;
    /* タイトルと著者名の間をコンパクトに */
    line-height: 1.3;
    font-weight: bold;
    text-align: center;
    padding-bottom: 1rem;
    border-bottom: 3px solid #751485;
}

.article-subtitle {
    display: block;
    margin-top: 0.5rem;
    font-size: 1.5rem;
    color: var(--color-muted-text, #444444);
    font-weight: 500;
}

.article-meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    /* 著者名を右揃え */
    gap: 2rem;
    margin-bottom: 0;
    /* 余分な下マージンを削除 */
    padding: 0.5rem 0;
    /* 上下のパディングを最小化 */
    border-radius: 8px;
}

.article-authors {
    font-weight: 500;
    color: var(--color-muted-text, #444444);
    margin: 0;
    /* パラグラフのデフォルトマージンをリセット */
}

.article-date {
    color: var(--color-muted-text, #444444);
    font-size: 0.9rem;
}

/* 要旨セクション */
.article-abstract {
    margin-bottom: 3rem;
    padding: 2rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 12px;
    border-left: 4px solid #3498db;
}

.article-abstract h3 {
    color: var(--color-text, #222426);
    margin-bottom: 1rem;
    font-size: 1.3rem;
}

.article-abstract p {
    line-height: 1.8;
    color: var(--color-muted-text, #444444);
}

/* 記事本文 */
.article-content {
    max-width: 48em;
    /* 読みやすいように一行の文字数を制限 */
    margin-left: auto;
    margin-right: auto;
    line-height: 1.7;
    /* 1.8から少し詰める */
    letter-spacing: -0.02em;
    /* わずかに文字間を詰める */
    color: var(--color-text, #222426);
}

.article-block {
    margin-bottom: 2.5rem;
}

.article-block h2 {
    font-size: 1.8rem;
    color: var(--color-text, #222426);
    margin-bottom: 1.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #751485;
}

/* 章タイトルの「第1章」等を囲み文字風に見せるためのラベル */
.article-chapter-label {
    display: inline-block;
    padding: 0.1em 0.8em;
    margin-right: 0.5em;
    border: 1px solid #000;
    border-radius: 0;
    background-color: #000;
    color: #fff;
    font-weight: 600;
    line-height: 1.3;
}

/* セクション番号（「１」「２」など）を四角く囲むスタイル */
.article-section-number {
    display: inline-block;
    padding: 0.3em 0.4em;
    margin-right: 0.4em;
    border: 1px solid var(--color-border-darker, #beb8c2);
    border-radius: 0;
    /* 四角く */
    background-color: #fff;
    font-weight: 600;
    line-height: 1;
    min-width: 1.2em;
    text-align: center;
    line-height: 1.4;
}

.article-block h3 {
    font-size: 1.4rem;
    color: var(--color-text, #222426);
    margin: 2rem 0 1rem 0;
}

.article-block h4 {
    font-size: 1.2rem;
    color: var(--color-text, #222426);
    margin: 1.5rem 0 0.8rem 0;
}

.article-block p {
    margin-bottom: 0.9rem;
    text-align: justify;
    text-indent: 1em;
    /* 段落の一文字下げ */
}

/* 先頭記号（○など）をぶら下げる段落 */
.article-block p.article-hanging-bullet {
    text-indent: -1em !important;
    padding-left: 1em !important;
}

/* 長いURL用：英数字の途中でも適度に折り返す */
.article-block .article-long-url {
    word-break: break-all;
    overflow-wrap: anywhere;
}

/* 囲み見出しの場合はインデントを無効化 */
.article-block p.article-callout-title {
    text-indent: 0;
}

/* インデントなし段落（図・表直後など、原稿でインデント不要な段落） */
.article-block p.no-indent {
    text-indent: 0;
}

/* 本文よりわずかに小さいフォント（注釈・用語定義など） */
.article-block .article-note {
    font-size: 0.9rem;
}

.article-block .article-note p {
    margin-bottom: 0.5em;
}

.article-block .article-note p:last-child {
    margin-bottom: 0.9rem;
}

/* 文献引用段落（左縦線でブロックを区別） */
.article-block p.article-citation {
    border-left: 3px solid #999;
    padding-left: 1em;
    margin: 1em 0;
}

/* 文献引用ブロック（引用文＋出典をまとめる） */
.article-block .article-citation-block {
    border-left: 3px solid #999;
    padding-left: 1em;
    margin: 1em 0;
}

.article-block .article-citation-block .article-citation-source {
    text-align: right;
    margin-top: 0.4em;
    margin-bottom: 0;
}

/* 年号＋複数行のリストで行頭を揃える（年号を inline-block で幅確保し、本文2行は同じ開始位置に） */
.article-block .article-year-entry {
    margin-bottom: 0.9rem;
    padding-left: 1em; /* ブロック全体を一文字分字下げ */
}

.article-block .article-year-prefix {
    display: inline-block;
    vertical-align: top;
}

.article-block .article-year-body {
    display: inline-block;
    vertical-align: top;
}

/* 引用段落（既存の段落間1emに加え、前後に余白を設ける） */
.article-block p.article-quote {
    margin-top: 2em;
    margin-bottom: 2em;
}

/* 記事01など、リストの黒丸を削除する場合専用の追加クラス */
.article-biblio.no-bullet ul,
.article-biblio.no-bullet ol {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
}

/* 文献一覧：黒丸は残し、左インデントのみなし。マーカーは記事02と同じ「・」文字に統一 */
.article-biblio.no-biblio-indent ul,
.article-biblio.no-biblio-indent ol {
    padding-left: 0;
    margin-left: 0;
    list-style: none;
}

.article-biblio.no-biblio-indent li {
    padding-left: 1.2em;
    text-indent: -1.2em;
}

.article-biblio.no-biblio-indent li::before {
    content: "・";
    margin-right: 0.3em;
}

.article-biblio p,
.article-biblio li {
    font-size: 0.9rem;
    /* 本文より少し小さくする */
    line-height: 1.5;
    /* 行間を詰める */
    color: var(--color-muted-text, #444444);
}

.article-biblio p {
    margin: 0 0 0.3rem 0;
    /* 下マージンを少し狭く */
    padding-left: 1.2em;
    /* ぶら下げの幅を文字サイズに合わせ少し広げる */
    text-indent: -1.2em;
}

.article-biblio li {
    margin-bottom: 0.3rem;
}

/* 本文中の囲み罫（例：吉田屋藤七の口上書 用） */
/* 本文中の囲み見出し用（例：吉田屋藤七の口上書） */
.article-callout-title {
    display: inline-block;
    padding: 0.1em 0.8em;
    margin: 1.2rem 0 0.8rem;
    border: 1px solid #000;
}

/* 本文中の下線（原稿で下線が引かれている部分） */
.article-underline {
    text-decoration: underline;
}

.article-block ul,
.article-block ol {
    margin: 1rem 0 1rem 2rem;
}

.article-block li {
    margin-bottom: 0.5rem;
}

/* 図版コンテナ */
.article-figure-container {
    margin: 2.5rem 0;
    text-align: center;
}

.article-figure {
    /* Wrapper for legacy figure blocks */
    margin: 2.5rem 0;
    text-align: center;
}

.article-figure figure {
    display: inline-block;
    max-width: 70%;
    margin: 0;
}

/* Unify container max-width to 70% on desktop, center aligned */
.article-figure-container,
.article-figure figure {
    max-width: 70%;
    margin-left: auto;
    margin-right: auto;
}

/* 表コンテナは幅制限を緩和 */
.article-table-container {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

/* --------------------------------------------------------------
   Word 由来原稿（WordSection1）の体裁調整
   - 原稿08など、Word から変換された本文は
     クラス MsoNormal / MS 明朝 などのインライン指定を含むため、
     ここでサイト共通の本文フォント・行間に統一する
-------------------------------------------------------------- */
.WordSection1,
.WordSection1 p,
.WordSection1 span,
.WordSection1 h2,
.WordSection1 h3,
.WordSection1 h4 {
    font-size: 1rem !important;
    font-family: var(--kp-font-body, "Noto Sans JP", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif) !important;
    line-height: 1.8;
    color: var(--color-text, #222426);
}

.WordSection1 p {
    margin-bottom: 1.2rem;
    text-indent: 1em;
}

/* リスト段落は字下げを抑制して読みやすく */
.WordSection1 p.MsoListParagraph {
    margin-left: 1.5em;
    text-indent: 0;
}

.article-table {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

/* Word由来・通常どちらの構造でも、記事内の図版画像は中央揃えにする */
.article-content img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 2.5rem auto 1rem;
}

/* Ensure images inside both container styles look identical */
.article-figure img,
.article-figure-container img,
.article-figure-container img.article-figure {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin-bottom: 1rem;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* 表（table画像）は角丸をなくして罫線が欠けないようにする */
.article-figure img[src*="table"],
.article-figure-container img[src*="table"] {
    border-radius: 0;
}

/* 人間ー環境系の歴史的側面の記事（記事01-08）：図表のborder-radiusを削除 */
.article-layout .article-figure img,
.article-layout .article-figure-container img,
.article-layout .article-figure-container img.article-figure {
    border-radius: 0;
}

/* Unify caption appearance for both patterns */
.article-figure figcaption,
.article-figure-caption {
    font-size: 0.9rem;
    color: var(--color-muted-text, #444444);
    text-align: left;
    font-style: normal;
    display: flex;
    justify-content: center;
    align-items: flex-end; /* ラベルと本文の下端を揃える */
}

.caption-label {
    margin-right: 0.5em;
    white-space: nowrap;
}

.caption-text {
    text-align: left;
}

/* キャプションが上にある場合（表など） */
.article-figure-container>.article-figure-caption:first-child {
    margin-top: 0;
    margin-bottom: 0.5rem;
}

/* キャプションが下にある場合（図など） */
.article-figure-container>.article-figure-caption:last-child {
    margin-top: 0.5rem;
    margin-bottom: 0;
}

/* 旧仕様の2行目インデントクラス（後方互換用、機能を無効化または最小化） */
.article-figure-caption-line2 {
    display: inline;
    padding-left: 0;
}

/* 引用段落（前後に余白・単独セレクターは予備） */
.article-quote {
    margin-top: 2em;
    margin-bottom: 2em;
}

/* 図版グリッド（複数図版の横並び） */
.article-figure-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
    margin: 2.5rem 0;
}

.article-figure-side-by-side {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    margin: 2.5rem 0;
}

/* 表コンテナ */
.article-table-container {
    margin: 2.5rem 0;
    overflow-x: auto;
    width: 100%;
    max-width: 100%;
}

/* 記事06 図表5専用：2列表を原稿どおり再現 */
.article-table.article-table--figure5 {
    width: auto;
    margin: 0 auto;
    font-size: 0.8125rem;
    table-layout: auto;
}

.article-table.article-table--figure5 td {
    padding: 0.2rem 0.6rem;
}

.article-table.article-table--figure5 td:first-child {
    text-align: left;
    white-space: nowrap;
}

.article-table.article-table--figure5 td:last-child {
    text-align: right;
}

/* 記事06の図表1・図表2：コンパクト＋1〜3列目見出し左揃え・数値列右揃え（原稿に合わせる） */
.article-figure-container--table-compact .article-table {
    font-size: 0.8125rem;
    table-layout: fixed;
    width: 100%;
    max-width: 22em;
}

.article-figure-container--table-compact .article-table th:first-child,
.article-figure-container--table-compact .article-table td:first-child {
    width: 48%;
}

.article-figure-container--table-compact .article-table th:nth-child(2),
.article-figure-container--table-compact .article-table td:nth-child(2),
.article-figure-container--table-compact .article-table th:nth-child(3),
.article-figure-container--table-compact .article-table td:nth-child(3) {
    width: 26%;
}

.article-figure-container--table-compact .article-table th,
.article-figure-container--table-compact .article-table td {
    padding: 0.2rem 0.28rem;
}

.article-figure-container--table-compact .article-table th:first-child,
.article-figure-container--table-compact .article-table td:first-child {
    text-align: left !important;
}

.article-figure-container--table-compact .article-table th:nth-child(2),
.article-figure-container--table-compact .article-table th:nth-child(3) {
    text-align: left !important;
}

.article-figure-container--table-compact .article-table td:nth-child(2),
.article-figure-container--table-compact .article-table td:nth-child(3) {
    text-align: right !important;
}

.article-figure-container--table-compact .article-figure-caption {
    text-align: left;
}

/* 表をコンパクトにしてウィンドウからはみ出さないように（記事07の表1・表2など） */
.article-table-container--compact .article-table {
    font-size: 0.875rem;
    table-layout: fixed;
    width: 100%;
}

/* コンパクト表：全セルを左右中央揃えに統一（th・tdおよび子要素すべて） */
.article-table-container--compact .article-table th,
.article-table-container--compact .article-table td {
    text-align: center !important;
}

.article-table-container--compact .article-table th *,
.article-table-container--compact .article-table td * {
    text-align: center !important;
}

.article-table-container--compact .article-table th,
.article-table-container--compact .article-table td {
    padding: 0.35rem 0.4rem;
}

/* 環境嗜好性：やや狭く */
.article-table-container--compact .article-table th:first-child,
.article-table-container--compact .article-table td:first-child {
    width: 12%;
    min-width: 0;
}

/* 遷移ランク */
.article-table-container--compact .article-table th:nth-child(2),
.article-table-container--compact .article-table td:nth-child(2) {
    width: 10%;
    min-width: 0;
}

/* 日華区系：やや広く（表2の種名など見やすく） */
.article-table-container--compact .article-table th:nth-child(3),
.article-table-container--compact .article-table td:nth-child(3) {
    width: 26%;
    min-width: 0;
}

/* 旧北区系・東洋区系 */
.article-table-container--compact .article-table th:nth-child(4),
.article-table-container--compact .article-table td:nth-child(4),
.article-table-container--compact .article-table th:nth-child(5),
.article-table-container--compact .article-table td:nth-child(5) {
    width: 19%;
    min-width: 0;
}

/* 合計・合計種数列：幅と中央揃えを明示 */
.article-table-container--compact .article-table th:nth-child(6),
.article-table-container--compact .article-table td:nth-child(6) {
    width: 14%;
    min-width: 0;
    text-align: center !important;
}

.article-table-container--compact .article-table td:nth-child(6) *,
.article-table-container--compact .article-table th:nth-child(6) * {
    text-align: center !important;
}

.article-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
    background-color: white;
    border: 1px solid #000;
    table-layout: auto;
}

.article-table th {
    background-color: #f0f0f0;
    color: #000;
    padding: 0.5rem 0.8rem;
    text-align: center;
    font-weight: normal;
    border: 1px solid #000;
    white-space: nowrap;
}

/* 環境嗜好性列の幅を広げる */
.article-table th:first-child,
.article-table td:first-child {
    width: 12%;
    min-width: 100px;
}

/* 遷移ランク列の幅（記事07の表用。記事06の図表5〜14には適用しない） */
.article-table:not([class*="article-table--figure"]) th:nth-child(2),
.article-table:not([class*="article-table--figure"]) td:nth-child(2) {
    width: 10%;
    min-width: 90px;
}

/* 日華区系、旧北区系、東洋区系の列幅を広げる（記事07の表用） */
.article-table:not([class*="article-table--figure"]) th:nth-child(3),
.article-table:not([class*="article-table--figure"]) td:nth-child(3) {
    width: 22%;
    min-width: 180px;
}

.article-table:not([class*="article-table--figure"]) th:nth-child(4),
.article-table:not([class*="article-table--figure"]) td:nth-child(4) {
    width: 22%;
    min-width: 180px;
}

.article-table:not([class*="article-table--figure"]) th:nth-child(5),
.article-table:not([class*="article-table--figure"]) td:nth-child(5) {
    width: 22%;
    min-width: 180px;
}

/* 合計種数列の幅（記事07の表用） */
.article-table:not([class*="article-table--figure"]) th:nth-child(6),
.article-table:not([class*="article-table--figure"]) td:nth-child(6) {
    width: 12%;
    min-width: 100px;
}

.article-table td {
    padding: 0.5rem 0.8rem;
    border: 1px solid #000;
    text-align: center;
    vertical-align: middle;
}

/* 記事06 図表5専用の上書き（他の表には影響させない） */
.article-table.article-table--figure5 td {
    padding: 0.2rem 0.6rem;
    text-align: right !important;
    width: auto;
    min-width: 0;
}

.article-table.article-table--figure5 td:first-child {
    text-align: left !important;
    white-space: nowrap;
}

/* 記事06 図表6専用：1列目（地名）は左揃え */
.article-table.article-table--figure6 td:first-child {
    text-align: left !important;
}

/* 記事06 図表7・図表8専用：1列目（地名）は左揃え */
.article-table.article-table--figure7 td:first-child,
.article-table.article-table--figure8 td:first-child,
.article-table.article-table--figure9 td:first-child,
.article-table.article-table--figure10 td:first-child {
    text-align: left !important;
}

/* 記事06 図表7・図表8専用：窒素成分(%)列の数字を右揃え＋タビュラーフォントで桁をそろえる */
.article-table.article-table--figure7 td:nth-child(2),
.article-table.article-table--figure8 td:nth-child(2) {
    text-align: right !important;
    padding-right: 1rem;
    font-variant-numeric: tabular-nums;
}

/* 記事06 図表10専用：数値列（屎尿・緑肥・堆肥・厩肥）を右揃え＋タビュラーフォントで桁をそろえる */
.article-table.article-table--figure10 td:nth-child(2),
.article-table.article-table--figure10 td:nth-child(3),
.article-table.article-table--figure10 td:nth-child(4),
.article-table.article-table--figure10 td:nth-child(5) {
    text-align: right !important;
    padding-right: 1rem;
    font-variant-numeric: tabular-nums;
}

/* 記事06 図表10専用：表全体をコンパクトにするため列幅を調整（フォントサイズは変更しない） */
.article-table.article-table--figure10 th:first-child,
.article-table.article-table--figure10 td:first-child {
    width: 26% !important;
    min-width: 0 !important;
}

.article-table.article-table--figure10 th:nth-child(2),
.article-table.article-table--figure10 td:nth-child(2),
.article-table.article-table--figure10 th:nth-child(3),
.article-table.article-table--figure10 td:nth-child(3),
.article-table.article-table--figure10 th:nth-child(4),
.article-table.article-table--figure10 td:nth-child(4),
.article-table.article-table--figure10 th:nth-child(5),
.article-table.article-table--figure10 td:nth-child(5) {
    width: 18% !important;
    min-width: 0 !important;
}

/* 記事06 図表11専用：1列目やや広め＋数値4列を均等にしてコンパクトに */
.article-table.article-table--figure11 th:first-child,
.article-table.article-table--figure11 td:first-child {
    text-align: left !important;
    width: 30% !important;
}

.article-table.article-table--figure11 th:nth-child(2),
.article-table.article-table--figure11 td:nth-child(2) {
    width: 32% !important;
    min-width: 0 !important;
}

.article-table.article-table--figure11 th:nth-child(3),
.article-table.article-table--figure11 td:nth-child(3),
.article-table.article-table--figure11 th:nth-child(4),
.article-table.article-table--figure11 td:nth-child(4),
.article-table.article-table--figure11 th:nth-child(5),
.article-table.article-table--figure11 td:nth-child(5) {
    width: 14.5% !important;
    min-width: 0 !important;
}

/* 記事06 図表12専用：地名左揃え＋牛・馬列右揃え */
.article-table.article-table--figure12 td:first-child {
    text-align: left !important;
}

.article-table.article-table--figure12 td:nth-child(2),
.article-table.article-table--figure12 td:nth-child(3) {
    text-align: right !important;
    padding-right: 1rem;
    font-variant-numeric: tabular-nums;
}

/* 記事06 図表13専用：1列目やや広め＋数値列を均等にしてコンパクトに（厩肥・家畜尿は少し広め） */
.article-table.article-table--figure13 th:first-child,
.article-table.article-table--figure13 td:first-child {
    text-align: left !important;
    width: 18% !important;
}

.article-table.article-table--figure13 th:nth-child(n+2),
.article-table.article-table--figure13 td:nth-child(n+2) {
    width: 9.5% !important;
    min-width: 0 !important;
}

.article-table.article-table--figure13 th:nth-child(5),
.article-table.article-table--figure13 td:nth-child(5) {
    width: 13% !important;
    min-width: 0 !important;
}

/* 図表13：数値セルは右揃え＋少し内側寄せ、長音「―」だけ中央揃え */
.article-table.article-table--figure13 td:nth-child(n+2) {
    text-align: right !important;
    padding-right: 1rem;
    font-variant-numeric: tabular-nums;
}

.article-table.article-table--figure13 td .figure13-dash {
    display: inline-block;
    width: 100%;
    text-align: center;
}

/* 記事06 図表14専用：1列目やや広め＋数値列を均等にしてコンパクトに */
.article-table.article-table--figure14 th:first-child,
.article-table.article-table--figure14 td:first-child {
    text-align: left !important;
    width: 16% !important;
}

.article-table.article-table--figure14 th:nth-child(n+2),
.article-table.article-table--figure14 td:nth-child(n+2) {
    width: 7.5% !important;
    min-width: 0 !important;
}

/* 図表14は列数が多く横幅を取りやすいため、専用に余白だけ少し詰める（フォントサイズは共通のまま） */
.article-table.article-table--figure14 {
    table-layout: auto;
    max-width: 100%;
}

.article-table.article-table--figure14 th,
.article-table.article-table--figure14 td {
    padding: 0.25rem 0.4rem;
}

/* 図表14：数値セル（2列目以降）は右揃え＋少し内側寄せ */
.article-table.article-table--figure14 td:nth-child(n+2) {
    text-align: right !important;
    padding-right: 1rem;
    font-variant-numeric: tabular-nums;
}

/* 環境嗜好性（草原性、林縁性、森林性）は上揃え・左右中央揃え */
.article-table-group-header {
    text-align: center !important;
    vertical-align: top;
}

/* 遷移ランク（SR1～SR8）は中央揃え */
.article-table-sr {
    text-align: center !important;
}

/* 数値データは中央揃え */
.article-table-number {
    text-align: center !important;
}

/* フッター行の「合計」セルも中央揃え */
.article-table-footer {
    text-align: center !important;
    vertical-align: middle !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* 合計種数セルのテキストを確実に中央揃え */
.article-table tbody tr:last-child td.article-table-footer {
    text-align: center !important;
    vertical-align: middle !important;
}

/* 合計種数セル内のすべての要素を中央揃え */
.article-table-footer * {
    text-align: center !important;
}

/* 表2のセル内のpタグのスタイル */
.article-table td p {
    margin: 0;
    padding: 0;
    line-height: 1.4;
    text-align: center;
}

.article-table td p:not(:last-child) {
    margin-bottom: 0.2rem;
}

/* 数値セル内のpタグも確実に中央揃え */
.article-table-number p {
    text-align: center !important;
}

.article-table-photo-owners {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
    background-color: white;
    border: 1px solid #000;
}

.article-table-photo-owners th {
    background-color: #f0f0f0;
    color: #000;
    padding: 0.5rem;
    text-align: center;
    font-weight: normal;
    border: 1px solid #000;
}

.article-table-photo-owners td {
    padding: 0.5rem;
    border: 1px solid #000;
    text-align: left;
    /* All cells left-aligned for photo owners table */
}

.article-table-caption {
    font-size: 0.9rem;
    color: var(--color-muted-text, #444444);
    text-align: left;
    margin-top: 0.5rem;
    font-style: normal;
    display: flex;
    justify-content: center;
}

/* 表の下の補足キャプション（例：数値はいずれも種数を示す） */
.article-table-caption-note {
    font-size: 0.85rem;
    color: var(--color-muted-text, #444444);
    text-align: center;
    margin-top: 0.4rem;
    margin-bottom: 0;
}

/* 参考文献セクション */
.article-references {
    margin-top: 4rem;
    padding: 2rem;
    background-color: #f8f9fa;
    border-radius: 12px;
}

.article-references h3 {
    color: var(--color-text, #222426);
    margin-bottom: 1.5rem;
    font-size: 1.4rem;
}

.article-references ol {
    margin-left: 1.5rem;
}

.article-references li {
    margin-bottom: 0.8rem;
    line-height: 1.6;
}

/* 記事ナビゲーション */
.article-navigation {
    display: flex;
    justify-content: space-between;
    margin: 3rem 0;
    padding: 1.5rem;
    background-color: #f8f9fa;
    border-radius: 8px;
}

.article-nav-prev,
.article-nav-next {
    padding: 0.8rem 1.5rem;
    background-color: #3498db;
    color: white;
    text-decoration: none;
    border-radius: 6px;
    transition: background-color 0.3s ease;
}

.article-nav-prev:hover,
.article-nav-next:hover {
    background-color: #2980b9;
}

.article-nav-prev:disabled,
.article-nav-next:disabled {
    background-color: #6c757d;
    cursor: not-allowed;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .article-layout {
        padding: 1rem;
    }

    .article-title {
        font-size: 1.8rem;
    }

    .article-subtitle {
        font-size: 1.2rem;
    }

    .article-meta {
        flex-direction: column;
        gap: 1rem;
    }

    .article-figure-side-by-side {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .article-navigation {
        flex-direction: column;
        gap: 1rem;
    }

    .article-nav-prev,
    .article-nav-next {
        text-align: center;
    }

    /* On mobile, allow full width */
    .article-figure-container,
    .article-figure figure,
    .article-table-container,
    .article-table {
        max-width: 100%;
    }
}

@media (max-width: 480px) {
    .article-title {
        font-size: 1.5rem;
    }

    .article-block h2 {
        font-size: 1.5rem;
    }

    .article-block h3 {
        font-size: 1.3rem;
    }
}

/* ==================================================
   記事01専用：Word原稿の本文幅を基準にした図表サイズ指定
   ================================================== */

/* 記事01の本文コンテナ：全記事共通のスタイル（.article-content相当）を継承しつつ、
   図表の相対幅指定のためのベース（100%）として機能させます。
   ※幅の指定自体は共通の .article-content（48em等）に依存します。 */
.article-content-01 {
    /* 特有の最大幅指定を削除し、共通レイアウトに追従させます */
    margin: 0 auto;
}

/* 記事01の図表コンテナ：テキスト幅（100%）に対するパーセンテージで比率を維持
   .article-block を含め詳細度を上げ、共通の .article-figure-container { max-width: 70% } より確実に優先させます */
.article-content-01 .article-block .article-figure-container {
    /* デフォルトはテキスト幅の70% */
    max-width: 70%;
    margin: 2.5rem auto;
}

/* data属性で個別の比率を指定可能（パーセンテージに変換） */
.article-content-01 .article-block .article-figure-container[data-width-ratio="0.38"] {
    max-width: 38%;
}

.article-content-01 .article-block .article-figure-container[data-width-ratio="0.46"] {
    max-width: 46%;
}

.article-content-01 .article-block .article-figure-container[data-width-ratio="0.467"] {
    max-width: 46.7%;
}

.article-content-01 .article-block .article-figure-container[data-width-ratio="0.5"] {
    max-width: 50%;
}

.article-content-01 .article-block .article-figure-container[data-width-ratio="0.6"] {
    max-width: 60%;
}

.article-content-01 .article-block .article-figure-container[data-width-ratio="0.7"] {
    max-width: 70%;
}

.article-content-01 .article-block .article-figure-container[data-width-ratio="0.72"] {
    max-width: 72%;
}

.article-content-01 .article-block .article-figure-container[data-width-ratio="0.8"] {
    max-width: 80%;
}

.article-content-01 .article-block .article-figure-container[data-width-ratio="0.9"] {
    max-width: 90%;
}

.article-content-01 .article-block .article-figure-container[data-width-ratio="1.0"] {
    max-width: 100%;
}

/* 記事01の表コンテナ：必要に応じて比率指定可能（CSS変数を用いて%を算出） */
.article-content-01 .article-table-container[data-width-ratio] {
    /* --width-ratio が 0.8 なら 80% になるように calc で計算 */
    max-width: calc(100% * var(--width-ratio, 1.0));
}

/* モバイル表示時のレスポンシブ対応 */
@media (max-width: 768px) {

    .article-content-01 .article-block .article-figure-container,
    .article-content-01 .article-table-container {
        /* 画面が狭いときは比率指定を無視して最大幅いっぱいまで広げる */
        max-width: 100%;
    }
}