@charset "UTF-8";
/* ==========================================================================
   919good.jp /tools/
   設計の下敷き：廃車王（haishaou.com）の構造
     アイボリー地 → 白／クリームのカード → 黒の太枠 → オフセットの黒影
     見出しは上下の太い黒罫、要点は赤いバー、強調は黄色のマーカー
   色は 919good のコーポレートカラーに置き換えている
   ========================================================================== */

:root{
  /* ブラウザの自動ダーク化（Chrome の Auto Dark Theme など）を止める。
     これが無いと、背景色を指定していない面が端末側で黒く塗られる。 */
  color-scheme: only light;

  /* 地と紙 */
  --bg:#F9FBEF;          /* 廃車王と同じ淡いアイボリー */
  --paper:#fff;
  --cream:#FFFBED;
  --wash:#F1F2E8;

  /* コーポレートカラー（919good.jp の実画面から採取） */
  --red:#BE1C1A;
  --red-d:#8E0000;
  --red-lite:#FDEDED;
  --green:#0E9B4E;
  --green-d:#05713A;
  --green-lite:#EAF7F0;
  --yellow:#F9DA31;      /* 見出し帯 */
  --marker:#FBE857;      /* 文中のマーカー */
  --hazard:#FBE800;      /* 警告文という現物の地色 */
  --paper-cream:#FFF2CD;
  --sig-red:#FE0000;

  /* 線と文字 */
  --ink:#16181A;
  --ink-2:#4A5158;
  --ink-3:#78818A;
  --line:#DDE0D8;
  --line-2:#C3C8BE;

  --maxw:1080px;
  --shadow:5px 5px 0 var(--ink);
  --shadow-sm:3px 3px 0 var(--ink);
  --jp:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic Medium","Yu Gothic",YuGothic,"Noto Sans JP","Noto Sans CJK JP",Meiryo,system-ui,sans-serif;
  --mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,"Roboto Mono","Courier New",monospace;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
html{background-color:#F9FBEF}
body{
  margin:0;font-family:var(--jp);color:var(--ink);background-color:#F9FBEF;background:var(--bg);
  font-size:16px;line-height:1.95;font-feature-settings:"palt" 1;
  -webkit-font-smoothing:antialiased;overflow-wrap:break-word;
}
img,svg{max-width:100%;height:auto;vertical-align:middle}
a{color:inherit;text-underline-offset:3px}
button,input,select,textarea{font:inherit;color:inherit;margin:0}
h1,h2,h3,h4,p,ul,ol,figure,dl{margin:0}
ul,ol{padding:0;list-style:none}
:focus-visible{outline:3px solid var(--green);outline-offset:2px}
/* 端末がダークモードでも、この配色を変えない。
   color-scheme の指定を無視して暗転させる環境への保険。 */
@media (prefers-color-scheme: dark){
  html,body,main,.hero,.sec,.tool,.calc,.band{background-color:#F9FBEF!important}
  body,.sechd h2,.h2c h2,.band h2,.h3,.h4,.p,.f-t,.faq summary{color:#16181A!important}
  .sec--paper{background-color:#fff!important}
  .sec--wash{background-color:#F1F2E8!important}
  .hd{background-color:#fff!important}
  .cta{background-color:#F9DA31!important}
  .ft{background-color:#fff!important}
  .stage{background-color:#F1F2E8!important}
  .sheet,.panel{background-color:#fff!important}
  .p-warn{background-color:#FBE800!important}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.sp-br{display:none}
/* ボタンが縦に折り返したときの間隔。個別指定の漏れを防ぐため、
   ボタンを並べる器はすべて row-gap を持たせる。 */
.hero__cta,.acts,.result__acts,.cta__row,.b__row{row-gap:12px}

/* ビューアや端末が body の背景を上書きしても地色が残るよう、
   主要な面それぞれに背景色を持たせる。body 任せにしない。 */
main,.hero,.sec,.tool,.calc,.band{background-color:var(--bg)}
@media (max-width:640px){.sp-br{display:inline}}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:18px}

/* ==========================================================================
   ヘッダー
   ========================================================================== */
.hd{position:sticky;top:0;z-index:80;background:#fff;border-bottom:4px solid var(--red)}
.hd__top{max-width:var(--maxw);margin-inline:auto;padding:0 16px;min-height:64px;display:flex;align-items:center;gap:12px}
.hd__brand{display:flex;align-items:center;text-decoration:none;color:inherit;flex:0 0 auto}
/* ロゴは縦横比が分からなくても崩れないよう、高さ固定・幅auto・上限つきにする */
.hd__logo{
  height:44px;width:auto;max-width:180px;flex:0 0 auto;display:block;object-fit:contain;overflow:hidden;
}
@media (max-width:640px){.hd__logo{height:38px;max-width:150px}}
@media (max-width:380px){.hd__logo{height:32px;max-width:120px}}
.hd__spacer{margin-left:auto}
.hd__tel{
  display:flex;align-items:center;text-decoration:none;color:var(--red);
  border:2px solid var(--red);border-radius:10px;padding:5px 14px;background:#fff;
}
.hd__tel i{font-style:normal;font-size:9.5px;font-weight:800;letter-spacing:.06em;color:var(--ink-2);display:block;text-align:center}
.hd__tel b{display:block;font-family:var(--mono);font-size:19px;font-weight:700;letter-spacing:-.02em;line-height:1.2}
.hd__burger{
  display:none;appearance:none;border:2px solid var(--ink);border-radius:8px;background:#fff;
  width:44px;height:40px;cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:4px;
}
.hd__burger span{display:block;width:18px;height:2px;background:var(--ink);border-radius:2px}
.hd__nav{background:var(--red-lite);border-top:1px solid #F3C9C9}
.hd__nav>ul{max-width:var(--maxw);margin-inline:auto;padding:0 18px;display:flex;flex-wrap:wrap}
.hd__nav>ul>li{position:relative}
.hd__nav a{
  display:block;padding:10px 16px;font-size:13px;font-weight:800;color:var(--red);
  text-decoration:none;border-radius:0;
}
.hd__nav a:hover{background:#fff}
.hd__nav a[aria-current="page"]{background:var(--red);color:#fff}
.hd__nav>ul>li.is-current>a{background:var(--red);color:#fff}

/* 展開ボタン（PCはホバーでも開く／SPはタップで開く） */
.nav-sub{display:flex;align-items:stretch}
.nav-sub__btn{
  appearance:none;border:0;background:none;color:var(--red);cursor:pointer;
  width:34px;display:grid;place-items:center;padding:0;
}
.nav-sub__btn::before{
  content:"";width:8px;height:8px;border-right:2.5px solid currentColor;border-bottom:2.5px solid currentColor;
  transform:translateY(-2px) rotate(45deg);transition:transform .18s ease;
}
.nav-sub__btn[aria-expanded="true"]::before{transform:translateY(2px) rotate(-135deg)}
.nav-sub__btn:hover{background:#fff}
.hd__nav>ul>li.is-current .nav-sub__btn{background:var(--red);color:#fff}

.subnav{display:none;margin:0;padding:0;list-style:none}
.subnav a{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:11px 14px;font-size:13px;font-weight:800;color:var(--ink);white-space:nowrap;
}
.subnav a:hover{background:var(--cream)}
.subnav i{
  font-style:normal;font-size:10px;font-weight:900;letter-spacing:.06em;padding:2px 9px;border-radius:999px;
  background:var(--green);color:#fff;flex:0 0 auto;
}
.subnav i.soon{background:#fff;color:#98A0A7;border:1.5px solid var(--line-2)}

@media (min-width:881px){
  .subnav{
    position:absolute;top:100%;left:0;z-index:90;min-width:290px;background:#fff;
    border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:5px;
  }
  .nav-sub:hover .subnav,
  .hd__nav>ul>li:focus-within .subnav,
  .subnav[data-open="true"]{display:block}
}
@media (max-width:880px){
  /* 親リンク・展開ボタン・サブメニューを縦に積む */
  .nav-sub{flex-wrap:wrap;align-items:center}
  .nav-sub>a{flex:1 1 auto}
  .nav-sub__btn{flex:0 0 48px;align-self:stretch}
  .subnav{flex:1 0 100%;width:100%}
  .subnav[data-open="true"]{display:block;background:#fff;border-left:4px solid var(--red);margin:0 0 6px}
  .subnav a{padding:12px 14px;font-size:13.5px}
}
@media (max-width:880px){
  .hd__burger{display:flex}
  .hd__tel{display:none}
  .hd__nav[hidden]{display:none}
  .hd__nav>ul{flex-direction:column;padding:8px 14px 12px}
  .hd__nav>ul>li{border-bottom:1px solid #F0D3D3}
  .hd__nav>ul>li:last-child{border-bottom:0}
  .hd__nav>ul>li>a{padding:13px 12px;font-size:14.5px;flex:1}
  .nav-sub__btn{width:48px}
}

/* ==========================================================================
   ヒーロー
   ========================================================================== */
.hero{background:var(--bg);padding:38px 0 44px;overflow:hidden}
.hero__in{max-width:var(--maxw);margin-inline:auto;padding:0 18px;display:grid;grid-template-columns:1fr 300px;gap:36px;align-items:center}

/* 「＼ 無料ツール ／」 */
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;font-size:13.5px;font-weight:900;
  color:var(--red);letter-spacing:.08em;
}
.eyebrow::before{content:"＼"}
.eyebrow::after{content:"／"}

.hero h1{font-size:clamp(27px,4.6vw,45px);font-weight:900;line-height:1.36;letter-spacing:-.03em;margin:14px 0 18px}
.hero h1 em{font-style:normal;background:linear-gradient(transparent 58%,var(--marker) 58%);padding:0 .06em}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.hero__lead{font-size:15px;line-height:2;color:var(--ink-2);max-width:34em;font-weight:600}

/* 3つの約束（廃車王の「3つの無料」の赤バー） */
/* 訴求ポイント。押せるものに見えないよう塗りをやめ、見出し付きのパネルにする。
   赤はチェックアイコンだけに絞り、塗りの赤は主CTAの専用色として残す。
   スタッフ写真とは、狭い画面でも縦積みにせず横に並べる。 */
.duo{display:grid;grid-template-columns:minmax(0,1fr) 37%;gap:8px;align-items:end;margin-top:22px}
.duo__ph{position:relative;justify-self:end;align-self:end;width:100%}
.duo__ph img{display:block;width:100%;height:auto}
.bub{
  position:relative;z-index:2;margin:0 0 8px;background:#fff;border:3px solid var(--ink);border-radius:12px;
  padding:7px 9px;font-size:11px;font-weight:900;line-height:1.45;box-shadow:3px 3px 0 var(--ink);text-align:center;
}
.bub em{font-style:normal;color:var(--red)}
/* しっぽは「白い正方形を45度回して、2辺だけ黒く縁取る」形で作る。
   三角を2枚重ねる方法だと、吹き出し本体の下ボーダーが継ぎ目に残ってしまう。
   この作りなら白い面が本体のボーダーを覆うので、線が入らない。 */
.bub::after{
  content:"";position:absolute;left:50%;margin-left:-7px;bottom:-8px;
  width:14px;height:14px;background:#fff;
  border-right:3px solid var(--ink);border-bottom:3px solid var(--ink);
  transform:rotate(45deg);border-bottom-right-radius:3px;
}

.spec{background:#fff;border:3px solid var(--ink);border-radius:13px;box-shadow:var(--shadow);overflow:hidden}
.spec__hd{background:var(--cream);border-bottom:3px solid var(--ink);padding:8px 12px;font-size:12px;font-weight:900;letter-spacing:.02em}
.spec ul{padding:4px 12px 8px}
.spec li{
  display:flex;align-items:center;gap:8px;padding:9px 0;border-bottom:1px dashed var(--line2);
  font-size:13.5px;font-weight:900;line-height:1.4;white-space:nowrap;
}
.spec li:last-child{border-bottom:0}
.spec svg{flex:0 0 22px;width:22px;height:22px}
.spec__sub{margin:8px 0 0;font-size:11.5px;font-weight:600;color:var(--ink-2);line-height:1.75}
/* 狭い端末では表記を短くして、横並びと1行を保つ。
   クラス名は必ず接頭辞を付ける。以前 .w / .n という汎用名を使い、
   記録書の行番号 <span class="n"> を消してレイアウトを壊した。 */
.spec__wide{display:inline}
.spec__narrow{display:none}
@media (max-width:389px){.spec__wide{display:none}.spec__narrow{display:inline}}
@media (min-width:760px){
  .duo{grid-template-columns:minmax(0,1fr) 210px;gap:18px;max-width:40em}
  .bub{font-size:12.5px;padding:8px 11px;margin-bottom:9px}
  .spec li{font-size:16px;gap:11px;padding:11px 0}
  .spec svg{flex:0 0 28px;width:28px;height:28px}
  .spec__sub{font-size:12.5px;max-width:42em}
}

.hero__paper{justify-self:end}
.sheet-mini{
  width:318px;height:450px;overflow:hidden;position:relative;
  border:3px solid var(--ink);border-radius:6px;box-shadow:7px 7px 0 var(--ink);
}
.sheet-mini .panel{--pw:312px;width:312px;height:444px}
.hero__cap{margin-top:16px;font-size:11.5px;color:var(--ink-3);font-weight:700;text-align:center}
@media (max-width:920px){
  .hero__in{grid-template-columns:1fr;gap:30px}
  .hero__paper{justify-self:center}
  .duo{max-width:none}
}

/* ==========================================================================
   ボタン
   ========================================================================== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  border:0;border-radius:10px;padding:15px 26px;font-size:15.5px;font-weight:900;
  letter-spacing:.01em;text-decoration:none;cursor:pointer;line-height:1.4;
  box-shadow:0 4px 0 rgba(0,0,0,.28);transition:transform .1s ease,box-shadow .1s ease,background-color .15s ease;
}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 rgba(0,0,0,.28)}
.btn svg{width:18px;height:18px;flex:0 0 auto}
.btn--pri,.btn--red{background:var(--red);color:#fff}
.btn--pri:hover,.btn--red:hover{background:var(--red-d)}
.btn--grn{background:var(--green);color:#fff}
.btn--grn:hover{background:var(--green-d)}
.btn--ghost{background:#fff;color:var(--ink);border:2px solid var(--ink);box-shadow:0 4px 0 var(--ink)}
.btn--ghost:hover{background:var(--yellow)}
.btn--sm{padding:10px 18px;font-size:13px;border-radius:8px;box-shadow:0 3px 0 rgba(0,0,0,.25)}
.btn--ghost.btn--sm{box-shadow:0 3px 0 var(--ink)}
.btn--block{width:100%}

/* ==========================================================================
   見出し（上下の太い黒罫）
   ========================================================================== */
.sec{padding:52px 0}
.sec--flat{padding:32px 0}
.sec--wash{background:var(--wash)}
.sec--paper{background:#fff}

.sechd{text-align:center;margin-bottom:14px;padding:0}
.sechd h2{
  font-size:clamp(20px,3.2vw,28px);font-weight:900;letter-spacing:-.025em;line-height:1.5;
  border-top:4px solid var(--ink);border-bottom:4px solid var(--ink);padding:12px 8px;
}
.sechd__no{
  display:inline-block;background:var(--red);color:#fff;font-family:var(--mono);font-size:11.5px;
  font-weight:700;letter-spacing:.1em;padding:3px 12px;border-radius:999px;margin-bottom:12px;
}
.sechd__note{display:block;font-size:12.5px;color:var(--ink-3);font-weight:700;margin-top:10px}

.band{max-width:1380px;margin:0 auto;padding:0 18px}
.band h2{
  font-size:clamp(19px,2.8vw,25px);font-weight:900;letter-spacing:-.025em;text-align:center;
  border-top:4px solid var(--ink);border-bottom:4px solid var(--ink);padding:12px 8px;
}
.h2c{margin-bottom:14px;text-align:center}
.h2c h2{
  font-size:clamp(20px,3.2vw,28px);font-weight:900;letter-spacing:-.025em;
  border-top:4px solid var(--ink);border-bottom:4px solid var(--ink);padding:12px 8px;
}
.lead{color:var(--ink-2);font-size:14.5px;font-weight:600;margin:18px 0 26px;line-height:2;text-align:center}

.h3{
  font-size:19px;font-weight:900;margin:38px 0 16px;letter-spacing:-.02em;line-height:1.6;
  padding:10px 0 10px 16px;border-left:7px solid var(--red);background:var(--cream);border-radius:0 8px 8px 0;
}
.h4{font-size:16px;font-weight:900;margin:26px 0 10px;letter-spacing:-.01em;padding-left:14px;position:relative}
.h4::before{content:"";position:absolute;left:0;top:.45em;width:5px;height:1.1em;background:var(--ink);border-radius:2px}
.p{font-size:15.5px;margin:0 0 17px;font-weight:600;line-height:2.05}
.p strong{font-weight:900;background:linear-gradient(transparent 58%,var(--marker) 58%);padding:0 .08em}
.mk{background:linear-gradient(transparent 58%,var(--marker) 58%);padding:0 .06em}

/* ==========================================================================
   様式一覧（白カード＋黒枠＋オフセット影）
   ========================================================================== */
.forms{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
@media (max-width:820px){.forms{grid-template-columns:1fr;gap:18px}}
.forms li{list-style:none}
.forms a,.forms .row{
  display:block;position:relative;background:#fff;border:3px solid var(--ink);border-radius:14px;
  box-shadow:var(--shadow);padding:24px 20px 20px;text-decoration:none;color:inherit;height:100%;
  transition:transform .12s ease,box-shadow .12s ease;
}
.forms a:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--ink);background:var(--cream)}
.forms a:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}
.forms .row{border-color:var(--line-2);box-shadow:none;background:#FAFAF6}

.f-no{
  display:inline-block;background:var(--red);color:#fff;font-family:var(--mono);font-size:13px;
  font-weight:700;letter-spacing:.08em;padding:2px 13px;border-radius:999px;margin-bottom:12px;
}
.forms .row .f-no{background:var(--line-2);color:#fff}
.f-t{display:block;font-size:18px;font-weight:900;letter-spacing:-.02em;line-height:1.55;margin-bottom:9px}
.forms .row .f-t{color:#7A838B}
.f-d{display:block;font-size:13.5px;color:var(--ink-2);font-weight:600;line-height:1.85;margin-bottom:14px}
.forms .row .f-d{color:#9AA2A9}
.f-spec{display:flex;flex-wrap:wrap;gap:6px}
.f-spec span{
  font-size:11px;font-weight:800;color:var(--ink-2);background:var(--cream);
  border:1px solid var(--line-2);border-radius:6px;padding:3px 9px;letter-spacing:.02em;
}
.forms .row .f-spec span{background:#fff;color:#9AA2A9}
.f-st{position:absolute;top:-14px;right:16px}
.f-st i{
  font-style:normal;display:inline-block;font-size:11.5px;font-weight:900;letter-spacing:.06em;
  padding:4px 14px;border-radius:999px;border:2px solid var(--ink);
}
.f-st--live i{background:var(--green);color:#fff;border-color:var(--green-d)}
.f-st--soon i{background:#fff;color:#98A0A7;border-color:var(--line-2)}
/* 「使う」の矢印 */
.forms a::after{
  content:"▶";position:absolute;right:18px;bottom:16px;width:30px;height:30px;border-radius:50%;
  background:var(--red);color:#fff;font-size:11px;display:grid;place-items:center;line-height:1;
}
.forms a{padding-right:60px}

/* ==========================================================================
   関連ツール
   ========================================================================== */
.rel{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.rel>*{
  background:#fff;border:3px solid var(--ink);border-radius:12px;box-shadow:var(--shadow-sm);
  padding:18px 16px;text-decoration:none;color:inherit;position:relative;
}
.rel a:hover{background:var(--cream)}
.rel .card--soon{border-color:var(--line-2);box-shadow:none;background:#FAFAF6}
.rel .card__th{display:none}
.rel .card__t{display:block;font-size:15px;font-weight:900;letter-spacing:-.015em;line-height:1.6;margin-bottom:7px}
.rel .card--soon .card__t{color:#7A838B}
.rel .card__d{display:block;font-size:12.5px;color:var(--ink-2);font-weight:600;line-height:1.85}
.rel .card--soon .card__d{color:#9AA2A9}
.rel .flag{
  position:static;display:inline-block;font-size:10.5px;font-weight:900;letter-spacing:.06em;
  margin-bottom:9px;padding:2px 11px;border-radius:999px;border:2px solid var(--ink);
}
.rel .flag--live{background:var(--green);color:#fff;border-color:var(--green-d)}
.rel .flag--soon{background:#fff;color:#98A0A7;border-color:var(--line-2)}
@media (max-width:760px){.rel{grid-template-columns:1fr}}

/* ==========================================================================
   パンくず・目次
   ========================================================================== */
.crumb{background:#fff;border-bottom:1px solid var(--line)}
.crumb ol{max-width:var(--maxw);margin-inline:auto;padding:10px 18px;display:flex;flex-wrap:wrap;gap:8px;font-size:11.5px}
.crumb li{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--ink-3)}
.crumb li+li::before{content:"›";color:var(--line-2)}
.crumb a{color:var(--ink-3);text-decoration:none}
.crumb a:hover{color:var(--red);text-decoration:underline}

.toc{background:#fff;border:3px solid var(--ink);border-radius:14px;box-shadow:var(--shadow-sm);padding:20px 22px;margin:0 0 32px}
.toc>b{display:block;font-size:13.5px;font-weight:900;margin-bottom:12px;padding-left:12px;position:relative}
.toc>b::before{content:"";position:absolute;left:0;top:.35em;width:5px;height:1.1em;background:var(--red);border-radius:2px}
.toc ol{counter-reset:t;columns:2;column-gap:30px}
.toc li{counter-increment:t;break-inside:avoid}
.toc a{display:block;font-size:13.5px;font-weight:800;text-decoration:none;padding:5px 0;color:var(--ink-2)}
.toc a::before{
  content:counter(t,decimal-leading-zero);font-family:var(--mono);font-size:11px;color:#fff;
  background:var(--red);border-radius:4px;padding:1px 6px;margin-right:10px;font-weight:700;
}
.toc a:hover{color:var(--red);text-decoration:underline}
@media (max-width:640px){.toc ol{columns:1}}

/* ==========================================================================
   本文パーツ
   ========================================================================== */
.ul{margin:0 0 22px;font-size:15px;font-weight:600}
.ul li{position:relative;padding-left:24px;margin-bottom:9px;line-height:2}
.ul li::before{content:"";position:absolute;left:0;top:.72em;width:12px;height:4px;background:var(--red);border-radius:2px}
.ol{counter-reset:n;margin:0 0 22px;font-size:15px;font-weight:600}
.ol li{counter-increment:n;position:relative;padding-left:42px;margin-bottom:16px;line-height:2}
.ol li::before{
  content:counter(n);position:absolute;left:0;top:.2em;width:26px;height:26px;border-radius:50%;
  background:var(--red);color:#fff;font-family:var(--mono);font-size:13px;font-weight:700;
  display:grid;place-items:center;line-height:1;
}

.tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 24px;background:#fff;border:3px solid var(--ink);border-radius:12px}
table.t{width:100%;border-collapse:collapse;font-size:13.5px;min-width:520px}
table.t th,table.t td{border-bottom:1px solid var(--line);padding:13px 15px;text-align:left;vertical-align:top;line-height:1.85}
table.t thead th{background:var(--ink);color:#fff;font-weight:900;font-size:12.5px;white-space:nowrap;letter-spacing:.04em;border-bottom:0}
table.t tbody th{background:var(--cream);font-weight:900;width:26%;white-space:nowrap}
table.t tr:last-child th,table.t tr:last-child td{border-bottom:0}

.callout{background:var(--cream);border:3px solid var(--ink);border-radius:12px;padding:18px 20px;margin:0 0 26px}
.callout--warn{background:var(--red-lite);border-color:var(--red)}
.callout--tip{background:var(--green-lite);border-color:var(--green)}
.callout h4{font-size:15px;font-weight:900;margin:0 0 8px;letter-spacing:-.01em;padding-left:0}
.callout h4::before{content:none}
.callout--warn h4{color:var(--red)}
.callout--tip h4{color:var(--green-d)}
.callout p,.callout li{font-size:13.5px;font-weight:600;margin:0;color:var(--ink-2);line-height:2}
.callout .ul{margin-bottom:0;font-size:13.5px}

/* ==========================================================================
   FAQ
   ========================================================================== */
/* 現場から一言（スタッフ写真つきの補足）。
   クラス名は voice__ の接頭辞で固定する。汎用名は他ツールを壊す。 */
.voice{
  display:flex;align-items:flex-start;gap:15px;margin:30px 0 6px;
  background:#fff;border:3px solid var(--ink);border-radius:14px;box-shadow:var(--shadow);padding:16px 18px;
}
.voice__av{
  flex:0 0 74px;width:74px;height:74px;border-radius:50%;overflow:hidden;position:relative;
  background:var(--cream);border:3px solid var(--ink);
}
/* 顔だけを切り出した専用画像を使う。元画像を位置ずらしで切ると、
   丸の大きさを変えるたびに顔の位置がずれる。 */
.voice__av img{width:100%;height:100%;object-fit:cover;display:block}
.voice__tx{min-width:0}
.voice__t{display:block;font-size:14px;font-weight:900;margin:0 0 5px;letter-spacing:.01em}
.voice__b{margin:0;font-size:13.5px;font-weight:700;line-height:1.9;color:var(--ink-2)}
.voice__n{display:block;margin-top:7px;font-size:11.5px;font-weight:700;color:var(--ink-3)}
@media (max-width:520px){
  .voice{gap:12px;padding:14px 15px}
  .voice__av{flex:0 0 60px;width:60px;height:60px}
  /* 専用画像なので端末ごとの位置調整は不要 */
  .voice__t{font-size:13.5px}
  .voice__b{font-size:13px}
}

.faq{display:grid;gap:14px}
.faq details{background:#fff;border:3px solid var(--ink);border-radius:12px;overflow:hidden}
.faq summary{
  list-style:none;cursor:pointer;padding:17px 50px 17px 56px;position:relative;
  font-size:15px;font-weight:900;line-height:1.75;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{
  content:"Q";position:absolute;left:16px;top:16px;width:28px;height:28px;border-radius:50%;
  background:var(--red);color:#fff;font-size:14px;font-weight:900;display:grid;place-items:center;line-height:1;
}
.faq summary::after{
  content:"";position:absolute;right:20px;top:27px;width:13px;height:13px;
  border-right:3px solid var(--ink);border-bottom:3px solid var(--ink);
  transform:translateY(-4px) rotate(45deg);transition:transform .18s ease;
}
.faq details[open] summary::after{transform:translateY(2px) rotate(-135deg)}
.faq summary:hover{background:var(--cream)}
.faq__a{
  padding:16px 20px 20px 56px;position:relative;font-size:14.5px;font-weight:600;color:var(--ink-2);
  border-top:2px dashed var(--line-2);background:#FCFCF8;
}
.faq__a::before{
  content:"A";position:absolute;left:16px;top:16px;width:28px;height:28px;border-radius:50%;
  background:var(--ink);color:#fff;font-size:14px;font-weight:900;display:grid;place-items:center;line-height:1;
}
.faq__a p{margin:0 0 12px;line-height:2}
.faq__a p:last-child{margin-bottom:0}
.faq__a .ul{font-size:14px;margin-bottom:12px}

/* ==========================================================================
   CTA
   ========================================================================== */
.cta{background:var(--yellow);padding:36px 0}
.cta__in{
  max-width:840px;margin-inline:auto;padding:26px 24px;background:#fff;
  border:3px solid var(--ink);border-radius:16px;box-shadow:var(--shadow);
}
.cta__t{font-size:18px;font-weight:900;line-height:1.7;letter-spacing:-.02em;text-align:center;margin-bottom:6px}
.cta__t em{font-style:normal;background:linear-gradient(transparent 58%,var(--marker) 58%);padding:0 .06em}
.cta__note{font-size:11.5px;color:var(--ink-3);margin-top:14px;font-weight:700;line-height:1.9;text-align:center}
.cta__row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}
.cta__tel{
  display:block;text-decoration:none;color:#fff;background:var(--red);border-radius:10px;padding:12px 18px;
  text-align:center;box-shadow:0 4px 0 rgba(0,0,0,.28);
}
.cta__tel:hover{background:var(--red-d)}
.cta__tel i{display:block;font-style:normal;font-size:10.5px;font-weight:800;letter-spacing:.06em;opacity:.92}
.cta__tel b{display:block;font-family:var(--mono);font-size:26px;font-weight:700;letter-spacing:-.03em;line-height:1.35}
.cta__form{
  display:flex;flex-direction:column;justify-content:center;text-decoration:none;background:var(--green);
  color:#fff;border-radius:10px;padding:12px 18px;text-align:center;box-shadow:0 4px 0 rgba(0,0,0,.28);
}
.cta__form:hover{background:var(--green-d)}
.cta__form b{font-size:17px;font-weight:900}
.cta__form i{font-style:normal;font-size:10.5px;font-weight:700;margin-top:3px;opacity:.92}
@media (max-width:640px){.cta__row{grid-template-columns:1fr}.cta__in{padding:22px 18px}}

/* 画面下に固定する相談バー（廃車王と同じ考え方） */
.fixbar{display:none}
@media (max-width:900px){
  body.has-fixbar{padding-bottom:78px}
  .fixbar{
    display:grid;grid-template-columns:1fr 1fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:75;
    background:rgba(255,255,255,.96);border-top:2px solid var(--ink);
    padding:8px 10px calc(8px + env(safe-area-inset-bottom));
  }
  .fixbar a{
    display:block;text-align:center;text-decoration:none;color:#fff;border-radius:9px;padding:8px 6px;
    box-shadow:0 3px 0 rgba(0,0,0,.28);line-height:1.35;
  }
  .fixbar__tel{background:var(--red)}
  .fixbar__web{background:var(--green)}
  .fixbar b{display:block;font-size:14px;font-weight:900}
  .fixbar span{display:block;font-size:9.5px;font-weight:700;opacity:.92}
}

/* ==========================================================================
   フッター
   ========================================================================== */
.ft{background:#fff;border-top:4px solid var(--red)}
.ft__in{max-width:var(--maxw);margin-inline:auto;padding:40px 18px 26px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px}
.ft__logo{height:44px;width:auto;max-width:200px;object-fit:contain;display:block;margin-bottom:16px}
.ft h4{font-size:13.5px;font-weight:900;margin-bottom:14px;padding-left:12px;position:relative;color:var(--ink)}
.ft h4::before{content:"";position:absolute;left:0;top:.3em;width:5px;height:1.1em;background:var(--red);border-radius:2px}
.ft ul{font-size:13px;line-height:2.2}
.ft li{position:relative;padding-left:14px}
.ft li::before{content:"›";position:absolute;left:0;color:var(--red);font-weight:900}
.ft a{color:var(--ink-2);text-decoration:none}
.ft a:hover{color:var(--red);text-decoration:underline}
.ft p{font-size:12.5px;line-height:2;color:var(--ink-2);font-weight:600}
.ft__tel{
  display:block;text-decoration:none;color:#fff;background:var(--green);border-radius:10px;padding:12px 16px;
  margin-top:16px;text-align:center;box-shadow:0 4px 0 rgba(0,0,0,.25);
}
.ft__tel:hover{background:var(--green-d)}
.ft__tel b{display:block;font-family:var(--mono);font-size:23px;font-weight:700;letter-spacing:-.03em;line-height:1.35;color:#fff}
.ft__tel i{display:block;font-style:normal;font-size:11px;font-weight:800;color:#fff}
.ft__bar{background:var(--wash);border-top:1px solid var(--line)}
.ft__bar div{max-width:var(--maxw);margin-inline:auto;padding:16px 18px;font-size:11.5px;color:var(--ink-3);line-height:1.95;text-align:center;font-weight:700}
@media (max-width:820px){.ft__in{grid-template-columns:1fr;gap:26px}}

/* ==========================================================================
   プロダクトツアー
   ========================================================================== */
.tour-btn{display:inline-flex;align-items:center;gap:8px}
.tour-veil{position:fixed;inset:0;z-index:9000;background:rgba(22,24,26,.45);opacity:0;transition:opacity .2s ease}
.tour-veil[hidden]{display:none}
body.tour-on .tour-veil{opacity:1}
.tour-spot{position:relative;z-index:9100;outline:4px solid var(--yellow);outline-offset:3px;border-radius:10px}
.tour-card{
  position:fixed;z-index:9200;left:50%;bottom:20px;transform:translateX(-50%);
  width:min(560px,calc(100vw - 24px));background:#fff;border:3px solid var(--ink);border-radius:16px;
  box-shadow:6px 6px 0 rgba(0,0,0,.45);overflow:hidden;
}
.tour-card[hidden]{display:none}
.tour-card__bar{height:6px;background:var(--yellow)}
.tour-card__in{padding:20px 22px 18px}
.tour-card__step{
  display:inline-block;background:var(--red);color:#fff;font-family:var(--mono);font-size:10.5px;
  font-weight:700;letter-spacing:.1em;padding:2px 11px;border-radius:999px;
}
.tour-card__t{font-size:16.5px;font-weight:900;margin:10px 0 8px;line-height:1.6;letter-spacing:-.02em}
.tour-card__b{font-size:13.5px;font-weight:600;color:var(--ink-2);line-height:2}
.tour-card__nav{display:flex;align-items:center;gap:10px;margin-top:18px}
.tour-dots{display:flex;gap:6px;margin-right:auto}
.tour-dots i{display:block;width:7px;height:7px;border-radius:50%;background:var(--line-2)}
.tour-dots i.on{background:var(--red)}
.tour-card__x{
  position:absolute;top:12px;right:12px;width:30px;height:30px;border:0;background:none;
  color:var(--ink-3);font-size:20px;line-height:1;cursor:pointer;
}
.tour-card__x:hover{color:var(--ink)}
@media (max-width:560px){
  .tour-card{left:10px;right:10px;bottom:10px;transform:none;width:auto}
  .tour-card__in{padding:16px 16px 14px}
  .tour-card__t{font-size:15.5px}
  .tour-card__nav .btn{flex:1}
}

/* ==========================================================================
   ツール本体
   ========================================================================== */
.tool{
  max-width:1380px;margin-inline:auto;padding:28px 18px 56px;
  display:grid;grid-template-columns:376px minmax(0,1fr);gap:26px;align-items:start;
}
.tool>*{min-width:0}
@media (max-width:1080px){.tool{grid-template-columns:1fr;padding-bottom:92px}}

.doctabs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:20px}
.doctabs button{
  appearance:none;background:#fff;border:3px solid var(--ink);border-radius:12px;padding:12px 10px;
  font-size:14px;font-weight:900;color:var(--ink-2);cursor:pointer;line-height:1.4;letter-spacing:-.01em;
  box-shadow:0 4px 0 var(--ink);
}
.doctabs button[aria-selected="true"]{background:var(--red);border-color:var(--red-d);color:#fff;box-shadow:0 4px 0 var(--red-d)}
.doctabs small{display:block;font-size:10.5px;font-weight:700;opacity:.8;margin-top:2px}

.pane{background:#fff;border:3px solid var(--ink);border-radius:14px;box-shadow:var(--shadow-sm);overflow:hidden}
.pane__hd{padding:13px 18px;background:var(--cream);border-bottom:3px solid var(--ink);font-size:14px;font-weight:900}
.form{padding:20px 18px}
.fld{margin-bottom:18px}
.fld:last-child{margin-bottom:0}
.fld>label{display:block;font-size:13px;font-weight:900;margin-bottom:7px;padding-left:12px;position:relative}
.fld>label::before{content:"";position:absolute;left:0;top:.35em;width:4px;height:1.05em;background:var(--ink);border-radius:2px}
.fld .hint{font-size:11.5px;color:var(--ink-3);font-weight:600;line-height:1.85;margin-top:7px}
/* ── iOS Safari 対策（全ツール共通・種類を問わず適用）──────────────
   iOS Safari は date / month / time / file を独自の部品として描き、
   width の指定を無視して固有の幅で膨らむ。結果、欄が枠からはみ出し、
   空のときは灰色の箱に見える。appearance を切って通常の入力欄に揃える。
   Chromium では再現しないため、実機の報告でしか気づけない類の崩れ。 */
/* 日付欄は全ツールで同じ見た目にそろえる（記録書の作りに合わせた）。
   値は等幅で桁を揃え、カレンダーのアイコンは大きめに右端へ置く。 */
input[type=date],input[type=month],input[type=time],input[type=datetime-local]{
  -webkit-appearance:none;appearance:none;
  background-color:#fff;color:inherit;font-family:var(--mono);letter-spacing:-.01em;
  /* appearance を切ると iOS のカレンダーアイコンも消える。
     タップで何が起きるか分からなくなるため、自前で描いて右端に置く。 */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234A5158' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;background-size:18px 18px;
  padding-right:36px;
}
/* 空のとき、何を入れる欄か分かるようにする（iOS は空欄を真っ白に描く） */
input[type=date]:not(:valid)::before,
input[type=date].is-empty::before{content:"年 / 月 / 日";color:var(--ink-3);font-weight:600}
input[type=date]::-webkit-date-and-time-value{text-align:left}
input[type=date]::-webkit-calendar-picker-indicator{opacity:0;width:34px;margin:0;cursor:pointer}
input,select,textarea{
  box-sizing:border-box;min-width:0;max-width:100%;
}
input[type=file]{max-width:100%;overflow:hidden}
/* iOS は入力欄の文字が16px未満だと、触れたときに画面を勝手に拡大する。
   個別の指定を壊さないよう、下限だけを保証する。 */
input,select,textarea{font-size:max(16px,1em)}

/* 入力欄の高さは padding で作らない。text / date / month / select は
   部品ごとに内部の描画高が違うため、余白で決めると必ず数px ずれる。
   高さを直接指定して、種類を問わず揃える。 */
.fld input[type=text],.fld input[type=date],.fld input[type=month],.fld select{
  width:100%;height:52px;padding:0 13px;border:2px solid var(--line-2);border-radius:9px;background:#fff;
  font-size:16px;font-weight:700;line-height:1.2;
}
.fld input:hover,.fld select:hover{border-color:var(--ink-3)}
.fld input:focus,.fld select:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(14,155,78,.16)}
.fld input::placeholder{color:#B4BBC1;font-weight:600}
/* ==========================================================================
   和暦の年月日入力（元号・年・月・日のプルダウン）
   元の input[type=date] は値の保持役として残し、画面からは隠す。
   ========================================================================== */
.wd{display:grid;grid-template-columns:1.25fr 1fr 1fr 1fr;gap:6px;align-items:stretch}
.wd--ym{grid-template-columns:1.25fr 1fr 1fr}
.wd select{
  width:100%;height:52px;padding:0 6px;border:2px solid var(--line-2);border-radius:9px;background:#fff;
  font-size:16px;font-weight:700;line-height:1.2;color:inherit;text-align:center;
}
.wd select:hover{border-color:var(--ink-3)}
.wd select:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(14,155,78,.16)}
/* 未選択のあいだは、何を選ぶ欄か分かるよう控えめな色にする */
.wd select:invalid,.wd select.is-empty{color:var(--ink-3)}
/* 値の保持役。読み上げと Tab からは外してある */
.wd-src{
  position:absolute!important;width:1px!important;height:1px!important;
  padding:0!important;margin:-1px!important;border:0!important;
  clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden!important;white-space:nowrap;
}
/* 記録書の行の中でも同じ見た目にする */
.kr-input .wd select,.ph-input .wd select{height:46px;font-size:16px}
.kr-input .wd,.ph-input .wd{gap:5px}
@media (max-width:380px){
  .wd{gap:4px}
  .wd select{padding:0 2px}
}

.r3{display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:9px}
.r3 span{display:block}
.r3 small{display:block;font-size:10.5px;font-weight:900;color:var(--ink-2);margin-bottom:3px}
.glabel{
  font-size:12px;font-weight:900;letter-spacing:.04em;color:#fff;background:var(--red);
  display:inline-block;padding:3px 12px;border-radius:999px;margin:0 0 14px;
}
.hr{height:2px;background:var(--line);margin:22px -18px}
.chk{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;font-weight:800;cursor:pointer;line-height:1.7}
.chk input{width:18px;height:18px;margin:3px 0 0;accent-color:var(--green);flex:0 0 auto}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.seg button{
  appearance:none;border:2px solid var(--line-2);border-radius:9px;background:#fff;padding:10px 8px;
  font-size:12.5px;font-weight:900;color:var(--ink-2);cursor:pointer;line-height:1.45;
}
.seg button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.acts{padding:18px;border-top:3px solid var(--ink);background:var(--cream);display:grid;gap:12px}
.privacy{
  display:flex;gap:9px;align-items:flex-start;background:var(--green-lite);border:2px solid #BFE4D0;
  border-radius:9px;padding:11px 13px;font-size:11.5px;font-weight:700;color:var(--green-d);line-height:1.85;
}
.privacy svg{width:16px;height:16px;flex:0 0 auto;margin-top:2px}

/* プレビュー：明るい下地に紙を置く */
.stage{background:var(--wash);border:3px solid var(--ink);border-radius:14px;box-shadow:var(--shadow-sm);padding:22px}
.stage__bar{display:flex;align-items:center;gap:12px;margin-bottom:16px;color:var(--ink-2);font-size:11.5px;font-weight:800;flex-wrap:wrap}
.stage__bar .pill{font-family:var(--mono);background:#fff;border:2px solid var(--line-2);border-radius:999px;padding:3px 11px}
.stage__bar .zoom{margin-left:auto;display:flex;gap:6px}
.stage__bar .zoom button{
  appearance:none;border:2px solid var(--ink);border-radius:8px;background:#fff;color:var(--ink);
  width:32px;height:30px;font-weight:900;font-size:15px;line-height:1;cursor:pointer;
}
.stage__bar .zoom button:hover{background:var(--yellow)}
.sheetwrap{display:block;overflow:auto;-webkit-overflow-scrolling:touch}
/* 横スクロールできることの案内。道具バーの直下に1行として置く。
   紙に重ねると文字に被り、拡大時は枠が縦に伸びて下端が画面外になるため。 */
.stage{position:relative}
.stage__hint{display:none;margin:-6px 0 12px;text-align:center}
.stage.is-scrollable .stage__hint{display:block}
.stage__hint span{
  display:inline-block;background:rgba(22,24,26,.82);color:#fff;font-size:11px;font-weight:800;
  padding:4px 12px;border-radius:999px;letter-spacing:.02em;white-space:nowrap;
}
.sheet-holder{margin:0 auto;position:relative;overflow:hidden}
.sheet-stack{display:flex;flex-direction:column;gap:8mm}
.sheet{background:#fff;box-shadow:0 10px 24px -10px rgba(0,0,0,.4),0 0 0 1px rgba(0,0,0,.14);transform-origin:top center;position:relative;display:flex}
.sheet--land{width:297mm;height:210mm}
.sheet--port{width:210mm;height:297mm}
.sheet--a5{width:148mm;height:210mm}
.cut{position:absolute;left:50%;top:0;bottom:0;width:0;border-left:1px dashed rgba(0,0,0,.4);z-index:5}
.cut::after{content:"✂ ここで切る";position:absolute;left:50%;top:4px;transform:translateX(-50%);font-size:9px;font-weight:700;color:#fff;background:rgba(0,0,0,.6);padding:2px 8px;border-radius:999px;white-space:nowrap}

/* ---- 出力される紙面（原本の再現。ここは変えない） ---- */
.panel{-webkit-print-color-adjust:exact;print-color-adjust:exact;position:relative;overflow:hidden;flex:1 1 0;font-size:calc(var(--pw) * .0362);line-height:1.5;font-weight:700;color:#000}
.sheet--land .panel{--pw:148.5mm;width:148.5mm;height:210mm}
.sheet--land.sheet--single .panel{--pw:297mm;width:297mm;height:210mm}
.sheet--a5 .panel{--pw:148mm;width:148mm;height:210mm}
.sheet--port .panel{--pw:210mm;width:210mm;height:297mm}
.panel u{text-decoration:none;border-bottom:.09em solid currentColor;padding:0 .25em;display:inline-block;text-align:center}
.panel .em{color:var(--sig-red);border-bottom:.08em solid var(--sig-red)}

.p-warn{background:var(--hazard);padding:.9em 1.05em 1em;display:flex;flex-direction:column}
/* 背景色が落ちる環境でも地色が残るよう、SVGの矩形を最背面に敷く */
.wl-bg,.nt-bg{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block}
.p-warn>*:not(.wl-bg){position:relative;z-index:1}
.nt-head{position:relative;overflow:hidden}
.nt-head>span{position:relative;z-index:1}
.wl-top{display:flex;align-items:baseline;justify-content:space-between;gap:.6em;font-size:.98em}
.wl-top b{color:var(--sig-red);font-weight:900;letter-spacing:-.02em}
.wl-hero{position:relative;text-align:center;padding:1.15em 0 .25em;margin-top:.4em}
.wl-ring{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);width:11.3em;height:11.3em;z-index:1}
.wl-en{position:relative;z-index:2;font-size:1.1em;font-weight:900;color:#fff;letter-spacing:.02em;text-shadow:0 0 .06em #000,.045em 0 #000,-.045em 0 #000,0 .045em #000,0 -.045em #000}
.wl-big{position:relative;z-index:2;font-size:3.95em;font-weight:900;letter-spacing:-.02em;line-height:1.12;text-shadow:.035em 0 #fff,-.035em 0 #fff,0 .035em #fff,0 -.035em #fff}
.wl-move{position:relative;z-index:2;font-size:1.22em;font-weight:900;margin-top:.15em}
.wl-b1{font-size:1.06em;font-weight:900;line-height:1.6;margin:1.15em 0 0}
.wl-b2,.wl-b3{font-size:.86em;font-weight:900;line-height:1.68;margin:1.15em 0 0}
.wl-b3{margin-top:1.05em}
.wl-issuer{margin-top:1.35em;border:.1em solid rgba(0,0,0,.7);background:rgba(255,255,255,.55);padding:.5em .65em;font-size:.74em;font-weight:900;line-height:1.7;display:flex;flex-wrap:wrap;gap:.1em 1.1em}
.wl-issuer::before{content:"申し出・お問い合わせ先";display:block;width:100%;font-size:.85em;color:#B00000;letter-spacing:.04em}

.p-note{background:#fff;display:flex;flex-direction:column}
.nt-head{background:#BE1C1A;color:#fff;font-size:2.05em;font-weight:900;text-align:center;padding:.42em 0 .46em;letter-spacing:-.02em}
.nt-body{padding:1em 1.05em 1.05em;display:flex;flex-direction:column;flex:1}
.nt-to{font-size:1.05em;font-weight:900;margin-bottom:.7em}
.nt-p{font-size:1.05em;font-weight:900;line-height:1.62;margin-bottom:.85em;text-indent:1em}
.nt-box{position:relative;overflow:hidden;border:.13em solid #BE1C1A;background:var(--paper-cream);padding:.85em .9em;margin:.35em 0 .8em;font-size:1.02em;font-weight:900;line-height:2.1}
.nt-box>div{position:relative;z-index:1}
.bx-bg{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block}
.nt-box .ind{padding-left:.85em}
.nt-foot{margin-top:auto;font-size:.82em;font-weight:900;line-height:1.85}
.nt-sign{margin-top:.55em;font-size:.78em;font-weight:900;text-align:right;line-height:1.6}

/* ---- 委任状：支給された標準様式（A4横）を再現する ----
   外枠1本。記入欄は罫線で、枠囲みではない。位置は原本の実測比率に合わせている。 */
.p-inin{
  background:#fff;color:#000;padding:23mm 25mm 23mm 26mm;display:flex;
  font-size:calc(var(--pw) * .0152);line-height:1.6;font-weight:400;
}
.iw-sheet{flex:1;min-width:0;border:.05em solid #000;padding:1.9em 2em 1.6em;display:flex;flex-direction:column;overflow:hidden}
.iw-title{font-size:1.85em;text-align:center;letter-spacing:1em;text-indent:1em;margin-bottom:1.9em}

/* 受任者：ラベルは2行の中央 */
.iw-rcv{display:flex;align-items:center;padding-left:16%;margin-bottom:1.4em}
.iw-rlb{flex:0 0 auto;letter-spacing:.35em;text-indent:.35em;width:5.6em}
.iw-rrows{flex:1;min-width:0;display:flex;flex-direction:column;gap:1.35em}
.iw-rr{display:flex;align-items:flex-end}
.iw-rr .k{flex:0 0 4.6em;white-space:nowrap;letter-spacing:.55em;text-indent:.55em}
.iw-rr .v{
  flex:0 1 27em;border-bottom:.045em solid #000;min-height:1.5em;
  padding:0 .3em .1em;line-height:1.35;word-break:break-all;
}

/* 本文：途中に手続きの別の空欄。注記はその真下 */
.iw-lead{margin:.3em 0 1.4em;font-size:1em;line-height:1.7;display:flex;align-items:flex-end;flex-wrap:nowrap;padding-left:1em}
.iw-kind{display:inline-flex;flex-direction:column;align-items:center;margin:0 .2em}
.iw-kind .v{
  min-width:11em;border-bottom:.045em solid #000;text-align:center;
  padding:0 .3em .08em;min-height:1.4em;
}
.iw-kind i{font-style:normal;font-size:.52em;letter-spacing:-.02em;white-space:nowrap;line-height:1.5}

/* 車両欄。ここだけが枠囲み */
.iw-car{margin-left:21%;width:56%;border:.05em solid #000;display:flex;margin-bottom:1.3em}
.iw-car .lb{
  flex:0 0 27.8%;border-right:.05em solid #000;padding:.5em .3em;font-size:.9em;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35em;line-height:1.35;
}
.iw-car .val{flex:1;display:flex;align-items:center;padding:.5em .7em;font-size:1.02em;min-height:3.4em;min-width:0;word-break:break-all}

/* 年月日。原本は「令和」まで刷り込まれている */
.iw-date{text-align:right;padding-right:2.2em;margin-bottom:1.9em;font-size:1em}
.iw-date .e{margin-right:.4em}
.iw-date .n{display:inline-block;min-width:2.6em;text-align:center}

/* 委任者×2 */
.iw-bottom{display:flex;gap:2.6em;margin-top:auto;padding:0 .8em}
.iw-col{flex:1 1 0;min-width:0}
.iw-ch{letter-spacing:.5em;text-indent:.5em;margin-bottom:.15em}
.iw-kana{display:flex;align-items:flex-end;font-size:.8em;margin-bottom:.35em;min-height:1.5em}
.iw-kana .k{flex:0 0 auto;letter-spacing:.02em}
.iw-kana .v{flex:1;min-width:0;padding:0 .4em .05em;word-break:break-all}
.iw-line{display:flex;align-items:flex-end;margin-bottom:1.3em}
.iw-line:last-child{margin-bottom:0}
.iw-line .k{flex:0 0 auto;font-size:.86em;white-space:nowrap;margin-right:.3em}
.iw-line .v{
  flex:1;min-width:0;border-bottom:.045em solid #000;min-height:1.5em;position:relative;
  padding:0 1.8em .1em .3em;font-size:.92em;line-height:1.35;word-break:break-all;
}
/* 氏名又は名称の行末に刷られている㊞ */
.iw-in{position:absolute;right:.15em;bottom:.15em;font-style:normal;font-size:.95em;line-height:1}

/* モバイル：入力／プレビュー */
.mtabs{display:none;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px}
.mbar{display:none}
@media (max-width:1080px){
  .mtabs{display:grid}
  .mtabs button{
    appearance:none;border:3px solid var(--ink);border-radius:12px;background:#fff;padding:11px;
    font-weight:900;font-size:14px;color:var(--ink-2);cursor:pointer;box-shadow:0 4px 0 var(--ink);
  }
  .mtabs button[aria-pressed="true"]{background:var(--ink);color:#fff}
  body.m-form .stage{display:none}
  body.m-prev .pane{display:none}
  .mbar{
    position:fixed;left:0;right:0;bottom:0;z-index:70;background:rgba(255,255,255,.96);
    border-top:2px solid var(--ink);padding:9px 14px calc(9px + env(safe-area-inset-bottom));display:block;
  }
  body.tour-on .mbar{z-index:60}
}

/* ==========================================================================
   印刷
   ========================================================================== */
#print-root{display:none}
@media print{
  /* iOS Safari は既定で背景色を印刷しない。Chrome も「背景のグラフィック」が
     オフだと落ちる。ここで exact を指定すると、どちらも背景を出す。 */
  *,*::before,*::after{
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
  }
  html,body{background:#fff!important}
  body>*{display:none!important}
  body>#print-root{display:block!important}
  #print-root .sheet{box-shadow:none!important;transform:none!important;margin:0!important}
  #print-root .sheet + .sheet{page-break-before:always;break-before:page}
  #print-root .sheet-holder{width:auto!important;height:auto!important;margin:0!important}
  #print-root .cut::after{display:none!important}
}

/* ==========================================================================
   譲渡証明書：第21号様式（道路運送車両法施行規則第64条関係）を再現する
   正式な用紙は日本産業規格Ａ列５番（A5縦）。A4縦へ拡大して印刷することもできる。
   ========================================================================== */
.p-joto{
  /* 支給された様式画像の実測値。A4横のページに、書面を左へ寄せて置く。
     外枠 左16.7mm／上38.2mm／幅125.6mm／高さ139.2mm */
  background:#fff;color:#000;display:block;
  padding:31.8mm 154.7mm 0 16.7mm;
  font-size:3.82mm;line-height:1.5;font-weight:400;
}
.jt-form{font-size:.82em;font-weight:400;margin-bottom:1.5mm}
.jt-frame{
  border:.055em solid #000;height:139.2mm;padding:0 4.85mm;
  display:flex;flex-direction:column;box-sizing:border-box;
}
.jt-title{font-size:1.9em;font-weight:400;text-align:center;letter-spacing:.42em;text-indent:.42em;margin:3.4mm 0 0}
.jt-lead{font-size:.94em;margin:2.2mm 0 1.9mm;padding-left:1.3mm}
.jt-tbl{width:100%;border-collapse:collapse;table-layout:fixed}
.jt-tbl th,.jt-tbl td{border:.055em solid #000;padding:.35em .4em;font-weight:400;vertical-align:top}
.jt-tbl th{text-align:center;font-size:.86em;font-weight:400;letter-spacing:0}
.jt-car td{height:15.2mm;font-size:.9em;text-align:center;vertical-align:middle;word-break:break-all}
/* 列幅は原本の実測比率 */
.jt-car .c-cn{width:20.5%}.jt-car .c-md{width:20.5%}.jt-car .c-vin{width:36.5%}.jt-car .c-en{width:22.5%}
.jt-main{margin-top:3.7mm}
.jt-main tr:first-child th{white-space:nowrap}
.jt-main .c-date{width:20.5%}
.jt-main .c-seal{width:22.5%}
/* 4行とも同じ高さ。連続譲渡のための空欄も同じ大きさで残す */
.jt-main tr:not(:first-child):not(:last-child) td{height:15.3mm}
.jt-date{text-align:center;font-size:.86em;line-height:1.55;vertical-align:top!important;padding-top:.6em!important}
/* 原本では1行目の譲渡年月日のセルに斜線が引かれている。
   斜めの線は背景のグラデーションだと印刷で途切れて見えるため、
   線そのものをSVGで引く。 */
.jt-slash{padding:0!important;line-height:0}
.jt-slash svg{display:block;width:100%;height:100%}
.jt-party{padding:.4em .6em!important;vertical-align:top}
.jt-party .addr{font-size:.84em;display:block;line-height:1.45;min-height:1.4em}
.jt-party .nm{font-size:.96em;display:block;line-height:1.45;min-height:1.4em}
.jt-seal{text-align:center;vertical-align:top!important;padding-top:1.1em!important}
.jt-seal i{
  display:inline-grid;place-items:center;width:3.2em;height:3.2em;border:.08em dashed #000;
  border-radius:50%;font-size:.62em;color:#000;font-weight:400;line-height:1.25;text-align:center;
}
/* 備考は表の最下段。左に見出し、右は結合した1マス */
.jt-memo-h{text-align:center;vertical-align:middle!important;font-size:.86em}
.jt-memo{height:15.5mm}
.jt-note{font-size:.72em;margin-top:1.6mm;line-height:1.6}
.jt-size{font-size:.72em;text-align:right;margin-top:1.1mm}

/* ==========================================================================
   遺産分割協議成立申立書（A4縦）
   出典：関東運輸局 配布様式。※様式は運輸局ごとに細部が異なる場合がある
   ========================================================================== */
.p-isan{
  background:#fff;color:#000;padding:15mm 16mm;display:flex;flex-direction:column;
  font-size:calc(var(--pw) * .0212);line-height:1.85;font-weight:700;
}
.is-title{font-size:1.65em;font-weight:900;text-align:center;letter-spacing:.24em;text-indent:.24em;margin-bottom:.7em}
/* 原本では上下の枠線が無く、左右に大きな角括弧が付く */
.is-cond{
  position:relative;padding:.5em 1.35em;font-size:.78em;line-height:1.7;margin-bottom:1.2em;
}
.is-cond::before,.is-cond::after{
  content:"";position:absolute;top:0;bottom:0;width:.75em;
  border-top:.07em solid #000;border-bottom:.07em solid #000;
}
.is-cond::before{left:0;border-left:.07em solid #000}
.is-cond::after{right:0;border-right:.07em solid #000}
.is-cap{font-size:.9em;font-weight:900;margin:0 0 .25em}
.is-tbl{width:100%;border-collapse:collapse;table-layout:fixed;margin-bottom:1em}
.is-tbl th,.is-tbl td{border:.06em solid #000;padding:.4em .55em;font-weight:700;vertical-align:middle}
.is-tbl th{text-align:center;font-size:.84em;letter-spacing:.04em}
.is-tbl td{height:2.5em;font-size:.92em;word-break:break-all}
.is-body{margin:.4em 0 1.4em}
.is-body p{text-indent:1em;margin-bottom:.55em;font-size:.94em;line-height:1.95}
.is-date{text-align:right;margin-bottom:1.1em;font-size:.94em}
.is-to{font-size:.98em;font-weight:700;margin-bottom:1.2em;padding-left:22%}
.is-sign{margin-top:auto;margin-left:auto;width:70%}
.is-srow{display:flex;align-items:flex-end;gap:.6em;margin-bottom:.7em}
.is-srow .k{flex:0 0 5.6em;font-weight:900;letter-spacing:.45em;text-indent:.45em;white-space:nowrap}
/* 原本の記入線は点線 */
.is-srow .v{flex:1;border-bottom:.09em dotted #000;min-height:1.8em;padding:0 .3em .1em;font-size:.94em}
/* 原本では氏名の行末に「実印」と刷られている */
.is-jitsuin{flex:0 0 auto;font-size:.82em;font-weight:700;padding-bottom:.1em}
.is-seal{flex:0 0 auto;width:2.9em;height:2.9em;border:.08em dashed #000;border-radius:50%;display:grid;place-items:center;font-size:.6em;color:#000;font-weight:900}

/* 日付の前後関係が合わないときの注意（紙面には出さない） */
.datewarn{
  margin-top:8px;background:var(--red-lite);border:2px solid var(--red);border-radius:8px;
  padding:9px 11px;font-size:11.5px;font-weight:800;color:var(--red);line-height:1.75;
}
.datewarn[hidden]{display:none}

/* ==========================================================================
   計算ツール（シミュレーター）
   紙面を作るツールではないので SheetKit は使わない
   ========================================================================== */
.calc{max-width:var(--maxw);margin-inline:auto;padding:28px 18px 56px;display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.calc>*{min-width:0}
@media (max-width:900px){.calc{grid-template-columns:1fr;padding-bottom:88px}}

.result{position:sticky;top:96px;background:#fff;border:3px solid var(--ink);border-radius:14px;box-shadow:var(--shadow);overflow:hidden}
@media (max-width:900px){.result{position:static}}
.result__hd{padding:13px 18px;background:var(--ink);color:#fff;font-size:14px;font-weight:900;letter-spacing:.04em}
.result__main{padding:26px 20px;text-align:center;background:var(--cream);border-bottom:3px solid var(--ink)}
.result__lb{font-size:13px;font-weight:900;color:var(--ink-2);margin-bottom:6px}
.money{font-family:var(--mono);font-size:clamp(34px,7vw,52px);font-weight:700;letter-spacing:-.03em;line-height:1.15;color:var(--red)}
.money small{font-family:var(--jp);font-size:.42em;font-weight:900;margin-left:.15em;color:var(--ink)}
.result__sub{font-size:12.5px;font-weight:700;color:var(--ink-2);margin-top:10px;line-height:1.8}
.result__ng{background:#fff}
.result__ng .money{font-size:clamp(22px,4.4vw,30px);color:var(--ink-2)}

.brk{width:100%;border-collapse:collapse;font-size:13.5px}
.brk th,.brk td{border-bottom:1px solid var(--line);padding:11px 18px;text-align:left;font-weight:700;line-height:1.7}
.brk th{width:47%;background:#FCFCF8;font-weight:800;font-size:12.5px}
.brk td{font-family:var(--mono);text-align:right;font-variant-numeric:tabular-nums}
.brk tr:last-child th,.brk tr:last-child td{border-bottom:0}
.brk .em td{color:var(--red);font-weight:700}
.result__note{padding:14px 18px;border-top:1px solid var(--line);font-size:11.5px;font-weight:700;color:var(--ink-2);line-height:1.85;background:#FCFCF8}
.result__acts{padding:16px 18px;border-top:3px solid var(--ink);display:grid;gap:10px;background:var(--cream)}

.calcwarn{margin-top:10px;background:var(--red-lite);border:2px solid var(--red);border-radius:8px;padding:10px 12px;font-size:12px;font-weight:800;color:var(--red);line-height:1.8}
.calcwarn[hidden]{display:none}
.seg--3{grid-template-columns:1fr 1fr 1fr}
.seg--4{grid-template-columns:1fr 1fr}

/* 計算結果の印刷 */
#print-root .memo{width:210mm;min-height:297mm;padding:22mm 20mm;background:#fff;color:#000;font-weight:700}
#print-root .memo h1{font-size:20pt;font-weight:900;text-align:center;letter-spacing:.2em;margin-bottom:6mm}
#print-root .memo .lead{font-size:10pt;margin-bottom:8mm;line-height:1.9}
#print-root .memo table{width:100%;border-collapse:collapse;font-size:11pt;margin-bottom:8mm}
#print-root .memo th,#print-root .memo td{border:1px solid #000;padding:3mm 4mm;text-align:left}
#print-root .memo th{width:45%;background:#F2F2F2;font-weight:900}
#print-root .memo td{text-align:right}
#print-root .memo .big{font-size:22pt;font-weight:900;text-align:center;margin:6mm 0 8mm}
#print-root .memo .fine{font-size:8.5pt;font-weight:700;line-height:1.9;color:#333;border-top:1px solid #999;padding-top:4mm}

/* ==========================================================================
   保管・撤去記録書（A4縦）
   ========================================================================== */
.p-kiroku{
  background:#fff;color:#000;padding:12mm 13mm 10mm;display:flex;flex-direction:column;
  font-size:calc(var(--pw) * .0196);line-height:1.6;font-weight:700;
}
.kr-head{
  background:#16181A;color:#fff;text-align:center;font-size:1.5em;font-weight:900;
  padding:.4em 0 .45em;letter-spacing:.12em;margin-bottom:.9em;
}
.kr-tbl{width:100%;border-collapse:collapse;font-size:.92em;margin-bottom:1em}
.kr-tbl th,.kr-tbl td{border:.06em solid #000;padding:.4em .55em;text-align:left;vertical-align:middle}
.kr-tbl th{background:#F0F0F0;font-weight:900;white-space:nowrap;width:7.5em}
.kr-tbl td{min-height:1.8em}
.kr-cap{font-size:.9em;font-weight:900;margin:.5em 0 .3em;padding-left:.5em;border-left:.28em solid #16181A}
.kr-rows{border:.06em solid #000;margin-bottom:.9em}
.kr-row{display:flex;border-bottom:.05em solid #000;font-size:.88em;min-height:2em}
.kr-row:last-child{border-bottom:0}
.kr-row--h{background:#F0F0F0;font-weight:900}
.kr-row .no{flex:0 0 2.4em;border-right:.05em solid #000;text-align:center;padding:.25em 0}
.kr-row .dt{flex:0 0 8.5em;border-right:.05em solid #000;padding:.25em .5em}
.kr-row .tx{flex:1;padding:.25em .5em;min-width:0}
.kr-phs{display:grid;grid-template-columns:1fr 1fr;gap:.45em;margin-bottom:.7em}
.kr-ph{border:.06em solid #000;overflow:hidden;display:flex;flex-direction:column}
.kr-ph img{width:100%;height:9.2em;object-fit:contain;background:#EFEFEF;display:block}
.kr-ph .cap{font-size:.7em;padding:.28em .42em;border-top:.05em solid #000;line-height:1.45;min-height:1.9em}
.kr-ph--empty{height:11.4em;display:grid;place-items:center;color:#AAA;font-size:.85em;border-style:dashed}
.kr-sign{margin-top:auto;display:flex;gap:1.2em;border-top:.06em solid #000;padding-top:.6em}
.kr-sr{flex:1;display:flex;align-items:flex-end;gap:.5em;font-size:.88em}
.kr-sr .k{flex:0 0 4.6em;font-weight:900;letter-spacing:.2em;white-space:nowrap}
.kr-sr .v{flex:1;border-bottom:.06em solid #000;min-height:1.6em;padding:0 .3em .1em}
.kr-note{font-size:.68em;color:#555;margin-top:.5em;line-height:1.6}

/* 入力側 */
/* 1行を1枚のカードにする。日付と内容を縦に積むと、6行で入力欄が12個並び、
   どこまで進んだか分からなくなる。番号を見出しに出して、まとまりを見せる。 */
/* 番号は左端の細い帯として置く。丸バッジを見出し行に置くと、
   その1行ぶん高さが無駄に増えるため。 */
.kr-input{
  position:relative;background:#fff;border:2px solid var(--line-2);border-radius:12px;
  padding:10px 44px 10px 34px;margin-bottom:9px;
}
.kr-input:focus-within{border-color:var(--green)}
.kr-input .kr-no{
  position:absolute;left:0;top:0;bottom:0;width:24px;
  display:flex;align-items:center;justify-content:center;
  background:var(--cream);border-right:2px solid var(--line-2);
  border-radius:9px 0 0 9px;
  font-family:var(--mono);font-size:12px;font-weight:700;color:var(--ink-3);
}
.kr-input:focus-within .kr-no{background:var(--green);color:#fff;border-right-color:var(--green)}
/* スマホは年月日を上、内容を下に。PC（760px以上）で横に並べる。 */
.kr-in-body{display:grid;grid-template-columns:1fr;gap:8px;min-width:0}
/* 横並びにするのは、フォーム欄そのものに幅があるときだけ。
   PC は画面が2カラムになりフォーム側が狭いため、画面幅ではなく
   行カードの幅で判定する。コンテナの指定は親（行カード）に付ける。 */
.kr-input{container-type:inline-size}
@container (min-width:420px){
  .kr-in-body{grid-template-columns:186px minmax(0,1fr);gap:10px}
}
.kr-in-body input{margin:0}
.kr-f{display:block;min-width:0}
.kr-f label{
  display:block;font-size:11px;font-weight:800;color:var(--ink-3);
  margin:0 0 3px 2px;letter-spacing:.02em;
}

.kr-input input{
  width:100%;height:46px;padding:0 10px;border:2px solid var(--line-2);border-radius:9px;
  font-size:16px;font-weight:600;line-height:1.2;
}
.kr-input input:focus{outline:none;border-color:var(--green)}
/* iOS は空の日付欄に mm/dd/yyyy と出す。桁が切れないよう字間を詰める。 */
.kr-input input:focus{outline:none;border-color:var(--green)}
/* 削除はゴミ箱の絵で示す。×だけだと何が消えるのか伝わらない。 */
.kr-del{
  position:absolute;top:50%;transform:translateY(-50%);right:7px;appearance:none;
  width:32px;height:32px;padding:0;border:2px solid var(--line-2);border-radius:9px;
  background:#fff no-repeat center/16px 16px;cursor:pointer;font-size:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2378818A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M8 6V4h8v2M6 6l1 14h10l1-14M10 11v5M14 11v5'/%3E%3C/svg%3E");
  transition:border-color .12s,background-color .12s;
}
.kr-del:hover,.kr-del:focus-visible{
  border-color:var(--red);background-color:var(--red-lite);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BE1C1A' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M8 6V4h8v2M6 6l1 14h10l1-14M10 11v5M14 11v5'/%3E%3C/svg%3E");
}
.kr-del:active{transform:translateY(-50%) scale(.94)}
.kr-del:hover{border-color:var(--red);color:var(--red)}
.kr-rowbar{display:flex;align-items:center;gap:12px;margin-top:4px}
.kr-count{font-size:12px;font-weight:800;color:var(--ink-3)}

/* 紙面：ページ番号・本文の器・実測用の隠し紙 */
.kr-head .pg{position:absolute;right:.7em;top:50%;transform:translateY(-50%);font-size:.55em;font-weight:800;letter-spacing:.04em}
.kr-head{position:relative}
.kr-body{flex:1;display:flex;flex-direction:column;min-height:0}
.kr-b{margin-bottom:.35em}
.kr-b--foot{margin-top:auto;margin-bottom:0}
.kr-ph--tate img{object-position:center}
.kr-ruler{position:fixed!important;left:-9999px;top:0;visibility:hidden;pointer-events:none}
.ph-input{border:2px solid var(--line-2);border-radius:10px;padding:12px;margin-bottom:12px;background:#fff}
.ph-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.ph-hd b{font-size:12.5px;font-weight:900}
.ph-clear{appearance:none;border:1.5px solid var(--line-2);background:#fff;border-radius:6px;padding:3px 10px;font-size:11.5px;font-weight:800;color:var(--ink-2);cursor:pointer}
.ph-clear:hover{border-color:var(--red);color:var(--red)}
.ph-input input{
  width:100%;height:46px;margin:0;padding:0 10px;border:2px solid var(--line-2);border-radius:8px;
  font-size:16px;font-weight:600;line-height:1.2;
}
.ph-input input:focus{outline:none;border-color:var(--green)}
/* ファイル選択だけは中身がボタン＋文字なので、上下の余白を自前で取る */
.ph-input input[type=file]{padding:9px 10px;height:auto;min-height:46px}
.ph-input .kr-f{margin-bottom:9px}
.ph-input .kr-f:last-child{margin-bottom:0}



/* フッターの対応地域：都道府県ごとのリンクを2列に */
.ft__area{columns:2;column-gap:18px}
.ft__area li{break-inside:avoid}
@media (max-width:820px){.ft__area{columns:2}}