/* 婦人科ラボ デザイン（2026-10 全面リニューアル #13976・「やわらかい相談室」）: 生成りの地・淡い青緑の面・大きな角丸。読み物の安心感を優先 */
:root{
  --brand-teal:#37958d;--brand-navy:#1f4e5f;--brand-beige:#b69e84;--chart-mark:#0e8f83;
  --canvas:#fbfaf6;--surface:#fff;--tint:#eef6f4;--ink:#2e3433;--ink-sub:#55605e;--ink-faint:#6b7573;
  --border:#e2e6e1;--border-strong:#c9d2cf;--link:#2b7770;--accent:#2b7770;--accent-hover:#215f59;--on-brand:#fff;
  --head:#1f4e5f;--head-bg:#fbfaf6;--head-ink:#2e3433;--hero-bg:#eef6f4;--card-bg:#fff;--card-border:#e2e6e1;--group-bg:#f5efe6;
  --tool-bg:#2b7770;--tool-ink:#fff;--tool-hover:#215f59;--foot-bg:#eef6f4;--foot-ink:#2e3433;--foot-rule:#d4dfdc;--logo-bg:transparent;
  --font-body:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP",-apple-system,sans-serif;--font-head:var(--font-body);--font-num:var(--font-body);
  --w-head:700;--r-btn:999px;--r-box:28px;--r-img:28px;--r-hero:40px;--r-sm:12px;
}
@media (prefers-color-scheme:dark){:root{
  --canvas:#121716;--surface:#18201f;--tint:#1b2725;--ink:#ecf1f0;--ink-sub:#b8c4c2;--ink-faint:#9aa8a6;--border:#2c3836;--border-strong:#40504d;
  --link:#7fd0c6;--accent:#7fd0c6;--accent-hover:#9adcd3;--on-brand:#0d1514;--head:#bfe3dd;--head-bg:#121716;--head-ink:#ecf1f0;--hero-bg:#17221f;
  --card-bg:#18201f;--card-border:#2c3836;--group-bg:#211f1b;--tool-bg:#1f3a36;--tool-ink:#ecf1f0;--tool-hover:#264843;--foot-bg:#0f1413;--foot-ink:#c8d3d1;--foot-rule:#2c3836;--chart-mark:#1aa395}}
/* 色・角丸・書体はすべて上の :root のトークン経由で使う。生の色コードを下に書かない */
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-padding-top:16px}
body{margin:0;background:var(--canvas);color:var(--ink);font:400 17px/1.95 var(--font-body);font-feature-settings:"palt" 0}
a{color:var(--link);text-underline-offset:3px;text-decoration-thickness:1px}a:hover{text-decoration-thickness:2px}
a:focus-visible,.btn:focus-visible,summary:focus-visible{outline:2px solid var(--link);outline-offset:3px;border-radius:4px}
.bar{max-width:72rem;margin:0 auto;padding:0 24px}
.wrap{max-width:46rem;margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:var(--surface);padding:8px 12px;z-index:9}
header.site{background:var(--head-bg);border-bottom:1px solid var(--border)}
header.site .bar{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:72px}
header.site .logo{display:block;background:var(--logo-bg)}header.site .logo img{display:block;height:40px;width:auto;border-radius:0}
.gnav{display:flex;align-items:center;gap:28px;white-space:nowrap}
.gnav a{font-size:16px;font-weight:500;line-height:1;color:var(--head-ink);text-decoration:none;padding:12px 0}
.gnav a:hover{color:var(--link)}
.gnav a.nav-cta{background:var(--accent);color:var(--on-brand);padding:12px 20px;border-radius:var(--r-btn)}
.crumbs{font-size:16px;color:var(--ink-faint);margin:0 0 24px}.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 0}
.crumbs li+li::before{content:"›";margin:0 8px;color:var(--ink-faint)}.crumbs a{color:var(--ink-sub)}
.crumbs li{min-width:0;overflow-wrap:anywhere;line-height:1.6}
main{padding:40px 0 96px}main.wide{padding:0 0 96px}
h1,h2,h3{font-family:var(--font-head);color:var(--head);font-weight:var(--w-head);letter-spacing:.02em}
h1{font-size:32px;line-height:1.45;margin:0 0 20px}
h2{font-size:24px;line-height:1.5;margin:64px 0 16px;padding-bottom:10px;border-bottom:1px solid var(--border)}
h3{font-size:20px;line-height:1.5;margin:36px 0 8px}
p,li{overflow-wrap:anywhere}
table{border-collapse:collapse;width:100%;font-size:16px;line-height:1.6;display:block;overflow-x:auto;margin:16px 0}
th,td{border:1px solid var(--border);padding:10px 12px;text-align:left;white-space:nowrap;vertical-align:top}th{background:var(--tint);font-weight:500}
.compare th,.compare td{white-space:normal;min-width:9rem}
img{max-width:100%;height:auto;border-radius:var(--r-img)}
.hero-photo{display:block;width:100%;aspect-ratio:16/7;object-fit:cover;border-radius:var(--r-img);margin:0 0 28px}
.hero{display:flex;gap:16px;align-items:center;margin:0 0 16px}.hero>img{flex:none;width:64px;height:64px;border-radius:0}
.hero h1{margin:0}.kicker{margin:0 0 4px;font-size:16px;color:var(--ink-sub);line-height:1.5}
.updated{display:inline-block;font-size:16px;line-height:1.6;color:var(--ink-sub);background:var(--tint);border-radius:var(--r-sm);padding:6px 12px;margin:0 0 8px}
.freshness{display:flex;flex-wrap:wrap;gap:0 8px}.updated.stale{color:var(--head);background:var(--group-bg);font-weight:500}
.toc{background:var(--tint);border-radius:var(--r-box);padding:20px 24px;margin:24px 0 8px}
.toc p{margin:0 0 6px;font-weight:700;color:var(--head)}.toc ol{margin:0;padding-left:1.4em}.toc li{line-height:1.7;margin:6px 0}
.anchor{display:block;position:relative;top:-8px}
.figure{margin:28px 0;max-width:40rem}.figure svg{width:100%;height:auto;display:block}
.figure figcaption{font-size:16px;color:var(--ink-sub)}
.chart{margin:16px 0 8px;max-width:30rem}.chart figcaption{font-size:16px;font-weight:500;color:var(--ink)}
.chart svg{width:100%;height:auto;display:block}
.chart .mark{fill:var(--chart-mark)}.chart .base{stroke:var(--border);stroke-width:1}
.chart .val{font-size:12px;fill:var(--ink);text-anchor:middle}.chart .lab{font-size:10px;fill:var(--ink-sub);text-anchor:middle}
.chart g:hover .mark{opacity:.8}
.charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:8px 24px}
blockquote{margin:24px 0;padding:16px 20px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--tint);color:var(--ink-sub)}
.lead{font-size:18px;color:var(--ink-sub)}
form.tool{background:var(--tint);border-radius:var(--r-box);padding:24px;display:grid;gap:16px;max-width:36rem}
form.tool label{display:grid;gap:6px;font-weight:500}form.tool label.inline{display:flex;gap:10px;align-items:center;font-weight:400}
form.tool input[type=radio],form.tool input[type=checkbox]{width:20px;height:20px;accent-color:var(--accent)}
form.tool fieldset{border:0;margin:0;padding:0;display:grid;gap:8px}form.tool legend{font-weight:500;margin-bottom:6px}
form.tool input[type=date],form.tool input[type=number],form.tool input[type=search],form.tool select{font:inherit;padding:10px 12px;border:1px solid var(--border-strong);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);max-width:16rem}
form.tool .btn{justify-self:start;border:0;cursor:pointer}
.clinic-filter{margin:16px 0}.clinic-filter .note{margin:0}.clinic-filter[hidden],.clinic-filter fieldset[hidden],main li[hidden]{display:none}
.ov-dl{margin:8px 0 0}.ov-dl dt{font-size:16px;color:var(--ink-sub);margin-top:10px}.ov-dl dd{margin:0;font-weight:500}
.faq details{border-bottom:1px solid var(--border);padding:16px 0}.faq summary{cursor:pointer;font-weight:500;color:var(--head);line-height:1.6}
.faq summary::before{content:"Q. ";color:var(--link);font-weight:700}.faq p{margin:10px 0 0}
.tool-result{margin:24px 0}.tool-result:focus{outline:none}.tool-error,.tool-warn{color:var(--head);font-weight:500}.tool-sub{font-weight:500;margin-top:16px}
.note{font-size:16px;line-height:1.7;color:var(--ink-sub)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:16px;padding:0;margin:16px 0;list-style:none}
.cards>li{background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--r-box);padding:20px 22px;line-height:1.6}
.cards>li>a{text-decoration:none;font-weight:500;color:var(--head)}.cards>li>a:hover{color:var(--link);text-decoration:underline}
.cards .note{margin:8px 0 0}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:14px 28px;border-radius:var(--r-btn);border:1px solid var(--accent);
  background:var(--accent);color:var(--on-brand);font-size:17px;font-weight:700;line-height:1.3;text-decoration:none;text-align:center}
.btn:hover{background:var(--accent-hover);border-color:var(--accent-hover);text-decoration:none}
.btn.ghost{background:transparent;color:var(--link);border-color:var(--border-strong)}.btn.ghost:hover{background:var(--tint)}
.group{background:var(--group-bg);border:1px solid var(--card-border);border-radius:var(--r-box);padding:28px;margin:64px 0 0}
.group h2{border:0;padding:0;margin:0 0 8px;font-size:20px}
.chips{display:flex;flex-wrap:wrap;gap:8px;padding:0;list-style:none;margin:8px 0}
.chips a{display:inline-block;padding:8px 16px;border:1px solid var(--border-strong);border-radius:var(--r-btn);font-size:16px;line-height:1.4;text-decoration:none;color:var(--ink);background:var(--surface)}
.chips a:hover{border-color:var(--link);color:var(--link)}
ul.plain{padding-left:1.2em}ul.plain li{margin:6px 0;line-height:1.7}
.glossary dt{margin:28px 0 4px;font-size:19px;font-weight:700;color:var(--head);line-height:1.5}.glossary dd{margin:0;padding:0 0 12px;border-bottom:1px solid var(--border)}.glossary dd p{margin:0 0 6px}
/* 柱記事の横の「同じ段階の解説」（スマホでは本文の後ろ） */
.guide-body{min-width:0}
.stage-side{margin:64px 0 0;padding:20px 24px;background:var(--tint);border-radius:var(--r-box);font-size:16px;line-height:1.7}
.stage-side h2{font-size:17px;margin:0 0 8px;padding:0;border:0}.stage-side ul{margin:0 0 16px}.stage-side p{margin:0}
.stage-side li[aria-current]{font-weight:700;color:var(--head)}
@media (min-width:1100px){
  .wrap:has(>.guide-layout){max-width:72rem}
  .guide-layout{display:grid;grid-template-columns:minmax(0,1fr) 18rem;gap:48px;align-items:start}
  .stage-side{position:sticky;top:16px;margin:0;max-height:calc(100vh - 32px);overflow-y:auto}
}
/* トップ */
.sec{padding:72px 0 0}.sec h2{margin-top:0}.sec-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap}
.sec-head a{font-size:16px}.sec-lead{color:var(--ink-sub);margin:0 0 8px}
.top-hero{background:var(--hero-bg);padding:56px 0}
.hero-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center}
.hero-copy h1{font-size:40px;line-height:1.4;margin:0 0 20px;word-break:keep-all;overflow-wrap:anywhere}
.eyebrow{display:inline-block;margin:0 0 16px;font-size:16px;font-weight:700;color:var(--link);letter-spacing:.06em}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 0}
.hero-img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-hero)}
.stage-entry ul{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:12px}
.stage-entry a{display:flex;flex-direction:column;gap:2px;min-height:48px;padding:12px 20px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--r-sm);text-decoration:none;color:var(--head);line-height:1.5}
.stage-entry a:hover{border-color:var(--link)}.stage-entry b{font-size:17px}.stage-entry span{font-size:16px;color:var(--ink-sub)}
.stats{border-bottom:1px solid var(--border);background:var(--surface)}
.stats ul{list-style:none;margin:0;padding:24px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.stats li{line-height:1.4;color:var(--ink-sub);font-size:16px}.stats b{display:block;font-family:var(--font-num);font-size:36px;font-weight:700;color:var(--head);letter-spacing:.02em}
.stage-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;list-style:none;margin:24px 0 0;padding:0}
.stage-cards>li{background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--r-box);padding:28px;display:flex;flex-direction:column}
.stage-cards img{width:64px;height:64px;border-radius:0}.stage-cards h3{margin:12px 0 4px;font-size:21px}
.stage-cards .who{margin:0 0 12px;color:var(--ink-sub);font-size:16px;line-height:1.7}
.stage-cards ul{list-style:none;padding:0;margin:0 0 16px;flex:1}.stage-cards ul li{border-top:1px solid var(--border);padding:10px 0;line-height:1.6}
.stage-cards ul a{color:var(--ink);text-decoration:none}.stage-cards ul a:hover{color:var(--link);text-decoration:underline}
.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;list-style:none;padding:0;margin:20px 0 0}
.guide-grid li a{display:flex;flex-direction:column;gap:6px;height:100%;padding:20px 22px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--r-box);text-decoration:none;color:var(--head);font-weight:500;line-height:1.6}
.guide-grid li a:hover{border-color:var(--link)}.guide-grid .tag{font-size:16px;font-weight:400;color:var(--ink-sub)}
.guide-grid .desc{font-size:16px;font-weight:400;line-height:1.7;color:var(--ink-sub)}h2+.guide-grid{margin-top:8px}
.tool-row{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin:20px 0 0}
.tool-row a{display:block;padding:28px;border-radius:var(--r-box);background:var(--tool-bg);color:var(--tool-ink);text-decoration:none}
.tool-row a b{display:block;font-size:21px;font-family:var(--font-head);margin-bottom:6px}.tool-row a span{font-size:16px;opacity:.9}
.tool-row a:hover{background:var(--tool-hover)}
.regions{display:grid;grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));gap:12px 32px;margin:20px 0 0}
.regions h3{margin:12px 0 4px;font-size:17px;color:var(--ink-sub)}
.news{list-style:none;padding:0;margin:16px 0 0}.news li{display:flex;gap:16px;border-bottom:1px solid var(--border);padding:14px 0;line-height:1.6}
.news time{flex:none;color:var(--ink-sub);font-size:16px;font-variant-numeric:tabular-nums}.news a{color:var(--ink);text-decoration:none}.news a:hover{color:var(--link);text-decoration:underline}
footer.site{background:var(--foot-bg);color:var(--foot-ink);padding:56px 0 28px;font-size:16px;line-height:1.7}
footer.site a{color:var(--foot-ink)}
.fcols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px}
.fcols h2{font-size:16px;margin:0 0 8px;padding:0;border:0;color:var(--foot-ink);font-family:var(--font-body);font-weight:700}
.fcols ul{list-style:none;margin:0;padding:0}.fcols li{margin:4px 0}
.flogo{display:inline-block;background:var(--logo-bg);margin:0 0 12px}.flogo img{height:32px;width:auto;display:block;border-radius:0}
.fbottom{border-top:1px solid var(--foot-rule);margin-top:32px;padding-top:20px}
@media (max-width:899px){
  .hero-grid{grid-template-columns:1fr;gap:28px}.hero-copy h1{font-size:30px}
  .stage-cards,.guide-grid{grid-template-columns:1fr}.tool-row{grid-template-columns:1fr}.fcols{grid-template-columns:1fr 1fr}.fcols>div:first-child{grid-column:1/-1}
}
@media (max-width:767px){
  body{font-size:16px;line-height:1.9}.bar,.wrap{padding:0 16px}
  header.site .bar{flex-wrap:wrap;gap:0;min-height:0;padding-top:12px}header.site .logo img{height:32px}
  .gnav{width:100%;gap:4px 18px;flex-wrap:wrap;padding:4px 0 6px}.gnav a{padding:12px 0}.gnav a.nav-cta{padding:10px 14px;margin-left:auto}
  main{padding:24px 0 72px}h1{font-size:25px}h2{font-size:21px;margin-top:52px}.hero>img{width:52px;height:52px}
  .top-hero{padding:32px 0}.hero-copy h1{font-size:27px}.hero-cta .btn{width:100%}
  .sec{padding-top:56px}.stats ul{grid-template-columns:1fr 1fr 1fr;gap:8px}.stats b{font-size:26px}
  .stage-cards>li,.group{padding:22px}.fcols{grid-template-columns:1fr}
  .group .btn{display:flex;width:100%}
  table:has(tr>th:first-child+td:last-child){display:block;overflow-x:visible;border:1px solid var(--border);border-radius:var(--r-sm)}
  table:has(tr>th:first-child+td:last-child) tbody{display:block}
  tr:has(>th:first-child+td:last-child){display:block;border-bottom:1px solid var(--border)}
  tr:has(>th:first-child+td:last-child):last-child{border-bottom:0}
  tr:has(>th:first-child+td:last-child)>th,tr:has(>th:first-child+td:last-child)>td{display:block;border:0;white-space:normal}
  tr:has(>th:first-child+td:last-child)>th{padding:8px 14px 2px;color:var(--ink-sub)}
  tr:has(>th:first-child+td:last-child)>td{padding:4px 14px 12px}
}
/* --- デザインの上書き（sites/fujinka-lab/design/overrides.css） --- */
/* 婦人科ラボ デザインの上書き（#13896）。apps/fujinka-lab-autopilot/improve_design.py が少しずつ足す。
   色は build.py の :root のトークン（var(--…)）だけを使う。検査は gate.py の check_css。
   2026-10-18 全面リニューアル（#13976）で、それまでの上書きは build.py の CSS に統合した。 */

/* 2026-10-18 article: 記事の表のセル内で文字を折り返し、スマホ幅に収める */
/* 柱記事の表: 長い説明文が1行のまま横へはみ出さないよう、セル内で折り返す（2列表の縦並びは既存の指定が優先される） */
th,td{white-space:normal;min-width:6em;line-height:1.7}
@media (max-width:767px){
  th,td{padding:10px 8px}
}

/* 2026-10-18 top: トップの最初の画面：スマホで段階の入口を押し上げ、押せるカードに見せる */
/* 2026-10-19 top: スマホの最初の画面に段階の入口を収め、押せるカードに見せる */
@media (max-width:767px){
  .top-hero{padding:20px 0 28px}
  .eyebrow{margin:0 0 8px}
  .hero-copy h1{margin:0 0 12px;line-height:1.35}
  .hero-copy .lead{margin:0;line-height:1.75}
  .stage-entry ul{margin-top:16px;gap:8px}
  .stage-entry a{position:relative;min-height:56px;justify-content:center;padding:10px 44px 10px 16px}
  .stage-entry a::after{content:"›";position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:22px;line-height:1;color:var(--link)}
  .stage-entry li:last-child a{background:var(--tint);border-color:var(--border-strong)}
  .hero-cta{margin-top:16px}
}

/* 2026-10-18 cta: 記事末の「次に読む」2本を、カード全体を押せる同じ形にそろえる */
.next-read h2{margin-top:56px}
.next-read .cards{grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:12px;margin:8px 0 0}
.next-read .cards>li{display:flex;padding:0}
.next-read .cards>li:hover{border-color:var(--link)}
.next-read .cards>li>a{position:relative;display:flex;align-items:center;width:100%;min-height:56px;padding:16px 44px 16px 20px;color:var(--head);font-weight:500;line-height:1.6}
.next-read .cards>li>a::after{content:"›";position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:22px;line-height:1;color:var(--link)}
.next-read .cards>li>a:focus-visible{border-radius:var(--r-box);outline-offset:-2px}
.next-read+.group{margin-top:40px}

/* 2026-10-19 clinic: 市区町村ページの院の一覧を、カード全体を押せる同じ形にそろえる */
.wrap>.cards:has(>li[data-filter]){gap:8px}
.wrap>.cards:has(>li[data-filter])>li:not([hidden]){display:flex;padding:0}
.wrap>.cards:has(>li[data-filter])>li:hover{border-color:var(--link)}
.wrap>.cards:has(>li[data-filter])>li>a{position:relative;display:flex;align-items:center;width:100%;min-height:56px;padding:14px 44px 14px 20px;color:var(--head);font-weight:500;line-height:1.6;overflow-wrap:anywhere}
.wrap>.cards:has(>li[data-filter])>li>a::after{content:"›";position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:22px;line-height:1;color:var(--link)}
.wrap>.cards:has(>li[data-filter])>li>a:focus-visible{border-radius:var(--r-box);outline-offset:-2px}

/* 2026-10-19 article: 柱記事の手順と箇条書きを、1項目ずつ読み分けられる間隔にする */
/* 2026-10-19 article: 柱記事の本文の箇条書き・手順に間隔を空け、1項目ずつ読み分けられるようにする（クラス付きの一覧は対象外） */
.wrap>ul:not([class]),.wrap>ol:not([class]){padding-left:1.6em;margin:16px 0 28px}
.wrap>ul:not([class])>li,.wrap>ol:not([class])>li{margin:0 0 12px;padding-left:4px;line-height:1.8}
.wrap>ul:not([class])>li:last-child,.wrap>ol:not([class])>li:last-child{margin-bottom:0}
.wrap>ol:not([class])>li::marker{color:var(--head);font-weight:700}
.wrap>ul:not([class])>li::marker{color:var(--link)}
.wrap>ol:not([class])>li>strong:first-child{color:var(--head)}
@media (max-width:767px){
  .wrap>ul:not([class])>li,.wrap>ol:not([class])>li{margin-bottom:14px}
}