:root{
  --ink:#101010;--mid:#41414a;--soft:#8a8a92;--faint:#c8c8ce;
  --bg:#fff;--card:#F4F4F7;--line:#EAEAEF;
  --grad:linear-gradient(135deg,#F4A58C 0%,#BD9AD6 50%,#93A7E8 100%);
  --good:#1FAE63;--warn:#E8821E;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans JP",sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;line-height:1.8}
a{color:inherit}
.nav{position:sticky;top:0;z-index:9;background:rgba(255,255,255,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav .in{max-width:760px;margin:0 auto;padding:0 22px;height:60px;display:flex;align-items:center;gap:9px}
.brand{display:flex;align-items:center;gap:8px;font-weight:800;font-size:17px;letter-spacing:-.3px}
.brand img{width:24px;height:24px}
.nav .dl{margin-left:auto;background:#000;color:#fff;font-weight:800;font-size:13px;padding:8px 15px;border-radius:999px;text-decoration:none}
.wrap{max-width:720px;margin:0 auto;padding:0 22px}
article{padding:40px 0 20px}
.crumb{font-size:13px;color:var(--soft);font-weight:600}
.crumb a{text-decoration:none;color:var(--soft)}
h1{font-size:clamp(28px,5vw,40px);font-weight:800;letter-spacing:-1px;line-height:1.2;margin:14px 0 12px}
.meta{font-size:13px;color:var(--soft);font-weight:600;margin-bottom:8px}
.tldr{background:var(--card);border-radius:18px;padding:20px 22px;margin:24px 0;border-left:4px solid;border-image:var(--grad) 1}
.tldr b{display:block;font-size:13px;letter-spacing:1px;color:var(--soft);margin-bottom:8px;font-weight:800}
.tldr p{font-size:16px;font-weight:600;line-height:1.7}
article h2{font-size:23px;font-weight:800;letter-spacing:-.5px;margin:40px 0 14px;line-height:1.3}
article h3{font-size:18px;font-weight:800;margin:26px 0 10px}
article p{font-size:16.5px;color:var(--mid);margin:0 0 16px}
article ul,article ol{margin:0 0 18px 22px;color:var(--mid);font-size:16.5px}
article li{margin:6px 0}
article strong{color:var(--ink);font-weight:700}
.tbl{width:100%;border-collapse:collapse;margin:20px 0;font-size:14.5px}
.tbl th,.tbl td{border:1px solid var(--line);padding:11px 12px;text-align:left;vertical-align:top}
.tbl th{background:var(--card);font-weight:800;font-size:13px}
.tbl td b{color:var(--ink)}
.faq{margin-top:14px}
.faq details{border:1px solid var(--line);border-radius:14px;padding:4px 16px;margin-bottom:10px}
.faq summary{font-weight:800;font-size:16px;padding:12px 0;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"＋";float:right;color:var(--soft)}
.faq details[open] summary::after{content:"－"}
.faq p{font-size:15.5px;padding-bottom:14px}
.cta{background:#0d0d0f;border-radius:24px;padding:32px;text-align:center;margin:44px 0;color:#fff}
.cta h3{font-size:22px;font-weight:800;color:#fff;margin-bottom:8px;letter-spacing:-.3px}
.cta p{color:rgba(255,255,255,.7);font-size:14.5px;margin-bottom:20px}
.cta .badge{display:inline-flex;align-items:center;gap:10px;background:#fff;color:#000;border-radius:12px;padding:10px 18px;text-decoration:none}
.cta .badge svg{width:21px;height:21px}
.cta .badge small{font-size:9.5px;display:block;line-height:1.1;opacity:.7;font-weight:600}
.cta .badge b{font-size:17px;line-height:1.1}
.rel{border-top:1px solid var(--line);margin-top:30px;padding-top:24px}
.rel h4{font-size:13px;letter-spacing:1px;color:var(--soft);font-weight:800;margin-bottom:12px}
.rel a{display:block;padding:11px 0;font-weight:700;font-size:15.5px;text-decoration:none;border-bottom:1px solid var(--line)}
.disc{font-size:12.5px;color:var(--faint);line-height:1.7;margin:30px 0;padding:16px;background:var(--card);border-radius:12px}
footer{border-top:1px solid var(--line);padding:30px 0;color:var(--soft);font-size:12.5px;text-align:center}