/* あすかテーマ：記事フロント用CSS（本家/SWELLの記事デザインを自前クラスで再現） */

/* ── サイトカラールール（役割ベース・思想11） ── */
:root {
    --ak-green: #7cb638; /* 見出し・構造アクセント（黄緑＝あすか本体のメインカラー） */
    --ak-link:  #7cb638; /* リンク・強調（黄緑に統一） */
    --ak-tint:  #f5f9e8; /* 薄い背景（淡緑＝本体実使用色） */
    --ak-tint2: #f2f5ea; /* 薄い背景（グレー寄り淡緑） */
}

/* ── 親サイトの「器」に含まれる、記事ページでは不要な要素を非表示 ──
   HTMLは削らずCSSで隠す（多バイト文字化け・消し残しを避けるため・思想12）
   ※ あすか本体は #content を丸ごと差し替えるため、ページタイトル帯
     （.main_title）や本体パンくず（.main_breadcrumb）は #content 内に
     含まれて自然に消える。ここでは差し替え後もガワに残り得る
     Jetpack共有ボタン等だけを保険で隠す ── */
.sharedaddy,        /* Jetpack シェアボタン（本体記事用・#content外に出た場合の保険） */
.jp-relatedposts {  /* Jetpack 関連記事（同上） */
    display: none !important;
}

/* あすか本体はヘッダーがfixed（PC80px/SP60px）で、bodyのpadding-topはヘッダー分
   ちょうどしかない。本体下層では #content 先頭の .main_title 帯（画像＋白まる帯）が
   ヘッダーとコンテンツの間のクッションになっているが、メディアは #content を丸ごと
   差し替えるため帯が消えてゼロ距離になる。その代替として上部余白を確保する（v1.1.5） */
#content {
    padding-top: 64px !important;
}
@media screen and (max-width: 767px) {
    #content {
        padding-top: 36px !important;
    }
}



/* ── ベースタイポグラフィ（親サイト準拠） ── */
main {
    font-size: 16px;
    line-height: 1.8;
    letter-spacing: 0.08em;
    color: #333;
    font-family: "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
    font-weight: 500;
}

/* ── 記事コンテナ ──
   幅780px＝あすか本体の記事本文実効幅に準拠（v1.1.6実測:
   .contents 1200px − サイドナビ330px − padding-left 70px − 左右padding30px ≒ 770px） */
.ak-article {
    max-width: 780px !important;
    margin: 24px auto 48px !important;
    /* v1.0.13: 余白は画面幅に応じて流動（小画面14px〜大画面44px）。
       メディアクエリ分岐なしで全デバイスに対応（全デバイス対応） */
    padding: 0 clamp(14px, 4vw, 44px) 8px !important;
    background: #fff !important;
    border: none !important;
    border-radius: 0 !important;
}

.ak-article .entry-title {
    float: none !important; /* 本体common.cssの裸 h1{float:left}（ヘッダーロゴ用）の打ち消し。
                               @importインライン化(v1.0.2)で下層CSSが記事にも効くようになったため */
    font-size: 28px;
    font-weight: 700;
    line-height: 1.5;
    margin: 0 0 16px;
    color: #4c7024; /* ディープネイビー（C案セット） */
}

.ak-article .entry-dates {
    font-size: 13px;
    color: #999;
    margin-bottom: 24px;
}

.ak-article .entry-dates span + span::before {
    content: "／";
    margin: 0 0.5em;
}

.ak-article .post-thumbnail {
    margin-bottom: 32px;
}

.ak-article .post-thumbnail img {
    width: 100% !important;
    max-width: min(740px, 100%) !important; /* アイキャッチは最大740px。
                                               運用ルール: アイキャッチ画像は横幅740pxで作成→原寸(等倍)表示で最も綺麗。
                                               図解は横幅700pxで作成（下の700pxルールで等倍表示） */
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
    border-radius: 8px !important;
}

/* ── 見出し（グリーンバンドセット・本体サイトの角丸作法） ── */
/* h2: あすか黄緑のバンド（角丸8px・白抜き） */
.ak-article h2 {
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.4;
    margin: 40px 0 18px;
    padding: 12px 18px;
    background: var(--ak-green);
    border: none;
    border-radius: 8px;
}

/* h3: 薄水色バンド（角丸6px・ネイビー文字） */
.ak-article h3 {
    color: #4c7024;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.4;
    margin: 32px 0 12px;
    padding: 8px 14px;
    background: var(--ak-tint);
    border: none;
    border-radius: 6px;
}

/* h4: シアンの点線下線（文字幅にフィット） */
.ak-article h4 {
    display: table;
    color: #333;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    margin: 28px 0 10px;
    padding: 0 2px 6px;
    background: none;
    border: none;
    border-bottom: 2px dotted #e17f54;
}

.ak-article h5 {
    color: #4c7024;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    margin: 22px 0 10px;
}

.ak-article h6 {
    color: #4E4E4E;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
    margin: 18px 0 8px;
}

/* ── 本文・リンク ── */
.ak-article p {
    font-size: 16px;
    line-height: 1.75;
    margin: 0 0 20px;
    color: #333;
}

.ak-article a {
    color: var(--ak-link);
    text-decoration: underline;
    transition: opacity 0.3s;
}

.ak-article a:hover {
    opacity: 0.6;
}

.ak-article strong {
    color: var(--ak-link);
    font-weight: 700;
}

/* ── リスト（v1.0.9: あすか黄緑のマーカー装飾）──
   ul  = 黄緑の丸マーカー
   ol  = 黄緑太字の数字
   ※プラグイン側の装飾ブロック（box-list等）は自前のマーカーで上書きする */
.ak-article ul {
    margin: 0 0 20px;
    padding-left: 2px;
    list-style: none;
}

.ak-article ol {
    margin: 0 0 20px;
    padding-left: 2px;
    list-style: none;
    counter-reset: ak-ol;
}

.ak-article ul > li {
    position: relative;
    padding-left: 1.25em;
}

.ak-article ul > li::before {
    content: "";
    position: absolute;
    left: 3px;
    top: 0.62em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ak-green);
}

.ak-article ul ul,
.ak-article ol ol,
.ak-article ul ol,
.ak-article ol ul {
    margin: 0.25em 0 0;
    list-style: none;
}

.ak-article ul ul > li::before {
    width: 6px;
    height: 6px;
    top: 0.7em;
    background: #e17f54;
}

.ak-article ol > li {
    position: relative;
    padding-left: 1.7em;
    counter-increment: ak-ol;
}

.ak-article ol > li::before {
    content: counter(ak-ol) ".";
    position: absolute;
    left: 2px;
    top: 0;
    color: var(--ak-green);
    font-weight: 700;
}

.ak-article li {
    font-size: 16px;
    line-height: 1.7;
    margin: 0.25em 0;
    padding-top: 0;
    padding-bottom: 0;
    color: #333;
}

.ak-article li > ul,
.ak-article li > ol {
    margin: 0.25em 0 0;
}

/* ── 画像 ──
   ・本来サイズで表示(拡大しない＝粗くならない)
   ・デバイス幅が画像より狭い場合は100%に縮小
   ・デフォルトで中央表示
*/
.ak-article img {
    max-width: 100%;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* Gutenbergの画像ブロック */
.ak-article .wp-block-image {
    margin: 24px auto;
    text-align: center;
}
.ak-article .wp-block-image img {
    display: inline-block;
    max-width: 100%;
    height: auto;
}

/* 画像は元サイズで表示し、拡大しない（粗くならないように）。
   ・コンテンツ幅より大きい画像 → 縮小（max-width:100%）
   ・小さい画像（例:500px） → そのままの幅で表示（width:auto）
   ・画面が画像幅より狭い → 100%に縮小
   ※ 全幅(alignfull)・幅広(alignwide)は意図的に幅100%にするため除外
   ※ 本体サイト取込CSSの img { max-width:100%; display:block } 系（要素セレクタ）に確実に勝つため !important を使用。
      手動リサイズ画像（インラインwidth指定あり）はセレクタから除外して尊重する（v1.0.10） */
.ak-article .wp-block-image:not(.alignfull):not(.alignwide) img:not([style*="width"]),
.ak-article p > img:not([style*="width"]) {
    width: auto !important;
    max-width: min(700px, 100%) !important; /* 図解は最大700px（v1.0.12：段落直下のimgにも適用） */
    height: auto !important;
}
/* 段落直下の画像（MD原稿由来の <p><img></p>）も中央寄せ */
.ak-article p > img {
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Gutenberg align 指定を尊重（右寄せ・左寄せが選ばれた場合） */
.ak-article .wp-block-image.alignleft {
    text-align: left;
    margin: 0 24px 16px 0;
}
.ak-article .wp-block-image.alignleft img {
    margin: 0;
}
.ak-article .wp-block-image.alignright {
    text-align: right;
    margin: 0 0 16px 24px;
}
.ak-article .wp-block-image.alignright img {
    margin: 0;
}

/* キャプションを控えめに */
.ak-article .wp-block-image figcaption {
    font-size: 12px;
    color: #666;
    text-align: center;
    margin-top: 8px;
    line-height: 1.5;
}

/* ── blockquote（本家準拠：グレー背景＋二重線の左罫） ── */
/* blockquote 案3: 淡緑カード＋大きな引用符（v1.1.1・デザイン第1弾確定） */
.ak-article blockquote {
    position: relative;
    margin: 20px 0;
    padding: 22px 24px 16px 46px;
    border: none;
    background: var(--ak-tint);
    border-radius: 12px;
    color: #4E4E4E;
    font-style: normal;
    font-size: 15px;
    line-height: 1.8;
}
.ak-article blockquote::before {
    content: "\201C";
    position: absolute;
    left: 16px;
    top: 6px;
    width: auto;
    height: auto;
    border: none;
    font-family: Georgia, serif;
    font-size: 44px;
    color: var(--ak-green);
    line-height: 1;
}

.ak-article blockquote p:last-child {
    margin-bottom: 0;
}

/* ── table（本体トーン + スマホ横スクロール対応） ── */
.ak-article table,
.ak-article .wp-block-table table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 20px 0 !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
    word-break: break-word;
    table-layout: auto !important;
}

/* th: 青ヘッダー白文字（!important で強制。Gutenbergのインライン色も打ち消す） */
.ak-article th,
.ak-article thead th,
.ak-article tr th,
.ak-article tr:first-child th,
.ak-article .wp-block-table th,
.ak-article .wp-block-table thead th {
    background: var(--ak-green) !important;
    background-color: var(--ak-green) !important;
    color: #fff !important;
    padding: 12px !important;
    text-align: left !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    border: 1px solid var(--ak-green) !important;
    vertical-align: middle !important;
}

.ak-article td,
.ak-article .wp-block-table td {
    padding: 12px !important;
    border: 1px solid #dcdcdc !important;
    text-align: left;
    font-size: 15px;
    line-height: 1.7;
    color: #333;
    vertical-align: middle;
    background: #fff;
}

/* 偶数行の td のみストライプ */
.ak-article tbody tr:nth-child(even) td,
.ak-article table > tr:nth-child(even) td {
    background: var(--ak-tint) !important;
}

.ak-article tbody tr:hover td {
    background: var(--ak-tint2) !important;
}

/* ── レスポンシブテーブル（WPブロック自動対応） ── */
.ak-article .wp-block-table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 2em 0;
}

.ak-article .wp-block-table table {
    margin: 0;
}

/* has-fixed-layout：まず100%に収める → 溢れたらスクロール */
.ak-article .wp-block-table .has-fixed-layout {
    table-layout: auto;
    width: 100%;
}

/* 多列テーブル：先頭列を固定 */
.ak-article .wp-block-table th:first-child,
.ak-article .wp-block-table td:first-child {
    position: sticky;
    left: 0;
    z-index: 1;
    background: var(--ak-tint2);
    box-shadow: 2px 0 4px rgba(0,0,0,0.06);
}

.ak-article .wp-block-table td:first-child {
    background: #fff;
}

.ak-article .wp-block-table tr:hover td:first-child,
.ak-article .wp-block-table tr:hover th:first-child {
    background: var(--ak-tint);
}

/* ── 親サイトCSSリセット（font-size:10px）の上書き ── */
.ak-article code,
.ak-article pre,
.ak-article dfn,
.ak-article em,
.ak-article span,
.ak-article sub,
.ak-article sup,
.ak-article dl,
.ak-article dt,
.ak-article dd {
    font-size: inherit;
    line-height: inherit;
    font-family: inherit;
}

.ak-article code,
.ak-article pre {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 0.9em;
    background: #f5f5f5;
    padding: 2px 6px;
    border-radius: 3px;
}

.ak-article pre {
    padding: 1em;
    overflow-x: auto;
    line-height: 1.6;
}

.ak-article em {
    font-style: italic;
}

.ak-article figcaption,
.ak-article .wp-element-caption,
.ak-article caption,
.ak-article cite,
.ak-article small,
.ak-article figure,
.ak-article address {
    font-size: 14px;
    line-height: 1.7;
    color: #4E4E4E;
    font-family: "Noto Sans JP", "游ゴシック体", YuGothic, sans-serif;
    font-weight: 500;
}

.ak-article figcaption,
.ak-article .wp-element-caption {
    margin-top: 0.8em;
    text-align: center;
}

/* (旧テーブルスクロールヒントは v1.0.1 で撤去。新機構=.is-scrollable ピルバッジに一本化) */

/* ── カード一覧（トップ・アーカイブ） ── */
.ak-card-grid {
    max-width: 780px !important;
    margin: 24px auto 40px !important;
    padding: 0 20px !important;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 24px;
}
.archive-hero + .ak-card-grid {
    margin-top: 32px !important;
}
.archive-hero + .ak-article {
    margin-top: 32px !important;
}

.ak-card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid #e5e9dc;
    border-top: 4px solid var(--ak-green); /* 案3: 上辺黄緑アクセント（業者カードとお揃い） */
    border-radius: 10px;
    overflow: hidden; /* v1.1.2: カテゴリタグ廃止に伴い角丸を綺麗に */
    text-decoration: none;
    color: #333;
    transition: box-shadow 0.2s, transform 0.2s, border-color 0.2s;
}

.ak-card:hover {
    box-shadow: 0 6px 22px rgba(76, 112, 36, 0.12);
    border-color: #d6ddc7;
    border-top-color: var(--ak-green);
    transform: translateY(-2px);
}

.ak-card__thumb {
    aspect-ratio: 740 / 416; /* アイキャッチ比率（740x416）で統一 */
    overflow: hidden;
}
.ak-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.ak-card__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 13px 16px 13px;
}

.ak-card__title {
    flex: 1;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
    margin: 0;
    text-align: left; /* 本体CSS h2{text-align:center} の打ち消し */
    color: #4c7024;
    transition: color 0.2s;
}
.ak-card:hover .ak-card__title {
    color: var(--ak-link);
}

.ak-card__date {
    margin-top: 10px;
    font-size: 11.5px;
    color: #8a91a0;
}

/* ── アーカイブタイトル ── */
.archive-hero {
    max-width: 780px;
    margin: 24px auto 0;
    padding: 24px 20px 0;
    text-align: center;
}
.archive-title {
    float: none !important; /* 保険：本体CSSに裸の h1 float 指定があっても
                               見出し左・カード右の2カラム状に崩れないよう明示
                               （あすか本体には現状 h1 float は無いが維持） */
    font-size: 30px;
    font-weight: 700;
    color: var(--ak-green);
    letter-spacing: .08em;
    line-height: 1.4;
    margin: 0;
}
.archive-hero + .ak-card-grid,
.archive-hero + .ak-article {
    clear: both; /* 保険：フロート解除 */
}

/* ── 404：トップへ戻るボタン ── */
.ak-article .ak-back-home {
    display: inline-block;
    margin-top: 8px;
    padding: 12px 28px;
    background: var(--ak-green);
    color: #fff !important;
    border-radius: 6px;
    text-decoration: none !important;
    font-weight: 700;
    transition: background 0.2s;
}
.ak-article .ak-back-home:hover {
    background: var(--ak-link);
}

/* ── ナビゲーション ── */
.nav-links {
    max-width: 780px;
    margin: 24px auto;
    padding: 0 20px;
    font-size: 14px;
}

.nav-links a {
    color: var(--ak-link);
}

/* ── レスポンシブ ── */
@media (max-width: 768px) {
    .ak-article {
        font-size: 15px; /* v1.0.1: main直指定をやめ記事スコープに（ガワへの影響排除） */
    }

    .ak-article .entry-title {
        font-size: 21px; /* v1.0.1: h2(19px)より大きく保ち階層逆転を解消 */
    }

    .ak-article p {
        font-size: 15px;
        line-height: 1.8;
    }

    .ak-article h2 {
        font-size: 19px;
        margin: 30px 0 15px;
        padding: 10px 14px;
    }

    .ak-article h3 {
        font-size: 17px;
        margin: 24px 0 12px;
        padding: 7px 12px;
    }

    .ak-article h4 {
        font-size: 16px;
        margin: 22px 0 10px;
        padding: 0 2px 5px;
    }

    .ak-article h5 {
        font-size: 15px;
    }

    .ak-article h6 {
        font-size: 14px;
    }

    /* リストボックスのpaddingを縮めて可読性確保 */
    .ak-article ul,
    .ak-article ol {
        padding: 20px 25px 12px;
        padding-left: 40px; /* マーカー分確保 */
    }

    .ak-article ul > li,
    .ak-article ol > li {
        font-size: 14px;
        line-height: 1.6;
    }

    /* テーブル：セル詰めて小フォントで対応 */
    .ak-article th,
    .ak-article td {
        padding: 8px 10px;
        font-size: 13px;
        line-height: 1.5;
    }

    .ak-article blockquote {
        font-size: 14px;
        padding: 12px 16px;
    }

    .ak-card-grid {
        margin-top: 24px !important;
        grid-template-columns: 1fr;
    }

    .ak-card__title {
        font-size: 15px;
    }

    .archive-hero {
        padding: 24px 16px 0 !important;
    }
    .archive-title {
        font-size: 24px !important;
        letter-spacing: .12em !important;
    }
    .archive-title::after {
        width: 80px !important;
        height: 6px !important;
    }
    .archive-desc {
        font-size: 13px !important;
        margin-top: 16px !important;
    }
}

/* ============================================================
   親サイト（asukafukushikai.com）適用CSS
   ============================================================
   親サイト（SWELL）のHTMLを借りる運用で、本文に不要な親テーマ由来の
   装飾を打ち消す。管理画面「追加CSS」欄に書く代わりにテーマに組み込む（WAF回避）。
   ============================================================ */

/* グローバルナビの「スタッフブログ」current ハイライトを打ち消し */
.headnavi.current {
    color: inherit !important;
    font-weight: normal !important;
    border-bottom: none !important;
    background: none !important;
}

/* サイドバー除去後、記事本体を全幅に */
.flexcontents--contents {
    display: block !important;
    width: 100% !important;
}
.article {
    width: 100% !important;
    max-width: 780px !important;
    margin: 0 auto !important;
    padding: 40px 20px !important;
}

/* ============================================================
   パンくずリスト（テーマ側スタイル・本体トーン）
   ※ 本体サイトはSWELLではないため p-breadcrumb 系のCSSを持たない。
     テーマ側で一般的な横並びパンくずとして装飾する（v1.0.8）。
   ============================================================ */
.p-breadcrumb {
    max-width: 780px;
    margin: 0 auto;
    padding: 16px 20px;
    font-size: 13px;
    line-height: 1.6;
}
.p-breadcrumb__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
}
.p-breadcrumb__item {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    font-size: 13px !important; /* 本体CSSの article li{font-size:20px} がli直接指定のため、
                                   コンテナ13pxの継承では効かない。li側で明示上書きする */
    line-height: 1.6 !important;
    background: none !important;
}
.p-breadcrumb__item + .p-breadcrumb__item::before {
    content: "›";
    margin: 0 8px;
    color: #9aa4b2;
}
.p-breadcrumb__text {
    color: #7cb638;
    text-decoration: none;
}
a.p-breadcrumb__text:hover {
    text-decoration: underline;
}
.p-breadcrumb__item:last-child .p-breadcrumb__text {
    color: #666666;
}
@media (max-width: 768px) {
    .p-breadcrumb {
        font-size: 12px;
        padding: 12px 15px;
    }
    .p-breadcrumb__item {
        font-size: 12px !important;
    }
}

/* ── テーブル直後の小サイズ文字（v1.0.10）──
   エディタでフォントサイズ「小」を設定した段落がテーブル直後に来た場合、
   テーブルとの間隔を詰めて注釈らしく見せる */
.ak-article .wp-block-table + p.has-small-font-size,
.ak-article figure.wp-block-table + p.has-small-font-size,
.ak-article table + p.has-small-font-size,
.ak-article .akc-table-wrap + p.has-small-font-size {
    margin-top: -12px; /* テーブルのmargin-bottom 20pxと相殺し実質8px */
    font-size: 13px;
    color: #777;
    line-height: 1.6;
}


/* ── 本体下層CSS（common.css インライン化分）の裸要素セレクタ打ち消し ──
   common.css には本体ヘッダーロゴ用の裸 h1{float:left} / h1 img{width:395px;height:58.5px}
   があり、@importインライン化(v1.0.2)後は記事側にも効いてしまう。
   記事内の h1（entry-title 以外の h1 が本文に来た場合も含む）を保険で打ち消す。 */
.ak-article h1 {
    float: none !important;
}
.ak-article h1 img {
    width: auto !important;
    height: auto !important;
}


/* ─────────────────────────────────
   本文テーブルのスマホ最適化（v1.0.13）
   既存のスクロール機構（グラデ＋「←スクロールできます→」）と統合。
   ・figureの幅を画面内に確実に固定し、内部だけ横スクロール
   ・iOS Safariで不具合の出やすい1列目sticky固定をスマホでは解除
   ・文字は本文より小さく／1列目は折り返さない
   ※ akc- 系（プラグイン装飾のテーブル）は対象外
   ───────────────────────────────── */
.ak-article .wp-block-table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
}
.ak-article .wp-block-table table {
    width: auto !important;
    min-width: 100% !important;  /* 内容が少ない表は画面幅まで広げ右余白を消す */
    max-width: none !important;   /* 収まらない表は自然幅のまま横スクロール */
}

@media (max-width: 768px) {
    /* iOSでスクロール不能・描画乱れの原因になりやすい1列目固定を解除 */
    .ak-article .wp-block-table th:first-child,
    .ak-article .wp-block-table td:first-child {
        position: static !important;
        box-shadow: none !important;
        z-index: auto !important;
    }
    /* 文字サイズ：本文より一段小さく */
    .ak-article table:not([class*="akc-"]),
    .ak-article .wp-block-table table {
        font-size: 13px !important;
        line-height: 1.6 !important;
    }
    .ak-article table:not([class*="akc-"]) th,
    .ak-article table:not([class*="akc-"]) td,
    .ak-article .wp-block-table thead th,
    .ak-article .wp-block-table td {
        padding: 9px 12px !important;
        font-size: 13px !important;
        line-height: 1.7 !important;
    }
    /* 2列目以降のセルに最小幅を保証：列の圧縮つぶれを防ぎ、
       収まらない分は自然に横スクロールへ（モバイルテーブルの定石） */
    .ak-article table:not([class*="akc-"]) th:not(:first-child),
    .ak-article table:not([class*="akc-"]) td:not(:first-child),
    .ak-article .wp-block-table th:not(:first-child),
    .ak-article .wp-block-table td:not(:first-child) {
        min-width: 12em !important;
    }
    /* 1列目（項目名）は折り返さない：細切れ表示の防止 */
    .ak-article table:not([class*="akc-"]) th:first-child,
    .ak-article table:not([class*="akc-"]) td:first-child {
        white-space: nowrap !important;
    }
    /* 裸テーブル（figureなし・MD原稿由来など）も横スクロール化 */
    .ak-article > table:not([class*="akc-"]) {
        display: block !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        max-width: 100% !important;
    }
}

/* ─────────────────────────────────
   テーブルスクロールのデザイン刷新（v1.0.13）
   ・右端グラデ（::after）を廃止：スクロールコンテナ化に伴い
     スクロール中に「区切り線」のように取り残されて見えるため
     （旧グラデ廃止）
   ・「←スクロールできます→」はピル型バッジに刷新し、
     実際にはみ出している表だけに表示（JS判定 .is-scrollable）
   ・罫線を淡緑に統一して軽く上品に（案2ホリゾンタル）
   ───────────────────────────────── */
.ak-article .wp-block-table::after {
    content: none !important;
    display: none !important;
}
.ak-article .wp-block-table::before {
    display: none !important;
}
.ak-article .wp-block-table.is-scrollable::before {
    content: '← スクロールできます →' !important;
    display: inline-block !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    background: #e17f54 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    padding: 3px 14px !important;
    letter-spacing: 0.03em !important;
    line-height: 1.5 !important;
}
.ak-article .wp-block-table {
    position: relative !important; /* バッジ(absolute)の基準。全幅で明示 */
    padding-top: 28px !important;
}
.ak-article .wp-block-table:not(.is-scrollable) {
    padding-top: 0 !important; /* スクロール不要の表はラベル領域も不要 */
}
/* 案2ホリゾンタル：縦線なし・横線のみ＋淡い縞（ヘッダの黄緑は維持） */
.ak-article .wp-block-table td {
    border: none !important;
    border-bottom: 1px solid #e5eed3 !important;
}
.ak-article .wp-block-table tbody tr:nth-child(odd) td {
    background: #f7faf0 !important;
}
.ak-article .wp-block-table tbody tr:nth-child(even) td {
    background: #fff !important;
}
/* Android等ではスクロールバーを細く上品に（iOSは標準挙動） */
.ak-article .wp-block-table::-webkit-scrollbar { height: 5px; }
.ak-article .wp-block-table::-webkit-scrollbar-thumb { background: #d9e7c4; border-radius: 3px; }
.ak-article .wp-block-table::-webkit-scrollbar-track { background: transparent; }