:root{
  --void:#F8FAFC;--deep:#F1F5F9;--surface:#FFFFFF;--white:#0F172A;--dim:#475569;--dimmer:#94A3B8;
  --line:#E2E8F0;--signal:#0F766E;--signal-dim:#F0FDFA;--todo:#B45309;--todo-bg:#FFFBEB;
  --f-jp:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic Medium","Yu Gothic",Meiryo,"Noto Sans JP",sans-serif;
  --f-lat:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Segoe UI",Arial,sans-serif;
  --f-mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
body{background:var(--void);color:var(--white);font-family:var(--f-jp);font-size:15px;line-height:1.95;-webkit-font-smoothing:antialiased;margin:0}
p{margin:0}a{color:inherit}
h1,h2{margin:0;font-weight:800;letter-spacing:-.01em;line-height:1.32;text-wrap:balance}
.eyebrow{font-family:var(--f-lat);font-weight:600;font-size:10.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--dimmer)}
.inner{max-width:760px;margin:0 auto;padding:0 28px}

/* ---------- LPと同じヘッダ ---------- */
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1120px;margin:0 auto;padding:20px 28px}
.nav-in{display:flex;align-items:center;gap:26px}
.mark{font-family:var(--f-lat);font-weight:800;font-size:15px;letter-spacing:.24em;text-transform:uppercase;text-decoration:none;color:var(--white)}
.mark:hover{opacity:.75}
.nav-links{display:flex;gap:26px;font-size:12px;letter-spacing:.04em;color:var(--dim)}
.nav-links a{text-decoration:none}
.nav-links a:hover{color:var(--white)}
.nav-links a[aria-current=page]{color:var(--white)}

.nav-cta{font-family:var(--f-jp);font-size:12.5px;font-weight:600;letter-spacing:.02em;color:#F8FAFC;
  background:var(--signal);padding:9px 20px;border-radius:8px;text-decoration:none;display:inline-block;transition:background .15s ease}
.nav-cta:hover{background:#0B5C50}

.btn{display:inline-block;font-family:var(--f-jp);font-size:13.5px;font-weight:600;letter-spacing:.03em;
  padding:14px 30px;border-radius:8px;border:none;cursor:pointer;text-decoration:none;transition:background .15s ease,border-color .15s ease}
.btn-solid{background:var(--signal);color:#F8FAFC}
.btn-solid:hover{background:#0B5C50}
.btn-line{background:transparent;color:var(--white);border:1px solid var(--line)}
.btn-line:hover{border-color:var(--white)}
.btn:disabled{opacity:.55;cursor:default}
.btn:focus-visible{outline:2px solid var(--signal);outline-offset:2px}

.draft{border:1px solid var(--todo);background:var(--todo-bg);color:var(--todo);padding:16px 18px;margin:28px 0 0;font-size:13px;line-height:1.8;border-radius:10px}
.draft b{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;display:block;margin-bottom:6px}
.draft ul{margin:10px 0 0;padding-left:1.2em}
.head{padding:44px 0 10px}
.head h1{font-size:clamp(26px,4.6vw,40px)}
.head .meta{margin-top:18px;color:var(--dimmer);font-family:var(--f-mono);font-size:11.5px}
.head .sub{margin-top:20px;color:var(--dim);font-size:15px}
section{padding:56px 0 0}
h2{font-size:clamp(19px,2.6vw,24px);padding-bottom:14px;border-bottom:1px solid var(--line)}
dl{margin:22px 0 0;display:grid;grid-template-columns:150px 1fr;gap:0}
@media(max-width:600px){dl{grid-template-columns:1fr}}
dt{font-size:13px;color:var(--dimmer);padding:13px 0;border-bottom:1px solid var(--line)}
dd{margin:0;padding:13px 0;border-bottom:1px solid var(--line);font-size:14.5px}
@media(max-width:600px){dt{padding-bottom:0;border-bottom:0}dd{padding-top:4px}}
.fill{font-family:var(--f-mono);font-size:12.5px;color:var(--todo);border:1px dashed rgba(180,83,9,.5);padding:2px 9px;border-radius:4px}
.card{border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:30px 30px 34px}
.card + .card{margin-top:18px}
ol.terms{margin:6px 0 0;padding:0;list-style:none}
ol.terms > li{padding:26px 0;border-bottom:1px solid var(--line)}
ol.terms > li > .t{font-family:var(--f-mono);font-size:11px;color:var(--signal);letter-spacing:.1em;display:block;margin-bottom:8px}
ol.terms > li > h3{margin:0 0 10px;font-weight:700;font-size:16.5px;letter-spacing:-.01em}
ol.terms p{color:var(--dim);font-size:14.5px}
ol.terms p + p{margin-top:12px}
ol.terms ul{margin:12px 0 0;padding-left:1.2em;color:var(--dim);font-size:14.5px}
ol.terms li li{margin-bottom:6px}
table.grid{width:100%;border-collapse:collapse;margin-top:14px;font-size:14px}
table.grid th,table.grid td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:top}
table.grid th{color:var(--dimmer);font-size:12.5px;font-weight:400;width:34%}
table.grid td{color:var(--dim)}
strong{color:var(--white);font-weight:500}

/* ---------- 下のお問い合わせ ---------- */
.endcta{margin-top:96px;padding:64px 0;border-top:1px solid var(--line);text-align:center}
.endcta h2{border:none;padding:0;font-size:clamp(22px,3.4vw,30px)}
.endcta p{margin-top:16px;color:var(--dim);font-size:14.5px}
.endcta .row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:28px}

footer{margin-top:0;padding:34px 0 68px;border-top:1px solid var(--line);color:var(--dimmer);font-size:11.5px}
.frow{display:flex;flex-wrap:wrap;gap:18px;justify-content:space-between;align-items:center;max-width:1120px;margin:0 auto;padding:0 28px}
.flinks{display:flex;flex-wrap:wrap;gap:20px}
.flinks a{color:var(--dim);text-decoration:none}
.flinks a:hover{color:var(--white)}

/* ---------- 画面が狭いとき ---------- */
@media(max-width:640px){
  .inner{padding:0 20px}
  .frow{padding:0 20px;flex-direction:column;align-items:flex-start;gap:14px}
  .flinks{flex-wrap:wrap;gap:12px 18px}
  .head{padding:34px 0 6px}
  section{padding:44px 0 0}
  .card{padding:24px 22px 26px}
  .endcta{margin-top:64px;padding:52px 0}
  .endcta .row{flex-direction:column;align-items:stretch}
  .endcta .btn{width:100%}
  table.grid th{width:38%}
  table.grid th,table.grid td{padding:11px 8px;font-size:13.5px}
  ol.terms > li{padding:22px 0}
  .fill{display:inline-block}
}
@media(max-width:400px){
  .inner{padding:0 16px}
  .frow{padding:0 16px}
  .nav{padding:14px 16px}
  table.grid{display:block;overflow-x:auto}
}

/* ---------- 狭い画面: ハンバーガー ---------- */
.nav-toggle{display:none}
.nav-menu{display:none}
@media(max-width:720px){
  .nav{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px}
  .nav-in{display:flex;align-items:center;gap:10px}
  .nav-links{display:none}
  .nav-cta{padding:9px 15px;font-size:12px}

  .nav-toggle{display:grid;gap:5px;place-content:center;width:42px;height:42px;flex:none;
    padding:0;background:none;border:1px solid var(--line);border-radius:10px;cursor:pointer}
  .nav-toggle span{display:block;width:17px;height:1.6px;border-radius:2px;background:var(--white);
    transition:transform .22s ease,opacity .16s ease}
  .nav-toggle[aria-expanded=true] span:nth-child(1){transform:translateY(6.6px) rotate(45deg)}
  .nav-toggle[aria-expanded=true] span:nth-child(2){opacity:0}
  .nav-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-6.6px) rotate(-45deg)}
  .nav-toggle:focus-visible{outline:2px solid var(--signal);outline-offset:2px}

  .nav-menu{display:block;position:absolute;left:14px;right:14px;top:calc(100% + 6px);z-index:20;
    padding:10px;background:var(--surface);border:1px solid var(--line);border-radius:14px;
    box-shadow:0 18px 46px rgba(15,23,42,.14)}
  .nav-menu[hidden]{display:none}
  .nav-menu a{display:block;padding:13px 14px;border-radius:9px;font-size:14.5px;
    color:var(--white);text-decoration:none}
  .nav-menu a[aria-current=page]{color:var(--signal);background:var(--signal-dim)}
  .nav-menu a:active{background:var(--deep)}
  .nav-menu .menu-cta{margin-top:6px;text-align:center;font-weight:600;
    background:var(--signal);color:#F8FAFC}
}
@media(max-width:420px){
  .nav-in > .nav-cta{display:none}   /* 幅が足りないので、登録はメニューの中の1本にする */
}

/* ---------- ページ共通の部品 ---------- */
.lede{margin-top:22px;color:var(--dim);font-size:15px;line-height:1.95}
.toc{margin-top:26px;border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:20px 22px}
.toc b{display:block;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;color:var(--dimmer);margin-bottom:12px}
.toc ol{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:2px 24px}
@media(max-width:600px){.toc ol{grid-template-columns:1fr}}
.toc a{display:flex;gap:10px;padding:7px 0;font-size:13.5px;color:var(--dim);text-decoration:none}
.toc a:hover{color:var(--signal)}
.toc a i{font-style:normal;font-family:var(--f-mono);font-size:11px;color:var(--dimmer);flex:none;width:3.4em}
ol.terms > li{scroll-margin-top:80px}
.updated{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-family:var(--f-mono);
  font-size:11px;letter-spacing:.06em;color:var(--dimmer);border:1px solid var(--line);
  background:var(--surface);border-radius:99px;padding:6px 13px}
.kv{margin:0}
.kv .r{display:grid;grid-template-columns:170px 1fr;gap:0;border-bottom:1px solid var(--line)}
@media(max-width:600px){.kv .r{grid-template-columns:1fr;gap:2px;padding:14px 0}
  .kv .r .k{padding:0}.kv .r .v{padding:0}}
.kv .k{font-size:13px;color:var(--dimmer);padding:15px 0}
.kv .v{font-size:14.5px;padding:15px 0}
.kv .r:first-child{border-top:1px solid var(--line)}
.two{margin-top:26px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:720px){.two{grid-template-columns:1fr}}
.two .card{padding:26px 24px 28px;margin:0}
.two .card h3{margin:0;font-size:16.5px;font-weight:700;letter-spacing:-.01em}
.two .card p{margin-top:12px;color:var(--dim);font-size:14px;line-height:1.85}
.two .card .ic{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;
  background:var(--signal-dim);border:1px solid rgba(15,118,110,.24);margin-bottom:16px}
.two .card .ic svg{width:17px;height:17px;stroke:var(--signal);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}