/*
 * Subpages 下層共通 Visual Grammar（R1 → R2 Common Refinement）。
 * front-page.css（TOP R6）には手を入れず、下層専用ルールをここへ分離する。
 * 全ページ共通 Site-wide Ending は assets/css/site-ending.css（TOP と共有）。
 * ブレークポイントは既存 components.css と合わせ 1024px / 767px の2点。
 *
 * R2: 下層は Alignment / Balance / 共通 Typography を優先する。TOP の表現的な非対称は
 * 持ち込まない。H1→H2→H3→Body のジャンプ率をページ横断で一定にする。
 */

/* 下層共通 Typography scale（R2 §5）。同格見出しをページごとに変えない。
 * H1=Page Hero（Serif） / H2=章（Serif） / H3=小見出し（Sans Medium）。 */
:root{
  --fs-subpage-h2:clamp(23px,2.3vw,31px);
  --fs-subpage-h3:clamp(17px,1.3vw,19px);
}

/* ============ 共通コンテンツフィールド（R3 §2） ============
 * 下層はひとつの共通フィールド（最大 約1080px・中央寄せ・共通 gutter）に横端を揃える。
 * Reading / Content / Field は「外幅の使い分け」ではなく実装上の別名として残す:
 *  - Reading = 長い散文。フィールド内で可読行長に絞った左寄せテキストカラム
 *    （別の中央コンテナへ戻さない。左端は共通起点と一致させる）。
 *  - Content / Field = 図・表・手順・一覧・ギャラリー。フィールド幅をそのまま使う。
 * 1200px の Field 例外（Hub / ギャラリー）は撤回し、共通フィールドに揃える。 */
.md-w-reading,.md-w-content,.md-w-field{max-width:1080px;margin-inline:auto;padding-inline:var(--container-gutter)}
/* 長文だけ内側で可読行長に絞る。共通の左起点に固定し、狭い中央コンテナへ戻さない。
 * 46rem ≒ 736px（日本語 16px で約46字 / 18px で約40字）。
 * 制限は散文のテキスト要素・見出し・FAQ・注記にのみかけ、ラッパー自体は共通フィールド幅の
 * ままにする。そのため表・図・ギャラリー・レガシー uk-grid / iframe は 1080px を使える。 */
:is(.md-w-reading,.md-w-content) .md-article :is(p,h2,h3,h4,h5,ul,ol,blockquote,dl),
:is(.md-w-reading,.md-w-content).md-article>:is(p,h2,h3,h4,h5,ul,ol,blockquote,dl),
.md-w-reading>.md-section-heading,
.md-w-reading>.md-faq,
.md-w-reading>.md-page-lead,
:is(.md-w-reading,.md-w-content)>.md-note{max-width:46rem}
/* 表・図・ギャラリー・地図・レガシー uk-grid は散文カラムの外。共通フィールド幅を使う。 */
:is(.md-w-reading,.md-w-content) .md-article :is(figure,table,iframe,.uk-grid,.md-table-wrap,.md-gallery),
:is(.md-w-reading,.md-w-content).md-article>:is(figure,table,iframe,.uk-grid,.md-table-wrap,.md-gallery){max-width:none}

/* ============ Breadcrumb list ============ */
.md-breadcrumb__list{display:flex;align-items:center;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.md-breadcrumb__item{display:flex;align-items:center;gap:8px}
.md-breadcrumb__sep{display:inline-flex;color:var(--text-faint)}

/* ============ Page Hero（下層共通の章扉。Client Feedback R1 §3 / Second Proof R1 §1） ============
 * Breadcrumb → English label → Serif H1 のみ。（任意で）実写真の場。
 * Intro / lead / excerptはNavy Hero内に置かない。必要なintroは .md-page-lead で
 * Hero直後の白背景側へ出す（下記 md-page-lead 参照）。
 * TOP FVの変更に合わせ、下層の入口も Deep Navy 主体へ統一する（TOP FVの縮小コピーではない）。
 * 本文開始まで十分な呼吸を取り、章の入口として明確に区切る。写真あり/なしの双方で成立する。
 * 意図的な非対称にはしない（下層は整列・均整を優先）。共通の scale / 横端 / 上下位置を持つ。
 * Heroを巨大化しない。専用写真・gradient・blur・decorative graphicを新規に追加しない。
 * Heroからleadを外した分をpadding増加で埋めない（既存 padding を維持）。 */
.md-page-hero{padding:var(--space-10) 0 var(--space-9);background:var(--navy-800);color:var(--text-on-navy)}
.md-page-hero__inner{max-width:1080px;margin-inline:auto;padding-inline:var(--container-gutter)}
/* Client Feedback R3 §5: Breadcrumb → English label → H1 のjump rateと余白を意味に沿って
 * 設計する（均等spacingにしない）。gapは使わず、各要素間のmargin-topを個別に決める。 */
.md-page-hero__text{display:flex;flex-direction:column;max-width:42em}
/* 章扉 → 本文最初の section の間に明確な呼吸を置く（罫線ではなく余白で区切る。R3 §3）。 */
.md-page-hero+.md-subpage-section{padding-top:var(--space-8)}
.md-page-hero+.md-subpage-section--tint{padding-top:var(--space-section-tight)}
.md-page-hero--center .md-page-hero__text{margin-inline:auto;align-items:center;text-align:center}
/* Breadcrumb（補助情報として小さく弱く）。Page Hero内だけ12-13pxへ抑える。 */
.md-page-hero .md-breadcrumb{font-size:13px}
/* Breadcrumb → English label: やや広め。 */
.md-page-hero__eyebrow-row{display:flex;align-items:center;gap:14px;margin-top:var(--space-5)}
/* English label（chapter labelとして小さいが明確）。11-12px + tracking。 */
.md-page-hero .md-eyebrow{font-size:12px}
/* English label → H1: 近め。 */
.md-page-hero__title{margin-top:var(--space-2)}
/* Breadcrumbの直後にH1が来る（eyebrowなし）場合は、H1入口として明確な余白を残す。 */
.md-page-hero__text>.md-breadcrumb+.md-page-hero__title{margin-top:var(--space-6)}
.md-page-hero__title{font-family:var(--font-serif);font-weight:var(--fw-serif-medium);font-size:clamp(28px,3.2vw,42px);line-height:var(--lh-heading);letter-spacing:var(--ls-heading);color:#fff;max-width:18em}
/* H1 → 本文開始: 明確な余白。 */
/* Hero外・白背景側のIntro（mdrw_page_lead()）。Navy Hero内leadの受け皿。 */
.md-page-lead{font:var(--type-body-l);color:var(--text-body)}
.md-page-lead p{margin:0}
.md-page-lead p+p{margin-top:1em}
/* Contact R1/R2（/contact/専用）: WEBフォーム導線の注記の情報階層。
 * alert card化・赤警告色は使わず、White Space + Typographyの強弱だけで
 * 「予約未確定」を主情報、「営業禁止」を補足情報として分ける。 */
.md-contact-notices{display:flex;flex-direction:column;gap:var(--space-4);max-width:46rem;margin-top:var(--space-5)}
.md-contact-notices p{margin:0}
.md-contact-notices__confirm{font:var(--type-small);color:var(--text-body)}
.md-contact-notices__confirm strong{color:var(--text-heading);font-weight:var(--fw-medium)}
.md-contact-notices__aside{font:var(--type-small);color:var(--text-muted)}
.md-contact-notices__note{font:var(--type-small);color:var(--text-muted)}

/* Contact R2 §5: 電話でのご予約・お問い合わせ。card / shadow / pillは使わず、
 * 電話番号のみscaleを上げ、受付時間・休診日はsecondary情報として一段弱く扱う。 */
.md-contact-phone{max-width:46rem;margin-top:var(--space-5)}
.md-contact-phone__number{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-serif);font-weight:var(--fw-serif-medium);font-size:clamp(26px,3vw,34px);letter-spacing:var(--ls-heading);color:var(--text-heading);text-decoration:none}
.md-contact-phone__number:hover{color:var(--color-primary)}
.md-contact-phone__note{margin:var(--space-2) 0 0;font:var(--type-small);color:var(--text-muted)}
.md-contact-phone__aside{margin:var(--space-4) 0 0;padding-top:var(--space-4);border-top:1px solid var(--border-default);font:var(--type-small);color:var(--text-muted)}

/* Contact R2 §8: SmoothContact読み込み前でもフォーム領域と分かる静かな外枠。
 * card / shadowにはしない。1pxの細いNavy系borderと最小限のradiusのみ。
 * embedの実heightに追従させるため固定min-heightは持たない。 */
.md-sc-frame{margin-top:var(--space-6);border:1px solid var(--navy-800);border-radius:var(--radius-sm);background:#fff;padding:var(--space-5)}
.md-sc-frame__notice{margin:0;text-align:center;font:var(--type-small);color:var(--text-muted)}
.md-sc-frame__embed{margin-top:var(--space-5);max-width:100%;overflow-x:hidden}
/* Navy面上の Breadcrumb / English label rule / eyebrow を可読な白familyへ（色差で階層を作らない）。 */
.md-page-hero .md-breadcrumb{color:var(--text-on-navy-muted)}
.md-page-hero .md-breadcrumb a{color:var(--text-on-navy-muted)}
.md-page-hero .md-breadcrumb a:hover{color:#fff}
.md-page-hero .md-breadcrumb__sep{color:var(--navy-400)}
.md-page-hero .md-breadcrumb [aria-current="page"]{color:#fff}
.md-page-hero .md-eyebrow{color:var(--navy-200)}
.md-page-hero .md-section-heading__rule{background:var(--navy-200)}

/* 写真あり: PC は text 左・media 右の安定した2カラム。比率は固定（0.72fr）。 */
.md-page-hero--with-media .md-page-hero__inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,0.72fr);gap:clamp(32px,5vw,72px);align-items:center}
.md-page-hero--with-media .md-page-hero__text{max-width:34em}
.md-page-hero__media{width:100%}

/* ============ Section rhythm（R2 §6: 背景色で章を分ける前に、余白と Typography で分ける） ============
 * 機械的な 白→淡Gray→白 の交互をデフォルトにしない。連続 section は余白リズムで分け、
 * 罫線は「淡色面と地の境目」に自然に生まれる分だけとする。--tint は意味のあるグルーピング用。 */
.md-subpage-section{padding-block:var(--space-section-tight)}
.md-subpage-section--tint{background:var(--surface-tint)}
.md-subpage-section--low{padding-block:var(--space-6)}
/* R3 §4: 連続する通常章は余白で分ける。全幅罫線をセクション区切りのデフォルトにしない
 * （罫線は表・FAQ・淡色面の境界など意味のあるグルーピングにのみ残す）。 */

/* ============ 下層共通 Ending — 章転換と Panel 幅（R5） ============
 * 共通 Ending 本体は site-ending.css（TOP と共有）。ここでは下層（2階層目以降）だけに効く
 * 差分を置く。この file は front-page.css を読む TOP では enqueue されないため TOP は不変。
 *
 * 1) 本文終了 → 白い余白 → 木目背景の共通 Ending、という章転換を作る。
 *    木目セクション（.fp-ending__section）が始まる前に、PC で約80px の白余白を置く。
 *    直前の本文 section（例: .md-subpage-section--low = padding-bottom 32px）と合算して
 *    約80px になるよう padding-top 側は約48px に取る。SP は固定せず vw で自然に縮小する。
 *    TOP には影響を与えない（この file 限定）。
 * 2) 木目内の白 Editorial Panel（.fp-ending__card）を、下層本文の共通フィールドと同じ
 *    max-width:1080px に揃える（site-ending.css の既定 1200px を下層でだけ上書き）。
 *    PC で本文の左右端と白 Panel の左右端が概ね揃って見えることを優先する。
 * 3) CTA（.fp-ending__cta）は白 Panel 内部のコンテンツとして自然に収める。R4 で強めた
 *    章転換用の大きい margin-top は下層では撤回し、Panel 内の他ブロックと同程度に戻す。
 *    bleed / negative margin は使わない（site-ending.css 側で撤回済み）。 */
.fp-ending{padding-top:clamp(16px,4vw,48px)}
.fp-ending__card{max-width:1080px}
.fp-ending__cta{margin-top:clamp(36px,5vw,56px)}
@media (max-width:767px){
  .fp-ending__cta{margin-top:clamp(32px,8vw,44px)}
}

/* 章見出し（mdrw_section_heading / .md-section-heading）を下層内で H2 scale へ統一する。
 * TOP・共通コンポーネントの既定（--type-h2 = 〜40px）を下層文脈だけ揃える。 */
.md-subpage-section .md-section-heading__title{font-size:var(--fs-subpage-h2);letter-spacing:var(--ls-heading)}

/* ============ Article prose（Treatment Article / Reading） ============ */
.md-article h2{font:var(--type-h2);font-size:var(--fs-subpage-h2);letter-spacing:var(--ls-heading);color:var(--text-heading);margin-top:2.2em;scroll-margin-top:96px}
.md-article h2:first-child{margin-top:0}
.md-article h3{font:var(--type-h3);font-weight:var(--fw-medium);font-size:var(--fs-subpage-h3);color:var(--text-heading);margin-top:1.8em}
.md-article p{font:var(--type-body-l);color:var(--text-body)}
.md-article h2+p,.md-article h3+p,.md-article h2+ul,.md-article h3+ul{margin-top:.9em}
.md-article p+p,.md-article ul+p,.md-article p+ul,.md-article p+ol{margin-top:1.2em}
.md-article ul,.md-article ol{padding-left:1.4em;font:var(--type-body-l);color:var(--text-body)}
.md-article li+li{margin-top:.5em}
.md-article figure{margin:var(--space-6) 0}
.md-article img{border-radius:var(--img-radius)}
.md-article figcaption{font:var(--type-small);color:var(--text-muted);margin-top:8px}

/* Table：料金・比較。可読性優先、装飾バッジ化しない。横スクロールで文字を縮小させない */
.md-table-wrap{overflow-x:auto;margin:var(--space-6) 0;-webkit-overflow-scrolling:touch}
.md-table{width:100%;border-collapse:collapse;min-width:520px;font:var(--type-body);font-size:15px}
.md-table caption{text-align:left;font:var(--type-small);color:var(--text-muted);margin-bottom:8px}
.md-table th,.md-table td{padding:14px 16px;border-bottom:1px solid var(--border-default);text-align:left;vertical-align:top}
.md-table thead th{color:var(--text-heading);font-weight:var(--fw-medium);border-bottom:2px solid var(--border-strong)}
.md-table tbody th{font-weight:var(--fw-medium);color:var(--text-heading);white-space:nowrap}

/* Note（注記・[要確認]を断定にしないための仮表示枠） */
.md-note{display:flex;gap:12px;padding:16px 20px;background:var(--surface-alt);border-radius:var(--radius-md);font:var(--type-small);color:var(--text-muted)}
.md-note--provisional{background:var(--warm-050);border:1px dashed var(--wood-300);color:var(--wood-600)}

/* ============ FAQ（<details>ベース。JS無しでも読める） ============ */
.md-faq{display:flex;flex-direction:column}
.md-faq__item{border-bottom:1px solid var(--border-default);padding:var(--space-4) 0}
.md-faq__item:first-child{border-top:1px solid var(--border-default)}
.md-faq__q{display:flex;align-items:baseline;gap:14px;cursor:pointer;font:var(--type-h3);font-size:17px;color:var(--text-heading);list-style:none;padding-right:28px;position:relative}
.md-faq__q::-webkit-details-marker{display:none}
.md-faq__q::after{content:"+";position:absolute;right:0;top:0;font:var(--type-h3);font-weight:var(--fw-regular);color:var(--text-faint);transition:transform var(--dur-base) var(--ease-standard)}
.md-faq__item[open] .md-faq__q::after{content:"–"}
.md-faq__q-mark{flex:0 0 auto;color:var(--color-secondary);font-weight:var(--fw-bold)}
.md-faq__a{display:flex;gap:14px;margin-top:12px;font:var(--type-body);color:var(--text-muted)}
.md-faq__a-mark{flex:0 0 auto;color:var(--text-faint);font-weight:var(--fw-bold)}
.md-faq__a p{margin:0}

/* ============ Figure gallery（設備案内等。可変比率、単一比率へ揃えない） ============ */
.md-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-6)}
.md-gallery__item{display:flex;flex-direction:column;gap:10px}
.md-gallery__item--wide{grid-column:1 / -1}
.md-gallery__item img{width:100%;border-radius:var(--img-radius);filter:var(--img-filter)}
.md-gallery__cap{font:var(--type-small);color:var(--text-muted)}

/* ============ Director Profile + Message（Director R2 §4） ============
 * 共通1080px field内の左右2カラムEditorial composition。左=基本プロフィール+Message、
 * 右=portrait + treatment photoの1つのvisual column。card / shadow / overlayは使わない。
 * SPは基本プロフィール→portrait→Message…→treatment photo→続きの意味順（§9）に並べ替える
 * ため、PC用の右カラム画像はSPで非表示にし、SP用の同一画像を本文内へ複製配置する。 */
.md-director-top__inner{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:start}
.md-director-top__media{display:flex;flex-direction:column;gap:var(--space-6);position:sticky;top:var(--space-8)}
.md-director-top__photo{margin:0}
/* SP専用の複製画像（基本プロフィール直後のportrait / 学びの原点直後のtreatment photo）は
 * PCでは非表示。PC専用の右カラム画像はSPで非表示にする（意味順の入れ替えをCSSだけで行う）。 */
.md-director-top__portrait--sp,.md-director-top__treatment--sp{display:none}

.md-director-basic{max-width:46rem}
.md-director-basic__label{display:block;font:var(--type-small);font-size:12px;letter-spacing:.06em;color:var(--text-faint)}
.md-director-basic__name{font-family:var(--font-serif);font-weight:var(--fw-serif-medium);font-size:clamp(22px,2.1vw,27px);letter-spacing:var(--ls-heading);color:var(--text-heading);margin:6px 0 0}
.md-director-basic__list{list-style:none;margin:14px 0 0;padding:0;font:var(--type-body);color:var(--text-body)}
.md-director-basic__list li+li{margin-top:.4em}

/* 長文「院長挨拶」1ブロックにせず、Greeting + 3つの小見出しで読むリズムを作る。
 * text は共通field左起点 + reading measure（46rem）に絞る。Message bodyはR2で
 * line-heightを広げ（約1.9）、通常本文と同等以上の可読性を維持する（§5）。 */
.md-director-message{max-width:46rem;margin-top:var(--space-8)}
.md-director-message__heading{font-family:var(--font-serif);font-weight:var(--fw-serif-medium);font-size:var(--fs-subpage-h2);letter-spacing:var(--ls-heading);color:var(--text-heading);margin:0}
.md-director-message__greeting{margin-top:var(--space-6)}
.md-director-message__greeting p{font-size:var(--fs-body);font-weight:var(--fw-regular);line-height:1.9;color:var(--text-body);margin:0}
.md-director-message__greeting p+p{margin-top:.3em}
.md-director-message__block{margin-top:var(--space-8)}
.md-director-message__block h3{font:var(--type-h3);font-weight:var(--fw-medium);font-size:var(--fs-subpage-h3);color:var(--text-heading);margin:0}
.md-director-message__block p{font-size:var(--fs-body);font-weight:var(--fw-regular);line-height:1.9;color:var(--text-body);margin-top:.9em}
.md-director-message__block p+p{margin-top:1.2em}

/* ============ Compact Information — 略歴 + 資格・所属・活動（Director R2 §6） ============
 * R1の独立2大Sectionを撤回し、同一1080px field内2カラムへ統合。ここは「読む長文」ではなく
 * 参照情報。見出しは通常H2（.md-director-message__heading等）より明確に控えめにし、
 * item textはPC 13-14px程度まで落とす。card / pill / badge wall /罫線の反復は使わない。 */
.md-director-compact{padding-block:var(--space-7)}
.md-director-compact__inner{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-7) clamp(32px,5vw,64px)}
.md-director-compact__heading{font:var(--type-h3);font-weight:var(--fw-medium);font-size:15px;letter-spacing:.02em;color:var(--text-heading);margin:0 0 14px}
.md-director-profile{list-style:none;margin:0;padding:0;border-top:1px solid var(--border-default)}
.md-director-profile__item{display:grid;grid-template-columns:5.5em 1fr;gap:16px;padding:6px 0;border-bottom:1px solid var(--border-default)}
.md-director-profile__year{font-family:var(--font-num);color:var(--text-faint);font-size:13px}
.md-director-profile__text{font-size:13px;line-height:1.45;color:var(--text-body)}
.md-director-evidence-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--border-default);font-size:13px;line-height:1.6;color:var(--text-body)}
.md-director-evidence-list__item{display:grid;grid-template-columns:4em 1fr;gap:16px;padding:9px 0;border-bottom:1px solid var(--border-default)}
.md-director-evidence-list__label{color:var(--text-faint)}
.md-director-evidence-list__text{overflow-wrap:break-word}

/* ============ Historical Directors / 歴代院長（Director R2 §7） ============
 * ページの主役ではない、控えめな人物記録。text-only 2カラム（写真なし）。白背景基本、
 * 現院長Messageより一段弱い視覚階層（見出しscale・本文密度）にする。card / shadow /
 * timeline UIは禁止。2カラムの高さを無理に揃えない。 */
.md-director-history{padding-block:var(--space-7)}
.md-director-history__heading{font-family:var(--font-serif);font-weight:var(--fw-serif-medium);font-size:clamp(19px,1.7vw,22px);letter-spacing:var(--ls-heading);color:var(--text-heading);margin:0 0 var(--space-6)}
.md-director-history__grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-8) clamp(32px,5vw,64px);align-items:start}
.md-director-figure{border-top:1px solid var(--border-default);padding-top:var(--space-5)}
.md-director-figure__photo{width:clamp(96px,18vw,140px);margin-bottom:var(--space-5)}
.md-director-figure__photo .md-media-frame__box{border-radius:0;box-shadow:none;background:var(--gray-100)}
.md-director-figure__name{font-family:var(--font-serif);font-weight:var(--fw-serif-medium);font-size:clamp(16px,1.3vw,18px);color:var(--text-heading);margin-bottom:4px}
.md-director-figure__role{font-size:13px;color:var(--text-muted);margin-bottom:12px}
.md-director-figure__list{list-style:none;margin:0;padding:0;font-size:13px;line-height:1.6;color:var(--text-body)}
.md-director-figure__list li+li{margin-top:.5em}

/* Related links の一律ブロックは R3 §6 で撤去。文脈的な内部リンクは各本文内で
 * mdrw_text_link 等を使い、意味のある箇所にのみ置く。 */

/* ============ Concept R1（Brand/Editorial 専用。CONCEPT-R1-DESIGN-SPEC.md） ============
 * 中心命題を Intro で先に示し、01〜03 は約1080px field 内の本文1:写真1 等幅2カラム。
 * 変化は左右反転のみ（01=本文/写真, 02=写真/本文, 03=本文/写真）。カラム幅・写真scale・
 * 見出し階層は3章で統一。rounded card / shadow / floating panel / 背景色の機械的交互は使わない。
 * 章間は White Space と Photography でリズムを作る。SP は3章とも本文→写真の意味順。 */

/* Intro: ページ全体の結論を先に出す Low-density zone。画像なし。 */
.md-concept-intro{padding-block:clamp(48px,6vw,88px)}
.md-concept-intro__inner{max-width:1080px;margin-inline:auto;padding-inline:var(--container-gutter)}
/* Client Feedback R3 §4.2: Opening/Closing見出しは01〜03のchapter headingより明確に大きくする
 * （目安 PC 30-34px / SP 26-28px）。Introの重要度は本文サイズではなくこのheadingと余白で表す。 */
.md-concept-intro__heading{font-family:var(--font-serif);font-weight:var(--fw-serif-medium);font-size:clamp(26px,2.8vw,34px);line-height:var(--lh-heading);letter-spacing:var(--ls-heading);color:var(--text-heading);max-width:22em;margin:0}
/* Client Feedback R3 §4.1: Intro本文は18px残存をやめ、通常本文16px/lh約1.9へ戻す。 */
.md-concept-intro__body{margin-top:var(--space-6);max-width:46rem}
.md-concept-intro__body p{font-size:var(--fs-body);font-weight:var(--fw-regular);line-height:var(--lh-body);color:var(--text-body);margin:0}
.md-concept-intro__body p+p{margin-top:1.2em}

/* 01〜03 章: 等幅2カラム。DOM は常に 本文→写真（SP 意味順 = keyboard / SR 順）。
 * PC で 02 のみ写真を左へ回すのは order で行い、HTML 順は変えない。 */
.md-concept-chapter{padding-block:var(--space-section-tight)}
.md-concept-chapter__inner{max-width:1080px;margin-inline:auto;padding-inline:var(--container-gutter);display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,64px);align-items:center}
.md-concept-chapter--photo-text .md-concept-chapter__text{order:2}
.md-concept-chapter--photo-text .md-concept-chapter__figure{order:1}
/* Client Feedback R2 §11: SPで 01/02/03 → h2 → subheading → body がほぼ同じ強さに見える
 * jump rate不足を、number=quiet／heading=Serif大きめ／subheading=Sans Medium／bodyの
 * 明確な強弱差で改善する。heading→subheadingは近く、subheading→bodyは一段広くとる。 */
.md-concept-chapter__num{font-family:var(--font-num);font-size:13px;letter-spacing:.14em;color:var(--text-faint);margin:0 0 var(--space-2)}
/* Client Feedback R3 §4.3: 01〜03 h3はOpening/Closingより一段小さくする（目安 PC 22-24px / SP 20-22px）。
 * numberだけが過度に主役にならないようnum(13px)とのjump rateも確認済み。 */
.md-concept-chapter__heading{font-family:var(--font-serif);font-weight:var(--fw-serif-medium);font-size:clamp(20px,1.9vw,24px);line-height:var(--lh-heading);letter-spacing:var(--ls-heading);color:var(--text-heading);margin:0}
/* Client Feedback R3 §4.4: chapter subheadingはh3より一段弱くする（目安 PC 16-18px / SP 16px前後）。
 * 本文16pxとの差はweightで作る（本文はregular、subはmedium）。 */
.md-concept-chapter__sub{font-size:clamp(16px,1.2vw,17px);line-height:1.6;font-weight:var(--fw-medium);color:var(--text-heading);margin:10px 0 0}
.md-concept-chapter__body{margin-top:var(--space-7)}
/* Client Feedback R2 §1/§11: 01〜03 の本文は「読ませる通常本文」であり lead 扱いにしない。
 * 16px/lh1.9 の共通 body grammar へ統一する（旧 --type-body-l = 18px から変更）。 */
.md-concept-chapter__body p{font-size:var(--fs-body);font-weight:var(--fw-regular);line-height:var(--lh-body);color:var(--text-body);margin:0}
.md-concept-chapter__body p+p{margin-top:1.2em}
.md-concept-chapter__figure{width:100%}

/* Closing（R2 Heritage Refinement）: 01〜03 の chapter grammar（num→heading→subheading→body
 * の反復）をここで明確に終える。「04」に見せない。R1 の Typography + White Space 構成に、
 * 1937年開院を裏づける新旧外観写真（factual / approved photography）を加える。
 * generic history timeline / equal card / sepia等の装飾は追加しない
 * （CONCEPT-R2-HERITAGE-REFINEMENT-SPEC.md §6, §10, §14）。 */
.md-concept-closing{padding-block:var(--space-section-tight)}
.md-concept-closing::before{content:"";display:block;max-width:1080px;margin:0 auto clamp(40px,6vw,72px);padding-inline:var(--container-gutter)}
.md-concept-closing::before{border-top:1px solid var(--border-default)}
/* Client Feedback R3 §4.5: outer fieldは01〜03と同じ1080pxへ揃え、狭い独立columnに見せない。
 * reading measureは本文(.md-concept-closing__body)側だけで46remへ絞る。 */
.md-concept-closing__text{max-width:1080px;margin-inline:auto;padding-inline:var(--container-gutter)}
/* Context label（SINCE 1937）: 装飾英字ではなく、写真・本文の時間軸を補助する小さな情報として
 * 扱う（Design Spec §4）。既存 .md-eyebrow と同格の tracking / size。 */
.md-concept-closing__eyebrow{font:var(--type-small);font-size:12px;letter-spacing:.1em;color:var(--text-faint);font-family:var(--font-num);margin:0 0 14px}
/* Client Feedback R3 §4.2: ClosingはOpening（.md-concept-intro__heading）と同じ上位階層。
 * 01〜03と同格に見えるサイズへ戻さない。 */
.md-concept-closing__text .md-concept-closing__heading{font-family:var(--font-serif);font-weight:var(--fw-serif-medium);font-size:clamp(26px,2.8vw,34px);line-height:var(--lh-heading);letter-spacing:var(--ls-heading);color:var(--text-heading);margin:0}
.md-concept-closing__body{margin-top:var(--space-6);max-width:46rem}
.md-concept-closing__body p{font-size:var(--fs-body);font-weight:var(--fw-regular);line-height:var(--lh-body);color:var(--text-body);margin:0}
.md-concept-closing__body p+p{margin-top:1.2em}
/* 最初の段落＝強調文（closing emphasis）。18〜22pxでbody Regularより一段強く見せるが、
 * card化・派手な背景色変更はしない。generic .md-concept-closing__body p の後に置き、
 * 同一詳細度でも上書きされるようにする。 */
.md-concept-closing__body p:first-child{font-family:var(--font-serif);font-weight:var(--fw-serif-medium);font-size:clamp(19px,1.9vw,23px);line-height:1.7;color:var(--text-heading)}
.md-concept-closing__body p:first-child+p{margin-top:1.4em}

/* Heritage photo pair（Design Spec §7-§9）: 昭和17年当時／現在の外観。field幅いっぱいを使い、
 * 本文横のサムネイルにはしない。2枚を同一 aspect ratio へ無理に揃えず、object-fit:cover による
 * 強制cropもしない（production derivative側で既にfactual cropを適用済み）。
 * PC starting point: old 約34% / current 約66%、gap 24-40px、bottom-align。 */
.md-concept-closing__photos{max-width:1080px;margin:clamp(40px,5vw,64px) auto 0;padding-inline:var(--container-gutter);display:grid;grid-template-columns:34fr 66fr;gap:clamp(24px,3vw,40px);align-items:end}
.md-concept-closing__photo{margin:0;display:flex;flex-direction:column}
.md-concept-closing__photo img{display:block;width:100%;height:auto;border-radius:var(--img-radius);filter:var(--img-filter)}
/* Current photo をわずかに主役に。古写真を資料サムネイル化しない（縦位置の性格を保つ）。 */
.md-concept-closing__photo--old{align-self:end}
.md-concept-closing__photo--current{align-self:end}
.md-concept-closing__caption{font:var(--type-small);font-size:13px;color:var(--text-muted);margin-top:10px}

/* Concept 固有の次ページ導線: generic related block ではない。余白を主 separator に、
 * 細い rule のみ許容。equal rounded card / shadow / thumbnail / large icon は使わない。 */
.md-concept-next__heading{font-family:var(--font-serif);font-weight:var(--fw-serif-medium);font-size:var(--fs-subpage-h2);letter-spacing:var(--ls-heading);color:var(--text-heading);margin:0 0 var(--space-6)}
.md-concept-next__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(32px,5vw,64px);border-top:1px solid var(--border-default)}
.md-concept-next__item{border-bottom:1px solid var(--border-default)}
.md-concept-next__link{display:grid;grid-template-columns:1fr auto;grid-template-areas:"label arrow" "desc arrow";align-items:center;column-gap:16px;padding:var(--space-5) 0;text-decoration:none;color:var(--text-heading)}
.md-concept-next__link:hover .md-concept-next__label{color:var(--text-link-hover)}
.md-concept-next__link:hover .md-concept-next__arrow{color:var(--color-secondary)}
.md-concept-next__label{grid-area:label;font-family:var(--font-serif);font-weight:var(--fw-serif-medium);font-size:clamp(17px,1.4vw,20px);color:var(--text-heading)}
.md-concept-next__desc{grid-area:desc;font:var(--type-small);color:var(--text-muted);margin-top:6px}
.md-concept-next__arrow{grid-area:arrow;display:inline-flex;color:var(--text-faint)}

@media (max-width:1024px){
  /* PC 左右反転をそのまま縦積みしない: 3章とも 本文 → 写真 の意味順へ戻す。 */
  .md-concept-chapter__inner{grid-template-columns:1fr;gap:var(--space-6)}
  .md-concept-chapter--photo-text .md-concept-chapter__text,
  .md-concept-chapter--photo-text .md-concept-chapter__figure{order:0}
  .md-concept-chapter__body{margin-top:var(--space-4)}
  .md-concept-chapter__figure{margin-top:var(--space-2)}
}
@media (max-width:767px){
  .md-concept-chapter{padding-block:var(--space-7)}
  /* Client Feedback R3 §4.3: SP 01〜03 h3は20-22px（Opening/Closingより明確に小さく保つ）。 */
  .md-concept-chapter__heading{font-size:clamp(20px,5.2vw,22px)}
  /* Client Feedback R3 §4.2: SP Opening/Closingは26-28px。01〜03と同格に見えるサイズへ戻さない。 */
  .md-concept-intro__heading{font-size:clamp(26px,6.8vw,28px)}
  .md-concept-closing__text .md-concept-closing__heading{font-size:clamp(26px,6.8vw,28px)}
  .md-concept-next__list{grid-template-columns:1fr}

  /* Heritage photo pair — SP（Design Spec §9）: Desktopの2カラムを単純縮小せず、
   * 過去→現在を縦方向に読む構成にする（DOM順は既に old→current）。
   * Old photoは縦長のまま、containerの78-88%を起点に本文起点と関連付け、
   * Current photoはOldより広く（フル幅）見せてよい。arrow/timeline UIは追加しない。 */
  .md-concept-closing__photos{grid-template-columns:1fr;gap:clamp(40px,10vw,56px);align-items:start}
  .md-concept-closing__photo--old{width:82%}
  .md-concept-closing__photo--current{width:100%}
}

/* ============ 既存固定ページ本文（レガシーHTML）の視覚整理 ============
 * 現行 minidora テーマ由来の uk-grid / title1-3 / sheet-dotted 等をCSSのみで
 * TOPと調和させる。本文・階層は変更しない（内容の書き換えはしない）。
 */
.md-legacy .uk-grid{display:flex;flex-wrap:wrap;gap:var(--space-6);align-items:flex-start;margin:var(--space-6) 0}
.md-legacy .uk-grid>div{flex:1 1 0;min-width:0}
/* 旧sidebar前提の固定 180px/320px を撤回し、新1080px fieldに対するfractionとして
 * flex-grow比で再構成する（Second Proof R1 §2）。basis:0 + gapのためpercentage計算をせず、
 * overflowを作らない。
 *  - 1/4 + 3/4: プロフィール写真 + 紹介文（staff / recruit）
 *  - 1/3 + 2/3: 写真 + 本文（sanitary / recruit / end 等。uk-push/pullは順序反転のみ）
 *  - 2/5 + 3/5: 図 + 説明（cosmetic セラミック解説）
 *  - 1/2 + 1/2: Before/After 比較（uk-width-1-2 + uk-width-medium-1-3の組。SPでも2カラム維持） */
.md-legacy .uk-width-1-2.uk-width-medium-1-4{flex-grow:1}
.md-legacy .uk-width-medium-3-4{flex-grow:3}
.md-legacy .uk-width-medium-1-3{flex-grow:1}
.md-legacy .uk-width-medium-2-3{flex-grow:2}
.md-legacy .uk-width-medium-2-5{flex-grow:2}
.md-legacy .uk-width-medium-3-5{flex-grow:3}
.md-legacy .uk-width-medium-1-2{flex-grow:1}
.md-legacy .uk-width-1-2.uk-width-medium-1-3{flex-grow:1}
.md-legacy .uk-pull-1-3,.md-legacy .uk-pull-2-5,.md-legacy .uk-push-2-3,.md-legacy .uk-push-3-5{width:auto}
/* 院内写真ギャラリー（.tour）: 3列 equal grid の写真タイル一覧。テキスト付き1-3列パターンとは別扱い */
.md-legacy .uk-grid.tour{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4)}
.md-legacy .uk-grid.tour>.uk-width-medium-1-3{width:auto;flex:none}
.md-legacy .uk-grid.tour a{display:block}
.md-legacy .uk-hidden-small{font:var(--type-small);color:var(--text-muted)}
@media (max-width:767px){.md-legacy .uk-grid.tour{grid-template-columns:repeat(2,1fr)}}
.md-legacy img{border-radius:var(--img-radius);filter:var(--img-filter)}
.md-legacy .center{text-align:center}
.md-legacy .mb20{margin-bottom:var(--space-4)}
.md-legacy .mb40{margin-bottom:var(--space-7)}
.md-legacy .title1{font:var(--type-h2);font-size:clamp(22px,2.2vw,28px);letter-spacing:var(--ls-heading);color:var(--text-heading);border-bottom:1px solid var(--border-default);padding-bottom:14px;margin-bottom:var(--space-5)!important}
.md-legacy .title2{font:var(--type-h3);color:var(--text-heading);margin:40px 0 20px}
.md-legacy .title3{font:var(--type-body);font-weight:var(--fw-medium);color:var(--text-heading);text-align:left}
.md-legacy dl.sheet,.md-legacy dl.sheet-dotted,.md-legacy dl.sheet-dotted2{margin:var(--space-4) 0 0;border-top:1px solid var(--border-default)}
.md-legacy dl.sheet-dotted dt,.md-legacy dl.sheet-dotted2 dt,.md-legacy dl.sheet dt{float:none;font:var(--type-small);font-weight:var(--fw-medium);color:var(--text-faint);padding-top:14px}
.md-legacy dl.sheet-dotted dd,.md-legacy dl.sheet-dotted2 dd,.md-legacy dl.sheet dd{margin:4px 0 14px;font:var(--type-body);color:var(--text-body);border-bottom:1px solid var(--border-default);padding-bottom:14px}
.md-legacy .more{margin-top:var(--space-4)}
.md-legacy .subMenu,.md-legacy .menu-page{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:12px}
.md-legacy a:visited{color:var(--error-600)}
.md-legacy a:visited:hover{color:var(--text-link-hover)}
.md-legacy .archive{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--border-default)}
.md-legacy .archive li{border-bottom:1px solid var(--border-default);padding:12px 0}
.md-legacy .bold,.md-legacy .strong{font-weight:var(--fw-bold)}
.md-legacy table{width:100%;border-collapse:collapse;margin:var(--space-5) 0}
.md-legacy table th,.md-legacy table td{padding:12px;border:1px solid var(--border-default);font:var(--type-small)}
@media (max-width:767px){
  /* SPで列数が多い表は横scroll可にする。文字は縮小しない（既存 --type-small を維持）。 */
  .md-legacy table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
.md-legacy iframe{max-width:100%;border-radius:var(--img-radius)}

/* ============ Form Visual Polish（Second Proof R1 §4） ============
 * Contact Form 7 自動生成markup（.wpcf7-form > .contactform >
 * <p class="bg">label</p><p>field</p> の反復）は変更しない。
 * 機能・送信先・validation・確認処理には一切触れず、scoped CSSのみで整える。
 */
.md-legacy .wpcf7-form{margin-top:var(--space-6)}
.md-legacy .wpcf7-form p{margin:0 0 var(--space-4)}
.md-legacy .wpcf7-form p.bg{margin:var(--space-5) 0 8px;font:var(--type-body);font-weight:var(--fw-medium);color:var(--text-heading)}
.md-legacy .wpcf7-form p.bg:first-child{margin-top:0}
.md-legacy .wpcf7-form p.bg .indispensable{margin-left:6px;font-size:11px;font-weight:var(--fw-medium);color:var(--color-secondary);letter-spacing:.02em}
.md-legacy .wpcf7-form p:has(>.indispensable){margin-top:-6px;font:var(--type-small);color:var(--text-muted)}
/* Contact R1: メッセージ欄の補足copy。labelより弱いsupplementary扱い（placeholderに依存しない）。 */
.md-legacy .wpcf7-form .cf7-field-hint{display:block;margin-top:4px;font:var(--type-small);font-weight:var(--fw-regular);color:var(--text-muted)}
.md-legacy .wpcf7-form input[type="text"],
.md-legacy .wpcf7-form input[type="tel"],
.md-legacy .wpcf7-form input[type="email"],
.md-legacy .wpcf7-form input[type="number"],
.md-legacy .wpcf7-form select{width:100%;min-height:48px;padding:0 14px;border:1px solid var(--border-default);border-radius:var(--radius-sm);font:var(--type-body);color:var(--text-body);background:#fff}
.md-legacy .wpcf7-form textarea{width:100%;min-height:160px;padding:12px 14px;border:1px solid var(--border-default);border-radius:var(--radius-sm);font:var(--type-body);color:var(--text-body);background:#fff;resize:vertical}
.md-legacy .wpcf7-form input::placeholder,
.md-legacy .wpcf7-form textarea::placeholder{color:var(--text-faint)}
.md-legacy .wpcf7-form input:focus-visible,
.md-legacy .wpcf7-form textarea:focus-visible,
.md-legacy .wpcf7-form select:focus-visible{outline:2px solid var(--color-primary);outline-offset:1px;border-color:var(--color-primary)}
.md-legacy .wpcf7-form .wpcf7-radio,
.md-legacy .wpcf7-form .wpcf7-checkbox{display:flex;flex-wrap:wrap}
.md-legacy .wpcf7-form .wpcf7-list-item{margin:0 20px 8px 0;display:inline-flex;align-items:center;gap:6px}
.md-legacy .wpcf7-form input[type="radio"],
.md-legacy .wpcf7-form input[type="checkbox"]{width:18px;height:18px;accent-color:var(--color-primary)}
.md-legacy .wpcf7-form .wpcf7-not-valid-tip{display:block;margin-top:6px;font-size:12px;color:var(--error-600)}
.md-legacy .wpcf7-form p.center{margin-top:var(--space-6)}
.md-legacy .wpcf7-form .wpcf7-submit{display:inline-flex;align-items:center;justify-content:center;min-height:var(--control-h);padding:0 40px;background:var(--color-primary);color:var(--text-on-navy);border:1px solid var(--color-primary);border-radius:var(--radius-sm);font:var(--type-body);font-weight:var(--fw-medium);cursor:pointer;transition:var(--transition-base)}
.md-legacy .wpcf7-form .wpcf7-submit:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover)}
.md-legacy .wpcf7-response-output{margin-top:var(--space-5);padding:14px 16px;border:1px solid var(--border-default);border-radius:var(--radius-sm);font:var(--type-small)}
@media (max-width:767px){
  .md-legacy .wpcf7-form input[type="text"],
  .md-legacy .wpcf7-form input[type="tel"],
  .md-legacy .wpcf7-form input[type="email"],
  .md-legacy .wpcf7-form select,
  .md-legacy .wpcf7-form textarea,
  .md-legacy .wpcf7-form .wpcf7-submit{width:100%}
}

/* ============ First Visit R2/R3（.md-fv2-*） ============
 * R2 Design Spec: docs/design-v2/FIRST-VISIT-R2-VISUAL-REFINEMENT-SPEC.md
 * R3 Design Spec: docs/design-v2/FIRST-VISIT-R3-VISUAL-POLISH-SPEC.md
 * （Task Spec: docs/tasks/2026-09-15_1055_first-visit-r3.md）
 * R3ではIntro改行/Typography・FLOW左揃え・FIRST VISIT 4カラム廃止（Group Header + 3 Step）・
 * FAQ 6問化・末尾導線のConcept統一を行った。
 * R1 の .md-fv-*（no card / rail-lessな等分3列・単純横罫line 04–06）は撤去済み。
 */

/* --- Intro editorial split（R2 Spec §4 / R3 Spec §3） --- */
/* R3: 2行目「自分の歯で過ごすために。」が3行化しないよう、左カラム比率を広げ letter-spacing・
 * font-size上限を調整（単純な文字縮小のみで解決しない）。 */
.md-fv2-intro{display:grid;grid-template-columns:minmax(0,44fr) minmax(0,56fr);gap:clamp(24px,3.6vw,48px);align-items:start}
.md-fv2-intro__title{font:var(--type-h2);font-size:clamp(24px,2.4vw,30px);line-height:1.5;letter-spacing:.01em;color:var(--text-heading);margin:0}
.md-fv2-intro__rule{display:block;width:48px;height:2px;background:var(--color-secondary);margin-top:var(--space-5)}
/* R3 Spec §3.2: Intro本文は18px（--type-body-l）から通常本文16px/lh約1.9へ。 */
.md-fv2-intro__body{font:var(--type-body);color:var(--text-body)}
.md-fv2-intro__body p{margin:0 0 1em}
.md-fv2-intro__body .md-text-link{margin-top:var(--space-4)}

/* R3 Typography audit: FLOW introのleadは共有 .md-section-heading__lead（18px、
 * 他ページで使用中のため共有token自体は変更しない）から局所的に16pxへ上書きする。 */
.md-fv2-flow-heading .md-section-heading__lead{font:var(--type-body)}

/* --- FIRST VISIT group（R3 Spec §6: 4カラムrailを廃止し Group Header + 3 Step へ） --- */
.md-fv2-group{background:var(--surface-tint);padding:clamp(32px,4vw,56px) clamp(24px,4vw,48px);margin-top:var(--space-heading-gap)}
.md-fv2-group__header{max-width:640px}
.md-fv2-group__eyebrow{font:var(--type-eyebrow);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--color-secondary)}
.md-fv2-group__header-row{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 20px;margin-top:10px}
.md-fv2-group__title{font:var(--type-h2);font-size:clamp(24px,2.4vw,30px);color:var(--text-heading);margin:0}
.md-fv2-group__time{display:inline-flex;align-items:center;gap:6px;font:var(--type-small);font-weight:var(--fw-medium);color:var(--text-muted)}
.md-fv2-group__time svg{flex:0 0 auto}
.md-fv2-group__rule{display:block;width:32px;height:1px;background:var(--border-strong);margin-top:var(--space-5)}
.md-fv2-group__lead{margin-top:var(--space-4);font:var(--type-body);color:var(--text-muted);max-width:46em}

/* 01〜03: 完全な等幅3カラム（R4 Spec §1）。列間の分離はgrid gapのみとし、
 * 左padding / 縦borderは撤去する（card/装飾は追加しない）。 */
.md-fv2-steps{list-style:none;margin:clamp(32px,4vw,48px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0 clamp(24px,3vw,40px)}
.md-fv2-step__no{display:block;font-family:var(--font-num);font-size:clamp(28px,3vw,36px);font-weight:var(--fw-medium);color:var(--color-secondary);line-height:1}
.md-fv2-step__title{display:block;font:var(--type-h3);font-size:16px;color:var(--text-heading);margin-top:10px}
.md-fv2-step__photo{margin-top:var(--space-4)}
/* R3 Spec §6: Step bodyは16px（旧 --type-small = 14pxから変更）。 */
.md-fv2-step__body{margin-top:var(--space-3);font:var(--type-body);color:var(--text-body)}

/* End marker: R3で同じ淡色FIRST VISIT surface内（.md-fv2-group内）に戻す。alert box化しない。 */
.md-fv2-end{margin-top:clamp(32px,4vw,48px);padding-top:clamp(24px,3vw,32px);border-top:1px solid var(--border-default)}
.md-fv2-end__title{font:var(--type-h3);font-size:18px;color:var(--text-heading);margin:0}
.md-fv2-end__body{margin-top:8px;font:var(--type-body);color:var(--text-muted)}

/* --- FAQ split（R2 Spec §7 / R3 Spec §7: 6問化 + 検査詳細） --- */
.md-fv2-faq{display:grid;grid-template-columns:minmax(0,29fr) minmax(0,71fr);gap:clamp(32px,4vw,56px);align-items:start}
.md-fv2-faq__title{font:var(--type-h2);font-size:clamp(22px,2.2vw,28px);letter-spacing:var(--ls-heading);color:var(--text-heading);margin:14px 0 0}
.md-fv2-faq__body .md-faq{max-width:none}

/* 検査詳細FAQ（R3 Spec §7）: plain long paragraphにせず、検査名 + 短い説明のstructured list。
 * native <details>/<summary>のkeyboard accessibilityは mdrw_faq() の既存マークアップを維持
 * （.md-faq__a-content は html フラグ付きanswer専用の追加wrapper。既存FAQは影響を受けない）。 */
.md-faq__a .md-fv2-faq-detail__intro{margin:0 0 1em}
.md-fv2-faq-detail__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-4)}
.md-fv2-faq-detail__item{padding-top:var(--space-4);border-top:1px solid var(--border-default)}
.md-fv2-faq-detail__item:first-child{padding-top:0;border-top:0}
.md-fv2-faq-detail__name{display:block;font-weight:var(--fw-medium);color:var(--text-heading);font-size:16px}
.md-faq__a .md-fv2-faq-detail__desc{margin:4px 0 0;font:var(--type-body);color:var(--text-muted)}
.md-fv2-faq-detail__sublist{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.md-fv2-faq-detail__sublist li{font:var(--type-body);color:var(--text-muted)}
.md-fv2-faq-detail__sublist strong{color:var(--text-heading);font-weight:var(--fw-medium)}

/* --- AFTER THE FIRST VISIT asymmetric grid（§8） --- */
.md-fv2-after{display:grid;grid-template-columns:minmax(0,26fr) minmax(0,74fr);gap:clamp(32px,4vw,56px)}
.md-fv2-after__eyebrow{font:var(--type-eyebrow);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--color-secondary)}
.md-fv2-after__title{font:var(--type-h2);font-size:clamp(26px,2.6vw,34px);color:var(--text-heading);margin:10px 0 0}
.md-fv2-after__rule{display:block;width:32px;height:1px;background:var(--border-strong);margin-top:var(--space-5)}
/* R3 Typography audit: section説明文は通常本文16pxへ（旧--type-small=14pxから変更）。 */
.md-fv2-after__lead{margin-top:var(--space-4);font:var(--type-body);color:var(--text-muted)}

.md-fv2-after__rows{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:clamp(40px,5vw,64px)}
.md-fv2-after__row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,40px);align-items:center}
.md-fv2-after__row--photo-text{grid-template-columns:1fr 1fr}
.md-fv2-after__row--photo-text .md-fv2-after__text{order:2}
.md-fv2-after__row--photo-text .md-fv2-after__photo{order:1}
.md-fv2-after__no{display:block;font-family:var(--font-num);font-size:clamp(24px,2.4vw,30px);font-weight:var(--fw-medium);color:var(--color-secondary);line-height:1}
.md-fv2-after__row-title{font:var(--type-h3);font-size:17px;color:var(--text-heading);margin:8px 0 0}
.md-fv2-after__text p{margin:.8em 0 0;font:var(--type-body);color:var(--text-body)}

/* --- Related Pages（R3 Spec §9） ---
 * R2の写真付きFirst Visit専用3panelは撤去。ページ末尾導線はConceptと同じ
 * .md-concept-next（page-concept.php / subpages.css）をそのまま再利用し、
 * First Visit専用CSSは複製しない。 */

/* ============ レスポンシブ（1024px / 767px） ============ */
@media (max-width:1024px){
  /* 写真ありHero: text を先に読ませ、media は下へ。SP に丸ごと1画面の余白を作らない。 */
  .md-page-hero--with-media .md-page-hero__inner{grid-template-columns:1fr;gap:var(--space-6)}
  .md-page-hero--with-media .md-page-hero__media{max-width:340px}
  .md-page-hero--with-media.md-page-hero--center .md-page-hero__media{margin-inline:auto}

  /* Director Profile + Message: 1024pxでは2カラムが狭くなりすぎるため縦積みへ
   * （Design Spec §9 / Task Spec §8 の1024px確認事項）。SP用複製画像はまだ出さず、
   * PC用の右カラム画像列をそのまま本文下へ落とす。 */
  .md-director-top__inner{grid-template-columns:1fr;gap:var(--space-7)}
  .md-director-top__media{position:static;max-width:420px;margin-top:var(--space-7)}

  /* First Visit R2/R3: 1024pxではIntro / FAQ / AFTER の左rail比率を保ったまま詰まりすぎない
   * よう余白のみ調整する（R3 Spec §11 Tablet確認事項）。767px未満で縦積みへ。 */
  .md-fv2-intro{gap:clamp(20px,3vw,32px)}
  .md-fv2-group{padding:var(--space-6) clamp(20px,4vw,32px)}
  .md-fv2-faq{grid-template-columns:minmax(0,32fr) minmax(0,68fr)}
  .md-fv2-after{grid-template-columns:minmax(0,30fr) minmax(0,70fr)}
  .md-fv2-after__row{grid-template-columns:1fr}
  .md-fv2-after__row--photo-text .md-fv2-after__text{order:1}
  .md-fv2-after__row--photo-text .md-fv2-after__photo{order:2}

  /* R3 Spec §11 Tablet: FIRST VISIT 3 Stepは1080px fieldが狭くなるため2カラム+末尾1列へ
   * recomposeする（PC 3列の単純縮小にしない）。 */
  .md-fv2-steps{grid-template-columns:repeat(2,1fr)}
  .md-fv2-step:nth-child(3){grid-column:1 / -1;padding-left:0;border-left:0;margin-top:clamp(24px,3vw,32px);padding-top:clamp(24px,3vw,32px);border-top:1px solid var(--border-default)}
}
@media (max-width:767px){
  .md-page-hero{padding-top:var(--space-7);padding-bottom:var(--space-7)}
  /* Client Feedback R3 §5.1: SP H1は28-32px程度。Heroを巨大化して解決しない。 */
  .md-page-hero__title{font-size:clamp(28px,7.4vw,32px)}
  .md-gallery{grid-template-columns:1fr!important}
  .md-step-list__item{gap:16px!important}

  /* First Visit R2/R3 SP（R3 Spec §6 SP composition / §11）: FIRST VISIT → 初診当日 →
   * 約90分 → intro → 01 → 02 → 03 → ここまでが初診当日、の自然な縦読みへ再構成する。
   * PC 3列を単純縮小せず、写真は各Step見出し直下で十分なscaleを確保する。 */
  .md-fv2-intro{grid-template-columns:1fr;gap:var(--space-6)}
  .md-fv2-group{padding:var(--space-6) 20px}
  .md-fv2-steps{grid-template-columns:1fr;gap:var(--space-6) 0;margin-top:var(--space-6)}
  .md-fv2-step,
  .md-fv2-step:nth-child(3){padding-left:0;border-left:0;padding-top:var(--space-6);border-top:1px solid var(--border-default);grid-column:auto;margin-top:0}
  .md-fv2-step:first-child{padding-top:0;border-top:0}
  .md-fv2-end{padding-top:var(--space-5);margin-top:var(--space-6)}

  /* FAQ SP: left heading rail を先に、右accordionをそのまま縦積み。 */
  .md-fv2-faq{grid-template-columns:1fr;gap:var(--space-5)}

  /* AFTER THE FIRST VISIT SP: PCのzigzagを無理に維持せず、写真と本文の対応を保ったまま
   * number+見出し→body→photo の順で自然に再構成する（Design Spec §8 SP）。 */
  .md-fv2-after{grid-template-columns:1fr;gap:var(--space-6)}
  .md-fv2-after__rows{gap:var(--space-7)}
  .md-fv2-after__row,
  .md-fv2-after__row--photo-text{grid-template-columns:1fr}
  .md-fv2-after__row--photo-text .md-fv2-after__text,
  .md-fv2-after__row--photo-text .md-fv2-after__photo{order:initial}

  /* Legacy写真+本文2カラムはSPで1カラムへ再構成する（Second Proof R1 §2.2）。
   * 旧 width:140px 固定は撤回し、通常写真はcontent widthを十分使う。
   * Before/Afterのみ比較の意味を保つため2カラムを維持する（§2.3）。 */
  .md-legacy .uk-grid{flex-direction:column}
  .md-legacy .uk-grid>div{flex-basis:auto;width:100%;max-width:none}
  .md-legacy .uk-grid:has(.uk-width-1-2.uk-width-medium-1-3){flex-direction:row;flex-wrap:wrap;gap:var(--space-4)}
  .md-legacy .uk-width-1-2.uk-width-medium-1-3{flex:1 1 0;width:auto}

  /* Related Pages SP: .md-concept-next の既存SP grammarをそのまま利用（複製しない）。 */

  /* Director Profile + Message SP（Design Spec §9）: PC専用の右カラムを丸ごと1画面の
   * 縦積みにせず、意味順で入れ替える。基本プロフィール直後にportrait、学びの原点
   * （小見出し2）直後にtreatment photoを挿入し、SP専用複製画像だけを表示する。 */
  .md-director-top__media{display:none}
  .md-director-top__portrait--sp,.md-director-top__treatment--sp{display:block}
  .md-director-top__portrait--sp{margin-top:var(--space-6);max-width:280px}
  .md-director-top__treatment--sp{margin:var(--space-8) 0 0}

  /* Compact Information / Historical Directors: SPは1列。参照情報のsection paddingは
   * 前後と同一値にしない（§9 SP requirements）。 */
  .md-director-compact{padding-block:var(--space-6)}
  .md-director-compact__inner{grid-template-columns:1fr;gap:var(--space-7)}
  .md-director-history{padding-block:var(--space-6)}
  .md-director-history__grid{grid-template-columns:1fr;gap:var(--space-7)}
}
