/*
 * 診療メニュー（single-medical.php・約80ページ）と、同じブロックで組んだ固定ページ（page.php：よくあるご質問・初診の方へ・
 * 大腸ポリープの良性・悪性の違い・施設基準・プライバシーポリシー）の見た目。
 * 読み込み：nn_page_css( 'medical' )（tokens.css → ds.css → common/style.css のあと）
 *
 * 正：Figma の型（インフルエンザ 1505:132174・胃カメラ検査 1590:197378・よくあるご質問 1506:179641・初診の方へ 1506:186036・
 *     プライバシーポリシー 1604:216641）の design.json の位置・大きさ・色・字。色・字・幅は tokens.css の var(--…)
 * 並び（template-parts/medical/layout.php）：
 *   .p-medPage（-photo 写真の帯あり／-plain 写真なし／-doc 規約の形）
 *     .p-medHero（写真の帯）→ .p-medPage__sheet［.p-medCrumb パンくず → .p-medTitle 題名 → .p-medPage__body］
 *     .p-medPage__body：__lead 導入文 → __band 予約の帯 → __tabs → .p-medToc 目次 → __content 本文の節 → .p-medCtaLead → __tail
 *   .p-medPage__cta（下の予約の帯。共通部品 nn-cta）
 * 本文のブロック：.p-medSec（-text・-box・-faq・-table・-cta・-cta2）の中に h2・段落・リスト（is-style-check・p-medLinks…）・
 *   表（.wp-block-table -even・-c1w250・-w1120）・画像・ボタン（is-style-ext）・詳細（FAQ）・p-medMedia・p-medCard ほか
 * 元のテーマ（Arkhe）の CSS は読み込まないので、本文のブロックの見た目もここで作る。
 * 中間の幅（768〜1199）は PC の並びのまま幅を縮め、767 以下で SP の並びにする。
 */

/* ===================================================================
 * 0. 下地・幅
 * =================================================================== */
.nn-main--medical {
	--med-gutter: 40px;          /* 画面の端との余白（1200 未満） */
	--med-inner: var(--w-inner); /* 1120 */
	--med-text: var(--w-text);   /* 960 */
	--med-sec-gap: 80px;         /* 節と節の間 */
	--med-lh: 1.625;             /* 本文 16px の行の高さ。Figma の 160% は 1行 26px で描かれる（25.6 ではない） */
	display: block;
	background: var(--color-background-main);
	color: var(--color-text-primary);
}
.p-medPage { position: relative; }
/* グループのブロックの内側の箱（theme.json の無いテーマで WordPress が足す）。並べ方は外側の箱で決める */
:is(.p-medCard, .p-medDiseases, .p-medTel) > .wp-block-group__inner-container { display: contents; }
.p-medPage__sheet {
	position: relative;
	padding-inline: var(--med-gutter);
	background: var(--color-background-main);
}
.p-medPage__sheet > * { max-width: var(--med-inner); margin-inline: auto; }
.p-medPage__body { padding-bottom: 120px; }
.p-medPage__body > * + * { margin-top: 40px; }
.p-medPage__body > .p-medPage__content { margin-top: var(--med-sec-gap); }
.p-medPage__body > :first-child { margin-top: 0; }
.p-medPage__body > .p-medCtaLead { margin-top: var(--med-sec-gap); }

/* 節の見出しへ飛んだとき、上に少し余白（SP は固定のメニューボタンに隠れない位置） */
.p-medPage :is(h2, h3)[id], .p-medFlow[id] { scroll-margin-top: 24px; }

/* ===================================================================
 * 1. 題名の帯・写真あり（Subpage Hero 1852:86103：1440×500・文字は左 160・上下中央）
 * =================================================================== */
.p-medHero {
	position: relative;
	display: flex;
	align-items: center;
	height: 500px;
	padding-inline: max(var(--med-gutter), 50% - 560px);
	overflow: hidden;
	background: var(--color-extra-665041);
	isolation: isolate;
}
.p-medHero__img {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
}
.p-medHero::before { /* 写真の上に薄い茶色（#665041・20%） */
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: rgb(102 80 65 / .2);
}
.p-medHero__ttl {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0 0 27px; /* 下のシートが 27px 重なる分、文字の中央を上へ */
	color: var(--color-white);
	text-shadow: 0 0 7.6px #715a5a;
}
.p-medHero__en {
	font: 400 24px/1 var(--font-family-latin);
	letter-spacing: .05em;
}
.p-medHero__main {
	font: 800 42px/1 var(--font-family-heading);
	letter-spacing: .1em;
}
.p-medHero__sub { font-size: 32px; }
/* 写真の帯のあとのシート：上の角丸 30px で写真に 27px 重ねる（Figma の Main y=635） */
.p-medPage.-photo .p-medPage__sheet {
	margin-top: -27px;
	border-radius: 30px 30px 0 0;
}
.p-medPage.-photo .p-medCrumb + .p-medPage__body { padding-top: 100px; }

/* ===================================================================
 * 2. パンくず（1855:219296）
 * =================================================================== */
.p-medCrumb { padding-top: 20px; }
.p-medCrumb__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
	font: 500 14px/1 var(--font-family-body);
	letter-spacing: .1em;
}
.p-medCrumb__item { display: flex; align-items: center; min-height: 64px; }
.p-medCrumb__item + .p-medCrumb__item::before { /* 区切りの矢印 13×26（左右 10px） */
	content: "";
	flex: none;
	width: 13px;
	height: 26px;
	margin-inline: 10px;
	background: url("icons/crumb-sep.svg") center / contain no-repeat;
}
.p-medCrumb__link {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--color-text-primary);
	text-decoration: none;
	transition: color var(--ds-ease);
}
.p-medCrumb__link.-home { min-width: 44px; margin-inline: -10px; justify-content: center; } /* 見た目 24px・押せる所 44px */
.p-medCrumb__item + .p-medCrumb__item { pointer-events: none; } /* 次の項目の矢印がホームの押せる範囲に重ならない（リンクは下で戻す） */
.p-medCrumb__link { pointer-events: auto; }
.p-medCrumb__homeIcon {
	display: block;
	width: 24px;
	height: 24px;
	background: url("icons/crumb-home.svg") center / contain no-repeat;
}
.p-medCrumb__item.-current .p-medCrumb__text { color: var(--color-extra-939393); }
.p-medCrumb__sr {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
@media (hover: hover) and (min-width: 768px) {
	.p-medCrumb__link:hover { color: var(--color-brand-orange-dark); }
	.p-medCrumb__link.-home:hover { opacity: .7; }
}

/* ===================================================================
 * 3. 題名・写真なし（Subpage Header：上 60・題名 42px・30px 下に 200×2 の線・下 100）
 * =================================================================== */
.p-medTitle { padding: 60px 0 100px; text-align: center; }
.p-medTitle__ttl {
	margin: 0;
	font: 800 42px/1 var(--font-family-heading);
	letter-spacing: .1em;
	color: var(--color-brand-orange-dark);
}
.p-medTitle__ttl::after {
	content: "";
	display: block;
	width: 200px;
	height: 2px;
	margin: 30px auto 0;
	border-radius: 50px;
	background: var(--color-brand-orange);
}
.p-medTitle__sub { font-size: 32px; }

/* ===================================================================
 * 4. 導入文（960・中央揃え・#333・16px/200%）と途中の予約の帯
 * =================================================================== */
.p-medPage__lead { max-width: var(--med-text); margin-inline: auto; }
.p-medLead {
	margin: 0;
	font: var(--font-pc-lead);
	letter-spacing: var(--ls-pc-lead);
	color: var(--color-text-secondary);
	text-align: center;
}
.p-medLead + .p-medLead { margin-top: 20px; }
/* 途中の予約の帯：共通部品の帯だけ（下のフッターの白い地は出さない） */
.p-medPage__band .nn-cta { padding-bottom: 0; }
.p-medPage__band .nn-cta::before { content: none; }
.p-medPage__band .nn-cta-band { width: 100%; margin-inline: auto; }

/* ===================================================================
 * 5. 目次（Index：白・角丸 10・影・内側 18 40 38・2列 500・項目 56）
 * =================================================================== */
.p-medToc {
	padding: 18px 40px 38px;
	border-radius: 10px;
	background: var(--color-white);
	box-shadow: 0 0 10px rgb(109 97 61 / .15);
}
.p-medToc__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 40px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.p-medToc__link {
	display: flex;
	align-items: center;
	gap: 6px;
	min-height: 56px;
	padding: 7px 14px 7px 3px;
	border-bottom: 1px dashed var(--color-brand-orange);
	color: var(--color-text-primary);
	text-decoration: none;
	font: 400 16px/1.2 var(--font-family-body);
	letter-spacing: .1em;
	transition: color var(--ds-ease);
}
.p-medToc__label { flex: 1; min-width: 0; }
.p-medToc__arrow {
	flex: none;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--color-white) url("icons/toc-arrow.svg") center / 16px no-repeat;
	transition: background-color var(--ds-ease);
}
@media (hover: hover) and (min-width: 768px) {
	.p-medToc__link:hover { color: var(--color-brand-orange-dark); }
	.p-medToc__link:hover .p-medToc__arrow { background-color: var(--color-brand-orange-light); }
}

/* ===================================================================
 * 6. 節（h2デザインテンプレート：見出し → 32 → 中身。節の間 80）
 * =================================================================== */
.p-medPage__content > * { margin-block: 0; }
.p-medPage__content > * + * { margin-top: var(--med-sec-gap); }
.p-medPage__content > p + p { margin-top: 20px; } /* 節の後ろの段落（規約の制定日・以上 など） */
.p-medPage__content > p { font: var(--font-pc-body); letter-spacing: var(--ls-pc-body); line-height: var(--med-lh); }
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >* { margin-block: 0; }
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >* + * { margin-top: 12px; }
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >h2 + * { margin-top: 32px; }
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >* + :is(.wp-block-buttons, .p-medConsult, .p-medFlow, .p-medCard, .p-medDiseases, .p-medTel, .wp-block-details, .p-medMedia) { margin-top: 32px; }
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >.wp-block-details + .wp-block-details { margin-top: 16px; }
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >.p-medCard,
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >.p-medCard + * { margin-top: 24px; }
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >h2 + .p-medCard { margin-top: 32px; }

/* h2：上に灰色の線（1px）＋左にオレンジの線（100×2）→ 16 → 28px の見出し */
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >h2,
.p-medPage__prose h2 {
	position: relative;
	padding-top: 19px;
	border-top: 1px solid var(--color-extra-939393);
	font: var(--ds-h2-pc);
	letter-spacing: var(--ds-h2-pc-ls);
	color: var(--color-brand-orange-dark);
}
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >h2::before,
.p-medPage__prose h2::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100px;
	height: 2px;
	border-radius: 0 0 50px 50px;
	background: var(--color-brand-orange-dark);
}
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >h2 { max-width: 100%; }

/* まとまりの大きな見出し（h2見出し：中央・36px＋英字 24px。企業健診） */
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >h2.p-medGroupTtl {
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	gap: 8px;
	padding-top: 0;
	border-top: 0;
	font: var(--ds-h2-large-pc);
	letter-spacing: var(--ds-h2-large-pc-ls);
	color: var(--color-text-primary);
	text-align: center;
}
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >h2.p-medGroupTtl::before { content: none; }
.p-medGroupTtl__en {
	font: var(--ds-en-pc);
	letter-spacing: var(--ds-en-pc-ls);
	color: var(--color-brand-gold-light);
}

/* 本文の字（16px/160%・字間 10%）。幅は節の中 954（Figma の内側の余白 3） */
.p-medSec,
.p-medPage__prose,
.p-medCtaLead,
.p-medPage__tail,
.p-medFlow__text {
	font: var(--font-pc-body);
	letter-spacing: var(--ls-pc-body);
	line-height: var(--med-lh);
}
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >:is(p, ul, ol),
:is(.p-medCard, .p-medCard > .wp-block-group__inner-container) >:is(p, ul, ol) { max-width: 954px; }
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >:is(p, ul, ol, h3, .wp-block-buttons) { margin-inline: 3px; }
.p-medSec p,
.p-medPage__prose p { margin-block: 0; }
.p-medSec strong { font-weight: 700; }
.p-medSec a:not([class]),
.p-medPage__prose a:not([class]),
.p-medPage__tail a:not([class]) {
	color: var(--color-text-link);
	text-decoration: underline;
	text-underline-offset: .2em;
}

/* 小見出し（h3：左に 4×28 のオレンジの線・20px） */
.p-medSec h3,
.p-medPage__prose h3 {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-block: 0;
	font: var(--ds-h3-pc);
	letter-spacing: var(--ds-h3-pc-ls);
	color: var(--color-text-primary);
}
.p-medSec h3::before,
.p-medPage__prose h3::before {
	content: "";
	flex: none;
	align-self: stretch;
	width: 4px;
	min-height: 28px;
	border-radius: 1px;
	background: var(--color-brand-orange);
}
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >* + h3 { margin-top: 32px; }
.p-medSec h4 { margin-block: 0; font: var(--ds-h4-pc); letter-spacing: var(--ds-h4-pc-ls); color: var(--ds-h4-color); }

/* 注記（Figma の 12px。-s14 は 14px） */
.p-medNote { font: 400 12px/1.6 var(--font-family-body); letter-spacing: .05em; }
.p-medNote.-s14 { font: var(--font-pc-body-small); letter-spacing: var(--ls-pc-body-small); }

/* 余白のブロック（Figma の空の枠） */
.p-medSec .wp-block-spacer { margin: 0; }

/* ===================================================================
 * 7. リスト
 * =================================================================== */
/* ■リスト：8px のオレンジの四角・文は 16px 右 */
.p-medSec ul:not([class*="p-med"]):not(.is-style-check),
.p-medCard ul:not([class*="p-med"]):not(.is-style-check),
.p-medPage__prose ul,
.wp-block-details ul:not([class*="p-med"]):not(.is-style-check) {
	padding: 0 2px;
	list-style: none;
}
.p-medSec ul:not([class*="p-med"]):not(.is-style-check) > li,
.p-medCard ul:not([class*="p-med"]):not(.is-style-check) > li,
.p-medPage__prose ul > li,
.wp-block-details ul:not([class*="p-med"]):not(.is-style-check) > li {
	position: relative;
	padding-left: 16px;
}
.p-medSec ul:not([class*="p-med"]):not(.is-style-check) > li::before,
.p-medCard ul:not([class*="p-med"]):not(.is-style-check) > li::before,
.p-medPage__prose ul > li::before,
.wp-block-details ul:not([class*="p-med"]):not(.is-style-check) > li::before {
	content: "";
	position: absolute;
	top: calc((1lh - 8px) / 2);
	left: 0;
	width: 8px;
	height: 8px;
	background: var(--color-brand-orange);
}
.p-medSec ul > li + li,
.p-medCard ul > li + li,
.p-medPage__prose ul > li + li { margin-top: 4px; }

/* 規約の形（プライバシーポリシー）：Figma の文字の箇条書き（・）。点・字下げのみで行の間は空けない */
.p-medPage.-doc .p-medSec ul:not([class*="p-med"]) > li,
.p-medPage.-doc .p-medCard ul:not([class*="p-med"]) > li { padding-left: 1.4em; }
.p-medPage.-doc .p-medSec ul:not([class*="p-med"]) > li::before,
.p-medPage.-doc .p-medCard ul:not([class*="p-med"]) > li::before {
	top: calc((1lh - 4px) / 2);
	left: .55em;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: currentColor;
}
.p-medPage.-doc ul > li + li { margin-top: 0; }

/* 番号のリスト */
.p-medSec ol:not([class*="p-med"]),
.p-medPage__prose ol {
	padding-left: 1.6em;
}
.p-medSec ol:not([class*="p-med"]) > li::marker,
.p-medPage__prose ol > li::marker { color: var(--color-brand-orange-dark); font-family: var(--font-family-latin); }

/* 症状リスト（is-style-check）：淡いオレンジの箱（角丸 10・内側 20 40）・チェックの印 20px */
.p-medSec ul.is-style-check,
ul.is-style-check {
	display: grid;
	gap: 4px;
	max-width: none;
	margin-inline: 0;
	padding: 20px 40px;
	border-radius: 10px;
	background: var(--color-background-sub);
	list-style: none;
}
ul.is-style-check > li {
	position: relative;
	margin: 0;
	padding-left: 24px;
	line-height: var(--med-lh);
}
ul.is-style-check.-lh22 > li,
ul.is-style-check > li.-h22 { line-height: 1.375; }
ul.is-style-check.-lh22 > li.-h26 { line-height: var(--med-lh); }
ul.is-style-check > li::before {
	content: "";
	position: absolute;
	top: calc((1lh - 20px) / 2);
	left: 0;
	width: 20px;
	height: 20px;
	background: url("icons/check.svg") center / contain no-repeat;
}
ul.is-style-check > li + li { margin-top: 0; }
ul.is-style-check.-col2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; }
/* 小見出し＋症状リストが続くとき（睡眠時無呼吸症候群など）：見出しごと1つの淡いオレンジの箱に入れる */
.nn-main--medical :is(.p-medSec, .p-medSec > .wp-block-group__inner-container) > h3:has(+ ul.is-style-check) {
	max-width: none;
	margin-inline: 0;
	padding: 20px 40px 12px;
	border-radius: 0;
	background: var(--color-background-sub);
}
.nn-main--medical :is(.p-medSec, .p-medSec > .wp-block-group__inner-container) > :not(ul.is-style-check) + h3:has(+ ul.is-style-check) { border-radius: 10px 10px 0 0; }
.nn-main--medical :is(.p-medSec, .p-medSec > .wp-block-group__inner-container) > ul.is-style-check + h3:has(+ ul.is-style-check) { margin-top: 0; padding-top: 12px; }
.nn-main--medical :is(.p-medSec, .p-medSec > .wp-block-group__inner-container) > h3 + ul.is-style-check { margin-top: 0; padding-top: 0; border-radius: 0; }
.nn-main--medical :is(.p-medSec, .p-medSec > .wp-block-group__inner-container) > h3 + ul.is-style-check:not(:has(+ h3 + ul.is-style-check)) { border-radius: 0 0 10px 10px; }
.nn-main--medical :is(.p-medSec, .p-medSec > .wp-block-group__inner-container) > h3 + ul.is-style-check:has(+ h3 + ul.is-style-check) { padding-bottom: 8px; }

/* 番号＋太字の見出し＋説明（p-medNumList） */
.p-medNumList {
	display: grid;
	gap: 16px;
	margin-block: 0;
	padding: 0;
	list-style: none;
}
.p-medNumList > li { margin: 0; }
.p-medNumList strong { color: var(--color-brand-orange-dark); font-family: var(--font-family-heading); font-size: 18px; }

/* 疾患・案内のリンクの並び（p-medLinks。リンク先が無いものは文字だけ） */
/* Figma「Symptom Link／Small」：4列 220・列の間 53・高さ 40・14px・下に #f3d0b8 の線・右に 16px の丸い矢印 */
.p-medLinks {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px 53px;
	margin-block: 0;
	padding: 0;
	list-style: none;
}
.p-medLinks > li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-height: 40px;
	margin: 0;
	padding: 4px 0;
	border-bottom: 1px solid var(--color-brand-orange-light);
	font: 400 14px/1.2 var(--font-family-body);
	letter-spacing: .1em;
}
.p-medLinks > li + li { margin-top: 0; }
.p-medLinks > li::after {
	content: "";
	flex: none;
	width: 16px;
	height: 16px;
	background: url("icons/btn-ext.svg") center / contain no-repeat;
}
.p-medLinks > li > a { flex: 1; color: inherit; text-decoration: none; }
/* 切り替えのタブ（企業健診） */
.p-medLinks.-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; }
.p-medLinks.-tabs > li {
	justify-content: center;
	min-height: 60px;
	border: 1px solid var(--color-brand-orange);
	background: var(--color-white);
	font: 700 18px/1.4 var(--font-family-heading);
	letter-spacing: .05em;
	color: var(--color-brand-orange-dark);
	text-align: center;
}
.p-medLinks.-tabs > li:first-child { border-radius: 10px 0 0 10px; background: var(--color-brand-orange); color: var(--color-white); }
.p-medLinks.-tabs > li:last-child { border-radius: 0 10px 10px 0; }
.p-medLinks.-tabs > li::after { content: none; }

/* 病気のリンクの白い箱（p-medDiseases：小見出し＋4列のリンク） */
.p-medDiseases {
	display: grid;
	gap: 16px;
	padding: 40px;
	border-radius: 10px;
	background: var(--color-white);
}
:is(.p-medDiseases, .p-medDiseases > .wp-block-group__inner-container) >* { margin: 0; }
:is(.p-medDiseases, .p-medDiseases > .wp-block-group__inner-container) >h3::before { content: none; }
:is(.p-medDiseases, .p-medDiseases > .wp-block-group__inner-container) >h3 { color: var(--color-brand-orange-dark); font-size: 18px; }
:is(.p-medDiseases, .p-medDiseases > .wp-block-group__inner-container) >* + h3 { margin-top: 16px; }

/* 縦書きの順番の図（p-medArrowSteps：企業健診の受診前と当日の案内） */
.p-medArrowSteps {
	display: flex;
	flex-direction: row-reverse;
	justify-content: center;
	gap: 40px;
	margin-block: 0;
	padding: 0;
	list-style: none;
}
.p-medArrowSteps > li {
	position: relative;
	padding: 24px 16px;
	border-radius: 10px;
	background: var(--color-white);
	writing-mode: vertical-rl;
	line-height: 1.8;
}
.p-medArrowSteps > li + li::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 100%;
	width: 40px;
	height: 14px;
	translate: 0 -50%;
	rotate: 90deg;
	background: url("icons/flow-arrow.svg") center / contain no-repeat;
}

/* 文献の番号つき一覧（__tail） */
.p-medRefs { margin: 0; padding-left: 1.6em; font: 400 14px/1.6 var(--font-family-body); letter-spacing: .05em; max-width: 960px; }   /* Figma（にんにく注射 1506:176830）：14px・行 160%・字間 5%・幅 960 */
.p-medCtaLead + .p-medPage__tail:has(> .p-medRefs:first-child) { margin-top: 80px; }   /* Figma：写真の下から 80 あけて文献 */

/* 見出し＋値の1行（住所 〒116-… など） */
/* Figma：見出しの欄 60・値は 5 右・行の高さ 120%・行の間 5 */
.p-medKv { display: grid; grid-template-columns: 60px minmax(0, 1fr); column-gap: 5px; line-height: 1.2; }
:is(.p-medCard, .p-medCard > .wp-block-group__inner-container) > .p-medKv + .p-medKv { margin-top: -7px; }
.p-medKv strong { font-weight: 700; }

/* ===================================================================
 * 8. 本文＋画像（p-medMedia：文 → 56 → 写真 400×300・角丸 5。-narrow は幅 960）
 * =================================================================== */
.p-medMedia {
	position: relative;
	display: flow-root;
	min-height: 300px;
	padding: 0 459px 0 3px;
}
:is(.p-medMedia, .p-medMedia > .wp-block-group__inner-container) >* { margin-block: 0; }
:is(.p-medMedia, .p-medMedia > .wp-block-group__inner-container) >* + * { margin-top: 12px; }
:is(.p-medMedia, .p-medMedia > .wp-block-group__inner-container) >.wp-block-image {
	position: absolute;
	top: 0;
	right: 3px;
	width: 400px;
	margin: 0;
}
:is(.p-medMedia, .p-medMedia > .wp-block-group__inner-container) >.wp-block-image img {
	display: block;
	width: 400px;
	height: 300px;
	border-radius: 5px;
	object-fit: cover;
}
.p-medMedia.-narrow { max-width: var(--med-text); margin-inline: 0; }   /* Figma の「デザインテンプレート/切り替え」960 は節の左（x 160）にそろう。中央にしていて 80px 右だった（6ページ。2026-10-26） */

/* 本文の中の画像（漫画など） */
.p-medSec .wp-block-image,
.p-medCard .wp-block-image,
.p-medPage__prose .wp-block-image { margin-inline: 0; }
.p-medSec .wp-block-image img,
.p-medPage__prose .wp-block-image img { display: block; max-width: 100%; height: auto; }

/* 漫画（小見出し＋画像の並び）：幅 954 の白い箱に入れる（Figma：見出し 3 の札。中の画像は 870 で中央） */
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >h3:has(+ .wp-block-image) {
	width: min(954px, 100%);
	margin-inline: auto;
	padding: 40px 40px 20px;
	border-radius: 10px 10px 0 0;
	background: var(--color-white);
}
/* 節の中にじかに置いた画像（漫画。Figma「h3+本文／マンガ」：白い箱 954・内側 40・画像 874）。続く画像は1つの箱にまとめる */
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >.wp-block-image {
	width: min(954px, 100%);
	margin-inline: auto;
	padding: 0 40px;
	background: var(--color-white);
}
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >:not(.wp-block-image, h3) + .wp-block-image { padding-top: 40px; border-radius: 10px 10px 0 0; }
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >:is(.wp-block-image, h3) + .wp-block-image { margin-top: 0; }
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >.wp-block-image:not(:has(+ .wp-block-image)) { padding-bottom: 40px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; }
/* 漫画の1枚：874×1414（Figma の枠。上下いっぱいに合わせ、左右の余白を切る）・薄い影 */
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >.wp-block-image img {
	width: 100%;
	aspect-ratio: 874 / 1414;
	object-fit: cover;
	box-shadow: 0 0 10px rgb(109 97 61 / .15);
}
/* 表示する大きさちょうどに作った画像（ツール/写真の合わせ.py → wp_import が class="is-fit"・width・height・srcset・余白を付ける）：
 * Figma の CROP と同じ倍率・切り取りなので、テーマでは縮めも切りもしない（狭い画面では幅に合わせて縮むだけ） */
.wp-block-image img.is-fit,
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >.wp-block-image img.is-fit { width: auto; max-width: 100%; height: auto; aspect-ratio: auto; object-fit: fill; }
@media (max-width: 767px) { .wp-block-image img.is-fit { margin: 0 !important; } }
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >.wp-block-image + h3 { margin-top: 40px; }

/* ===================================================================
 * 9. 小見出し＋本文の白い札（p-medCard：角丸 10・内側 16・間 12）
 *    段落が1つの札は本文に p-medCard の箱が無く、h3 と後ろの段落が並ぶだけなので、
 *    h3 から次の h3（か節の終わり）までを白い札に見せる（Figma「h3+本文／デフォルト」。胃潰瘍の主な原因など）
 * =================================================================== */
.nn-main--medical :is(.p-medSec, .p-medSec > .wp-block-group__inner-container) > h3:not(:has(+ .wp-block-image, + ul.is-style-check)) {
	max-width: 954px;
	margin-inline: 3px;
	padding: 16px 16px 0;
	border-radius: 10px 10px 0 0;
	background: var(--color-white);
}
.nn-main--medical :is(.p-medSec, .p-medSec > .wp-block-group__inner-container) > h3:not(:has(+ .wp-block-image, + ul.is-style-check)) ~ :is(p, ul:not(.is-style-check), ol, .wp-block-buttons, .wp-block-table) {
	max-width: 954px;
	margin: 0 3px;
	padding: 12px 16px 0;
	background: var(--color-white);
}
.nn-main--medical :is(.p-medSec, .p-medSec > .wp-block-group__inner-container) > h3:not(:has(+ .wp-block-image, + ul.is-style-check)) ~ :is(p, ul:not(.is-style-check), ol, .wp-block-buttons, .wp-block-table):is(:has(+ h3), :last-child) {
	padding-bottom: 16px;
	border-radius: 0 0 10px 10px;
}
.nn-main--medical :is(.p-medSec, .p-medSec > .wp-block-group__inner-container) > :not(h2) + h3:not(:has(+ .wp-block-image, + ul.is-style-check)) { margin-top: 24px; }
.nn-main--medical :is(.p-medSec, .p-medSec > .wp-block-group__inner-container) > h3:not(:has(+ .wp-block-image, + ul.is-style-check)) ~ ul:not([class*="p-med"]):not(.is-style-check) > li { margin-left: 2px; }
.p-medCard {
	display: grid;
	gap: 12px;
	max-width: 954px;
	margin-inline: 3px;
	padding: 16px;
	border-radius: 10px;
	background: var(--color-white);
}
:is(.p-medCard, .p-medCard > .wp-block-group__inner-container) >* { margin: 0; }
:is(.p-medCard, .p-medCard > .wp-block-group__inner-container) >.wp-block-buttons { margin-top: 12px; }

/* ===================================================================
 * 10. ボタン（Button PC Basic：34px・角丸 4・左 32 右 20・明朝 18px・右に白い丸の矢印 20px）
 * =================================================================== */
.wp-block-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}
.nn-main--medical .wp-block-button__link {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 16px;
	min-height: 34px;
	padding: 0 20px 0 32px;
	border-radius: 4px;
	background: var(--color-brand-orange);
	color: var(--color-white);
	font: 400 18px/1 var(--font-family-heading);
	letter-spacing: 0;
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--ds-ease), opacity var(--ds-ease);
}
.nn-main--medical .wp-block-button__link::after {
	content: "";
	flex: none;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--color-white) url("icons/btn-arrow.svg") center / 20px no-repeat;
}
.nn-main--medical .wp-block-button__link::before { /* 押せる範囲を上下に広げる（見た目 34px → 44px） */
	content: "";
	position: absolute;
	inset: -5px 0;
}
/* PC External：オレンジの丸い印＋オレンジの字のリンク */
.nn-main--medical .is-style-ext .wp-block-button__link {
	flex-direction: row-reverse;
	gap: 8px;
	padding: 8px 6px 8px 0;
	background: transparent;
	color: var(--color-brand-orange);
	font-weight: 700;
	font-size: 16px;
}
.nn-main--medical .is-style-ext .wp-block-button__link::after {
	width: 14px;
	height: 14px;
	background: url("icons/btn-ext.svg") center / contain no-repeat;
}
@media (hover: hover) and (min-width: 768px) {
	.nn-main--medical .wp-block-button__link:hover { background-color: var(--color-brand-orange-dark); }
	.nn-main--medical .is-style-ext .wp-block-button__link:hover { background-color: transparent; opacity: .7; }
}

/* ===================================================================
 * 11. 表（ヘッダーの行 #f3d0b8・罫線 #f7ece4 1px・角丸 5・内側 12 16・16px）
 *     1列目 150（既定）／-even 等分／-c1w250 1列目 250／-w1120 節の幅いっぱい
 *     SP：セル幅を縮めず、表の範囲だけ横スクロール（注意書き 1669:223566）
 * =================================================================== */
.p-medSec .wp-block-table,
.p-medCard .wp-block-table,
.p-medPage__prose .wp-block-table {
	max-width: 954px;
	margin: 0 3px;
	overflow-x: auto;
}
:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >* + .wp-block-table { margin-top: 16px; }
.p-medSec .wp-block-table.-w1120 { max-width: none; margin-inline: 0; }
.nn-main--medical .wp-block-table table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	table-layout: fixed;
	border: 1px solid var(--color-background-sub);
	border-radius: 5px;
	overflow: hidden;
	background: var(--color-background-sub);
	font: 400 16px/1.2 var(--font-family-body);
	letter-spacing: .05em;
}
.nn-main--medical .wp-block-table :is(th, td) {
	padding: 12px 16px;
	border: 0;
	border-right: 1px solid var(--color-background-sub);
	border-bottom: 1px solid var(--color-background-sub);
	background: var(--color-white);
	text-align: left;
	vertical-align: middle;
	overflow-wrap: anywhere;
}
.nn-main--medical .wp-block-table tr > :last-child { border-right: 0; }
.nn-main--medical .wp-block-table tbody tr:last-child > * { border-bottom: 0; }
.nn-main--medical .wp-block-table thead th {
	background: var(--color-brand-orange-light);
	font-weight: 500;
}
.nn-main--medical .wp-block-table tbody th { font-weight: 500; background: var(--color-background-table); }
.nn-main--medical .wp-block-table:not(.-even):not(.-c1w250) tr > :first-child { width: 150px; }
.nn-main--medical .wp-block-table.-c1w250 tr > :first-child { width: 250px; }
.nn-main--medical .wp-block-table figcaption { margin-top: 8px; font: var(--font-pc-body-small); }

/* ===================================================================
 * 12. よくある質問（FAQ Accordion：閉じ＝白・開き＝#f7ece4／角丸 10・影・内側 20 40・間 8）
 *     注意書き 1669:223582：質問行全体で開閉・0.3秒 Ease Out（medical.js）・PC はホバーで文字と印をオレンジ
 * =================================================================== */
.nn-main--medical .wp-block-details {
	overflow: hidden;
	padding: 20px 40px;
	border-radius: 10px;
	background: var(--color-white);
	box-shadow: 0 0 10px rgb(109 97 61 / .3);
	transition: background-color var(--ds-ease);
}
.nn-main--medical .wp-block-details[open] { background: var(--color-background-sub); }
.nn-main--medical .wp-block-details > summary {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	margin: -7.5px 0; /* 見た目は Figma の 29px・押せる所は 44px */
	padding-right: 40px;
	list-style: none;
	cursor: pointer;
	font: 700 18px/1.6 var(--font-family-heading);
	letter-spacing: .05em;
	color: var(--color-brand-orange-dark);
	transition: color var(--ds-ease);
}
.nn-main--medical .wp-block-details > summary::-webkit-details-marker { display: none; }
/* 質問の文の白い丸い下地（medical.js が .p-medFaqQ で包む）。Q の丸もこの中に入れる */
.p-medFaqQ {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 29px;
	padding-right: 16px;
	border-radius: 50px;
	background: var(--color-white);
}
.nn-main--medical .wp-block-details > summary:has(.p-medFaqQ)::before { content: none; }
.p-medFaqQ::before,
.nn-main--medical .wp-block-details > summary::before { /* Q の丸（29px・白） */
	content: "Q";
	flex: none;
	display: grid;
	place-items: center;
	width: 29px;
	height: 29px;
	border-radius: 50%;
	background: var(--color-white);
	font: 800 18px/1 var(--font-family-heading);
	letter-spacing: .1em;
	padding-left: 2px;
	color: var(--color-brand-orange-dark);
}
.nn-main--medical .wp-block-details > summary::after { /* 開閉の印（＋／−）24px */
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	width: 24px;
	height: 24px;
	translate: 0 -50%;
	background:
		linear-gradient(currentColor, currentColor) center / 14px 1.5px no-repeat,
		linear-gradient(currentColor, currentColor) center / 1.5px 14px no-repeat;
	color: var(--color-text-primary);
	transition: background-size var(--ds-ease), color var(--ds-ease);
}
.nn-main--medical .wp-block-details.is-open > summary::after,
.nn-main--medical .wp-block-details[open]:not(.is-js) > summary::after {
	background-size: 14px 1.5px, 1.5px 0;
}
.nn-main--medical .wp-block-details > :not(summary) { margin: 0; }
.nn-main--medical .wp-block-details > summary + * { margin-top: 8px; }
.nn-main--medical .wp-block-details > * + :not(summary) { margin-top: 12px; }
.nn-main--medical .wp-block-details > * + .wp-block-buttons { margin-top: 16px; }
.nn-main--medical .wp-block-details p { max-width: 960px; }
@media (hover: hover) and (min-width: 768px) {
	.nn-main--medical .wp-block-details > summary:hover,
	.nn-main--medical .wp-block-details > summary:hover::after { color: var(--color-brand-orange); }
}

/* ===================================================================
 * 13. 流れ（medical/flow-steps：幅 960・白い札 角丸 5・内側 20 32・文 676 → 40 → 写真 180×120・札の間に下向きの三角）
 * =================================================================== */
.p-medFlow { max-width: var(--med-text); margin-inline: auto; }
.p-medFlow__heading { margin: 0 0 24px; }
.p-medFlow__list {
	display: grid;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.p-medFlow__item {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 40px;
	margin: 0;
	padding: 20px 32px;
	border-radius: 5px;
	background: var(--color-white);
}
.p-medFlow__item:not(:last-child) { margin-bottom: 20px; }
.p-medFlow__item:not(:last-child)::after { /* 次の札への三角（43×14） */
	content: "";
	position: absolute;
	top: calc(100% + 6px);
	left: 50%;
	width: 43px;
	height: 14px;
	translate: -50% 0;
	background: url("icons/flow-arrow.svg") center / contain no-repeat;
}
.p-medFlow__text { flex: 1; min-width: 0; color: var(--color-text-secondary); }
.p-medFlow__no {
	display: block;
	width: fit-content;
	padding: 2px 4px 3px;
	border-radius: 2px;
	background: var(--color-brand-orange);
	color: var(--color-white);
	font: 400 12px/1 var(--font-family-latin);
	letter-spacing: 0;
}
.p-medFlow .p-medFlow__title {
	margin: 4px 0 0;
	font: 700 20px/1.2 var(--font-family-heading);
	letter-spacing: .05em;
	color: var(--color-text-secondary);
}
.p-medFlow .p-medFlow__desc { margin: 12px 0 0; }
.p-medFlow__under { display: block; max-width: 100%; height: auto; margin-top: 12px; }
.p-medFlow__img {
	flex: none;
	width: 180px;
	height: 120px;
	border-radius: 5px;
	object-fit: cover;
}

/* ===================================================================
 * 14. 本文の途中の相談の箱（medical/cta-banner：文＋Web予約・LINE予約）
 * =================================================================== */
/* Figma「途中CTA」：幅 760・白・角丸 10・影・内側 20・間 16・文は中央 */
.p-medConsult {
	display: grid;
	justify-items: center;
	gap: 16px;
	max-width: 760px;
	margin-inline: auto;
	padding: 20px;
	border-radius: 10px;
	background: var(--color-white);
	box-shadow: 0 0 10px rgb(109 97 61 / .15);
	text-align: center;
}
.p-medConsult__text { margin: 0; }
.p-medConsult__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; }
.p-medConsult .ds-btn--pc-content-web,
.p-medConsult .ds-btn--pc-content-line { inline-size: 241px; }
/* tokens.css の --color-brand-green が別の色（#faf0ed）で上書きされているため、LINE の緑はここで直に指定（共通部品への提案） */
.p-medConsult .ds-btn--pc-content-line { --ds-btn-bg: #76983b; --ds-btn-badge-fg: #76983b; }
@media (hover: hover) and (min-width: 768px) {
	.p-medConsult .ds-btn--pc-content-line:hover { --ds-btn-bg: #65980e; --ds-btn-badge-fg: #65980e; }
}

/* 電話の途中CTA（p-medTel：オレンジの箱。左に見出しと文、右に白い電話の札） */
.p-medTel {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 8px 40px;
	padding: 40px 60px;
	border-radius: 10px;
	background: var(--color-brand-orange);
	color: var(--color-white);
}
:is(.p-medTel, .p-medTel > .wp-block-group__inner-container) >* { margin: 0; grid-column: 1; }
.p-medTel__ttl {
	display: flex;
	flex-direction: column;
	gap: 4px;
	font: 700 32px/1.2 var(--font-family-heading);
	letter-spacing: .1em;
}
.p-medTel__en { font: 400 20px/1 var(--font-family-latin); letter-spacing: .05em; color: var(--color-brand-gold-light); }
.p-medTel__btn { grid-column: 2; grid-row: 1 / span 4; }
.p-medTel__btn a {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	min-width: 360px;
	padding: 20px 32px;
	border-radius: 10px;
	background: var(--color-white);
	color: var(--color-text-primary);
	text-decoration: none;
}
.p-medTel__label { font: 500 14px/1 var(--font-family-body); letter-spacing: .1em; }
.p-medTel__num { font: 500 36px/1 var(--font-family-latin); letter-spacing: .1em; }

/* ===================================================================
 * 15. 予約の帯の上の案内（CTA前リード文：文 → 写真 400×300）・後ろの注記
 * =================================================================== */
.p-medCtaLead {
	display: flex;
	align-items: center;
	gap: 56px;
	padding-inline: 3px;
}
.p-medCtaLead__text { flex: 1; min-width: 0; }
.p-medCtaLead__text p { margin: 0; }
.p-medCtaLead__text p + p { margin-top: 12px; }
.p-medCtaLead__photo { flex: none; width: 400px; }
.p-medCtaLead__img { display: block; width: 400px; height: 300px; border-radius: 5px; object-fit: cover; }
.p-medPage__tail { color: var(--color-text-primary); }
.p-medPage__tail > * { margin: 0; }
.p-medPage__tail > * + * { margin-top: 8px; }

/* 切り替えのタブの並び（導入文の下） */
.p-medPage__tabs .p-medLinks { max-width: var(--med-inner); }

/* ===================================================================
 * 16. 規約の形（プライバシーポリシー）・新しく作った固定ページの本文
 * =================================================================== */
.p-medPage.-doc .p-medPage__lead .p-medLead { line-height: var(--med-lh); } /* Figma：規約の導入文は 160% */
.p-medPage__prose { max-width: var(--med-text); margin-inline: auto; }
.p-medPage__prose > * + h2 { margin-top: var(--med-sec-gap); }
.p-medPage__prose > h2 + * { margin-top: 32px; }

/* ===================================================================
 * 17. 中間の幅（768〜1199）：並びは PC のまま、余白と写真を縮める
 * =================================================================== */
@media (max-width: 1199px) {
	.p-medMedia { padding-right: calc(40% + 40px); }
	:is(.p-medMedia, .p-medMedia > .wp-block-group__inner-container) >.wp-block-image { width: 40%; }
	:is(.p-medMedia, .p-medMedia > .wp-block-group__inner-container) >.wp-block-image img { width: 100%; height: auto; aspect-ratio: 4 / 3; }
	.p-medCtaLead__photo { width: 40%; }
	.p-medCtaLead__img { width: 100%; height: auto; aspect-ratio: 4 / 3; }
	.p-medLinks { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.p-medTel { grid-template-columns: 1fr; }
	.p-medTel__btn { grid-column: 1; grid-row: auto; }
	.p-medTel__btn a { min-width: 0; }
}
@media (max-width: 1023px) {
	.p-medFlow__img { width: 150px; height: 100px; }
	.p-medFlow__item { gap: 24px; }
}

/* ===================================================================
 * 18. スマホ（767 以下。Figma の SP：左右 20・字は SP の大きさ）
 * =================================================================== */
@media (max-width: 767px) {
	.nn-main--medical { --med-gutter: 20px; --med-sec-gap: 60px; --med-lh: 1.6; }
	.p-medPage__body { padding-bottom: 80px; }
	.p-medPage__body > * + * { margin-top: 32px; }

	/* 写真の帯 */
	.p-medHero { height: 240px; }
	.p-medHero__ttl { gap: 6px; margin-bottom: 20px; }
	.p-medHero__en { font-size: 18px; }
	.p-medHero__main { font-size: 26px; line-height: 1.2; }
	.p-medHero__sub { font-size: 20px; }
	.p-medPage.-photo .p-medPage__sheet { margin-top: -20px; border-radius: 20px 20px 0 0; }
	.p-medPage.-photo .p-medCrumb + .p-medPage__body { padding-top: 40px; }

	/* パンくず：最大 2 行・収まらない分は今のページ名の末尾を「…」 */
	.p-medCrumb { padding-top: 8px; }
	.p-medCrumb__list { font-size: 12px; max-height: calc(2 * 44px); overflow: hidden; margin-inline: -10px; padding-inline: 10px; } /* 左右 10px は、ホームの押せる範囲（44px）が overflow で切られないための余白（見た目は変わらない） */
	.p-medCrumb__item { min-height: 44px; }
	.p-medCrumb__item.-current { flex: 1 1 0; min-width: 0; }
	.p-medCrumb__item.-current .p-medCrumb__text { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
	.p-medCrumb__item + .p-medCrumb__item::before { margin-inline: 4px; }
	.p-medCrumb__homeIcon { width: 20px; height: 20px; }

	/* 題名 */
	.p-medTitle { padding: 24px 0 48px; }
	.p-medTitle__ttl { font: var(--ds-h1-sp); letter-spacing: var(--ds-h1-sp-ls); line-height: 1.3; }
	.p-medTitle__ttl::after { width: 120px; margin-top: 20px; }
	.p-medTitle__sub { font-size: 20px; }

	/* 導入文：SP は左揃え 14px/160% */
	.p-medLead { font: var(--font-sp-lead); letter-spacing: var(--ls-sp-lead); text-align: left; }
	.p-medLead + .p-medLead { margin-top: 12px; }

	/* 目次：1列 */
	.p-medToc { padding: 8px 20px 24px; }
	.p-medToc__list { grid-template-columns: 1fr; }
	.p-medToc__link { min-height: 48px; font-size: 14px; padding-right: 0; }

	/* 節 */
	.p-medSec,
	.p-medPage__prose,
	.p-medCtaLead,
	.p-medPage__tail { font: var(--font-sp-body); letter-spacing: var(--ls-sp-body); }
	:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >h2,
	.p-medPage__prose h2 { padding-top: 16px; font: var(--ds-h2-sp); letter-spacing: var(--ds-h2-sp-ls); }
	:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >h2::before,
	.p-medPage__prose h2::before { width: 60px; }
	:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >h2 + * { margin-top: 24px; }
	:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >h2.p-medGroupTtl { font: var(--ds-h2-large-sp); letter-spacing: var(--ds-h2-large-sp-ls); }
	.p-medGroupTtl__en { font: var(--ds-en-sp); }
	.p-medSec h3,
	.p-medPage__prose h3 { font: var(--ds-h3-sp); letter-spacing: var(--ds-h3-sp-ls); }
	.p-medSec h3::before { min-height: 22px; }
	:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >:is(p, ul, ol, h3, .wp-block-buttons) { margin-inline: 0; }
	.p-medNote { font-size: 12px; }
	.p-medNote.-s14 { font: var(--font-sp-body-small); }

	ul.is-style-check { padding: 16px 20px; }
	ul.is-style-check.-col2 { grid-template-columns: 1fr; }
	ul.is-style-check > li::before { width: 18px; height: 18px; top: calc((1lh - 18px) / 2); }
	ul.is-style-check > li { padding-left: 22px; }

	.p-medLinks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; }
	.p-medLinks > li { position: relative; min-height: 44px; }
	/* 押せる範囲を、行（li）の全体まで広げる（見た目はそのまま。隣の行・タブとは重ならない） */
	.p-medLinks > li > a::after { content: ""; position: absolute; inset: 0 0 -1px; }
	.p-medLinks.-tabs > li > a::after { inset: 0; }
	.p-medLinks.-tabs { grid-template-columns: 1fr 1fr; }
	.p-medLinks.-tabs > li { min-height: 52px; font-size: 15px; padding: 8px; }
	.p-medDiseases { padding: 20px 16px; }

	/* 本文＋画像：文 → 写真 */
	.p-medMedia { min-height: 0; padding: 0; }
	:is(.p-medMedia, .p-medMedia > .wp-block-group__inner-container) >.wp-block-image { position: static; width: 100%; margin-top: 20px; }
	:is(.p-medMedia, .p-medMedia > .wp-block-group__inner-container) >.wp-block-image img { width: 100%; height: auto; aspect-ratio: 4 / 3; }
	.p-medCtaLead { flex-direction: column; align-items: stretch; gap: 20px; padding: 0; }
	.p-medCtaLead__photo { width: 100%; }

	/* 漫画の白い箱 */
	:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >h3:has(+ .wp-block-image) { padding: 20px 16px 16px; }
	:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >.wp-block-image { padding-inline: 16px; }
	:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >:not(.wp-block-image, h3) + .wp-block-image { padding-top: 20px; }
	:is(.p-medSec, .p-medSec > .wp-block-group__inner-container) >.wp-block-image:not(:has(+ .wp-block-image)) { padding-bottom: 20px; }

	.p-medCard { margin-inline: 0; padding: 16px; }

	/* ボタン：幅いっぱい（SP Inner：35px・明朝 16px。押せる所は 44px） */
	.wp-block-buttons { flex-direction: column; align-items: stretch; }
	.nn-main--medical .wp-block-button__link {
		justify-content: center;
		width: 100%;
		min-height: 44px;
		padding: 8px 32px 8px 16px;
		font-size: 16px;
		line-height: 1.3;
		white-space: normal;
		text-align: center;
	}
	.nn-main--medical .wp-block-button__link::before { content: none; }
	.nn-main--medical .wp-block-button__link::after { position: absolute; right: 10px; width: 16px; height: 16px; background-size: 16px; }
	.nn-main--medical .is-style-ext .wp-block-button__link { justify-content: flex-start; width: auto; padding: 8px 0; font-size: 14px; }
	.nn-main--medical .is-style-ext .wp-block-button__link::after { position: static; }

	/* 表：セル幅を縮めず、表の範囲だけ横スクロール（初期位置は左端） */
	.p-medSec .wp-block-table,
	.p-medCard .wp-block-table,
	.p-medPage__prose .wp-block-table { margin-inline: 0; -webkit-overflow-scrolling: touch; }
	.nn-main--medical .wp-block-table table { width: max-content; min-width: 100%; table-layout: auto; font-size: 14px; }
	.nn-main--medical .wp-block-table :is(th, td) { min-width: 7em; max-width: 16em; padding: 10px 12px; }
	.nn-main--medical .wp-block-table:not(.-even):not(.-c1w250) tr > :first-child,
	.nn-main--medical .wp-block-table.-c1w250 tr > :first-child { width: auto; min-width: 8em; }

	/* FAQ */
	.nn-main--medical .wp-block-details { padding: 16px 16px; }
	.nn-main--medical .wp-block-details > summary { align-items: flex-start; padding-right: 32px; font-size: 16px; line-height: 1.5; padding-block: 8px; }
	.nn-main--medical .wp-block-details > summary::before,
	.p-medFaqQ::before { width: 26px; height: 26px; font-size: 16px; }
	.p-medFaqQ { align-items: flex-start; border-radius: 14px; padding-right: 12px; }
	.nn-main--medical .wp-block-details > summary + * { margin-top: 12px; }

	/* 流れ：写真は文の上 */
	.p-medFlow__item { flex-direction: column-reverse; gap: 12px; padding: 16px; }
	.p-medFlow__img { width: 100%; height: auto; aspect-ratio: 3 / 2; }
	.p-medFlow__title { font-size: 18px; }

	/* 途中の相談の箱 */
	.p-medConsult { padding: 24px 16px; }
	.p-medConsult__btns { flex-direction: column; align-items: stretch; width: 100%; gap: 16px; }
	.p-medConsult .ds-btn--pc-content-web,
	.p-medConsult .ds-btn--pc-content-line { inline-size: 100%; min-block-size: 66px; }

	.p-medTel { padding: 32px 20px; }
	.p-medTel__ttl { font-size: 24px; }
	.p-medTel__num { font-size: 28px; }
	.p-medTel__btn a { min-height: 44px; }

	.p-medArrowSteps { flex-direction: column; gap: 24px; }
	.p-medArrowSteps > li { writing-mode: horizontal-tb; padding: 16px; }
	.p-medArrowSteps > li + li::after { content: none; }
	.p-medKv { grid-template-columns: 1fr; gap: 4px; }
}

/* 動きを減らす設定：色の切り替えも止める */
@media (prefers-reduced-motion: reduce) {
	.p-medCrumb__link,
	.p-medToc__link,
	.p-medToc__arrow,
	.nn-main--medical .wp-block-button__link,
	.nn-main--medical .wp-block-details,
	.nn-main--medical .wp-block-details > summary,
	.nn-main--medical .wp-block-details > summary::after { transition: none; }
	html:has(.nn-main--medical) { scroll-behavior: auto; }
}
html:has(.nn-main--medical) { scroll-behavior: smooth; }
