/* ===== page-news-detail.css ｜ お知らせ個別（Figma 14486:41970）=====
   デザイン言語: 色/書体トークンは base.css。英大見出し＋和ラベルのペア、共通ボタン(.btn)、コンテンツ幅1200中央（--pad-side）を全ページで使い回す。
   下層FVはタイトル小（.lfv--s）。記事行は TOP の .news-item（css/sections/news.css）をそのまま使用。 */

/* --- FV差分: タイトル下に 日付＋カテゴリタグ（gap12） --- */
.lfv__meta{display:flex;align-items:center;gap:12px}
.lfv__date{font-family:var(--font-en);font-weight:600;font-size:14px;line-height:1;color:var(--c-gray);white-space:nowrap;font-feature-settings:normal}
.lfv__tag{display:flex;align-items:center;justify-content:center;min-width:69px;padding:0 12px 1px;border:1px solid var(--c-border-sub);border-radius:var(--r-s);font-size:14px;font-weight:500;line-height:1.6;letter-spacing:.14px;color:var(--c-text-sub);text-align:center;white-space:nowrap}

/* --- 記事: bg base3 / pt80 pb120 / 1200内で右寄せ（w885）→ gap80 → 戻るボタン --- */
.article{padding-top:var(--sp-under-btn);padding-bottom:var(--sp-side-m);background:var(--c-base3);overflow:hidden}
.article__inner{display:flex;align-items:flex-start;justify-content:flex-end}
.article__col{display:flex;flex-direction:column;align-items:center;gap:var(--sp-under-btn)}
.article__body{display:flex;flex-direction:column;align-items:flex-start;gap:64px;width:885px;max-width:100%}
.article__lead{width:100%;font-size:var(--fs-body-m);font-weight:400;line-height:2;letter-spacing:.16px}
.article-part{display:flex;flex-direction:column;align-items:flex-start;gap:24px;width:100%}
.article-part__title{font-size:var(--fs-h4);font-weight:500;line-height:1.6;letter-spacing:.24px}
.article-part__content{display:flex;flex-direction:column;align-items:flex-start;gap:48px;width:100%}
.article-part__text{width:100%;font-size:var(--fs-body-m);font-weight:400;line-height:2;letter-spacing:.16px}
.article-part__text strong{font-weight:700}

/* 表: 罫線 #c2cde0 / th 白 w279 px32 py16 Medium / td px32 py8 Regular（Figma実測 行ピッチ57.67 → th padding 15.5px） */
.article-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:var(--fs-body-m);line-height:1.6;letter-spacing:.16px}
.article-table th,.article-table td{border-top:1px solid var(--c-border);border-bottom:1px solid var(--c-border);vertical-align:middle;text-align:left}
.article-table th{width:279px;padding:15.5px 32px;background:var(--c-base);border-right:1px solid var(--c-border);font-weight:500}
.article-table td{padding:8px 32px;font-weight:400}

/* 番号付きポイント: gap16 / 見出し行 gap8（Lato SemiBold 16 lh32 ＋ 16px Medium）青 / 本文 16px Regular lh1.6 */
.article-points{display:flex;flex-direction:column;align-items:flex-start;gap:16px;width:100%}
.article-points__item{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%}
.article-points__head{display:flex;align-items:center;gap:8px;color:var(--c-text-sub);white-space:nowrap}
.article-points__num{font-family:var(--font-en);font-weight:600;font-size:16px;line-height:32px;font-feature-settings:normal}
.article-points__label{font-size:var(--fs-body-m);font-weight:500;line-height:1.6;letter-spacing:.16px}
.article-points__text{width:100%;font-size:var(--fs-body-m);font-weight:400;line-height:1.6;letter-spacing:.16px}

/* 補足ボックス: 白 px48 pt24 pb32 r3 gap24 / 下線リンク */
.article-note{display:flex;flex-direction:column;align-items:flex-start;gap:24px;width:100%;padding:24px 48px 32px;background:var(--c-base);border-radius:var(--r-s)}
.article-note__text{width:100%;font-size:var(--fs-body-m);font-weight:400;line-height:2;letter-spacing:.16px}
.article-note__link{display:inline-flex;align-items:center;justify-content:center;padding:5px 2px;border-bottom:1px solid var(--c-border-sub);font-size:var(--fs-body-m);font-weight:500;line-height:1.6;letter-spacing:.16px;color:var(--c-text-sub);white-space:nowrap}

/* 戻るボタン（Figma component button 14406:19657）: w180 pl12 pr24 gap24 / アイコン左
   矢印はSVG自体を左向きに描いている（.btn__arrow--back）。CSSで反転しない＝共通の .btn ホバー（animation.css）にそのまま乗る */
.btn--back{flex-direction:row;gap:24px;width:180px;padding:12px 24px 12px 12px}
.btn--back .btn__label{flex:1 0 0;justify-content:flex-start}

/* --- 関連記事: bg 白 / pt120 pb160 / Title(215) gap100 記事群(885) --- */
.related{padding-top:var(--sp-side-m);padding-bottom:var(--sp-section-gap);background:var(--c-base);overflow:hidden}
.related__inner{display:flex;align-items:flex-start;gap:100px}
.related__title{display:flex;flex-direction:column;align-items:flex-start;gap:8px;flex:none;width:215px}
.related__en{font-family:var(--font-en);font-weight:600;font-size:var(--fs-h2-en2);line-height:1;color:var(--c-text-sub);font-feature-settings:normal}
.related__ja{font-size:var(--fs-concept);font-weight:500;line-height:1.6;letter-spacing:1.44px;white-space:nowrap}
.related__list{display:flex;flex-direction:column;align-items:flex-start;width:885px;max-width:100%}

/* ===== SP（768px以下）: SPカンプ無し → 本文1カラム・表は縦積み・関連記事は TOP-SP News の行と同じ組み方 ===== */
@media (max-width:768px){
  /* FV差分: タグを 12px に */
  .lfv__meta{flex-wrap:wrap;gap:8px}
  .lfv__tag{min-width:0;padding:0 8px 2px;font-size:12px;letter-spacing:.12px}
  /* 記事: 右寄せを解除して幅100%・縦間隔を詰める */
  .article{padding-top:var(--sp-under-btn);padding-bottom:var(--sp-section-gap)}
  .article__inner{justify-content:flex-start}
  .article__col{width:100%;gap:var(--sp-under-btn)}
  .article__body{width:100%;gap:40px}
  .article__lead{line-height:1.8;letter-spacing:.15px}
  .article-part{gap:16px}
  .article-part__title{letter-spacing:.2px}
  .article-part__content{gap:32px}
  .article-part__text{line-height:1.8;letter-spacing:.15px}
  /* 表: th/td を縦積み（th=12px太字・白bg、td=本文）。罫線は th の上と td の下だけ残す */
  .article-table{display:block;width:100%;font-size:var(--fs-body-m);letter-spacing:.15px}
  .article-table tbody,.article-table tr,.article-table th,.article-table td{display:block;width:100%}
  .article-table th{padding:8px 16px;border:0;border-top:1px solid var(--c-border);font-size:12px;font-weight:700;line-height:1.6;letter-spacing:.12px}
  .article-table td{padding:10px 16px 14px;border:0;border-bottom:1px solid var(--c-border)}
  .article-table tr:last-child td{border-bottom:1px solid var(--c-border)}
  /* 番号付きポイント: 見出し行は折返し可 */
  .article-points__head{align-items:flex-start;white-space:normal}
  .article-points__num{line-height:24px}
  .article-points__label{letter-spacing:.15px}
  .article-points__text{line-height:1.8;letter-spacing:.15px}
  /* 補足ボックス: 余白を詰め、リンクは折返し可 */
  .article-note{gap:16px;padding:20px 20px 24px}
  .article-note__text{line-height:1.8;letter-spacing:.15px}
  .article-note__link{padding:4px 0;white-space:normal;text-align:left}
  /* 戻るボタン: 幅100%（フォーム系ボタンと同じ扱い） */
  .btn--back{width:100%}
  /* 関連記事: 見出し→記事行の縦積み。行は TOP-SP News（14591:56112）と同値 */
  .related{padding-top:var(--sp-section-gap);padding-bottom:var(--sp-section-gap)}
  .related__inner{flex-direction:column;gap:24px}
  .related__title{width:100%;gap:4px}
  .related__ja{letter-spacing:1.12px;white-space:normal}
  .related__list{width:100%}
  .related .news-item{gap:16px;width:100%;padding:14px 4px 16px}
  .related .news-item__body{flex-direction:column;align-items:flex-start;gap:8px}
  .related .news-item__meta{gap:8px}
  .related .news-item__tag{width:auto;padding:0 8px 2px;font-size:12px;letter-spacing:.12px}
  .related .news-item__title{flex:none;width:100%;letter-spacing:.15px}
  .related .news-item__arrow{width:28px;height:28px;padding:8px}
  .related .news-item__arrow img{width:12px;height:12px}
}
