/* =========================================================
   下層ページ用スタイル（detail / emergency / blog）
   2026-09-28 作成・同日 構造に合わせて修正

   これらのページは羅針盤リブランド時に取り残され、旧クラス体系
   （wrap / hdr / pain / caution / howto / routes …）のまま残っていた。
   style.css はLP用に書き換わったため定義が消え、本文が1行90字・
   金茶色・余白ゼロという状態で表示されていた。
   HTMLは触らず、CSS側で現行ブランドに寄せている。

   配色・書体は style.css の :root をそのまま使う。
   ========================================================= */

/* ---------- 土台 ---------- */
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:17px;line-height:2.05;
  letter-spacing:.02em;font-feature-settings:"palt" 1;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--ink)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

.wrap{max-width:720px;margin-inline:auto;padding-inline:26px}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--paper);padding:12px 16px;z-index:100}
.skip:focus{left:0}

/* ---------- ヘッダー・フッター ---------- */
.hdr{
  position:sticky;top:0;z-index:50;
  background:rgba(249,246,238,.94);backdrop-filter:saturate(180%) blur(10px);
  border-bottom:1px solid var(--line);
}
.hdr-in{display:flex;align-items:center;gap:12px;height:62px}
.hdr-in img{width:32px;height:32px;flex:none;border-radius:50%}
.hdr-name{font-family:var(--serif);font-size:15px;letter-spacing:.1em;text-decoration:none;margin-right:auto;line-height:1.5}
.hdr-name small{display:block;font-size:11px;letter-spacing:.06em;color:var(--muted);font-family:var(--sans)}

.ftr{margin-top:90px;padding:56px 0 64px;background:var(--ink);color:var(--paper);text-align:center}
.ftr a{color:var(--paper)}
.fname{font-family:var(--serif);font-size:17px;letter-spacing:.14em;margin:0 0 10px}
.ftr p{margin:6px auto;font-size:13px;line-height:1.95;color:#cfc8bb;max-width:none}
.ftr small{font-size:12px;color:#a49c8e}

/* ---------- 節と見出し ---------- */
section{padding:64px 0}
.pain{background:var(--cream)}

h1,h2,h3{font-family:var(--serif);letter-spacing:.05em;margin:0}
h1{font-size:clamp(25px,4.4vw,33px);line-height:1.75}
h2{font-size:clamp(21px,3.4vw,27px);line-height:1.8}
h3{font-size:18.5px;line-height:1.85}
h2+*,h3+*{margin-top:1.1em}

p{margin:1.45em 0 0;max-width:34em}
p:first-child{margin-top:0}
strong{font-weight:600;color:var(--ink)}
b{font-weight:600}

.eyebrow{font-size:11.5px;letter-spacing:.18em;color:var(--gold);margin:0 0 20px;line-height:1.8}
.lead{font-size:17.5px;line-height:2.1;margin-top:1.35em}
.note-small{font-size:13.5px;line-height:1.95;color:var(--muted);margin-top:1.4em}
.why,.how{font-size:16px;line-height:2;margin-top:1.2em}
.ttl{font-family:var(--serif);font-size:18px;letter-spacing:.04em}
.mid{margin-top:2.6em}

ul,ol{margin:1.4em 0 0;padding-left:1.35em;max-width:34em}
li{margin-top:.75em;line-height:2}
li:first-child{margin-top:0}

/* ---------- 注意ブロック ---------- */
.caution{
  margin-top:2.2em;padding:22px 26px;background:#fff;
  border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:3px;
}
.caution *{max-width:none}
.caution>:first-child{margin-top:0}
.caution h3{font-size:16.5px}
.caution p{font-size:15.5px;margin-top:.9em}

/* ---------- 進む道（routes）---------- */
.routes{list-style:none;padding:0;margin-top:2.2em;max-width:none;display:grid;gap:14px}
.routes>li{
  margin:0;padding:22px 24px;background:#fff;
  border:1px solid var(--line);border-radius:3px;
}
.routes .goal{
  display:flex;align-items:center;gap:10px;
  font-family:var(--serif);font-size:17.5px;letter-spacing:.04em;color:var(--ink);
}
.routes .ico{
  width:21px;height:21px;flex:none;color:var(--gold);
  margin:0 !important;vertical-align:baseline !important;
}
.routes .how{margin-top:.85em;font-size:15.5px;max-width:none;line-height:1.95}
.routes .cost{
  display:inline-block;margin-top:1.1em;padding:5px 13px;
  background:#f2efe8;border-radius:999px;
  font-size:12.5px;letter-spacing:.04em;color:var(--muted);line-height:1.7;
}

/* ---------- 渡せる／渡せない ---------- */
.can{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:2.2em}
.can>div{padding:22px 24px;border-radius:3px;border:1px solid var(--line);font-size:15px;line-height:1.95}
.can .yes{background:#fff;border-color:var(--gold)}
.can .no{background:#f2efe8;border-color:#c3bdb0}
.can b{
  display:block;font-family:var(--serif);font-size:16.5px;
  letter-spacing:.04em;margin-bottom:.7em;
}
.can .yes b{color:var(--gold)}
.can .no b{color:#6e6a60}

/* ---------- 事実リスト ---------- */
.facts{list-style:none;padding:0;margin-top:2em;max-width:none;display:grid;gap:11px}
.facts>li{
  margin:0;padding:16px 20px;background:#fff;
  border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:3px;
  font-size:15.5px;line-height:1.95;
}

/* ---------- 手順 ---------- */
.howto{margin-top:2.2em;padding:26px 28px;background:#fff;border:1px solid var(--line);border-radius:3px}
.howto>:first-child{margin-top:0}
.howto-head{display:flex;align-items:baseline;gap:12px}
.howto-no{flex:none;font-family:var(--serif);font-size:16px;color:var(--gold)}
.howto p,.howto ul,.howto ol{max-width:none}
.howto ol{padding-left:1.4em}

/* ---------- ラベル＋説明（bignum）---------- */
.bignum{
  display:flex;gap:16px;align-items:flex-start;
  margin-top:1.8em;padding:18px 20px;background:var(--cream);
  border:1px solid var(--line);border-radius:3px;
}
.bignum .n{
  flex:none;font-family:var(--serif);font-size:14px;letter-spacing:.08em;
  color:var(--gold);padding:3px 11px;border:1px solid var(--gold);border-radius:999px;
  line-height:1.7;white-space:nowrap;
}
.bignum .t{font-size:15px;line-height:1.95}
.bignum .t b{display:block;margin-bottom:.25em}

/* ---------- 置き場所（○×）---------- */
.where{list-style:none;padding:0;margin-top:2em;max-width:none;display:grid;gap:11px}
.where>li{
  position:relative;margin:0;padding:16px 20px 16px 48px;
  background:#fff;border:1px solid var(--line);border-radius:3px;
  font-size:15.5px;line-height:1.95;
}
.where>li:before{position:absolute;left:18px;top:16px;font-size:17px;line-height:1.95}
.where .ok:before{content:"\25CB";color:var(--gold)}
.where .ng:before{content:"\00D7";color:#9a9186}
.where .ng{background:#f2efe8}

/* ---------- 補助 ---------- */
.goal,.cost{font-size:inherit}
/* 旧イラスト（ill-phone-paper.svg / il-emergency.svg）は2026-09-28に削除。
   線画の質がLPの水準に合わないため。再掲する場合はここにスタイルを戻す。 */

/* ---------- ボタン ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  font-family:var(--sans);font-size:15px;font-weight:600;line-height:1.5;
  padding:.9em 1.7em;border-radius:3px;border:1px solid transparent;
  text-decoration:none;cursor:pointer;min-height:48px;
  transition:background-color .18s,color .18s,border-color .18s;
}
.btn-primary,.btn-onnavy{background:var(--gold);color:#fff}
.btn-primary:hover,.btn-onnavy:hover{background:#7d5f32}
.btn-sm{font-size:13px;padding:.6em 1.2em;min-height:40px}
.btn-block{display:flex;width:100%}
.btn-soft,.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn-soft:hover,.btn-ghost:hover{border-color:var(--gold)}
.btn-cta{margin-top:2.6em}

/* ---------- スマホ ---------- */
@media (max-width:700px){
  body{font-size:16px;line-height:1.98}
  .wrap{padding-inline:20px}
  section{padding:50px 0}
  h3{font-size:17px}
  .lead{font-size:16.5px}
  .can{grid-template-columns:1fr}
  .caution,.howto,.routes>li{padding:18px 18px}
  .bignum{flex-direction:column;gap:10px;padding:16px 18px}
  .ftr{margin-top:64px;padding:44px 0 50px}
}

/* ---------- 図版（2026-09-28 追加）---------- */
.fig{margin:2.4em 0 0;max-width:none}
.fig img{width:100%;height:auto;border:1px solid var(--line);border-radius:3px;background:#fff}
.fig figcaption{margin-top:.7em;font-size:13px;color:var(--muted);line-height:1.8}

/* ---------- note への導線（2026-09-28 追加）---------- */
.to-note{
  margin-top:3em;padding:28px 30px;background:#fff;
  border:1px solid var(--line);border-radius:3px;
}
.to-note>:first-child{margin-top:0}
.to-note .tn-ttl{
  font-family:var(--serif);font-size:18px;letter-spacing:.04em;margin:0;
}
.to-note p{font-size:15px;margin-top:.9em;max-width:none;color:var(--muted)}
.tn-list{list-style:none;padding:0;margin:1.4em 0 0;max-width:none;display:grid;gap:9px}
.tn-list li{margin:0}
.tn-list a{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;
  padding:14px 18px;background:var(--cream);border:1px solid var(--line);
  border-radius:3px;text-decoration:none;font-size:15px;line-height:1.7;
  transition:border-color .18s,background .18s;
}
.tn-list .tn-tx{font-family:var(--serif);letter-spacing:.03em}
.tn-list a:hover{border-color:var(--gold);background:#fff}
.tn-list .tn-no{font-family:var(--serif);font-size:13px;color:var(--gold);letter-spacing:.08em;flex:none}
.tn-list .tn-ar{color:var(--gold);flex:none}
.to-note .btn{margin-top:1.6em}
@media (max-width:700px){
  .to-note{padding:22px 20px}
  .tn-list a{padding:13px 15px;font-size:14px}
}

/* ヒーロー図版：LPと同じ写実。枠なしで馴染ませる */
.fig-hero{margin-top:2.2em}
.fig-hero img{border:0;border-radius:3px}
