/* 障がい福祉ナビ（東京版・多摩市版・市区町村サイトで同じファイルを使う。直すときは tokyo/site/assets と site/assets に同じ内容を置く）
   方向：「相談窓口で手渡される、よくできたパンフレット」。生成りの紙に、青緑を「押す場所」だけに使う。
   見出しとボタンは丸ゴシック、本文はUDゴシック。読むものは枠なし、押せるものは角丸の面＋縁＋影。困りごとは色つきのアイコンで見分ける。 */
:root{
  --bg:#fbf8f1; --paper:#ffffff; --ink:#1f2a28; --sub:#4f5a57; --line:#dfe6e2; --edge:#a9b8b3;
  --accent:#0a5a55; --accent-dark:#063f3b; --accent-ink:#ffffff; --accent-soft:#ddf3f1; --accent-text:#0a5a55; --gold:#8f6528; --gold-ink:#ffffff; --gold-soft:#f2cf83;
  --link:#0a5a55; --focus:#f2cf83; --invalid:#b3261e;
  --yes:#1f6a46; --yes-bg:#e6f1e9; --maybe:#8a5300; --maybe-bg:#fbf0dc; --no:#5a554c; --no-bg:#efebe4;
  --shadow:0 1px 0 rgb(10 60 55/.12),0 4px 14px rgb(10 60 55/.07);
  --press:0 3px 0 var(--accent-dark);
  --f-head:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  --f-body:"BIZ UDPGothic","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
  --f-num:"BIZ UDGothic","Hiragino Kaku Gothic ProN",Meiryo,monospace;
  --r:14px; --r-s:10px;
  /* 困りごとの色（アイコンの地と線） */
  --c-money:#fde7c8; --c-money-ink:#7a4a00;
  --c-medical:#fde0de; --c-medical-ink:#9a2b2b;
  --c-tax:#e4ebf7; --c-tax-ink:#2f4a86;
  --c-move:#dcefec; --c-move-ink:#1b6060;
  --c-tools:#ebe5f5; --c-tools-ink:#5a3d8a;
  --c-talk:#e3f0dc; --c-talk-ink:#2f6a2f;
  --c-care:#fbe3da; --c-care-ink:#9a3a2a;
  --c-leisure:#fff2c9; --c-leisure-ink:#6e5200;
  font-size:112.5%;
}
:root[data-size="l"]{font-size:131.25%}
:root[data-size="xl"]{font-size:156.25%}
@media (prefers-color-scheme:dark){:root:not([data-contrast="high"]){
  --bg:#141a19; --paper:#1d2524; --ink:#ecf2f0; --sub:#b7c4c0; --line:#2f3a38; --edge:#6d7d79;
  --accent:#5fd3cd; --accent-dark:#2fa39d; --accent-ink:#0b1c1a; --accent-soft:#16302d; --accent-text:#8fe3de; --gold:#f2cf83; --gold-ink:#1c1406; --gold-soft:#4a3a1c;
  --link:#8fe3de; --focus:#f2cf83; --invalid:#ff8a80;
  --yes:#8fd3ac; --yes-bg:#1f3328; --maybe:#f3c86b; --maybe-bg:#3a2c10; --no:#c3bbae; --no-bg:#2e2b27;
  --shadow:0 1px 0 rgb(0 0 0/.4),0 4px 14px rgb(0 0 0/.3);
  --c-money:#3d2f14; --c-money-ink:#f3c86b; --c-medical:#3f2323; --c-medical-ink:#f4a6a6; --c-tax:#242e45; --c-tax-ink:#a9c0f0;
  --c-move:#1c3634; --c-move-ink:#8fd6cf; --c-tools:#2f2742; --c-tools-ink:#c9b7ee; --c-talk:#223622; --c-talk-ink:#a9dba3;
  --c-care:#40261f; --c-care-ink:#f3b3a3; --c-leisure:#3c3414; --c-leisure-ink:#f2dd8a;
  color-scheme:dark}}
:root[data-contrast="high"]{
  --bg:#000; --paper:#000; --ink:#fff; --sub:#fff; --line:#fff; --edge:#fff;
  --accent:#ffd166; --accent-dark:#b38f3a; --accent-ink:#000; --accent-soft:#000; --accent-text:#ffd166; --gold:#ffd166; --gold-ink:#000; --gold-soft:#000;
  --link:#ffd166; --focus:#fff; --invalid:#ff8a80;
  --yes:#7dff9a; --yes-bg:#000; --maybe:#ffe14d; --maybe-bg:#000; --no:#fff; --no-bg:#000;
  --shadow:none; --press:none;
  --c-money:#000; --c-money-ink:#fff; --c-medical:#000; --c-medical-ink:#fff; --c-tax:#000; --c-tax-ink:#fff; --c-move:#000; --c-move-ink:#fff;
  --c-tools:#000; --c-tools-ink:#fff; --c-talk:#000; --c-talk-ink:#fff; --c-care:#000; --c-care-ink:#fff; --c-leisure:#000; --c-leisure-ink:#fff;
  color-scheme:dark}
:root[data-contrast="high"] .ic{border:2px solid #fff}
:root[data-contrast="high"] :is(.btn,.tile,.door,.tool,.tel-btn,.memo-btn,.chip,.choice,.toc a,.seg label,.office,.card,.q,details.area,details.refine,details.more,.res-hero,.local-top,.contact-card){border-width:2px}
:root[data-contrast="high"] .badge{border:1.5px solid currentColor}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-padding-top:12px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:1rem;line-height:1.85;letter-spacing:.015em;overflow-wrap:anywhere;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--f-head);font-weight:700;line-height:1.45;letter-spacing:.02em;word-break:auto-phrase;text-wrap:pretty}
h1{font-size:clamp(1.6rem,5vw,2.2rem);margin:0 0 .5em}
h2{font-size:1.45rem;margin:2.4em 0 .7em}
h2:has(>.ic){display:flex;align-items:center;gap:.5em}
h2>.ic{width:1.6em;height:1.6em;flex:none}
h3{font-size:1.15rem;margin:0}
p{margin:.6em 0}
a{color:var(--link);text-decoration-thickness:1.5px;text-underline-offset:.22em}
a:hover{text-decoration-thickness:3px}
.num{font-family:var(--f-num);font-variant-numeric:tabular-nums;white-space:nowrap}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px;box-shadow:0 0 0 3px var(--paper),0 0 0 9px var(--focus)}
h1[tabindex="-1"]:focus-visible,h2[tabindex="-1"]:focus-visible,main:focus-visible,[id^="rule-"]:focus-visible{outline:none;box-shadow:none}
html:not(.js) .js-only{display:none!important}
.wrap{max-width:62rem;margin-inline:auto;padding-inline:max(16px,env(safe-area-inset-left,0px)) max(16px,env(safe-area-inset-right,0px))}
.measure{max-width:42rem}
.skip{position:absolute;left:-9999px;top:8px;z-index:20;background:var(--ink);color:var(--bg);padding:10px 16px;font-weight:700}
.skip:focus{left:16px}
.lead{font-size:1.08rem;max-width:42rem;color:var(--sub)}
h2+.lead{margin-top:-.4em}
svg.ico{width:1.25em;height:1.25em;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.3em}
.sprite{position:absolute;width:0;height:0;overflow:hidden}

/* 困りごとのアイコン（色つきの丸い地に線画） */
.ic{display:inline-grid;place-items:center;width:2.6em;height:2.6em;border-radius:50%;background:var(--c-bg,var(--accent-soft));color:var(--c-ink,var(--accent-text));flex:none}
.ic svg{width:60%;height:60%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ic.money{--c-bg:var(--c-money);--c-ink:var(--c-money-ink)}
.ic.medical{--c-bg:var(--c-medical);--c-ink:var(--c-medical-ink)}
.ic.tax{--c-bg:var(--c-tax);--c-ink:var(--c-tax-ink)}
.ic.move{--c-bg:var(--c-move);--c-ink:var(--c-move-ink)}
.ic.tools{--c-bg:var(--c-tools);--c-ink:var(--c-tools-ink)}
.ic.talk{--c-bg:var(--c-talk);--c-ink:var(--c-talk-ink)}
.ic.care{--c-bg:var(--c-care);--c-ink:var(--c-care-ink)}
.ic.leisure{--c-bg:var(--c-leisure);--c-ink:var(--c-leisure-ink)}

/* 押せるもの：角丸の面、縁、下に影。読むものと見分けるため、本文には面をつけない */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:56px;padding:12px 28px;font-family:var(--f-head);font-weight:700;font-size:1.08rem;line-height:1.35;background:var(--accent);color:var(--accent-ink);border:2px solid var(--accent);border-radius:999px;text-decoration:none;cursor:pointer;box-shadow:var(--press)}
.btn:hover{background:var(--accent-dark);border-color:var(--accent-dark);color:var(--accent-ink)}
.btn:active{transform:translateY(2px);box-shadow:none}
.btn.big{min-height:68px;padding-inline:36px;font-size:1.25rem}
.btn.sub{background:var(--paper);color:var(--accent-text);border-color:var(--accent);box-shadow:none}
.btn.sub:hover{background:var(--accent-soft);color:var(--accent-text)}
.btn small{font-family:var(--f-body);font-weight:400;font-size:.8rem;opacity:.9}
.linkbtn{font:inherit;font-family:var(--f-head);font-weight:700;min-height:48px;padding:8px 4px;background:none;border:0;color:var(--link);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:.22em;cursor:pointer;text-align:left}
.linkbtn:hover{text-decoration-thickness:3px}
.tool{font:inherit;font-family:var(--f-head);font-weight:700;font-size:.85rem;min-height:44px;padding:4px 14px;border:1.5px solid var(--edge);border-radius:999px;background:var(--paper);color:var(--ink);cursor:pointer}
.tool:hover{border-color:var(--accent)}
.tool[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.tool[aria-pressed="true"]::before{content:"✓ "}
.textlink{font-family:var(--f-head);font-weight:700;display:inline-flex;align-items:center;gap:.3em;min-height:44px}

/* 表示の設定 */
.settings .wrap{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;justify-content:flex-end;padding-block:8px}
.set-grp{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.set-lab{font-size:.85rem;font-weight:700;color:var(--sub)}
.set-msg{flex-basis:100%;margin:0;font-size:.85rem;color:var(--sub);text-align:right}
.set-msg:empty{display:none}
@media (max-width:640px){.set-lab{display:none}.settings .wrap{justify-content:flex-start;gap:6px 8px;padding-block:6px}.tool{font-size:.8rem;padding:4px 11px}.nav a{padding:4px 10px;font-size:.9rem}.site-head .wrap{gap:0 12px;padding-block:6px}}

/* ヘッダー（上端に青緑の帯） */
.site-head{background:var(--paper);border-top:6px solid var(--accent);border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;flex-wrap:wrap;gap:4px 20px;align-items:center;padding-block:10px}
.brand{font-family:var(--f-head);font-size:1.2rem;font-weight:700;color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;gap:10px;min-height:48px}
.brand small{font-size:.68em;font-weight:500;display:block;line-height:1.2;color:var(--sub)}
.brand .mark{width:40px;height:40px;flex:none;border-radius:12px;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center}
.brand .mark svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.nav ul{display:flex;flex-wrap:wrap;gap:2px;margin:0;padding:0;list-style:none}
.nav a{display:flex;align-items:center;min-height:44px;padding:4px 12px;color:var(--ink);text-decoration:none;font-family:var(--f-head);font-weight:700;font-size:.95rem;border-radius:999px}
.nav a:hover{background:var(--accent-soft);color:var(--accent-text)}
.nav a[aria-current="page"]{background:var(--ink);color:var(--bg)}
.count{font-family:var(--f-num);margin-left:.3em}

main{padding-block:28px 72px}
main:has(> .hero){padding-top:0}

/* 注意の箱：読むもの。縁取りだけで、面は薄く */
.note{padding:14px 20px 14px 18px;background:var(--paper);margin:1.4em 0;border:1px solid var(--line);border-left:6px solid var(--maybe);border-radius:var(--r-s)}
.note p{margin:.2em 0}
.note b:first-child{display:block;font-family:var(--f-head);font-size:1.05rem}

/* トップのヒーロー */
.hero{background:linear-gradient(180deg,var(--accent-soft) 0%,var(--bg) 100%)}
:root[data-contrast="high"] .hero{background:#000;border-bottom:1px solid #fff}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px 40px;align-items:center;padding-block:clamp(28px,5vw,64px) clamp(24px,4vw,44px)}
@media (max-width:760px){.hero .wrap{grid-template-columns:minmax(0,1fr)}}
:root[data-size="xl"] .hero .wrap{grid-template-columns:minmax(0,1fr)}
.hero h1{font-size:clamp(1.75rem,5.2vw,2.6rem);line-height:1.45;margin:0;max-width:18em}
.hero p{max-width:30em;font-size:1.1rem;margin:.9em 0 1.4em}
.hero-acts{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center}
.steps3{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:h}
.steps3 li{counter-increment:h;display:flex;align-items:center;gap:14px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:12px 16px;font-family:var(--f-head);font-weight:700;line-height:1.5;box-shadow:var(--shadow)}
.steps3 li::before{content:counter(h);flex:none;width:2em;height:2em;border-radius:50%;background:var(--gold);color:var(--gold-ink);display:grid;place-items:center;font-family:var(--f-num);font-size:1.05rem}
.steps3 li small{display:block;font-family:var(--f-body);font-weight:400;font-size:.85rem;color:var(--sub)}
.steps3 .ic{margin-left:auto;width:2.3em;height:2.3em}
.city-hero .wrap{display:block;padding-block:clamp(24px,4vw,44px) 8px}
.city-hero h1{margin:0}
.city-hero .lead{margin:.5em 0 1.2em;max-width:42rem;font-size:1.08rem}

/* 困りごとのタイル：押せる面 */
.tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));gap:12px}
.tile{display:flex;align-items:center;gap:12px;min-height:72px;height:100%;padding:12px 14px 12px 12px;background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r);color:var(--ink);text-decoration:none;font-family:var(--f-head);font-weight:700;line-height:1.4;box-shadow:var(--shadow)}
.tile:hover{border-color:var(--accent);background:var(--accent-soft)}
.tile .ic{width:3em;height:3em}
.tile>span:not(.ic,.go){flex:1;word-break:auto-phrase}
.tile small{display:block;font-family:var(--f-body);font-weight:400;font-size:.85rem;color:var(--sub)}
.tile .go{flex:none;color:var(--accent-text);font-size:1.3rem;line-height:1}

/* ほかにできること：扉 */
.doors{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:12px}
.door{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;height:100%;padding:16px;background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r);color:var(--ink);text-decoration:none;box-shadow:var(--shadow)}
.door:hover{border-color:var(--accent);background:var(--accent-soft)}
.door .ic{grid-row:1/3;width:3em;height:3em}
.door b{font-family:var(--f-head);font-size:1.15rem;line-height:1.4;word-break:auto-phrase}
.door .d{color:var(--sub);line-height:1.65;font-size:.95rem}
.door .go{grid-column:2;color:var(--accent-text);font-family:var(--f-head);font-weight:700;margin-top:4px}

/* 市区町村：開いて選ぶ */
.areas{display:grid;gap:10px}
details.area{background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
details.area>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:12px;min-height:60px;padding:10px 16px;font-family:var(--f-head);font-weight:700;font-size:1.05rem;line-height:1.45}
details.area>summary::-webkit-details-marker{display:none}
details.area>summary small{font-family:var(--f-body);font-weight:400;color:var(--sub);font-size:.85rem}
details.area>summary::after{content:"";flex:none;margin-left:auto;width:.6em;height:.6em;border-right:2.5px solid var(--accent-text);border-bottom:2.5px solid var(--accent-text);transform:rotate(45deg);transition:transform .15s}
details.area[open]>summary::after{transform:rotate(-135deg)}
.chips{list-style:none;margin:0;padding:4px 14px 14px;display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;min-height:46px;padding:4px 16px;background:var(--bg);border:1.5px solid var(--edge);border-radius:999px;color:var(--ink);text-decoration:none;font-weight:700}
.chip:hover{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-text)}

/* 質問（1画面に1つ） */
.q{background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r);padding:clamp(20px,4.5vw,40px);max-width:46rem;margin-inline:auto;box-shadow:var(--shadow)}
.q-step{display:flex;align-items:center;gap:12px;margin:0 0 10px;font-family:var(--f-head);font-weight:700;color:var(--sub)}
.dots{display:flex;gap:6px}
.dots i{width:14px;height:14px;border-radius:50%;background:var(--line)}
.dots i.on{background:var(--accent)}
.q h2{font-size:clamp(1.45rem,4.6vw,1.95rem);margin:0 0 .3em}
.q-hint{color:var(--sub);margin:0 0 1.1em}
.q h3{font-size:1rem;color:var(--sub);margin:1.2em 0 .5em}
.choices{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr))}
.choices.one{grid-template-columns:minmax(0,1fr)}
.choices.grades{grid-template-columns:repeat(3,minmax(0,1fr))}
.choices.grades.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.choice{display:flex;align-items:center;gap:14px;min-height:68px;padding:12px 18px;background:var(--paper);color:var(--ink);border:1.5px solid var(--edge);border-radius:var(--r);font:inherit;font-family:var(--f-head);font-weight:700;font-size:1.15rem;line-height:1.4;text-align:left;cursor:pointer;box-shadow:var(--shadow)}
.choice:hover{border-color:var(--accent);background:var(--accent-soft)}
.choice:active{transform:translateY(1px)}
.choice small{display:block;font-family:var(--f-body);font-weight:400;font-size:.85rem;color:var(--sub)}
.choice input{width:28px;height:28px;flex:none;margin:0;accent-color:var(--accent)}
.choice[aria-pressed="true"],.choice:has(input:checked){background:var(--accent-soft);border-color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent)}
button.choice[aria-pressed="true"]::after{content:"✓";margin-left:auto;font-family:var(--f-num);color:var(--accent-text)}
.choices.grades .choice{justify-content:center;text-align:center;font-size:1.35rem}
.choices.grades .choice[aria-pressed="true"]::after{margin-left:8px}
.choices.cities{grid-template-columns:repeat(auto-fill,minmax(min(100%,9.5rem),1fr))}
.choices.cities .choice{min-height:64px;font-size:1.1rem;padding:10px 14px}
.q-nav{display:flex;flex-wrap:wrap-reverse;gap:10px 20px;align-items:center;justify-content:space-between;margin-top:26px}
.q-nav>a{font-family:var(--f-head);font-weight:700}
.q-alt{margin:18px 0 0;padding-top:14px;border-top:1px solid var(--line)}
.age-row{display:flex;align-items:center;gap:12px;font-weight:700;font-size:1.4rem}
.age-row input{width:7.5rem;min-height:76px;font-family:var(--f-num);font-size:2rem;text-align:center}
.privacy{max-width:46rem;margin:14px auto 0;color:var(--sub);font-size:.9rem;text-align:center}
input[type=number],input[type=search],textarea,select{font:inherit;width:100%;min-height:52px;padding:8px 12px;color:var(--ink);background:var(--paper);border:1.5px solid var(--edge);border-radius:var(--r-s)}
input[aria-invalid="true"]{border-color:var(--invalid);border-width:3px}
.hint{font-size:.88rem;color:var(--sub);line-height:1.65;margin:0}
.err{font-weight:700;color:var(--invalid);margin:.8em 0 0}
.err:empty{display:none}
fieldset{border:0;padding:0;margin:0;display:grid;gap:10px;min-width:0}
legend{font-family:var(--f-head);font-weight:700;font-size:1.05rem;padding:0;margin-bottom:6px}
.field{display:grid;gap:4px}
.field label{font-family:var(--f-head);font-weight:700}
.check{display:flex;gap:12px;align-items:flex-start;min-height:46px;line-height:1.6;padding:6px 0;cursor:pointer}
.check input{width:26px;height:26px;margin:1px 0 0;flex:none;accent-color:var(--accent)}

/* トップの小窓 */
dialog.quick{width:min(100% - 24px,36rem);max-height:calc(100dvh - 24px);overflow:auto;padding:clamp(18px,4vw,30px);background:var(--paper);color:var(--ink);border:1.5px solid var(--edge);border-top:6px solid var(--accent);border-radius:var(--r)}
dialog.quick::backdrop{background:rgb(0 0 0/.55)}
.quick form{display:grid;gap:20px}
.quick-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.quick h2{margin:0;font-size:1.4rem}
.quick-top .tool{flex:none;white-space:nowrap}
.quick .q-hint{margin:0}
.quick .field>label,.quick legend{font-weight:700;font-size:1.05rem}
.quick fieldset{gap:0}
.quick-sub{display:grid;gap:10px;padding:2px 0 12px 38px}
.quick-sub .field>label{font-size:.9rem;color:var(--sub)}
.quick .age-row input{width:7rem;min-height:56px;font-size:1.4rem}
.quick .q-nav{margin-top:0}

/* 結果 */
.res-hero{background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r);padding:clamp(18px,4vw,32px);box-shadow:var(--shadow)}
.res-hero h2{margin:0 0 .3em;font-size:clamp(1.4rem,4.6vw,1.9rem)}
.res-hero h2 b{font-family:var(--f-num);font-size:1.45em;color:var(--yes);margin-right:.08em}
.answers{display:flex;flex-wrap:wrap;gap:2px 12px;align-items:baseline;margin:14px 0 0;padding:8px 16px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-s)}
.answers b{font-size:.85rem;color:var(--sub)}
.acts{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0}
details.refine{margin:16px 0 0;background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r)}
details.refine>summary{cursor:pointer;list-style:none;padding:12px 18px;font-family:var(--f-head);font-weight:700;font-size:1.05rem;min-height:56px;display:flex;align-items:center;gap:10px}
details.refine>summary::-webkit-details-marker{display:none}
details.refine>summary::after{content:"";flex:none;margin-left:auto;width:.6em;height:.6em;border-right:2.5px solid var(--accent-text);border-bottom:2.5px solid var(--accent-text);transform:rotate(45deg)}
details.refine[open]>summary::after{transform:rotate(-135deg)}
details.refine>summary small{display:block;font-family:var(--f-body);font-weight:400;font-size:.85rem;color:var(--sub)}
.refine-body{padding:4px 18px 20px;display:grid;gap:20px;max-width:34rem}
.seg{display:flex;flex-wrap:wrap;gap:8px}
.seg label{display:flex;align-items:center;gap:8px;min-height:50px;padding:6px 18px;border:1.5px solid var(--edge);border-radius:999px;background:var(--paper);font-weight:700;cursor:pointer}
.seg label:has(input:checked){background:var(--accent-soft);border-color:var(--accent);color:var(--accent-text)}
.seg input{width:22px;height:22px;margin:0;accent-color:var(--accent)}
.res-h{display:flex;align-items:center;gap:12px;font-size:1.35rem;margin:2em 0 .4em}
.res-h .mk{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-family:var(--f-num);font-size:1.25rem}
.res-h.yes .mk{background:var(--yes-bg);color:var(--yes)}
.res-h.maybe .mk{background:var(--maybe-bg);color:var(--maybe)}
.res-lead{color:var(--sub);margin:0 0 1em}
details.more{margin-top:2em;background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r);padding:4px 18px}
details.more>summary{cursor:pointer;min-height:52px;padding-block:12px;font-weight:700;font-family:var(--f-head)}
details.more[open]{padding-bottom:18px}
.next-box{margin-top:2.4em;background:var(--accent-soft);border-radius:var(--r);padding:clamp(18px,4vw,30px)}
:root[data-contrast="high"] .next-box{border:2px solid #fff}
.next-box h3{font-size:1.3rem;margin:0 0 .4em;display:flex;align-items:center;gap:.4em}
.bring{padding-left:1.3em;margin:.4em 0}
.bring li{margin:.35em 0}

/* 制度のカード：要点を先に、くわしくは開く */
.cards{display:grid;gap:14px}
.card{background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r);padding:18px 18px 12px;display:grid;gap:8px;scroll-margin-top:12px;box-shadow:var(--shadow)}
.card.yes{border-left:8px solid var(--yes)}
.card.maybe{border-left:8px solid var(--maybe)}
.card.no{border-left:8px solid var(--no)}
.card p{margin:0}
.card .why,.card .plain,.card .gist,.card .detail-body,.card .who{max-width:46rem}
.card h3,.card h4{font-size:1.25rem;line-height:1.4;margin:0;display:flex;gap:10px;align-items:flex-start}
.card h3 .ic,.card h4 .ic{width:2em;height:2em;margin-top:.05em}
.card-top{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
.lv{font-size:.85rem;color:var(--sub);padding:0 10px;border:1px solid var(--line);border-radius:999px}
.badge{display:inline-flex;align-items:center;gap:.3em;font-family:var(--f-head);font-size:.9rem;font-weight:700;border-radius:999px;padding:2px 12px}
.badge.yes{color:var(--yes);background:var(--yes-bg)}.badge.maybe{color:var(--maybe);background:var(--maybe-bg)}.badge.no{color:var(--no);background:var(--no-bg)}
.amt{font-family:var(--f-head);font-weight:700;font-size:1.3rem;color:var(--accent-text);line-height:1.4}
.why b,.who b{display:block;font-size:.85rem;color:var(--sub);font-weight:700}
.card-acts{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:4px}
.tel-btn{display:inline-flex;flex-wrap:wrap;align-items:center;gap:0 .6em;min-height:52px;max-width:100%;padding:6px 20px;background:var(--paper);color:var(--ink);border:2px solid var(--accent);border-radius:999px;font-weight:700;font-size:1.1rem;line-height:1.35;text-decoration:none}
.tel-btn:hover{background:var(--accent-soft);color:var(--ink)}
.tel-btn small{font-family:var(--f-head);font-size:.85rem;color:var(--accent-text)}
.tel-note{display:inline-block;margin-left:.7em;font-size:.9rem;color:var(--sub)}
.memo-btn{font:inherit;font-family:var(--f-head);font-weight:700;min-height:52px;padding:4px 20px;background:var(--paper);color:var(--ink);border:1.5px solid var(--edge);border-radius:999px;cursor:pointer}
.memo-btn:hover{border-color:var(--accent)}
.memo-btn::before{content:"＋ "}
.memo-btn[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.memo-btn[aria-pressed="true"]::before{content:"✓ "}
details.detail{margin-top:4px;border-top:1px solid var(--line)}
details.detail>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;min-height:48px;padding:8px 2px;font-family:var(--f-head);font-weight:700;color:var(--link)}
details.detail>summary::-webkit-details-marker{display:none}
details.detail>summary::before{content:"";flex:none;width:.55em;height:.55em;border-right:2.5px solid currentColor;border-bottom:2.5px solid currentColor;transform:rotate(45deg);margin:0 .3em .25em .2em}
details.detail[open]>summary::before{transform:rotate(-135deg);margin-bottom:-.15em}
details.detail[open]>summary .o{display:none}
details.detail:not([open])>summary .c{display:none}
.detail-body{display:grid;gap:10px;padding:2px 2px 10px}
.ask{display:grid;gap:4px}
.ask-h{font-size:.85rem;font-weight:700;color:var(--sub)}
.ask-n small{display:block;color:var(--sub);font-size:.9rem}
.ask-other{font-size:.95rem}
.sources{font-size:.85rem;color:var(--sub);line-height:1.6}

/* 窓口の連絡先（市区町村サイトの先頭など） */
.contact-card{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin:1em 0;padding:14px 18px;background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.contact-card>.ic{width:2.6em;height:2.6em}
.contact-card>span:not(.ic){flex:1 1 14rem}
.contact-card b{display:block;font-family:var(--f-head)}
.contact-card small{color:var(--sub);font-size:.9rem}
.contact-card .tel-btn{margin-left:auto}

/* 市区町村を探す・市区町村のページ */
.group-h{font-size:1.1rem;margin:1.4em 0 .5em;color:var(--sub)}
.city-links{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.city-links a{display:flex;align-items:center;min-height:48px;padding:4px 16px;background:var(--paper);border:1.5px solid var(--edge);border-radius:999px;color:var(--ink);text-decoration:none;font-weight:700}
.city-links a:hover{border-color:var(--accent);background:var(--accent-soft)}
.office-links{font-size:.95rem;margin-top:4px!important}
.filter{max-width:26rem;margin:1.2em 0}
.crumb{font-size:.9rem;color:var(--sub);margin:0 0 .6em}
#city-note .tel-btn{margin-top:6px}
.local-top{margin:1.4em 0;padding:18px 20px;background:var(--paper);border:1.5px solid var(--line);border-top:6px solid var(--accent);border-radius:var(--r);box-shadow:var(--shadow)}
.local-top h2{margin:0 0 .4em;font-size:1.2rem}
.local-top ul{list-style:none;margin:0;padding:0}
.local-top li{display:flex;flex-wrap:wrap;align-items:center;gap:0 12px;min-height:44px;padding:4px 0;border-top:1px solid var(--line)}
.local-top li a{font-weight:700}
.local-top li span{font-size:.92rem;color:var(--sub)}
.local-top p{margin:.6em 0 0}

/* 一覧の目次 */
.toc{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.toc a{display:flex;align-items:center;min-height:48px;padding:4px 18px;background:var(--paper);border:1.5px solid var(--edge);border-radius:999px;color:var(--ink);text-decoration:none;font-family:var(--f-head);font-weight:700}
.toc a:hover{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-text)}
.cat-h{scroll-margin-top:12px}

/* 手順（番号は金茶） */
.steps{list-style:none;counter-reset:s;margin:1em 0;padding:0;max-width:42rem;display:grid;gap:10px}
.steps li{counter-increment:s;position:relative;padding:12px 4px 12px 58px;min-height:56px}
.steps li::before{content:counter(s);position:absolute;left:4px;top:10px;width:2.1em;height:2.1em;border-radius:50%;background:var(--gold);color:var(--gold-ink);display:grid;place-items:center;font-family:var(--f-num);font-weight:700;font-size:1.05rem;line-height:1}
.steps li+li{border-top:1px dashed var(--line)}
.updated{font-size:.85rem;color:var(--sub)}

/* 相談先 */
.offices{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,19rem),1fr))}
.office{background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r);padding:16px 18px;display:grid;gap:6px;align-content:start;box-shadow:var(--shadow)}
.office h3{margin:0;font-size:1.15rem}
.office p{margin:0}

/* 窓口メモ */
.memo-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start}
@media (max-width:900px){.memo-grid{grid-template-columns:minmax(0,1fr)}}
:root[data-size="xl"] .memo-grid{grid-template-columns:minmax(0,1fr)}
form.panel{background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r);padding:22px;display:grid;gap:24px;box-shadow:var(--shadow)}
.sheet{border:1.5px solid var(--ink);border-radius:var(--r);overflow:hidden;background:var(--paper)}
.sheet-head{height:8px;background:var(--accent)}
.sheet-body{padding:20px}
.sheet h2{margin:0 0 .4em;font-size:1.5rem}
.sheet h3{margin:1.1em 0 .3em;font-size:1rem;border-bottom:1px solid var(--ink)}
.sheet ul{margin:.3em 0;padding-left:1.3em}
.say{font-size:1.45rem;font-weight:700;line-height:1.5}
.say li{margin:.3em 0}
.sheet .note-text{white-space:pre-wrap;font-size:1.2rem}
.sheet-foot{font-size:.85rem;color:var(--sub);margin-top:1.2em}
.memo-empty{color:var(--sub)}
.remove{font:inherit;font-size:.85rem;min-height:44px;padding:2px 10px;margin-left:.4em;background:transparent;color:var(--link);border:0;text-decoration:underline;cursor:pointer}

/* フッター */
.site-foot{border-top:1px solid var(--line);padding-block:30px 44px;font-size:.92rem;background:var(--paper)}
.site-foot p{margin:.5em 0}
.foot-links{display:flex;flex-wrap:wrap;gap:4px 18px;list-style:none;margin:0 0 1em;padding:0}
.foot-links a{display:inline-flex;align-items:center;min-height:44px;font-weight:700}
.foot-cities{margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.site-foot .foot-cities-h{font-family:var(--f-head);font-size:1.1rem;font-weight:700;margin:0 0 .4em}
.site-foot .foot-group-h{font-weight:700;color:var(--sub);margin:1em 0 .2em}
.foot-group ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 4px}
.foot-group a{display:inline-flex;align-items:center;min-height:44px;padding:2px 10px 2px 0}
.foot-group a[aria-current="page"]{font-weight:700;color:var(--ink);text-decoration:none}
.proto{display:inline-block;font-family:var(--f-head);font-weight:700;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:0 12px;margin-right:.3em}

@media (prefers-reduced-motion:reduce){.btn:active,.choice:active{transform:none}details.area>summary::after{transition:none}}

@media print{
  :root{--bg:#fff;--paper:#fff;--ink:#000;--sub:#222;--line:#777;--edge:#555;--link:#000;--accent-soft:#fff;--accent-text:#000;--shadow:none;--press:none;font-size:11pt}
  .settings,.nav,.site-foot .no-print,.no-print,.skip,.memo-btn,.q,.privacy,form.panel,.btn{display:none!important}
  .memo-grid{display:block}
  .site-head{border-top:0;border-bottom:1px solid #000}
  .hero{background:none}
  details.more{display:none}
  details.detail>summary{display:none}
  .card,.office{break-inside:avoid}
  main{padding:8pt 0}
  .site-foot{padding-block:8pt}
  .sheet-head{display:none}
  a[target="_blank"]::after{content:" （" attr(href) "）";font-size:.8em;word-break:break-all}
}
/* 印刷のときは「くわしく見る」の中も出す（開くのは app.js。対応するブラウザでは、閉じたままでも中を出す） */
@media print{details.detail::details-content{content-visibility:visible;display:block}}

/* 結果の印刷用の一覧（A4縦1枚）。画面には出さない。
   中の見た目は印刷のとき以外にも効かせておく（収まる文字の大きさを、画面の外で同じ見た目にして測るため）。 */
#a4{display:none;width:190mm;color:#000;line-height:1.45;letter-spacing:0;font-family:var(--f-body)}
#a4 .a4-head{display:flex;justify-content:space-between;align-items:baseline;gap:1em;border-bottom:1.5pt solid #000;padding-bottom:.3em}
#a4 h2{margin:0;font-size:1.7em;letter-spacing:.06em;line-height:1.3}
#a4 p{margin:0}
#a4 .a4-cond{margin:.6em 0}
#a4 table{width:100%;border-collapse:collapse;table-layout:fixed}
#a4 th,#a4 td{border:.5pt solid #555;padding:.3em .5em;text-align:left;vertical-align:top;font-weight:400}
#a4 thead th{font-weight:700;background:#eee;-webkit-print-color-adjust:exact;print-color-adjust:exact}
#a4 tbody th{font-weight:700}
#a4 th:nth-child(1),#a4 td:nth-child(1){width:2.2em;text-align:center}
#a4 th:nth-child(2){width:24%}
#a4 th:nth-child(4),#a4 td:nth-child(4){width:26%}
#a4 tr{break-inside:avoid}
#a4 .a4-end{display:flex;justify-content:space-between;align-items:flex-end;gap:1.2em;margin-top:.6em;break-inside:avoid}
#a4 .a4-foot{font-size:.92em}
#a4 .a4-qr{flex:none;width:22mm;text-align:center;font-size:6.5pt;line-height:1.2}
#a4 .a4-qr svg{display:block;width:22mm;height:22mm}
@page{size:A4 portrait;margin:10mm}
@media print{
  body:has(#a4:not(:empty)) :is(.settings,.site-head,.site-foot){display:none!important}
  main:has(#a4:not(:empty)) *:not(:has(#a4)):not(#a4):not(#a4 *){display:none!important}
  main:has(#a4:not(:empty)){padding:0}
  main .wrap:has(#a4:not(:empty)){max-width:none;padding:0}
  #a4:not(:empty){display:block!important}
}
