/* 介護保険料シミュレーターのサイト CSS。ページの型 v1 の共通部品（/assets/tpl-v1/page-template-v1.css）の後に読む。 */
:root{
  --tpl-accent:#0f766e;
  --tpl-card-bg:#effaf8;
  --tpl-btn-bg:#0f766e;
  --tpl-head-bg:#e9f5f3;
  --tpl-map-bg:#f7fbfa;
  --bg:#fff;
  --text:#222;
  --muted:#666;
  --line:#e3e8e7;
}
*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{ margin:0; background:var(--bg); color:var(--text); font-family:system-ui,-apple-system,"Hiragino Sans","Noto Sans JP","Yu Gothic UI",sans-serif; line-height:1.7; font-size:16px; }
.container{ max-width:760px; margin:0 auto; padding:0 16px; }
a{ color:#0b5f8a; }
h1{ font-size:1.35em; line-height:1.45; margin:14px 0 8px; }
h2{ font-size:1.15em; line-height:1.45; margin:26px 0 8px; padding-left:10px; border-left:4px solid var(--tpl-accent); scroll-margin-top:12px; }
h3{ font-size:1.02em; margin:16px 0 6px; }
h4{ font-size:.98em; margin:12px 0 4px; }
p{ margin:0 0 10px; }
.muted{ color:var(--muted); font-size:.9em; }
.small{ font-size:.85em; }

.site-header{ border-bottom:1px solid var(--line); background:#fff; }
.site-header .container{ display:flex; align-items:baseline; gap:10px; padding-top:10px; padding-bottom:8px; flex-wrap:wrap; }
.site-title{ font-weight:700; color:var(--tpl-accent); text-decoration:none; font-size:1.05em; }
.site-sub{ color:var(--muted); font-size:.8em; }
.breadcrumb{ list-style:none; display:flex; flex-wrap:wrap; gap:4px; padding:0; margin:10px 0 0; font-size:.8em; color:var(--muted); }
.breadcrumb li+li::before{ content:"›"; margin-right:4px; }
.site-footer{ border-top:1px solid var(--line); margin-top:36px; padding:16px 0 28px; font-size:.85em; color:var(--muted); background:#fafcfc; }
.site-footer nav{ display:flex; flex-wrap:wrap; gap:6px 14px; margin-bottom:8px; }

/* 表 */
.table-wrap{ overflow-x:auto; margin:0 0 10px; }
table.stages{ border-collapse:collapse; width:100%; font-size:.86em; line-height:1.45; }
table.stages th, table.stages td{ border:1px solid var(--line); padding:6px 6px; vertical-align:top; }
table.stages th{ background:var(--tpl-head-bg); text-align:left; white-space:nowrap; }
table.stages td.num{ text-align:right; white-space:nowrap; }
table.stages tr.is-base td{ background:#fffbe6; }

/* 試算フォーム */
.calc{ border:1px solid var(--line); border-radius:6px; padding:12px 12px 6px; margin:0 0 16px; background:#fcfefe; }
.calc fieldset{ border:none; margin:0 0 10px; padding:0; }
.calc legend{ font-weight:700; font-size:.95em; margin-bottom:4px; padding:0; }
.calc .opts{ display:flex; flex-wrap:wrap; gap:6px 14px; }
.calc label.opt{ display:inline-flex; align-items:center; gap:4px; font-size:.95em; }
.calc label.field{ display:block; font-weight:700; font-size:.95em; margin:0 0 10px; }
.calc label.field span.hint{ display:block; font-weight:400; font-size:.82em; color:var(--muted); }
.calc input[type=number], .calc select{ width:100%; font-size:16px; padding:8px; border:1px solid #bbb; border-radius:4px; margin-top:4px; }
.calc button{ display:block; width:100%; padding:14px; font-size:16px; font-weight:700; color:#fff; background:var(--tpl-accent); border:none; border-radius:6px; margin:4px 0 10px; cursor:pointer; }
.calc [hidden]{ display:none !important; }
.result{ border-top:2px solid var(--tpl-accent); padding-top:10px; margin-top:4px; }
.result .big{ font-size:1.3em; font-weight:700; margin:0 0 4px; }
.result .stage{ font-weight:700; margin:0 0 2px; }
.result ul{ margin:4px 0 8px; padding:0; list-style:none; font-size:.88em; }
.result ul li{ margin:0 0 4px; }
.result ul li::before{ content:"※"; }
.result .disclaimer{ background:#fff8e1; border-left:4px solid #f2b705; padding:8px 10px; font-size:.9em; margin:8px 0; }
.result .schedule{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; font-size:.88em; margin:4px 0 8px; }
.result .schedule span{ border:1px solid var(--line); border-radius:4px; padding:4px; text-align:center; }

/* 広告の枠（ASP 提携前。場所だけ確保して表示しない） */
.ad-slot[hidden]{ display:none; }

/* 一覧 */
ul.city-list{ list-style:none; padding:0; margin:0 0 10px; display:grid; grid-template-columns:repeat(auto-fill,minmax(9.5em,1fr)); gap:4px 10px; }
ul.city-list li{ font-size:.95em; }
.pref-block{ margin:0 0 6px; }

/* 福岡県介護保険広域連合の町ごとの情報 */
.town-info{ border:1px solid var(--line); border-radius:6px; padding:8px 10px 2px; margin:0 0 14px; background:#fafcfc; }

.calc label.field span.hint.hint-strong{ color:#b3261e; font-weight:700; font-size:.86em; }

/* 解説へのリンク */
ul.guide-links{ padding-left:1.2em; margin:0 0 10px; }
ul.guide-links li{ margin:2px 0; }