/* はじめてのファクタリング（/hajimete/、page-hajimete.php）v2。2026-11-05 本人「作り直すぐらいオシャレに」。
   紺のヒーロー／章ごとに左の見出し（追従）＋右の中身／操作できる部品。前の版は scratchpad の hajimete.v1.css */
.hj2{--n:#0B1830;--ink:#0D1B2A;--sub:#4C5D70;--b:#1F5EFF;--m:#14A695;--s:#F0A830;--ln:#E3EAF2;--tint:#F4F7FC;--r:24px;color:var(--ink);overflow-x:clip}
.hj2 .num{font-family:var(--mono);font-variant-numeric:tabular-nums}
.hj2 a{text-underline-offset:3px}

/* ---------- 顔 ---------- */
.hj2-av{flex:none;display:block;width:44px;height:44px;border-radius:50%;background:#fff;border:2px solid var(--ink);overflow:hidden;box-shadow:0 8px 18px -10px rgba(13,27,42,.6)}
.hj2-av svg{display:block;width:100%;height:100%}
.hj2-av.lg{width:56px;height:56px}.hj2-av.xl{width:96px;height:96px;border-width:3px}

/* ---------- ヒーロー ---------- */
.hj2-hero{position:relative;isolation:isolate;overflow:hidden;color:#fff;padding:0 0 56px;background:linear-gradient(160deg,#0A1528 0%,#0F2547 45%,#123E66 100%)}
.hj2-hero:before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(80% 70% at 30% 30%,#000,transparent 75%)}
.hj2-hero-bg i{position:absolute;z-index:-1;border-radius:50%;filter:blur(60px);opacity:.55;animation:hj2-float 18s ease-in-out infinite alternate}
.hj2-hero-bg .b1{width:520px;height:520px;left:-160px;top:-180px;background:#1F5EFF}
.hj2-hero-bg .b2{width:440px;height:440px;right:-120px;top:40px;background:#14A695;animation-delay:-6s}
.hj2-hero-bg .b3{width:360px;height:360px;left:40%;bottom:-220px;background:#F0A830;opacity:.28;animation-delay:-12s}
@keyframes hj2-float{to{transform:translate(40px,30px) scale(1.08)}}
.hj2-hero .crumbs,.hj2-hero .crumbs a{color:rgba(255,255,255,.6)}
.hj2-hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center;margin-top:30px}
.hj2-kick{display:inline-flex;align-items:center;gap:10px;margin:0 0 20px;padding:5px 14px 5px 5px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);font-size:13px;font-weight:700;color:rgba(255,255,255,.85)}
.hj2-kick .num{font-size:10.5px;letter-spacing:.18em;color:var(--n);background:linear-gradient(135deg,#7FE0D2,#8FB3FF);border-radius:999px;padding:4px 10px}
.hj2-hero h1{margin:0 0 18px;font-weight:900;line-height:1.08;letter-spacing:-.02em}
.hj2-hero h1 span{display:block}
.hj2-hero h1 .l1{font-size:clamp(28px,3.4vw,40px);color:rgba(255,255,255,.88);letter-spacing:.02em}
.hj2-hero h1 .l2{font-size:clamp(44px,6.4vw,80px);background:linear-gradient(100deg,#FFFFFF 0%,#BFE9DF 40%,#8FB3FF 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hj2-sub{margin:0 0 26px;font-size:16px;line-height:1.9;color:rgba(255,255,255,.75);font-weight:500}
.hj2-answer{display:flex;gap:14px;align-items:flex-start;max-width:600px;margin:0 0 28px;padding:16px 18px;border-radius:20px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(8px)}
.hj2-answer b{display:block;font-size:12px;letter-spacing:.08em;color:#7FE0D2;margin-bottom:2px}
.hj2-answer p{margin:0;font-size:14.5px;line-height:1.85;color:rgba(255,255,255,.92)}
.hj2-answer em{font-style:normal;color:#fff;font-weight:800;box-shadow:inset 0 -6px 0 rgba(240,168,48,.45)}
.hj2-cta{display:flex;flex-wrap:wrap;gap:12px}
.hj2-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:15px 26px;border-radius:999px;font-size:15px;font-weight:800;text-decoration:none;transition:transform .15s,box-shadow .15s,background .15s}
.hj2-btn span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;font-size:13px;transition:transform .15s}
.hj2-btn.pri{background:#fff;color:var(--n);box-shadow:0 14px 30px -12px rgba(0,0,0,.6)}.hj2-btn.pri span{background:var(--n);color:#fff}
.hj2-btn.ghost{color:#fff;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.04)}.hj2-btn.ghost span{background:rgba(255,255,255,.14)}
.hj2-btn:hover{transform:translateY(-2px)}.hj2-btn:hover span{transform:translateX(3px)}
.hj2-glass{position:relative;padding:22px;border-radius:28px;background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(14px);box-shadow:0 40px 80px -40px rgba(0,0,0,.7)}
.hj2-glass-top{display:flex;align-items:center;gap:12px;margin:0 0 14px}
.hj2-glass-top p{position:relative;margin:0;padding:10px 14px;border-radius:16px;background:#FFF6D9;color:var(--ink);font-size:14px;font-weight:800}
.hj2-glass-top p:before{content:"";position:absolute;left:-7px;top:50%;margin-top:-7px;border:7px solid transparent;border-right-color:#FFF6D9;border-left:0}
.hj2-glass-k{margin:0 0 10px;font-size:12px;font-weight:700;letter-spacing:.06em;color:#9FE3D3}
.hj2-ck{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.hj2-ck button{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);font-size:14px;font-weight:700;color:#fff;transition:background .15s,border-color .15s,transform .15s}
.hj2-ck button:hover{background:rgba(255,255,255,.12);transform:translateX(2px)}.hj2-ck button:focus-visible{outline:2px solid #7FE0D2;outline-offset:2px}
.hj2-ck i{flex:none;position:relative;width:22px;height:22px;border-radius:7px;border:2px solid rgba(255,255,255,.45)}
.hj2-ck button[aria-pressed=true]{background:rgba(20,166,149,.22);border-color:rgba(127,224,210,.6)}
.hj2-ck button[aria-pressed=true] i{background:#14A695;border-color:#14A695}.hj2-ck button[aria-pressed=true] i:after{content:"";position:absolute;left:6px;top:2px;width:6px;height:11px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}
.hj2-meter{display:grid;grid-template-columns:44px auto minmax(0,1fr);align-items:center;gap:12px;margin-top:14px;padding:12px 14px;border-radius:16px;background:rgba(5,12,26,.55)}
.hj2-meter svg{width:44px;height:44px}.hj2-meter .t{fill:none;stroke:rgba(255,255,255,.14);stroke-width:5}.hj2-meter .f{fill:none;stroke:#7FE0D2;stroke-width:5;stroke-linecap:round;transition:stroke-dasharray .35s}
.hj2-meter b{font-size:26px;font-weight:600;line-height:1;color:#7FE0D2}.hj2-meter b small{font-size:13px;color:rgba(255,255,255,.5)}
.hj2-meter span{font-size:12.5px;line-height:1.6;color:rgba(255,255,255,.82)}
.hj2-stats{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-radius:22px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);overflow:hidden}
.hj2-stats li{padding:18px 22px;border-left:1px solid rgba(255,255,255,.1)}.hj2-stats li:first-child{border-left:0}
.hj2-stats b{font-size:34px;font-weight:600;line-height:1;color:#fff}.hj2-stats small{margin-left:3px;font-size:14px;color:rgba(255,255,255,.6)}
.hj2-stats span{display:block;margin-top:6px;font-size:12px;font-weight:700;color:rgba(255,255,255,.62)}

/* ---------- 章のナビ ---------- */
.hj2-nav{position:sticky;top:var(--hdr,64px);z-index:20;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--ln)}
.hj2-nav-in{display:flex;gap:4px;max-width:var(--wrap);margin:0 auto;padding:10px 28px;overflow-x:auto;scrollbar-width:none}.hj2-nav-in::-webkit-scrollbar{display:none}
.hj2-nav a{flex:none;display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:999px;font-size:13px;font-weight:700;color:var(--sub);text-decoration:none;transition:background .15s,color .15s}
.hj2-nav a .num{font-size:11px;color:#9AA8B8}
.hj2-nav a:hover{background:var(--tint);color:var(--ink)}
.hj2-nav a.on{background:var(--n);color:#fff}.hj2-nav a.on .num{color:#7FE0D2}

/* ---------- 章 ---------- */
.hj2-sec{padding:96px 0}
.hj2-sec.tint{background:linear-gradient(180deg,#F4F7FC,#F8FAFD)}
.hj2-sec.dark{background:radial-gradient(50% 70% at 100% 0,rgba(20,166,149,.28),transparent 70%),radial-gradient(50% 70% at 0 100%,rgba(31,94,255,.32),transparent 70%),linear-gradient(160deg,#0A1528,#10284B);color:#fff}
.hj2-grid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:64px;align-items:start}
.hj2-h{position:sticky;top:150px;scroll-margin-top:130px}
.hj2-no{display:flex;align-items:center;gap:12px;margin:0 0 16px;font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.2em;color:var(--b)}
.hj2-no .num{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;font-size:16px;letter-spacing:0;color:#fff;background:linear-gradient(135deg,#1F5EFF,#14A695);box-shadow:0 12px 24px -12px rgba(31,94,255,.8)}
.hj2-no:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(31,94,255,.35),transparent)}
.hj2-h h2{margin:0 0 14px;font-size:clamp(26px,2.6vw,34px);font-weight:900;line-height:1.35;letter-spacing:-.01em;text-wrap:balance}
.hj2-h h2 em{font-style:normal;background:linear-gradient(100deg,#1F5EFF,#14A695);-webkit-background-clip:text;background-clip:text;color:transparent}
.hj2-lead{margin:0;font-size:14.5px;line-height:1.95;color:var(--sub)}
.dark .hj2-no{color:#7FE0D2}.dark .hj2-no:after{background:linear-gradient(90deg,rgba(127,224,210,.4),transparent)}
.dark .hj2-h h2{color:#fff}.dark .hj2-h h2 em{background:linear-gradient(100deg,#7FE0D2,#8FB3FF);-webkit-background-clip:text;background-clip:text}.dark .hj2-lead{color:rgba(255,255,255,.72)}
.hj2-body{display:grid;gap:22px;min-width:0}
.hj2-note{margin:0;font-size:14.5px;line-height:1.9;color:var(--sub)}.hj2-note a{color:var(--b);font-weight:700}

/* ふわっと出る（JS が動くときだけ） */
.hj2-js .hj2-r{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.hj2-js .hj2-r.in{opacity:1;transform:none}

/* ---------- 吹き出し ---------- */
.hj2-chat{display:grid;gap:10px;padding:18px;border-radius:var(--r);background:#fff;border:1px solid var(--ln);box-shadow:0 22px 44px -36px rgba(13,27,42,.55)}
.hj2-say{display:flex;align-items:flex-end;gap:10px}.hj2-say.a{justify-content:flex-end}
.hj2-say p{position:relative;margin:0;max-width:min(520px,82%);padding:11px 15px;border-radius:18px;font-size:14.5px;line-height:1.8;font-weight:700}
.hj2-say p small{display:block;font-size:11px;font-weight:800;letter-spacing:.06em;margin-bottom:1px}
.hj2-say.q p{background:#FFF6D9;border-bottom-left-radius:6px}.hj2-say.q small{color:#B7791F}
.hj2-say.a p{background:#EAF1FF;border-bottom-right-radius:6px}.hj2-say.a small{color:var(--b)}

/* ---------- 01 4つの問い ---------- */
.hj2-qs{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:none}
.hj2-q{border-radius:20px;background:#fff;border:1px solid var(--ln);transition:border-color .2s,box-shadow .2s}
.hj2-q-top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;padding:16px 18px}
.hj2-q-top .num{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;font-size:13px;font-weight:600;color:var(--b);background:#EEF3FF}
.hj2-q-top b{font-size:15.5px;font-weight:800;line-height:1.55}
.hj2-yn{display:flex;gap:6px}
.hj2-yn button{all:unset;cursor:pointer;padding:8px 16px;border-radius:999px;font-size:13px;font-weight:800;color:var(--sub);background:var(--tint);border:1px solid var(--ln);transition:all .15s}
.hj2-yn button:hover{border-color:var(--b);color:var(--b)}.hj2-yn button:focus-visible{outline:2px solid var(--b);outline-offset:2px}
.hj2-yn button[data-v=y][aria-pressed=true]{background:var(--m);border-color:var(--m);color:#fff}
.hj2-yn button[data-v=n][aria-pressed=true]{background:#E0561F;border-color:#E0561F;color:#fff}
.hj2-q-no{display:none;margin:0;padding:0 18px 16px 70px;font-size:14px;line-height:1.85;color:#7A3A12}.hj2-q-no a{color:#C2410C;font-weight:800}
.hj2-q[data-a=n]{border-color:#F5C9AE;box-shadow:0 14px 30px -24px rgba(224,86,31,.6)}.hj2-q[data-a=n] .hj2-q-no{display:block}
.hj2-q[data-a=y]{border-color:#BFE7DF}.hj2-q[data-a=y] .hj2-q-top .num{background:var(--m);color:#fff}
.hj2-qres{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:20px;color:#fff;background:linear-gradient(135deg,#0E7C70,#14A695)}
.hj2-qres p{flex:1;margin:0;font-size:14.5px;line-height:1.8}.hj2-qres a{flex:none;color:#fff;font-weight:800;text-decoration:none;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.18)}

/* ---------- 挿絵 ---------- */
.hj2-art{margin:0;padding:16px;border-radius:var(--r);background:#fff;border:1px solid var(--ln);box-shadow:0 26px 50px -40px rgba(13,27,42,.6)}
.hj2-art svg{display:block;width:100%;height:auto;max-height:340px}
.hj2-art figcaption{margin:8px 4px 0;font-size:12.5px;font-weight:700;color:var(--sub);text-align:center}

/* ---------- 02 2社間・3社間 ---------- */
.hj2-vs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.hj2-vs-c{position:relative;padding:22px;border-radius:var(--r);background:#fff;border:1px solid var(--ln);overflow:hidden}
.hj2-vs-c:after{content:"";position:absolute;right:-40px;top:-40px;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,rgba(31,94,255,.12),transparent 70%)}
.hj2-vs-c+.hj2-vs-c:after{background:radial-gradient(circle,rgba(20,166,149,.14),transparent 70%)}
.hj2-tag{display:inline-block;margin:0 0 8px;padding:3px 10px;border-radius:999px;font-size:11.5px;font-weight:800}.hj2-tag.blue{color:var(--b);background:#EEF3FF}.hj2-tag.mint{color:#0E7C70;background:#E6F7F3}
.hj2-vs-c h3{margin:0 0 8px;font-size:24px;font-weight:900}
.hj2-vs-c>p{margin:0 0 14px;font-size:14.5px;line-height:1.85;color:#2B3A4C}
.hj2-vs-c ul{list-style:none;margin:0;padding:0;display:grid;gap:1px;border-radius:14px;overflow:hidden;background:var(--ln)}
.hj2-vs-c li{display:flex;justify-content:space-between;gap:10px;padding:9px 12px;background:var(--tint);font-size:13.5px;font-weight:700}.hj2-vs-c li b{color:var(--sub);font-size:12px}

/* ---------- 03 5つのこと ---------- */
.hj2-five{list-style:none;margin:0;padding:0;border-top:1px solid var(--ln)}
.hj2-five li{display:grid;grid-template-columns:84px minmax(0,1fr) auto;gap:22px;align-items:center;padding:26px 8px;border-bottom:1px solid var(--ln);transition:background .2s}
.hj2-five li:hover{background:linear-gradient(90deg,rgba(31,94,255,.04),transparent)}
.hj2-five-n{font-size:52px;font-weight:600;line-height:1;letter-spacing:-.04em;background:linear-gradient(135deg,#1F5EFF,#14A695);-webkit-background-clip:text;background-clip:text;color:transparent}
.hj2-five li:nth-child(2n) .hj2-five-n{background:linear-gradient(135deg,#F0A830,#E0561F);-webkit-background-clip:text;background-clip:text}
.hj2-five h3{margin:0 0 6px;font-size:18px;font-weight:900;line-height:1.5}
.hj2-five p{margin:0;font-size:14.5px;line-height:1.85;color:#2B3A4C}.hj2-five p b{color:var(--b)}
.hj2-five-go{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;border:1px solid var(--ln);font-size:13px;font-weight:800;color:var(--ink);text-decoration:none;white-space:nowrap;transition:all .15s}
.hj2-five-go span{color:var(--b);transition:transform .15s}.hj2-five-go:hover{border-color:var(--b);color:var(--b)}.hj2-five-go:hover span{transform:translateX(3px)}

/* ---------- 04 流れ ---------- */
.hj2-tl{list-style:none;margin:0;padding:0;position:relative;display:grid;gap:14px}
.hj2-tl:before{content:"";position:absolute;left:23px;top:24px;bottom:24px;width:2px;background:linear-gradient(180deg,#1F5EFF,#14A695)}
.hj2-tl li{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr);gap:18px;align-items:start}
.hj2-tl-n{position:relative;z-index:1;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;font-size:18px;font-weight:600;color:var(--b);background:#fff;border:2px solid var(--b);box-shadow:0 0 0 6px var(--tint)}
.hj2-tl li:nth-child(n+4) .hj2-tl-n{color:var(--m);border-color:var(--m)}
.hj2-tl-c{padding:16px 18px;border-radius:20px;background:#fff;border:1px solid var(--ln)}
.hj2-tl-h{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 4px}.hj2-tl-h b{font-size:16.5px;font-weight:900}
.hj2-tl-h span{font-size:11.5px;font-weight:800;color:var(--sub);background:var(--tint);border:1px solid var(--ln);border-radius:999px;padding:2px 10px}
.hj2-tl-c>p{margin:0;font-size:14.5px;line-height:1.85;color:#2B3A4C}.hj2-tl-c a{color:var(--b);font-weight:700}

/* ---------- 05 書類 ---------- */
.hj2-docs{padding:22px;border-radius:var(--r);background:#fff;border:1px solid var(--ln);box-shadow:0 26px 50px -40px rgba(13,27,42,.6)}
.hj2-docs-top{display:grid;gap:10px;margin:0 0 16px}
.hj2-docs-top p{margin:0;font-size:14px;font-weight:800;color:var(--sub)}.hj2-docs-top b{font-size:28px;color:var(--ink)}
.hj2-bar{display:block;height:8px;border-radius:8px;background:var(--tint);overflow:hidden}.hj2-bar i{display:block;width:0;height:100%;border-radius:8px;background:linear-gradient(90deg,#1F5EFF,#14A695);transition:width .35s}
.hj2-docs.done .hj2-docs-top b,.hj2-docs.done .hj2-docs-top p{color:var(--m)}
.hj2-docs ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.hj2-docs li button{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:grid;grid-template-columns:48px minmax(0,1fr) 26px;align-items:center;gap:14px;padding:12px 14px;border-radius:16px;border:1px solid var(--ln);background:#fff;transition:all .15s}
.hj2-docs li button:hover{border-color:var(--b)}.hj2-docs li button:focus-visible{outline:2px solid var(--b);outline-offset:2px}
.hj2-docs .ic{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:#EEF3FF}.hj2-docs .ic svg{width:24px;height:24px;fill:none;stroke:var(--b);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.hj2-docs .t b{display:block;font-size:15.5px;font-weight:800}.hj2-docs .t small{font-size:12.5px;font-weight:700;color:var(--sub)}
.hj2-docs li i{position:relative;width:26px;height:26px;border-radius:50%;border:2px solid #C5D1E0}
.hj2-docs li button[aria-pressed=true]{background:#F0FAF7;border-color:#9ED9CD}
.hj2-docs li button[aria-pressed=true] .ic{background:#DDF3EE}.hj2-docs li button[aria-pressed=true] .ic svg{stroke:var(--m)}
.hj2-docs li button[aria-pressed=true] i{background:var(--m);border-color:var(--m)}.hj2-docs li button[aria-pressed=true] i:after{content:"";position:absolute;left:8px;top:4px;width:6px;height:11px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}
.hj2-docs-more{margin:14px 0 0;padding:12px 14px;border-radius:14px;background:#FFF8EA;border:1px dashed #F3D9A4;font-size:13.5px;line-height:1.8;color:#5B4A2A}.hj2-docs-more b{display:block;font-size:12px;color:#B7791F}

/* ---------- 06 計算 ---------- */
.hj2-calc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;padding:22px;border-radius:28px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(8px)}
.hj2-sl{display:grid;gap:22px;align-content:center}
.hj2-sl label{display:grid;gap:10px}
.hj2-sl label>span{display:flex;justify-content:space-between;align-items:baseline;font-size:13.5px;font-weight:700;color:rgba(255,255,255,.75)}
.hj2-sl output{font-family:var(--mono);font-size:20px;font-weight:600;color:#fff}
.hj2-sl input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:8px;border-radius:8px;background:linear-gradient(90deg,#7FE0D2 0,#8FB3FF var(--p,50%),rgba(255,255,255,.16) var(--p,50%));outline:none;cursor:pointer}
.hj2-sl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:#fff;border:4px solid #1F5EFF;box-shadow:0 6px 14px rgba(0,0,0,.4)}
.hj2-sl input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;border:4px solid #1F5EFF}
.hj2-sl input[type=range]:focus-visible::-webkit-slider-thumb{outline:3px solid #7FE0D2}
.hj2-res{padding:22px;border-radius:22px;background:#fff;color:var(--ink)}
.hj2-res-k{margin:0;font-size:13px;font-weight:800;color:var(--sub)}
.hj2-res-v{margin:2px 0 14px;font-size:clamp(36px,4vw,48px);font-weight:600;line-height:1.1;background:linear-gradient(100deg,#0E7C70,#1F5EFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.hj2-split{display:flex;gap:3px;height:14px;margin:0 0 14px}.hj2-split i{display:block;border-radius:6px;transition:width .3s}.hj2-split .net{background:linear-gradient(90deg,#14A695,#1F5EFF)}.hj2-split .fee{background:var(--s)}
.hj2-res dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.hj2-res dl div{padding:10px 12px;border-radius:14px;background:var(--tint)}
.hj2-res dt{font-size:12px;font-weight:700;color:var(--sub)}.hj2-res dd{margin:2px 0 0;font-size:20px;font-weight:600}
.hj2-res dl div:first-child dd{color:#C2410C}
.hj2-res-n{margin:12px 0 0;font-size:12px;line-height:1.7;color:var(--sub)}.hj2-res-n a{color:var(--b);font-weight:700}

/* ---------- 07 会社 ---------- */
.hj2-four{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.hj2-four li{padding:14px;border-radius:18px;background:var(--n);color:#fff;font-size:13.5px;font-weight:800;line-height:1.5}
.hj2-four b{display:block;font-size:12px;color:#7FE0D2;margin-bottom:4px}
.hj2-picks .pk-list{margin-top:0}

/* ---------- 08 失敗 ---------- */
.hj2-ng{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.hj2-ng li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-radius:20px;overflow:hidden;border:1px solid var(--ln);background:#fff}
.hj2-ng p{margin:0;padding:16px 18px;font-size:14.5px;line-height:1.75;font-weight:700}
.hj2-ng span{display:inline-block;margin:0 0 4px;padding:2px 9px;border-radius:999px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em}
.hj2-ng .x{color:#7A3A12;background:linear-gradient(90deg,#FFF3EC,#fff)}.hj2-ng .x span{display:block;width:max-content;color:#fff;background:#E0561F}
.hj2-ng .o{position:relative;color:#0B4F47;background:#F0FAF7;border-left:1px dashed #BFE7DF}.hj2-ng .o span{display:block;width:max-content;color:#fff;background:var(--m)}
.hj2-ng .o:before{content:"→";position:absolute;left:-13px;top:50%;margin-top:-13px;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#fff;border:1px solid var(--ln);font-size:13px;color:var(--m)}

/* ---------- 09 よくある質問 ---------- */
.hj2-faq{display:grid;gap:10px}
.hj2-faq details{border-radius:20px;background:#fff;border:1px solid var(--ln);transition:box-shadow .2s}
.hj2-faq details[open]{box-shadow:0 22px 44px -36px rgba(13,27,42,.55)}
.hj2-faq summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:auto minmax(0,1fr) 30px;align-items:center;gap:14px;padding:18px 20px}
.hj2-faq summary::-webkit-details-marker{display:none}
.hj2-faq summary .num{font-size:12px;font-weight:600;color:var(--b);background:#EEF3FF;border-radius:10px;padding:6px 9px}
.hj2-faq summary b{font-size:15.5px;font-weight:800;line-height:1.55}
.hj2-faq summary i{position:relative;width:30px;height:30px;border-radius:50%;border:1px solid var(--ln)}
.hj2-faq summary i:before,.hj2-faq summary i:after{content:"";position:absolute;left:9px;top:13px;width:10px;height:2px;border-radius:2px;background:var(--b);transition:transform .2s}.hj2-faq summary i:after{transform:rotate(90deg)}
.hj2-faq details[open] summary i{background:var(--b);border-color:var(--b)}.hj2-faq details[open] summary i:before,.hj2-faq details[open] summary i:after{background:#fff}.hj2-faq details[open] summary i:after{transform:rotate(0)}
.hj2-faq details p{margin:0;padding:0 20px 20px 68px;font-size:14.5px;line-height:1.95;color:#2B3A4C}
.hj2-src{margin:0;font-size:12px;line-height:1.8;color:#6B7A8D}.hj2-src a{color:var(--b)}

/* ---------- 最後 ---------- */
.hj2-end{padding:88px 0;color:#fff;background:radial-gradient(50% 80% at 90% 0,rgba(20,166,149,.45),transparent 70%),radial-gradient(50% 80% at 0 100%,rgba(31,94,255,.5),transparent 70%),linear-gradient(160deg,#0A1528,#15304F)}
.hj2-end-in{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:40px;align-items:center}
.hj2-end-chara{display:flex}.hj2-end-chara .hj2-av+.hj2-av{margin-left:-22px;transform:translateY(18px)}
.hj2-no.light{color:#7FE0D2}.hj2-no.light .num{width:auto;padding:0 12px;font-size:11px;letter-spacing:.16em}.hj2-no.light:after{display:none}
.hj2-end h2{margin:0 0 14px;font-size:clamp(26px,3vw,36px);font-weight:900;color:#fff}
.hj2-end ol{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.hj2-end li{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:700;color:rgba(255,255,255,.9)}
.hj2-end li b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font-size:13px;color:var(--n);background:linear-gradient(135deg,#7FE0D2,#8FB3FF)}
.hj2-end-cta{display:grid;gap:10px}

/* ---------- 狭い画面 ---------- */
@media(max-width:1080px){.hj2-grid{grid-template-columns:minmax(0,1fr);gap:28px}.hj2-h{position:static}.hj2-end-in{grid-template-columns:minmax(0,1fr)}.hj2-end-chara{display:none}}
@media(max-width:900px){.hj2-hero-grid{grid-template-columns:minmax(0,1fr);gap:28px}.hj2-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.hj2-stats li:nth-child(3){border-left:0}.hj2-stats li:nth-child(n+3){border-top:1px solid rgba(255,255,255,.1)}.hj2-calc{grid-template-columns:minmax(0,1fr)}.hj2-four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){
  .hj2-sec{padding:64px 0}.hj2-hero{padding-bottom:40px}
  .hj2-nav-in{padding:8px 16px}
  .hj2-glass{padding:16px;border-radius:22px}.hj2-btn{width:100%;box-sizing:border-box}
  .hj2-stats b{font-size:26px}.hj2-stats li{padding:14px 16px}
  .hj2-q-top{grid-template-columns:auto minmax(0,1fr);padding:14px}.hj2-yn{grid-column:1/-1}.hj2-yn button{flex:1;text-align:center}.hj2-q-no{padding:0 14px 14px}
  .hj2-vs{grid-template-columns:minmax(0,1fr)}
  .hj2-five li{grid-template-columns:52px minmax(0,1fr);gap:14px;padding:20px 4px}.hj2-five-n{font-size:36px}.hj2-five-go{grid-column:2;justify-self:start}
  .hj2-ng li{grid-template-columns:minmax(0,1fr)}.hj2-ng .o{border-left:0;border-top:1px dashed #BFE7DF}.hj2-ng .o:before{left:50%;top:-13px;margin:0 0 0 -13px;content:"↓"}
  .hj2-faq summary{padding:14px 14px;gap:10px}.hj2-faq details p{padding:0 14px 16px}
  .hj2-chat{padding:12px}.hj2-say p{max-width:86%;font-size:14px}.hj2-av{width:38px;height:38px}
  .hj2-tl:before{left:19px}.hj2-tl li{grid-template-columns:40px minmax(0,1fr);gap:12px}.hj2-tl-n{width:40px;height:40px;font-size:16px}
  .hj2-calc,.hj2-docs{padding:14px}
}
@media(prefers-reduced-motion:reduce){.hj2-hero-bg i{animation:none}}

.hj2-qres[hidden]{display:none}
.hj2-h h2{word-break:keep-all;overflow-wrap:anywhere}
@media(max-width:1080px){.hj2-h h2 br{display:none}}
.hj2-nav{top:72px}

/* ---------- 05 100万円の例 ---------- */
.hj2-case{padding:22px;border-radius:var(--r);background:#fff;border:1px solid var(--ln);box-shadow:0 26px 50px -40px rgba(13,27,42,.6)}
.hj2-case-top{display:flex;gap:14px;align-items:center;padding:0 0 16px;border-bottom:1px dashed var(--ln)}
.hj2-case-top .k{margin:0 0 6px;font-size:13px;font-weight:800;color:var(--b)}
.hj2-case-top ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.hj2-case-top li{padding:5px 12px;border-radius:999px;background:var(--tint);border:1px solid var(--ln);font-size:13px;font-weight:800}.hj2-case-top li b{font-size:11px;color:var(--sub);margin-right:6px}
.hj2-case-tl{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:0}
.hj2-case-tl li{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;padding:14px 0;border-top:1px solid #EEF2F7}.hj2-case-tl li:first-child{border-top:0;padding-top:0}
.hj2-case-tl .d{font-size:12.5px;font-weight:800;color:#fff;background:var(--n);border-radius:10px;padding:5px 10px;height:max-content;text-align:center}
.hj2-case-tl li:last-child .d{background:var(--m)}
.hj2-case-tl b{display:block;font-size:15.5px;font-weight:900;margin-bottom:3px}.hj2-case-tl p{margin:0;font-size:14.5px;line-height:1.85;color:#2B3A4C}
.hj2-case-tw{overflow-x:auto;margin-top:8px;border:1px solid var(--ln);border-radius:14px}
.hj2-case-t{width:100%;min-width:480px;border-collapse:collapse;font-size:13.5px}
.hj2-case-t th{background:var(--tint);font-size:12px;font-weight:800;color:var(--sub);text-align:left;padding:9px 12px}
.hj2-case-t td{padding:10px 12px;border-top:1px solid #EEF2F7}.hj2-case-t td:first-child{font-weight:900}.hj2-case-t tr:first-child td{background:#F0FAF7}.hj2-case-t b{color:var(--m)}
.hj2-case-sum{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:16px}
.hj2-case-sum div{padding:12px 14px;border-radius:14px;background:linear-gradient(150deg,#0B1830,#12306A);color:#fff}
.hj2-case-sum span{display:block;font-size:11.5px;color:rgba(255,255,255,.7)}.hj2-case-sum b{font-size:18px;font-weight:700;line-height:1.4}

/* ---------- 07 断られやすい場面 ---------- */
.hj2-ko{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.hj2-ko li{position:relative;padding:18px 18px 18px 54px;border-radius:20px;background:#fff;border:1px solid var(--ln)}
.hj2-ko li:before{content:"!";position:absolute;left:16px;top:18px;display:grid;place-items:center;width:26px;height:26px;border-radius:8px;font-weight:900;font-size:14px;color:#fff;background:#E0561F}
.hj2-ko li.ok{background:#F0FAF7;border-color:#BFE7DF}.hj2-ko li.ok:before{content:"✓";background:var(--m)}
.hj2-ko b{display:block;font-size:15.5px;font-weight:900;line-height:1.5;margin-bottom:4px}.hj2-ko p{margin:0;font-size:14px;line-height:1.85;color:#2B3A4C}
.hj2-ko em{font-style:normal;font-weight:800;color:var(--b)}.hj2-ko a{color:var(--b);font-weight:700}

/* ---------- 09 見積もりで聞くこと ---------- */
.hj2-ask{padding:20px;border-radius:var(--r);background:#fff;border:1px solid var(--ln);box-shadow:0 26px 50px -40px rgba(13,27,42,.6)}
.hj2-ask-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
.hj2-ask-top p{margin:0;font-size:14px;font-weight:800;color:var(--sub)}.hj2-ask-top b{font-size:26px;color:var(--ink)}
.hj2-copy{all:unset;cursor:pointer;padding:9px 16px;border-radius:999px;background:var(--n);color:#fff;font-size:13px;font-weight:800}.hj2-copy:hover{background:var(--b)}.hj2-copy:focus-visible{outline:2px solid var(--b);outline-offset:2px}
.hj2-ask ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;counter-reset:ask}
.hj2-ask li{counter-increment:ask}
.hj2-ask li button{all:unset;box-sizing:border-box;width:100%;height:100%;cursor:pointer;display:grid;grid-template-columns:24px minmax(0,1fr);gap:12px;align-items:start;padding:12px 14px;border-radius:16px;background:var(--tint);border:1px solid var(--ln);transition:all .15s}
.hj2-ask li button:hover{border-color:var(--b)}.hj2-ask li button:focus-visible{outline:2px solid var(--b);outline-offset:2px}
.hj2-ask li i{position:relative;width:24px;height:24px;border-radius:8px;background:#fff;border:2px solid #C5D1E0}
.hj2-ask li i:before{content:counter(ask);position:absolute;inset:0;display:grid;place-items:center;font-family:var(--mono);font-size:11px;font-style:normal;color:var(--sub)}
.hj2-ask b{display:block;font-size:14.5px;font-weight:800;line-height:1.55}.hj2-ask small{display:block;margin-top:2px;font-size:12.5px;line-height:1.6;color:var(--sub)}
.hj2-ask li button[aria-pressed=true]{background:#F0FAF7;border-color:#9ED9CD}
.hj2-ask li button[aria-pressed=true] i{background:var(--m);border-color:var(--m)}.hj2-ask li button[aria-pressed=true] i:before{content:"✓";color:#fff;font-size:13px}
@media(max-width:640px){.hj2-ko,.hj2-ask ol{grid-template-columns:minmax(0,1fr)}.hj2-case,.hj2-ask{padding:14px}.hj2-case-tl li{grid-template-columns:minmax(0,1fr);gap:6px}.hj2-case-tl .d{justify-self:start}.hj2-case-sum{grid-template-columns:minmax(0,1fr)}.hj2-ask-top{flex-wrap:wrap}}
.hj2-ask-top b{display:inline}