/* ohdou.css — 王道版 /aga/ の追加レイヤー（原本CSSは無編集・!important は使わない）
   本番サイトから持ってきた小さめの画像（製品写真・アイコン）を本文に組み込むための型。
   2026-10-05 */

/* ── 選ばれる理由: アイコン付き3列カード ───────────────────────── */
.ohdou-why{
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:24px 0 22px;
}
.ohdou-why > div{
  background:#fff; border:1px solid #e3ebe8; border-radius:14px; padding:22px 20px 20px;
  display:flex; flex-direction:column; align-items:flex-start;
}
.ohdou-why img{ width:62px; height:auto; margin:0 0 12px; }
.ohdou-why span{
  display:block; font-weight:700; color:var(--deep,#146e71); font-size:16px; line-height:1.55; margin:0 0 8px;
}
.ohdou-why p{ margin:0; font-size:15px; line-height:1.85; color:#34494a; }

/* ── 製品写真の横並び（2〜4点） ─────────────────────────────── */
.ohdou-photos{
  display:grid; gap:14px; margin:20px 0 22px;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
}
.ohdou-photos figure{
  margin:0; background:#f7faf9; border:1px solid #e3ebe8; border-radius:12px;
  padding:16px 14px 12px; text-align:center;
}
.ohdou-photos img{ width:100%; max-width:180px; height:auto; display:block; margin:0 auto; }
.ohdou-photos figcaption{
  margin-top:10px; font-size:13px; line-height:1.6; color:#4f6a6c;
}
.ohdou-photos--tight img{ max-width:150px; }

/* ── 2点ならべ（説明写真） ──────────────────────────────────── */
.ohdou-pair{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:20px 0 22px; }
.ohdou-pair figure{ margin:0; }
.ohdou-pair img{ width:100%; height:auto; border-radius:12px; display:block; }
.ohdou-pair figcaption{ margin-top:8px; font-size:13px; line-height:1.6; color:#4f6a6c; }

/* 画像のまとまりは下にも余白を付ける（2026-10-05実測で 0〜13px しか空いておらず
   次の見出しや本文とくっついていた。上だけ margin を入れていたのが原因） */

/* ── 横長の1枚（成分図・バナー） ───────────────────────────── */
/* aga.css の「.aga-page figure{margin:0}」（詳細度0,1,1）に負けて上下の余白が
   消えていた（2026-10-05実測: margin-top 0px）。body を足して詳細度で上回る。
   !important は使わない。下の余白も付ける（次の見出し・囲みと重なっていた） */
body.aga-page .ohdou-wide{ margin:26px 0 24px; }
body.aga-page .ohdou-wide img{ width:100%; height:auto; display:block; border-radius:12px; }
body.aga-page .ohdou-wide figcaption{ margin-top:8px; font-size:13px; line-height:1.6; color:#4f6a6c; }

/* ── 診察の流れ: アイコン付きステップ ──────────────────────── */
.ohdou-steps{ margin:22px 0 22px; }
.ohdou-steps > div{
  display:grid; grid-template-columns:76px 1fr; gap:16px; align-items:start;
  background:#fff; border:1px solid #e3ebe8; border-radius:14px;
  padding:18px 20px; margin:0 0 10px;
}
.ohdou-steps .ohdou-step-icon{
  width:76px; height:60px; display:flex; align-items:center; justify-content:center;
  background:var(--pale,#f0f7f4); border-radius:10px;
}
.ohdou-steps .ohdou-step-icon img{ width:44px; height:auto; }
.ohdou-steps dt, .ohdou-steps b{
  display:block; font-weight:700; color:var(--deep,#146e71); font-size:16px; margin:0 0 6px;
}
.ohdou-steps p{ margin:0; font-size:15px; line-height:1.85; color:#34494a; }

/* ── オンライン診療の3つのメリット ─────────────────────────── */
.ohdou-merits{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:20px 0 22px; }
.ohdou-merits > div{
  background:var(--pale,#f0f7f4); border-radius:14px; padding:20px 16px; text-align:center;
}
.ohdou-merits img{ width:66px; height:auto; margin:0 auto 10px; display:block; }
.ohdou-merits span{ display:block; font-weight:700; color:var(--deep,#146e71); font-size:15px; line-height:1.6; }

/* ── 薬の一覧に小さなサムネを添える ───────────────────────── */
.ohdou-drug-list{ margin:20px 0 22px; }
.ohdou-drug-list > div{
  display:grid; grid-template-columns:104px 1fr; gap:18px; align-items:center;
  background:#fff; border:1px solid #e3ebe8; border-radius:14px; padding:16px 20px; margin:0 0 10px;
}
.ohdou-drug-list .ohdou-drug-thumb{
  width:104px; height:72px; display:flex; align-items:center; justify-content:center;
  background:#f7faf9; border-radius:8px;
}
.ohdou-drug-list .ohdou-drug-thumb img{ max-width:92px; max-height:62px; width:auto; height:auto; }
.ohdou-drug-list b{ display:block; font-weight:700; color:var(--deep,#146e71); font-size:16px; margin:0 0 5px; }
.ohdou-drug-list p{ margin:0; font-size:15px; line-height:1.8; color:#34494a; }

/* ── 院の外観（2点） ──────────────────────────────────────── */
.ohdou-clinic-photos{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:20px 0 22px; }
.ohdou-clinic-photos figure{ margin:0; }
.ohdou-clinic-photos img{ width:100%; height:auto; border-radius:12px; display:block; }
.ohdou-clinic-photos figcaption{ margin-top:8px; font-size:14px; font-weight:600; color:var(--deep,#146e71); }

/* ── スマホ ──────────────────────────────────────────────── */
@media (max-width: 767px){
  .ohdou-why{ grid-template-columns:1fr; gap:12px; }
  .ohdou-why img{ width:54px; }
  .ohdou-merits{ grid-template-columns:1fr; }
  .ohdou-merits > div{ display:grid; grid-template-columns:58px 1fr; gap:14px; text-align:left; align-items:center; }
  .ohdou-merits img{ width:58px; margin:0; }
  .ohdou-pair{ grid-template-columns:1fr; }
  .ohdou-clinic-photos{ grid-template-columns:1fr; }
  .ohdou-steps > div{ grid-template-columns:60px 1fr; gap:12px; padding:16px; }
  .ohdou-steps .ohdou-step-icon{ width:60px; height:52px; }
  .ohdou-steps .ohdou-step-icon img{ width:36px; }
  .ohdou-drug-list > div{ grid-template-columns:84px 1fr; gap:14px; padding:14px 16px; }
  .ohdou-drug-list .ohdou-drug-thumb{ width:84px; height:62px; }
  .ohdou-drug-list .ohdou-drug-thumb img{ max-width:74px; max-height:54px; }
  .ohdou-photos{ grid-template-columns:1fr 1fr; }
}

/* ── 図解（D-*）は大きくなりすぎないよう幅を抑えて中央に ──────── */
body.aga-page .ph-img[data-img^="D-"]{ max-width:620px; margin-inline:auto; }
.ohdou-wide img{ max-width:620px; margin-inline:auto; }
@media (max-width: 767px){
  body.aga-page .ph-img[data-img^="D-"]{ max-width:none; }
  .ohdou-wide img{ max-width:none; }
}

/* 実写真に添える短いキャプション */
body.aga-page .ohdou-cap{ margin-top:8px; font-size:13px; line-height:1.6; color:#4f6a6c; text-align:center; }

body.aga-page .ohdou-cap small{ display:block; margin-top:3px; font-size:12px; color:#6b8486; }

/* ── 元サイトのキービジュアル（最上部・全幅） ───────────────── */
body.aga-page .ohdou-hero{ max-width:880px; margin:18px auto 6px; padding:0 20px; box-sizing:border-box; }
body.aga-page .ohdou-hero img{ display:block; width:100%; height:auto; border-radius:10px; }
@media (max-width: 767px){
  body.aga-page .ohdou-hero{ margin:12px auto 4px; padding:0 16px; }
}

/* スマホは縦長の専用画像に切り替わる（<picture>）。高さが出すぎないよう上限をつける */
body.aga-page .ohdou-hero picture{ display:block; }
@media (max-width: 767px){
  /* スマホではキービジュアルを出さない（2026-10-05 田中さん指示）。
     画像も読み込ませないよう img は loading="lazy" にしてある。 */
  body.aga-page .ohdou-hero{ display:none; }
}
/* タップしやすさ: 本文中の小さなリンクに最低限の高さを持たせる */
body.aga-page .aga-article a.aga-inline-link,
body.aga-page .aga-link-row a,
body.aga-page .aga-figure-heading a{ display:inline-flex; align-items:center; min-height:44px; }

/* ══ スマホ最適化（2026-10-05） ══════════════════════════════ */

/* ① 料金の3表はスマホだと長いので、開いて見る形にする。
      パソコンでは summary を隠して常に開いた見た目にする（JSは使わない）。 */
body.aga-page details.ohdou-pricebox{ margin:18px 0 0; border:1px solid #e3ebe8; border-radius:12px; background:#fff; }
body.aga-page details.ohdou-pricebox > summary{
  list-style:none; cursor:pointer; padding:16px 18px; font-weight:700; color:var(--deep,#146e71);
  font-size:16px; display:flex; align-items:center; justify-content:space-between; min-height:44px; box-sizing:border-box;
}
body.aga-page details.ohdou-pricebox > summary::-webkit-details-marker{ display:none; }
body.aga-page details.ohdou-pricebox > summary::after{ content:"開く ＋"; font-size:13px; font-weight:600; color:#4f6a6c; }
body.aga-page details.ohdou-pricebox[open] > summary::after{ content:"閉じる －"; }
body.aga-page details.ohdou-pricebox > table{ margin:0 0 14px; border-radius:0 0 12px 12px; }
@media (max-width: 767px){
  /* 閉じているときは中身を隠す（他のCSS層が table に display を当てているため明示する） */
  body.aga-page details.ohdou-pricebox:not([open]) > table{ display:none; }
}
@media (min-width: 768px){
  body.aga-page details.ohdou-pricebox{ border:0; background:none; }
  body.aga-page details.ohdou-pricebox > summary{ padding:0; margin:26px 0 10px; font-size:19px; }
  body.aga-page details.ohdou-pricebox > summary::after{ content:""; }
  body.aga-page details.ohdou-pricebox > table{ display:table; width:100%; margin:0; }
}

/* ② 比較表はスマホだと横スクロールが要るので、縦積みのカードに組み替える */
@media (max-width: 767px){
  body.aga-page .compare-3col{ overflow-x:visible; }
  body.aga-page .compare-3col table{ min-width:0; display:block; border:0; }
  body.aga-page .compare-3col thead{ display:none; }
  body.aga-page .compare-3col tbody,
  body.aga-page .compare-3col tbody tr,
  body.aga-page .compare-3col tbody th,
  body.aga-page .compare-3col tbody td{ display:block; width:auto; }
  body.aga-page .compare-3col tbody tr{
    border:1px solid #e3ebe8; border-radius:12px; margin:0 0 12px; background:#fff; overflow:hidden;
  }
  body.aga-page .compare-3col tbody th{
    background:#f0f7f4; padding:12px 14px; font-size:15px; color:var(--deep,#146e71); text-align:left; border:0;
  }
  body.aga-page .compare-3col tbody td{ padding:11px 14px; border:0; border-top:1px solid #eef2f0; font-size:15px; }
  body.aga-page .compare-3col tbody td::before{
    display:block; font-size:12px; font-weight:700; color:#4f6a6c; margin:0 0 3px;
  }
  body.aga-page .compare-3col tbody td:nth-of-type(1)::before{ content:"市販の育毛剤"; }
  body.aga-page .compare-3col tbody td:nth-of-type(2)::before{ content:"薄毛専門でない一般の皮膚科"; }
  body.aga-page .compare-3col tbody td:nth-of-type(3)::before{ content:"B&H（薄毛専門）"; }
  body.aga-page .compare-3col tbody td.us{ background:#f7fbfa; }
}

/* ③ 指で押しにくいリンクに高さを確保する（44px） */
@media (max-width: 767px){
  body.aga-page .aga-breadcrumb a,
  body.aga-page .aga-advice > a,
  body.aga-page .aga-diagnosis-layout a.aga-inline-link,
  body.aga-page .consultation-bottom a,
  body.aga-page .access-facts dd a{
    display:inline-flex; align-items:center; min-height:44px;
  }
  body.aga-page .aga-advice > a{ justify-content:center; min-width:44px; }
}

/* ④ 症状の3カード（M字・O字・U字）。スマホだと 72px + 207px の2列になって
      本文が極端に細くなるので、1列に積み直す（2026-10-05 実測で発見） */
@media (max-width: 767px){
  body.aga-page .aga-pattern{ display:block; padding:16px 16px 18px; }
  body.aga-page .aga-pattern-top{
    flex-direction:row; align-items:baseline; gap:10px; width:auto; margin:0 0 10px; padding:0; border:0;
  }
  body.aga-page .aga-pattern-top span{ font-size:30px; line-height:1; }
  body.aga-page .aga-pattern-top small{ font-size:12px; }
  body.aga-page .aga-pattern > figure{ width:auto; margin:0 0 12px; }
  body.aga-page .aga-pattern h3{ width:auto; margin:0 0 8px; }
  body.aga-page .aga-pattern p{ width:auto; }
}

/* ⑤ 薬の一覧。スマホではサムネを上に出して、説明を画面幅いっぱいに
      （2列のままだと本文が165pxしかなく窮屈） */
@media (max-width: 767px){
  body.aga-page .ohdou-drug-list > div{ display:block; padding:14px 16px 16px; }
  body.aga-page .ohdou-drug-list .ohdou-drug-thumb{
    width:100%; height:auto; padding:12px 0; margin:0 0 10px; border-radius:8px;
  }
  body.aga-page .ohdou-drug-list .ohdou-drug-thumb img{ max-width:130px; max-height:84px; }
}

/* ⑥ ノーウッド分類の下の3段階。スマホでは3列だと1列92pxしかないので縦に積む */
@media (max-width: 767px){
  body.aga-page .aga-stages{ display:block; }
  body.aga-page .aga-stages > div{
    display:grid; grid-template-columns:72px 1fr; gap:12px; align-items:start;
    padding:12px 14px; margin:0 0 8px; background:#f7faf9; border-radius:10px;
  }
  body.aga-page .aga-stages > div > span{ font-size:16px; font-weight:700; color:var(--deep,#146e71); }
  body.aga-page .aga-stages > div > p{ margin:0; font-size:15px; line-height:1.8; }
}

/* ⑦ 監修の院長写真。スマホでは左に寄っていたので横方向の中央へ */
@media (max-width: 767px){
  body.aga-page .aga-doctor{ justify-items:stretch; }
  body.aga-page .aga-doctor .polish-doctor-image{ width:100%; text-align:center; }
  body.aga-page .aga-doctor .polish-doctor-image img{ display:inline-block; margin-inline:auto; }
}

/* ⑧ スマホのH1。「渋谷区恵比寿・横浜の」10字が34px＋字間3.06pxで370pxになり、
      335pxの枠からはみ出して「の」だけが2行目に落ちていた（2026-10-05実測）。
      1行に収まる大きさへ。aga.html / faga.html の両方に効く */
@media (max-width: 767px){
  body.aga-page .aga-masthead h1{ font-size:29px; letter-spacing:.04em; line-height:1.55; }
}

/* ── フッター ─────────────────────────────────────────────────
   白地・リンクのみ（2026-10-05 田中さん選択。住所・電話・診療時間は入れない）。
   文字の決まりはもともとのフッター（.footer-cols）由来で変えない：
   見出し13px・字間.12em・深緑／リンク14px・本文色／**見出しの下に線は引かない**
   （当社6サイト実測でも見出し下の罫線は0/6）。区切り線はブロックの下に1本だけ。
   左にブランド（ロゴ＋一行）を置き、3列等分で右半分が空くのを防ぐ。 */
.footer-map{
  display:grid; grid-template-columns:280px 1fr; gap:0 48px;
  padding:4px 0 30px; border-bottom:1px solid var(--line,#d9e7e3);
  align-items:start;
}
.footer-map .fm-brand{ min-width:0; }
.footer-map .fm-logo{ display:block; width:186px; }
.footer-map .fm-logo img{ width:100%; height:auto; display:block; }
.footer-map .fm-note{
  margin:14px 0 0; font-size:12px; line-height:1.95; color:#6d8a86; letter-spacing:.02em;
}
.footer-map .fm-cols{
  display:grid; grid-template-columns:repeat(3,1fr); gap:0 48px; min-width:0;
}
.footer-map .fm-col{ min-width:0; }
.footer-map .fm-en{
  display:block; font-size:10px; font-weight:600; letter-spacing:.18em;
  color:#9cbab6; margin:0 0 5px;
}
.footer-map .fm-head{
  font-size:13px; font-weight:600; letter-spacing:.12em; color:var(--deep,#146e71);
  margin:0 0 12px;
}
.footer-map ul{ list-style:none; margin:0; padding:0; }
.footer-map li{ margin:0; }
.footer-map a:not(.fm-logo){
  display:block; font-size:14px; padding:3px 0; line-height:1.9; color:var(--ink,#234d50);
}
.footer-map a:hover{ text-decoration:underline; }

/* 著作権の行に並べる、規約・お知らせ */
.footer-sub{ display:flex; flex-wrap:wrap; gap:4px 18px; margin-inline:auto; }
.footer-sub a{ font-size:11px; letter-spacing:.04em; color:#7d9995; }
.footer-sub a:hover{ text-decoration:underline; }

@media(max-width:980px){
  .footer-map{ grid-template-columns:1fr; gap:24px 0; }
  .footer-map .fm-brand{ display:flex; align-items:center; gap:18px; }
  .footer-map .fm-note{ margin:0; }
  .footer-map .fm-cols{ gap:0 26px; }
}
@media(max-width:560px){
  .footer-map .fm-brand{ display:block; }
  .footer-map .fm-note{ margin:12px 0 0; }
  /* 1列に積むとフッターが935pxになり、スマホで延々とスクロールする（2026-10-05実測）。
     項目名は最長でも138pxなので、375pxでも2列（157px）に収まる。 */
  .footer-map .fm-cols{ grid-template-columns:1fr 1fr; gap:24px 20px; }
  .footer-map{ padding-bottom:22px; }
  .footer-sub{ margin:10px 0 0; gap:3px 14px; }
}

/* ── 制作中のご案内（coming-soon.html） ── */
.cs-body{ padding:8px 0 56px; }
.cs-body h2{ font-size:19px; letter-spacing:.04em; color:var(--deep,#146e71); margin:38px 0 16px; }
.cs-plan{ display:grid; grid-template-columns:1fr 1fr; gap:22px 32px; }
.cs-group{ background:#f4faf8; border:1px solid var(--line,#d9e7e3); border-radius:10px; padding:18px 20px; }
.cs-group-head{ font-size:13px; font-weight:600; letter-spacing:.12em; color:var(--deep,#146e71); margin:0 0 12px; }
.cs-group dl{ margin:0; }
.cs-group dt{ font-size:14px; font-weight:600; color:var(--ink,#234d50); margin:12px 0 3px; }
.cs-group dt:first-child{ margin-top:0; }
.cs-group dd{ margin:0; font-size:13px; line-height:1.9; color:#5d7a76; }
.cs-live{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:10px 12px; }
.cs-live a{ display:block; border:1px solid var(--line,#d9e7e3); border-radius:999px;
  padding:9px 20px; font-size:14px; color:var(--deep,#146e71); background:#fff; }
.cs-live a:hover{ background:#f4faf8; }
@media(max-width:700px){ .cs-plan{ grid-template-columns:1fr; } }

/* ── ヘッダーのメニュー（パネル） ──────────────────────────
   項目を2列に並べると、左の紹介（題字＋説明＋写真 約300px）より右が低くなり、
   パネルの右下に150pxほど白が残って作りかけに見えた（2026-10-05実測）。
   1列にすると4項目で約356px・3項目で約267pxになり、左の高さとほぼ揃う。 */
.nav-panel .nav-panel-links{ grid-template-columns:1fr; gap:0; }
@media(max-width:900px){ /* スマホの開くメニューは2列のまま（縦に長くしない） */
  .nav-panel .nav-panel-links{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 20px; }
}
@media(max-width:560px){ .nav-panel .nav-panel-links{ grid-template-columns:1fr; } }

/* 診療の4本は畳まず、そのままのリンクで上の並びに出す（2026-10-05 田中さん）。
   .nav-trigger と同じ見た目にそろえる（下線は出さない）。 */
.nav.nav-enhanced .nav-direct{ text-decoration:none; color:inherit; }
.nav.nav-enhanced .nav-direct:hover{ color:var(--teal); }

/* ── /treatment/original/（Hシリーズ）の部品 ───────────────── */
/* 4つの処方。写真と説明を左右に置く */
.ohdou-lineup{ display:grid; grid-template-columns:220px 1fr; gap:26px; align-items:center;
  padding:22px 0; border-bottom:1px solid var(--line,#d9e7e3); }
.ohdou-lineup:last-of-type{ border-bottom:0; }
.ohdou-lineup>figure{ margin:0; background:#f4faf8; border-radius:10px; padding:16px; text-align:center; }
.ohdou-lineup>figure img{ max-width:100%; height:auto; mix-blend-mode:multiply; }
.ohdou-lineup h3{ margin:0 0 8px; font-size:18px; letter-spacing:.03em; color:var(--deep,#146e71); }
.ohdou-lineup p{ margin:0; }
@media(max-width:700px){
  .ohdou-lineup{ grid-template-columns:1fr; gap:14px; }
  .ohdou-lineup>figure{ max-width:220px; }
}
/* 配合成分の羅列 */
.ohdou-parts{ background:#f4faf8; border:1px solid var(--line,#d9e7e3); border-radius:8px;
  padding:14px 18px; font-size:13px; line-height:2.1; color:#3f6360; }
/* 箇条書き（お使いいただけない方） */
.ohdou-list{ margin:0 0 16px; padding-left:1.2em; }
.ohdou-list li{ margin:6px 0; line-height:1.95; }
/* 注意書きの箱 */
.ohdou-note{ background:#fff8f3; border:1px solid #f0d9c6; border-radius:8px;
  padding:14px 18px; font-size:13px; line-height:2; }
/* 成分リストの見出しに添える小さい説明 */
.aga-medicine-list dt small{ display:block; margin-top:4px; font-size:12px; font-weight:400; color:#6d8a86; }

/* 写真を持たない並び（/treatment/ の「当院で受けられる治療方法」）。
   .ohdou-lineup は「220px の図版＋本文」の2列なので、図版が無いと本文が220pxに
   押し込まれて縦長になる（2026-10-05実測）。1カラムに戻す。 */
.ohdou-lineup--text{ grid-template-columns:1fr; gap:8px; }
.ohdou-lineup--text h3{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
.ohdou-lineup--text h3 small{ font-size:12px; font-weight:400; color:#6d8a86; letter-spacing:.06em; }
.ohdou-lineup--text h3 a{ color:inherit; }
.ohdou-lineup--text h3 a:hover{ text-decoration:underline; }

/* ── 子ページへの入口カード ───────────────────────────────
   家の .methods-grid は4列。3枚のときに1枠ぶん空かないよう3列にする。
   2026-10-05 田中さん「もっとカードとか出入口作れないの？目立たないよね？入口」 */
.methods-grid--3{ grid-template-columns:repeat(3,1fr); }
@media(max-width:900px){ .methods-grid--3{ grid-template-columns:1fr 1fr; } }
@media(max-width:600px){ .methods-grid--3{ grid-template-columns:1fr; } }
/* 本文の章の中に置くので、上に見出しぶんの間をあける */
.aga-section > .methods-grid{ margin-top:22px; }
.aga-section > .methods-grid .method-card h3{ margin:10px 16px 6px; }
.aga-section > .methods-grid .method-card p{ margin:0 16px; line-height:1.9; }
.aga-section > .methods-grid .method-card .method-no{ margin-left:16px; }
.aga-section > .methods-grid .method-card .guide-link{ margin:12px 16px 18px; }
/* 薬ごとのカード。家の .column-grid は3列 */
.aga-section > .column-grid{ margin-top:18px; }

/* .method-card は grid-template-rows:auto 1fr。2行目＝番号の行が 1fr なので、
   説明が短いカードほど番号の下が間延びし、見出しの位置が揃わなくなる
   （2026-10-05実測: 3枚目だけ番号の行が69px・ほかは40px、見出しが28px下がる）。
   縦並びにして、余りは説明の行に吸わせる。 */
.methods-grid .method-card{ display:flex; flex-direction:column; }
.methods-grid .method-card p{ flex:1 1 auto; }

/* カード2枚のとき（家の .methods-grid は4列） */
.methods-grid--2{ grid-template-columns:repeat(2,1fr); }
@media(max-width:600px){ .methods-grid--2{ grid-template-columns:1fr; } }

/* ── 薬ごとのカードに絵を入れる（2026-10-06 田中さん）──────────
   家の .column-card は文字だけ（padding 16px 18px）。絵を入れるので内側の余白を外し、
   絵は横3:2で上に敷く。文字まわりの余白はカードの中で付け直す。 */
/* codex-polish.css の :is(.method-card,.why-item,.flow-steps li,.column-card){padding:26px 24px}
   は :is() の中の「.flow-steps li」が効いて詳細度 0,1,1。素の .column-card--art（0,1,0）では
   負けて絵の左右に余白が残る（2026-10-06実測: カード362pxに対し絵312px）。親を足して上回る。 */
.column-grid .column-card--art{ padding:0; overflow:hidden; gap:0; }
.column-grid .column-card--art .cc-art{ display:block; aspect-ratio:3/2; overflow:hidden; background:#f4faf8; }
.column-grid .column-card--art .cc-art img{ width:100%; height:100%; object-fit:cover; display:block; }
.column-grid .column-card--art .column-cat{ margin:14px 16px 0; }
.column-grid .column-card--art h3{ margin:4px 16px 16px; }

/* 箱の写真は小さく（316x108 など）白背景なので、切り抜かずに枠の中へ収める。
   錠剤の絵（3:2の写真）は切り抜いて敷く。2026-10-06 田中さん「まぜる」 */
.column-grid .column-card--art .cc-art--box{ background:#fff; display:grid; place-items:center; padding:16px 20px; }
.column-grid .column-card--art .cc-art--box img{ width:auto; height:auto; max-width:100%; max-height:100%; object-fit:contain; }

/* 絵があるカードと無いカードが並ぶ（実物の写真があるものだけ絵を入れる・2026-10-06）。
   既定だと絵のないカードが絵のある行の高さまで引き伸ばされ、下が空の箱になる。
   文字だけのカードは中身の高さにとどめる。 */
.column-grid .column-card:not(.column-card--art){ align-self:start; }

/* 院ページのH1。「B&Hメディカルクリニック」は12字あり、masthead の字の大きさでは
   1行に入らず「クリニッ／ク」と割れる（2026-10-06実測）。ブランドは小さく上に置く。 */
.clinic-page .aga-masthead h1 .cl-brand{
  display:block; font-size:.42em; letter-spacing:.08em; line-height:1.6;
  color:var(--deep,#146e71); margin-bottom:6px; font-weight:500;
}

/* 集客ページのH1（2026-10-07）。title を「恵比寿・横浜の◯◯治療はB&Hメディカルクリニック」に揃えたが、
   院名12字は masthead の字の大きさで1行に入らず「メディ／カルクリニック」と割れる（スマホ・中幅で実測）。
   院ページの .cl-brand と同じ考えで、院名は小さく下の行に置く。faga は2行目「女性の薄毛（FAGA）治療は」14字が
   29px だと 375px 幅に入らないので、スマホだけ 23px に。 */
body.aga-page .aga-masthead h1 .h1-brand{
  display:block; font-size:.5em; letter-spacing:.08em; line-height:1.6;
  color:var(--deep,#146e71); margin-top:8px; font-weight:500;
}
@media (max-width: 767px){
  body.faga-page .aga-masthead h1,
  body.infusion-page .aga-masthead h1{ font-size:23px; letter-spacing:.02em; }  /* infusion は「エクソソーム点滴・注射は」12字（10/7 田中さん裁定で注射を残す） */
}

/* ── クリニック案内（院一覧）の2院ブロック ────────────────── */
.clinic-list{ display:grid; gap:26px; margin-top:22px; }
.clinic-item{ display:grid; grid-template-columns:320px 1fr; gap:26px; align-items:start;
  border:1px solid var(--line,#d9e7e3); border-radius:10px; overflow:hidden; background:#fff; }
.clinic-item-art{ display:block; aspect-ratio:16/11; overflow:hidden; background:#f4faf8; }
.clinic-item-art img{ width:100%; height:100%; object-fit:cover; display:block; }
.clinic-item > div{ padding:22px 24px 24px 0; }
.clinic-item h3{ margin:6px 0 10px; font-size:21px; }
.clinic-item h3 a{ color:var(--deep,#146e71); }
.clinic-item h3 a:hover{ text-decoration:underline; }
.clinic-item-addr{ margin:0 0 14px; font-size:14px; line-height:1.9; }
.clinic-item-meta{ margin:0 0 14px; }
.clinic-item-meta > div{ display:grid; grid-template-columns:86px 1fr; gap:10px;
  padding:7px 0; border-top:1px solid var(--line,#d9e7e3); }
.clinic-item-meta dt{ font-size:12px; color:#6d8a86; }
.clinic-item-meta dd{ margin:0; font-size:14px; line-height:1.8; }
@media(max-width:760px){
  .clinic-item{ grid-template-columns:1fr; gap:0; }
  .clinic-item > div{ padding:20px; }
}

/* ── お知らせ・規約の5本（本文1カラム） ─────────────────── */
.aga-layout--solo{ display:block; }
.aga-layout--solo .aga-article{ max-width:820px; margin-inline:auto; }
.aga-masthead--slim{ padding-block:34px 28px; }
/* 2カラムの masthead は min-height:370px（写真の枠ぶん）。写真を置かない
   お知らせ・規約のページでは、題字の下に150px近い空きが残る（2026-10-06実測）。 */
.aga-masthead--slim .aga-masthead-inner{ display:block; min-height:0; }
.aga-masthead--slim .aga-masthead-copy{ padding-block:0; }
.aga-masthead--slim h1{ font-size:34px; line-height:1.6; }
.light-page .aga-section{ padding-block:28px; }
.press-date{ margin:0 0 6px; font-size:12px; letter-spacing:.08em; color:#6d8a86; }
.press-item{ border:1px solid var(--line,#d9e7e3); border-radius:10px; padding:26px 28px; background:#fff; }
.press-item .aga-subheading:first-of-type{ margin-top:4px; }
.video-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:14px 0 26px; }
/* 動画は埋め込みではなくサムネイル＋題名（埋め込みはドメイン制限でエラー153・2026-10-06） */
.video-item{ display:block; border:1px solid var(--line,#d9e7e3); border-radius:8px; overflow:hidden;
  background:#fff; color:inherit; text-decoration:none; }
.video-item:hover{ border-color:var(--teal,#1f8a80); }
.video-thumb{ display:block; position:relative; aspect-ratio:16/9; overflow:hidden; background:#eef7f4; }
.video-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.video-play{ position:absolute; inset:0; margin:auto; width:52px; height:36px; border-radius:8px;
  background:rgba(32,32,32,.72); }
.video-play::after{ content:""; position:absolute; inset:0; margin:auto; width:0; height:0;
  border-style:solid; border-width:8px 0 8px 13px; border-color:transparent transparent transparent #fff; }
.video-item:hover .video-play{ background:#cc0000; }
.video-body{ display:block; padding:12px 14px 14px; }
.video-body b{ display:block; font-size:14px; line-height:1.6; color:var(--ink,#234d50); }
.video-body small{ display:block; margin-top:6px; font-size:12px; line-height:1.85; color:#6d8a86; }
.video-body .guide-link{ display:inline-block; margin-top:8px; font-size:12px; }
@media(max-width:860px){ .video-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:560px){ .video-grid{ grid-template-columns:1fr; } .aga-masthead--slim h1{ font-size:27px; } }

/* ── コラムから移したページの部品（2026-10-06） ─────────────── */
/* 章の終わりのまとめ行（元コラムの「⇒」） */
.col-takeaway{ margin:18px 0 0; padding:13px 18px; background:#f4faf8;
  border-left:3px solid var(--teal,#1f8a80); border-radius:0 6px 6px 0;
  font-size:14px; line-height:1.95; font-weight:500; color:var(--ink,#234d50); }
/* 参考の一行 */
.col-ref{ margin:10px 0 0; font-size:12px; color:#6d8a86; }
.col-ref a{ color:var(--deep,#146e71); text-decoration:underline; }
/* 表 */
.col-table-wrap{ overflow-x:auto; margin:18px 0; }
.col-table{ width:100%; border-collapse:collapse; font-size:14px; background:#fff; }
.col-table th, .col-table td{ border:1px solid var(--line,#d9e7e3); padding:11px 14px;
  text-align:left; line-height:1.85; vertical-align:top; }
.col-table thead th{ background:#f4faf8; color:var(--deep,#146e71); font-weight:600; white-space:nowrap; }
.col-table tbody th{ background:#fbfdfc; font-weight:600; white-space:nowrap; }
.col-badge{ display:inline-block; padding:3px 10px; border-radius:999px; font-size:12px; white-space:nowrap; }
.col-badge.is-ok{ background:#e3f3ec; color:#1d6b55; }
.col-badge.is-watch{ background:#fdf0e6; color:#9a5a22; }
@media(max-width:560px){ .col-table{ font-size:13px; } .col-table th,.col-table td{ padding:9px 10px; } }

/* ── 予約ページ（/counseling/ ほか3本）2026-10-06 ───────────────── */
.rsv-ways{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:24px; }
.rsv-way{ display:block; padding:22px 20px; border:1px solid #d9e7df; border-radius:3px 20px 3px 3px;
  background:#fbfdfb; text-decoration:none; transition:border-color .2s,background .2s; }
.rsv-way:hover{ border-color:#2f7a63; background:#f4faf6; }
.rsv-way-name{ display:block; font-size:19px; color:#1b4a4c; letter-spacing:.02em; }
.rsv-way-time{ display:block; margin-top:6px; font-size:11px; letter-spacing:.12em; color:#5c8a79; }
.rsv-way-note{ display:block; margin-top:12px; font-size:12px; line-height:1.9; color:#4a5b55; }

.rsv-form{ margin-top:24px; }
.rsv-fields{ list-style:none; margin:0; padding:0; border-top:1px solid #e2ebe4; }
.rsv-fields > li{ padding:20px 0; border-bottom:1px solid #e2ebe4; }
.rsv-label{ display:block; margin-bottom:10px; font-size:13px; color:#1b4a4c; letter-spacing:.04em; }
.rsv-label > b{ margin-left:10px; padding:2px 8px; border-radius:2px; background:#2f7a63;
  color:#fff; font-size:10px; font-weight:400; letter-spacing:.08em; }
.rsv-any{ margin-left:10px; padding:2px 8px; border-radius:2px; background:#eef2ef;
  color:#6b7d75; font-size:10px; letter-spacing:.08em; }
.rsv-form input[type=text],.rsv-form input[type=email],.rsv-form input[type=tel],
.rsv-form textarea,.rsv-form select{ width:100%; padding:11px 13px; border:1px solid #cfdfd6;
  border-radius:2px; background:#fff; font:inherit; font-size:15px; color:#243; }
.rsv-form input:focus,.rsv-form textarea:focus,.rsv-form select:focus{ outline:2px solid #8fc0ae; outline-offset:1px; }
.rsv-form .rsv-short{ max-width:120px; }
.rsv-hint{ display:block; margin-top:8px; font-size:11px; line-height:1.8; color:#6b7d75; }
.rsv-choices{ display:flex; flex-wrap:wrap; gap:10px; }
.rsv-radio{ display:inline-flex; }
.rsv-radio input{ position:absolute; opacity:0; width:0; height:0; }
.rsv-radio label{ display:inline-block; padding:9px 18px; border:1px solid #cfdfd6; border-radius:2px;
  background:#fff; font-size:14px; color:#3b4f48; cursor:pointer; }
.rsv-radio input:checked + label{ border-color:#2f7a63; background:#eef7f2; color:#1b4a4c; }
.rsv-radio input:focus-visible + label{ outline:2px solid #8fc0ae; outline-offset:1px; }
.rsv-dates{ display:grid; gap:12px; }
.rsv-date{ display:grid; grid-template-columns:72px 1fr 150px; gap:10px; align-items:center; }
.rsv-date > em{ font-style:normal; font-size:12px; color:#5c8a79; }
.rsv-agree{ margin-top:22px; font-size:14px; }
.rsv-agree input{ margin-right:8px; }
.rsv-recaptcha{ margin-top:10px; font-size:11px; line-height:1.9; color:#6b7d75; }
.rsv-submit{ display:block; width:100%; max-width:380px; margin:22px auto 0; padding:17px;
  border:0; border-radius:2px; background:#2f7a63; color:#fff; font:inherit; font-size:16px;
  letter-spacing:.06em; cursor:pointer; }
.rsv-submit:hover{ background:#27694f; }
.rsv-demo{ margin-top:12px; text-align:center; font-size:11px; color:#8a9a93; }

@media(max-width:700px){
  .rsv-ways{ grid-template-columns:1fr; gap:12px; }
  .rsv-date{ grid-template-columns:1fr; gap:6px; }
  .rsv-date > em{ font-size:11px; }
  .rsv-submit{ max-width:none; }
}

/* 予約フォームの送信実装: エラー・確認・完了（王道-g75 2026-10-27） */
.rsv-errors{ list-style:none; margin:0 0 20px; padding:14px 18px; border:1px solid #dcAFA9;
  border-left:3px solid #b05b50; background:#fdf6f5; }
.rsv-errors li{ font-size:14px; line-height:1.9; color:#8a3d33; }
.rsv-hp{ position:absolute !important; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.rsv-confirm{ margin-top:24px; }
.rsv-confirm h3{ margin:0 0 16px; font-size:18px; color:#1b4a4c; letter-spacing:.04em; }
.rsv-confirm-list{ margin:0; border-top:1px solid #e2ebe4; }
.rsv-confirm-list dt{ padding:14px 0 2px; font-size:12px; color:#5c8a79; letter-spacing:.04em; }
.rsv-confirm-list dd{ margin:0; padding:0 0 14px; border-bottom:1px solid #e2ebe4;
  font-size:15px; line-height:1.9; color:#243; white-space:pre-wrap; word-break:break-all; }
.rsv-confirm-actions{ margin-top:22px; }
.rsv-back{ display:block; width:100%; max-width:380px; margin:12px auto 0; padding:13px;
  border:1px solid #cfdfd6; border-radius:2px; background:#fff; color:#3b4f48;
  font:inherit; font-size:14px; letter-spacing:.06em; cursor:pointer; }
.rsv-back:hover{ background:#f4faf6; }
.rsv-submit:disabled{ opacity:.6; cursor:default; }
.rsv-done{ padding:28px 0 8px; text-align:center; }
.rsv-done h3{ margin:0 0 16px; font-size:21px; color:#1b4a4c; letter-spacing:.04em; }
.rsv-done p{ margin:0 0 14px; font-size:15px; line-height:2.1; color:#243; }
.rsv-done .rsv-done-note{ font-size:12px; line-height:2; color:#6b7d75; text-align:left;
  max-width:560px; margin:18px auto 0; }
@media(max-width:700px){ .rsv-back{ max-width:none; } }

/* 動画のライト埋め込み（王道-g80/g80b 2026-10-27）: 本文の章として挿入・クリックで初めてiframeを生成 */
.yt-videos{ display:grid; gap:16px; margin-top:22px; }
.yt-videos--1{ max-width:640px; margin-left:auto; margin-right:auto; }  /* PCはセンター寄せ（g80b 田中さん） */
.yt-videos--3{ grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); }
.yt-lite{ position:relative; aspect-ratio:16/9; background:#000; border-radius:3px 14px 3px 3px;
  overflow:hidden; cursor:pointer; }
.yt-lite > img{ width:100%; height:100%; object-fit:cover; display:block; opacity:.94;
  transition:opacity .2s, transform .3s; }
.yt-lite:hover > img{ opacity:1; transform:scale(1.02); }
.yt-lite:focus-visible{ outline:3px solid #8fc0ae; outline-offset:2px; }
.yt-lite-play{ position:absolute; inset:0; margin:auto; width:64px; height:44px; border-radius:10px;
  background:rgba(15,40,32,.82); }
.yt-lite-play::before{ content:""; position:absolute; inset:0; margin:auto; width:0; height:0;
  border-style:solid; border-width:9px 0 9px 16px; border-color:transparent transparent transparent #fff; }
.yt-lite:hover .yt-lite-play{ background:#2f7a63; }
.yt-lite-title{ position:absolute; left:0; right:0; bottom:0; padding:26px 14px 10px;
  background:linear-gradient(transparent, rgba(0,0,0,.72)); color:#fff; font-size:12.5px; line-height:1.6; }
.yt-lite iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
@media(max-width:560px){ .yt-videos--3{ grid-template-columns:1fr; } }

/* WEB予約（予約システム）を第一導線に（王道-g76 2026-10-27） */
.rsv-ways--4 .rsv-way--primary{ grid-column:1 / -1; border:2px solid #2f7a63; background:#f4faf6; }
.rsv-way--primary:hover{ background:#eef7f2; }
.rsv-way-badge{ display:inline-block; margin-bottom:10px; padding:3px 12px; border-radius:999px;
  background:#2f7a63; color:#fff; font-size:10px; letter-spacing:.08em; }

/* 取扱が未確認のページに出す帯 2026-10-06 */
.rsv-notice{ margin:18px 0 0; padding:16px 20px; border:1px solid #e4cfa6; border-radius:3px;
  background:#fdf8ee; font-size:13px; line-height:2; color:#6b5726; }
.rsv-notice .need-check{ margin-right:8px; }
@media(max-width:560px){ .rsv-notice{ padding:14px 16px; font-size:12px; } }

/* 本文の図解・大判バナーはPCで80%幅・中央寄せ（横幅いっぱいは下品・2026-10-06 田中さん）。
   はじめ薬5記事(.drug-page)だけだったが「全部のページで100%なら80%へ」の指示で全ページに広げた。
   スマホ(900px以下)は全幅のまま。max-width 指定ずみの図（--diagram 760px / D-系 620px）は
   小さい方の上限がそのまま効く。 */
@media(min-width:901px){
  body.aga-page .ph-img{ width:80%; margin-left:auto; margin-right:auto; }
  body.aga-page .aga-check-panel > .ph-img{ width:100%; margin:0 0 18px; }  /* グリッド内は枠が決める */
  /* 高さの低い帯バナー（比率>3・.ph-img--band）はPCで100%幅。80%に縮めると中身が他の図より
     小さく見える（2026-10-07 田中さん「この手の画像は、PCで横幅100％に」） */
  body.aga-page .ph-img--band{ width:100%; }
  body.aga-page .perk.banner img{ display:block; width:80%; margin-left:auto; margin-right:auto; }
}

/* 目次ブロック（CONTENTS このページの内容）は全ページで出さない（2026-10-06 田中さん「全ページのこれ取ろうか。なくして」）。
   HTMLには残してある＝戻すときはこの3行を消すだけ。本文はお知らせ・予約ページ（--solo）と同じ820px中央に揃える。 */
body.aga-page .aga-sidebar{ display:none; }
body.aga-page .aga-layout{ display:block; }
body.aga-page .aga-layout .aga-article{ max-width:820px; margin-left:auto; margin-right:auto; }

/* ── 薄毛についての入口3ページ（王道-g33・2026-10-07 田中さん「中はカード型の各記事の入口・リッチなカードで」）──
   写真(記事のfv・3:2切り抜き)＋英字＋題＋一行＋「読む →」。土台は .column-card--art（治療方法ページの薬カード）。
   PC3列・900px以下2列・600px以下1列。 */
.hub-section .aga-section-heading{ margin-bottom:10px; }
.hub-intro{ max-width:760px; margin:0 0 26px; color:var(--muted,#647a7b); line-height:1.9; }
.hub-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.hub-card{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--line,#d9e7e3); border-radius:12px;
  overflow:hidden; text-decoration:none; color:var(--ink,#234d50); box-shadow:0 6px 24px #255c4910;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.hub-card:hover, .hub-card:focus-visible{ transform:translateY(-3px); box-shadow:0 12px 30px #255c491b; border-color:var(--teal,#008f87); }
.hub-art{ position:relative; display:block; aspect-ratio:3/2; overflow:hidden; background:#f4faf8; }
.hub-art img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.hub-card:hover .hub-art img{ transform:scale(1.04); }
.hub-badge{ position:absolute; left:12px; top:12px; z-index:1; font-size:11px; letter-spacing:.08em; padding:4px 10px; border-radius:999px; background:#146e71; color:#fff; }
.hub-body{ display:flex; flex-direction:column; gap:6px; padding:18px 20px 20px; flex:1; }
.hub-en{ font-size:10.5px; font-weight:600; letter-spacing:.18em; color:#146e71; }
.hub-cat{ font-size:12.5px; font-weight:600; letter-spacing:.06em; color:#146e71; }  /* 和文の分類（治療方法ページの薬カード） */
.hub-card h3{ margin:0; font-size:19px; line-height:1.5; font-weight:600; color:var(--ink,#234d50); }
.hub-sub{ font-size:13.5px; line-height:1.8; color:var(--muted,#647a7b); }
.hub-link{ margin-top:auto; padding-top:12px; border-top:1px solid #e3eeea; font-size:13px; color:#146e71;
  display:flex; justify-content:space-between; align-items:center; }
.hub-link b{ display:inline-flex; width:28px; height:28px; border:1px solid #aecdc4; border-radius:50%; align-items:center; justify-content:center; font-weight:400; }
@media(max-width:900px){ .hub-grid{ grid-template-columns:1fr 1fr; gap:16px; } }
@media(max-width:600px){ .hub-grid{ grid-template-columns:1fr; } .hub-card h3{ font-size:18px; } }
@media(prefers-reduced-motion:reduce){ .hub-card:hover, .hub-card:hover .hub-art img{ transform:none; } }

/* ===== 2026-10-07 スマホ実測チェックの是正（田中さん指示） ===== */
/* ① トップの統括院長写真をスマホで中央に（1カラム化後は左に張り付いていた） */
@media(max-width:900px){
  .doctor-layout .doctor-photo{ margin-inline:auto; }
}
/* ② 横スクロールする表に「スクロールできます →」の案内を出す（判定は navigation.js が .is-scrollable を付ける） */
@media(max-width:767px){
  .col-table-wrap.is-scrollable::before{
    content:"スクロールできます →";
    display:block; width:max-content; position:sticky; left:0;
    font-size:12px; color:var(--muted,#647a7b); padding:0 0 6px 2px;
  }
}
/* ③ スマホ追従ヘッダーのロゴを大きく（codex-polish の 140px → 195px。2026-10-07 田中さん指示×2回目）
   狭い端末（320px級）では flex-shrink で自動的に縮めてボタンと重ねない */
@media(max-width:600px){
  .header .logo{ width:195px; flex-shrink:1; min-width:140px; }
}

/* 王道-g57/g58（2026-10-26）監修ブロックの経歴＝常時表示・氏名は医師紹介へリンク。院内写真4枚の並び */
.aga-page .aga-doctor h3 a, .doctor-copy .doctor-name a{ color:inherit; text-decoration:none; border-bottom:1px solid #b9d3cf; }
.aga-page .aga-doctor h3 a:hover, .doctor-copy .doctor-name a:hover{ border-bottom-color:var(--deep,#146e71); }
.doctor-career{ margin:6px 0 10px; font-size:13.5px; }
.doctor-career .doctor-career-h{ margin:0 0 4px; font-size:12px; font-weight:600; letter-spacing:.08em; color:var(--deep,#146e71); }
.doctor-career ul{ list-style:none; margin:0; padding:0; }
.doctor-career li{ display:grid; grid-template-columns:56px 1fr; gap:8px; line-height:1.7; color:#34494a; }
.doctor-career li span{ color:#4f6a6c; }
.doctor-career .doctor-career-more{ margin:8px 0 0; font-size:13px; }
.doctor-career .doctor-career-more a{ color:var(--deep,#146e71); font-weight:600; text-decoration:none; border-bottom:1px solid #b9d3cf; }
.ohdou-clinic-photos--4{ grid-template-columns:repeat(4,1fr); }
.ohdou-clinic-photos--3{ grid-template-columns:repeat(3,1fr); }
@media (max-width:960px){ .ohdou-clinic-photos--4{ grid-template-columns:1fr 1fr; } .ohdou-clinic-photos--3{ grid-template-columns:1fr; } }
/* 医師紹介ページ */
.doctor-page .aga-masthead-visual img{ object-position:center top; max-height:420px; }
.doctor-page .aga-masthead-visual:before{ display:none; }
.doctor-page .aga-masthead-visual{ max-width:360px; justify-self:center; }
.doctor-profile-career{ margin:18px 0 6px; }
.doctor-profile-career li{ display:grid; grid-template-columns:72px 1fr; gap:12px; padding:10px 0; border-bottom:1px solid #e3ebe6; line-height:1.7; }
.doctor-profile-career li span{ color:#4f6a6c; font-weight:600; }
.doctor-policy-list{ margin:14px 0 0; padding:0; list-style:none; display:grid; gap:12px; }
.doctor-policy-list li{ background:var(--cream,#f7faf5); border:1px solid #e0eadb; border-radius:8px; padding:16px 18px; line-height:1.8; }
.doctor-policy-list li b{ display:block; color:var(--deep,#146e71); margin-bottom:4px; }
.doctor-pages{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px 18px; margin:14px 0 0; padding:0; list-style:none; }
.doctor-pages li a{ display:block; padding:10px 14px; border:1px solid #e0eadb; border-radius:6px; text-decoration:none; color:#1d3b3c; }
.doctor-pages li a:hover{ border-color:var(--deep,#146e71); }
@media (max-width:640px){ .doctor-pages{ grid-template-columns:1fr; } }
/* 王道-g61（2026-10-26）監修ブロックの「最終更新／参考」はページの注記＝経歴と罫線で区切る */
.aga-page .aga-doctor .doctor-meta{ margin:14px 0 0; padding-top:10px; border-top:1px solid #e3ebe6; }
.aga-page .aga-doctor .doctor-meta small{ font-size:12.5px; line-height:1.6; color:#6b8486; }

/* 王道-g69（2026-10-26）お知らせ（NEWS）＝A案エディトリアル・コンパクト（田中さん「Aで。高さ低め・字小さめ」）。空なら hidden のまま */
.news-box{ padding:20px 0 0; }  /* 上の余白はもう少し狭く（田中さん 10/26）。下は svc-primary 側の36pxのまま */
.news-box[data-news="top"]:not([hidden]) + .svc-primary{ padding-top:36px; }
.news-box:not([data-news="top"]){ padding-bottom:14px; }  /* 診療ページは次がバナー画像なので下にも少し */
body .news-box .container{ width:min(960px, calc(100% - 48px)) !important; max-width:none !important; margin:0 auto !important; border:0; padding:0 !important; background:transparent; box-shadow:none; border-radius:0; }  /* 列の幅を960pxに固定して中央＝ページごとの container 幅に左右されず、左右の余白が全ページ同じ（田中さん 10/26） */
.news-box .news-head{ display:flex; align-items:baseline; gap:14px; padding:9px 0 0; margin:0; }
.news-box .news-head::after{ content:none; }
.news-box .news-label{ margin:0; font:500 12px/1 "Noto Serif JP",serif; letter-spacing:.32em; color:#1d3b3c; }
.news-box .news-list{ list-style:none; margin:0; padding:2px 0 4px; }
.news-box .news-item{ display:grid; grid-template-columns:112px 1fr 28px; gap:18px; align-items:baseline; padding:8px 0; border-top:1px solid #e3ebe6; line-height:1.55; }
.news-box .news-item:first-child{ border-top:0; }
.news-box .news-item time{ display:flex; align-items:baseline; gap:8px; padding:0; color:#1d3b3c; }
.news-box .news-item time b{ font:500 17px/1 "Noto Serif JP",serif; letter-spacing:.04em; font-variant-numeric:tabular-nums; }
.news-box .news-item time small{ font-size:10px; letter-spacing:.16em; color:#8a9c9d; }
.news-box .news-text{ min-width:0; }
body .news-box .news-text p{ margin:0 !important; line-height:1.55; }
body .news-box .news-text p.news-title{ font-weight:600; color:#1d3b3c; font-size:13.5px !important; line-height:1.55 !important; }  /* claude-overrides の `.aga-page main p{font-size:15px !important}` に勝つため !important（田中さん 10/26「他のページが大きく見える」） */
body .news-box .news-text p.news-body{ font-size:12px !important; line-height:1.55 !important; color:#5a6f70; margin-top:1px !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.news-box .news-body br{ display:none; }
body .news-box[data-expanded="1"] .news-text p.news-body{ white-space:normal; }
.news-box[data-expanded="1"] .news-body br{ display:inline; }
.news-box .news-arrow{ font-size:13px; color:var(--deep,#146e71); text-decoration:none; text-align:right; }
.news-box .news-more{ margin:0 0 8px; background:none; border:0; padding:2px 0; font-size:11.5px; color:var(--deep,#146e71); cursor:pointer; letter-spacing:.06em; }
.news-box .news-more::after{ content:" ↓"; }
.news-box[data-expanded="1"] .news-more::after{ content:" ↑"; }
.news-box .news-empty{ grid-template-columns:1fr; color:#6b8486; font-size:12.5px; }
@media (max-width:640px){ .news-box{ padding:16px 0 0; } .news-box[data-news="top"]:not([hidden]) + .svc-primary{ padding-top:24px; } .news-box .news-item{ grid-template-columns:1fr 24px; gap:4px 10px; } .news-box .news-item time{ grid-column:1 / -1; } .news-box .news-arrow{ grid-column:2; grid-row:2; } }