/* AI実技測定 会話型LP（/lp/）。色と書体は売り場（public/kensa/index.html の :root）と同じ */
:root{
  color-scheme:light;
  --bg:#F2F4F5;--bg-2:#E6EBEC;--paper:#FFFFFF;--ink:#16232D;--ink-2:#5B6B76;--navy:#1F3A4D;--navy-h:#16303F;
  --shu:#C8442B;--rule:#C9D2D6;--rule-2:#DDE3E6;--ok:#2E6E58;--line:#2B3A45;
  /* 話す人の色：平野＝濃紺の枠、森＝ジャケットの緑の枠、本部長＝塗り */
  --c-hirano:#4BA3E3;--c-mori:#E0A526;--c-onishi:#1F3A4D;--c-shu:#C8442B;
  --sans:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
  --head:"Zen Kaku Gothic New","Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
  --mono:"IBM Plex Mono","Noto Sans JP",sans-serif;
  --ease:cubic-bezier(.2,.7,.1,1);
  --gut:48px;--sec:112px;
}
@media (max-width:1024px){:root{--gut:32px;--sec:96px}}
@media (max-width:640px){:root{--gut:16px;--sec:72px}}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:24px;overflow-x:clip}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);font-size:16px;line-height:1.9;letter-spacing:.04em;-webkit-font-smoothing:antialiased;overflow-x:clip}
@media (max-width:640px){body{font-size:15px}}
a{color:inherit;text-underline-offset:5px;text-decoration-thickness:1px}
img,svg{display:block}
:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.num,.mono{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:0}
.wrap{max-width:calc(1200px + var(--gut)*2);margin:0 auto;padding:0 var(--gut);position:relative}
.wrap.narrow{max-width:calc(760px + var(--gut)*2)}
.nw{display:inline-block}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (min-width:1025px){body::before,body::after{content:"";position:fixed;top:0;bottom:0;width:1px;background:var(--rule-2);z-index:0;pointer-events:none}
  body::before{left:max(var(--gut),calc(50% - 600px))}body::after{right:max(var(--gut),calc(50% - 600px))}}
main,footer{position:relative;z-index:1}

h1,h2,h3,h4{font-family:var(--head);font-weight:700;font-feature-settings:"palt";color:var(--ink);word-break:auto-phrase}
h1{font-size:clamp(26px,3.6vw,46px);line-height:1.5;letter-spacing:.05em}
h2{font-size:clamp(22px,2.5vw,32px);line-height:1.6;letter-spacing:.05em;margin-bottom:22px}
h3{font-size:clamp(18px,1.6vw,21px);line-height:1.6;letter-spacing:.04em}
@media (max-width:640px){h1{font-size:clamp(23px,6.6vw,28px)}h2{font-size:clamp(20px,5.6vw,24px)}}
h1 .ln{display:block}
.body{margin:14px 0}
.tx{margin:6px 0}
.voice b{font-weight:700}
.sm{font-size:12.5px;line-height:1.75;color:var(--ink-2)}
.src{font-size:12px;line-height:1.75;color:var(--ink-2);margin-top:6px}
.note{font-size:12px;color:var(--ink-2);margin-bottom:8px}
.kicker{font-size:13px;color:var(--ink-2);margin-bottom:18px;display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px}
.lbl{display:inline-block;font-size:11px;line-height:1.7;padding:0 9px;border:1px solid var(--ink-2);border-radius:999px;color:var(--ink-2);letter-spacing:.08em;white-space:nowrap}
.lbl.ex{background:var(--navy);border-color:var(--navy);color:#fff}

/* ---------- PRの帯 ---------- */
.pr{background:var(--bg);border-bottom:1px solid var(--rule-2);font-size:12px;color:var(--ink-2);position:relative;z-index:2}
.pr-in{min-height:28px;display:flex;align-items:center;justify-content:space-between;gap:4px 16px;flex-wrap:wrap;padding-top:3px;padding-bottom:3px}
.pr nav{display:flex;gap:14px;margin-left:auto}.pr nav a{color:var(--ink-2)}
@media (max-width:640px){.pr{font-size:11px}.pr-in{line-height:1.6}}

/* いま物語か説明かの札（JSのときだけ、スクロールに合わせて出す） */
.mode{position:fixed;top:10px;left:max(10px,calc(50% - 600px + 10px));z-index:40;pointer-events:none;opacity:0;transform:translateY(-6px);transition:opacity .2s,transform .2s}
.mode span{display:inline-block;font-size:11px;line-height:1.8;padding:0 10px;border-radius:999px;background:rgba(255,255,255,.94);border:1px solid var(--ink-2);color:var(--ink-2);letter-spacing:.06em}
.mode.ex span{background:var(--navy);border-color:var(--navy);color:#fff}
.mode.on{opacity:1;transform:none}

/* ---------- ボタン ---------- */
.btn{display:inline-flex;align-items:center;justify-content:space-between;gap:14px;min-height:56px;padding:0 10px 0 28px;border-radius:999px;background:var(--navy);color:#fff;text-decoration:none;font-weight:500;font-size:16px;letter-spacing:.06em;line-height:1.3;border:1px solid var(--navy);cursor:pointer;font-family:var(--sans);transition:background .2s,transform .1s}
.btn:hover{background:var(--navy-h)}.btn:active{transform:scale(.98)}
.btn .arw{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#fff;color:var(--navy);transition:transform .2s;flex:none}
.btn:hover .arw{transform:translateX(4px)}
.btn.ln-btn{background:var(--paper);color:var(--navy)}.btn.ln-btn:hover{background:var(--bg-2)}.btn.ln-btn .arw{background:var(--navy);color:#fff}
.btn.inv{background:#fff;color:var(--ink);border-color:#fff}.btn.inv:hover{background:var(--bg-2)}.btn.inv .arw{background:var(--navy);color:#fff}
form .btn[disabled]{opacity:.6;cursor:default}
@media (max-width:640px){.btn{width:100%;font-size:15px;min-height:54px;padding-left:22px}}
.tl{display:inline-flex;align-items:center;gap:8px;color:var(--ink);text-decoration:underline;text-underline-offset:6px;text-decoration-color:var(--rule);font-weight:700}
.tl:hover{text-decoration-color:currentColor}.tl svg{transition:transform .2s}.tl:hover svg{transform:translateX(4px)}
.cta-blk{margin-top:40px}
.cta-blk .sm{margin-top:10px}

/* ---------- 表紙 ---------- */
.cover{padding:56px 0 24px}
.cover-grid{display:grid;grid-template-columns:7fr 5fr;gap:32px 56px;align-items:center}
.cover h1{margin-bottom:28px}
.aside{font-size:13px;line-height:1.85;color:var(--ink-2);border-left:2px solid var(--rule);padding-left:14px;max-width:34em}
.f01{position:relative;aspect-ratio:2/3;max-height:600px;width:100%;margin:0 auto;background:var(--bg-2);border-radius:16px;overflow:hidden}
.f01-bg{position:absolute;left:-14%;bottom:-2%;width:128%;height:auto;opacity:.35}
.slide{position:absolute;left:7%;top:9%;width:64%;aspect-ratio:4/3;background:var(--paper);border:1.5px solid var(--line);border-radius:6px;padding:7% 8%;display:flex;flex-direction:column}
.slide-t{font-family:var(--head);font-weight:700;font-size:clamp(10px,1vw,13px);letter-spacing:.06em;border-bottom:1px solid var(--rule);padding-bottom:6px;white-space:nowrap}
.slide-q{flex:1;display:grid;place-items:center;font-family:var(--head);font-weight:700;font-size:clamp(40px,5vw,72px);color:var(--ink-2);line-height:1}
.f01-p{position:absolute;right:4%;bottom:0;height:80%;width:auto}
@media (max-width:900px){
  .cover{padding-top:32px}
  .cover-grid{grid-template-columns:1fr;gap:20px}
  .cover-text{display:contents}
  .cover .kicker{order:0;margin-bottom:0}.cover h1{order:1;margin-bottom:0}.f01{order:2;aspect-ratio:auto;height:min(500px,58svh);max-height:none}.cover-note{order:3}
  .slide{width:66%;left:6%;top:8%;aspect-ratio:auto;height:36%}.f01-p{height:84%}
  .slide-t{font-size:11px}
}
.brief{margin-top:40px;background:var(--paper);border:1px solid var(--rule);border-radius:14px;padding:24px 28px 18px;max-width:760px}
.brief h2{font-size:15px;letter-spacing:.06em;margin-bottom:10px}
.brief ul{list-style:none}
.brief li{position:relative;padding:8px 0 8px 18px;font-size:15px;line-height:1.75;border-top:1px solid var(--rule-2)}
.brief li:first-child{border-top:0}
.brief li::before{content:"";position:absolute;left:2px;top:19px;width:7px;height:7px;border-radius:50%;background:var(--navy)}
.brief-ft{margin-top:10px;padding-top:12px;border-top:1px solid var(--rule-2);font-size:12px;color:var(--ink-2);line-height:1.8}
.brief-ft a{margin-left:12px;color:var(--navy)}
@media (max-width:640px){.brief{padding:18px 18px 14px;margin-top:28px}.brief li{font-size:14.5px}}
.top-cta{margin-top:24px;max-width:760px}
html[data-v="b"] .top-cta{display:none}

/* ---------- 場面（絵＋吹き出し） ---------- */
.scene{padding:56px 0}
.scene+.scene,.block+.scene,.scene+.block{padding-top:24px}
.block{padding:32px 0}
.scene-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:24px 56px;align-items:start}
.ex-scene{margin:28px auto}
.stage{position:sticky;top:56px;background:var(--bg-2);border-radius:16px;overflow:hidden;display:flex;justify-content:center;align-items:flex-end;gap:2%;padding:28px 6% 0;min-height:200px;z-index:3}
.stage-bg{position:absolute;left:-6%;bottom:0;width:112%;height:auto;opacity:.32;z-index:0;will-change:transform}
.actor{position:relative;z-index:1;aspect-ratio:4/5;flex:0 1 auto;width:44%;max-width:230px}
.s1p .actor{width:56%}.s3p .actor{width:32%}
.actor img{position:absolute;inset:0;width:100%;height:100%;transition:opacity .12s linear}
.actor img.off{opacity:0}
.phone-tag{position:absolute;right:-6%;bottom:6%;font-size:10px;line-height:1.7;padding:0 7px;border-radius:999px;background:var(--navy);color:#fff;white-space:nowrap;letter-spacing:.04em}
.flow{display:flex;flex-direction:column;gap:10px;padding-top:8px;min-width:0}
.flow .tx{margin:10px 0}
.flow .tx.end{margin-top:28px;font-size:14px;color:var(--ink-2);border-top:1px solid var(--rule);padding-top:14px}
.gap{height:22px}
@media (max-width:760px){
  .scene{padding:36px 0}
  .scene-grid{grid-template-columns:1fr;gap:18px}
  .stage{top:0;min-height:0;padding:14px 8% 0;border-radius:0 0 16px 16px;margin:0 calc(var(--gut)*-1);box-shadow:0 1px 0 var(--rule)}
  .actor{width:36%;max-width:130px}.s1p .actor{width:34%}.s3p .actor{width:29%;max-width:112px}
  .phone-tag{font-size:9px;padding:0 5px;right:-18%;bottom:4%}
}

/* 吹き出し */
.say{max-width:88%;align-self:flex-start;--c:var(--c-hirano);--nm-bg:var(--c);--nm-tx:#10293B}
.say.r{align-self:flex-end;text-align:right}
.say[data-who="mori"]{--c:var(--c-mori);--nm-tx:#3A2A00}.say[data-who="onishi"]{--c:var(--c-onishi);--nm-bg:var(--c-shu);--nm-tx:#fff}
.say .nm{display:inline-block;font-size:11px;line-height:1.75;padding:0 9px;border-radius:999px;background:var(--nm-bg);color:var(--nm-tx);font-weight:600;letter-spacing:.06em;margin:0 6px 4px}
.say p{text-align:left;background:var(--paper);border:2px solid var(--c);border-radius:4px 18px 18px 18px;padding:10px 16px;font-size:15.5px;line-height:1.8;color:var(--ink)}
.say.r p{border-radius:18px 4px 18px 18px}
.say[data-who="onishi"] p{background:var(--c);color:#fff}
@media (max-width:640px){.say p{font-size:15px;padding:9px 14px}}
.rei{align-self:flex-start;font-size:11px;line-height:1.7;padding:0 9px;border:1px dashed var(--ink-2);border-radius:999px;color:var(--ink-2);margin-top:14px}

/* 切り替えの一行 */
.switch{position:relative;max-width:calc(1200px + var(--gut)*2);margin:24px auto 0;padding:0 var(--gut);text-align:center;font-size:14px;color:var(--ink-2)}
.switch span{display:block;padding:18px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}

/* ---------- 画面の見本（売り場の .scr と同じ部品） ---------- */
.scr{background:var(--paper);border:1px solid var(--rule);border-radius:6px;position:relative;font-size:13.5px;margin:12px 0}
.scr-hd{display:flex;align-items:center;gap:10px;padding:12px 18px;border-bottom:1px solid var(--rule);font-size:12.5px;color:var(--ink-2)}
.scr-hd i{width:7px;height:7px;border-radius:50%;background:var(--navy);flex:none}
.mihon{border:1px solid var(--ink-2);border-radius:2px;padding:0 6px;font-size:11px;line-height:1.6;color:var(--ink-2);white-space:nowrap;margin-left:auto}
.scr-bd{padding:14px 18px 18px}
.req{background:var(--bg);border-left:3px solid var(--navy);border-radius:4px;padding:12px 16px;font-size:14px;line-height:1.85}
.file{border:1px solid var(--rule);border-radius:4px;padding:12px 14px;margin-top:10px}
.file:first-child{margin-top:0}
.file .fn{display:flex;align-items:center;gap:10px;font-weight:500;word-break:break-all}
.file .ext{font:500 10px var(--mono);color:var(--ink-2);border:1px solid var(--rule);border-radius:3px;padding:1px 5px;flex:none}
.file .fn small{font:400 11px var(--mono);color:var(--ink-2);margin-left:auto;flex:none}
.seg{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.seg span{font-size:12px;padding:4px 12px;border:1px solid var(--rule);border-radius:999px;color:var(--ink-2);transition:background .3s,color .3s,border-color .3s}
.seg span.on,.seg span.pick{background:var(--navy);border-color:var(--navy);color:#fff}
.lblx{font-size:12px;color:var(--ink-2);margin:14px 0 4px}
.prompt{border:1px solid var(--rule);border-radius:4px;padding:10px 12px;font-size:13.5px;line-height:1.8}
.sendrow{margin-top:12px}
.fake-btn{display:inline-block;min-width:96px;text-align:center;padding:8px 20px;border-radius:999px;font-size:13px;background:var(--navy-h);color:#fff;transform:scale(.97);transition:background .15s,transform .15s}
.in-fig{margin:14px 4px}
/* 罠1の選択：画面に入ってから印が入る */
.js[data-motion="on"] #pick:not(.go) .seg span.pick{background:transparent;border-color:var(--rule);color:var(--ink-2)}
.js[data-motion="on"] #pick:not(.sent) .fake-btn{background:var(--navy);transform:none}

.mockfig{position:relative;margin:20px 0;display:flex;flex-direction:column}
.mockfig .mini-actor{align-self:flex-end;width:104px;height:auto;aspect-ratio:4/5;margin:10px 4px 0 0;position:relative;z-index:2;background:var(--bg-2);border-radius:16px;padding:6px 4px 0;border:1px solid var(--rule)}
.mockfig.left-actor .mini-actor{align-self:flex-start;margin-left:10px}
.mockfig figcaption{margin-top:8px}
@media (max-width:640px){.mockfig .mini-actor{width:76px}.scr-bd{padding:12px 14px 16px}}
.recrow{display:grid;grid-template-columns:1fr 24px;gap:2px 12px;align-items:center;background:var(--paper);border:1px solid var(--rule);border-radius:6px;padding:12px 18px;font-size:13px;line-height:1.65;margin-top:8px}
.recrow .who{grid-column:1;font-size:12px;color:var(--ink-2)}
.recrow .act{grid-column:1;word-break:break-all}
.recrow .mk{grid-column:2;grid-row:1/3;font-family:var(--mono);font-size:16px;text-align:center;color:var(--shu)}

/* 結果の画面 */
.result .scr-bd p{margin:6px 0;color:var(--ink-2);font-size:13.5px;line-height:1.85}
.result .scr-bd p b{color:var(--ink)}
.result .res-h{color:var(--ink)!important;font-weight:700;font-size:14.5px!important;padding-right:84px}
.res-h .x{color:var(--shu);font-family:var(--mono);margin-right:8px;font-size:17px}
.stamp{width:72px;height:72px;color:var(--shu);opacity:.88;transform:rotate(-4deg);pointer-events:none}
.st-a{font:700 17px var(--head);fill:currentColor;letter-spacing:.02em}
.st-b{font:500 13px var(--mono);fill:currentColor}
.st-c{font:700 12px var(--head);fill:currentColor;letter-spacing:.2em}
.result .stamp{position:absolute;right:14px;top:48px}
@media (max-width:640px){.result .stamp{width:60px;height:60px;right:10px;top:46px}.result .res-h{padding-right:66px}}

/* 受信トレイ */
.mail-hd{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;font-size:13px;padding-bottom:12px;border-bottom:1px solid var(--rule-2)}
.mail-hd dt{color:var(--ink-2);font-size:12px}
.mail-hd .addr{font-family:var(--mono);font-size:12.5px;word-break:break-all}
.mail-sb{font-weight:500;margin:12px 0 6px}
.mail-tx{color:var(--ink-2);line-height:1.85}
.zoom{background:var(--paper);border:1px solid var(--rule);border-radius:6px;padding:14px 18px;margin:8px 0;display:grid;gap:4px}
.zoom p{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.zoom small{font-size:11.5px;color:var(--ink-2);flex:0 0 6.5em}
.zoom .big{font-size:clamp(17px,2vw,21px)}
.zoom .hit{position:relative;color:var(--shu);font-weight:500;padding:0 .1em}
.zoom .hit svg{position:absolute;left:50%;top:50%;width:30px;height:30px;margin:-15px 0 0 -15px;overflow:visible}
.zoom circle{fill:none;stroke:var(--shu);stroke-width:1.8;stroke-dasharray:100;stroke-dashoffset:0;transition:stroke-dashoffset .4s var(--ease)}
.zoom .ok{color:var(--ok);font-weight:500;padding:0 .1em}
.js[data-motion="on"] .zoom:not(.on) circle{stroke-dashoffset:100}

/* AIの答え */
.sum{width:100%;border-collapse:collapse;font-size:13.5px}
.sum th,.sum td{padding:8px 4px;border-bottom:1px solid var(--rule-2);text-align:left}
.sum th{font-weight:400;color:var(--ink-2);font-size:12px}
.sum td.num,.sum th.num{text-align:right}
.sum tr.tot td{border-top:1px solid var(--ink);border-bottom:0;font-weight:500;padding-top:12px;transition:box-shadow .3s,color .3s}
.tv i{font-style:normal;display:inline-block}
.swapped .sum tr.tot td{box-shadow:inset 0 -2px 0 var(--shu)}.swapped .tv i{color:var(--shu)}
.swapped .d4{transform:translateX(100%)}.swapped .d2{transform:translateX(-100%)}
.js[data-motion="on"] .swapped .d4{animation:sw4 .5s var(--ease) both}
.js[data-motion="on"] .swapped .d2{animation:sw2 .5s var(--ease) both}
@keyframes sw4{0%{transform:none}50%{transform:translate(50%,-80%)}100%{transform:translateX(100%)}}
@keyframes sw2{0%{transform:none}50%{transform:translate(-50%,80%)}100%{transform:translateX(-100%)}}
.calc-note{display:flex;justify-content:flex-end;align-items:baseline;gap:10px;margin-top:10px;font-size:12px;color:var(--ink-2);transition:opacity .3s}
.calc-note b{font-size:16px;color:var(--ink);font-weight:500;border-bottom:1.5px solid var(--navy)}
.js[data-motion="on"] .s3:not(.checked) .calc-note{opacity:0}

/* ---------- 説明の段 ---------- */
.sec{padding:var(--sec) 0;position:relative;overflow:clip}
.sec.tight{padding:40px 0}
.sec.alt{background:var(--bg-2)}
.art{position:absolute;right:-160px;top:40px;width:440px;color:var(--ink);opacity:.07;pointer-events:none;z-index:0;will-change:transform}
.art svg{width:100%;height:auto}
@media (max-width:640px){.art{opacity:.05;width:300px;right:-140px}}
.sec>.wrap{z-index:1}
.three{list-style:none;margin-top:32px;border-top:1px solid var(--ink)}
.three li{display:flex;gap:20px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--rule);font-family:var(--head);font-weight:700;font-size:clamp(17px,1.8vw,20px)}
.three .num{font-size:13px;color:var(--ink-2);font-weight:500}
.kh{display:flex;align-items:baseline;gap:14px;padding-top:20px;border-top:1px solid var(--navy);margin-bottom:8px}
.kh .num{font-size:14px;color:var(--navy);font-weight:500}
.kh2{margin:64px 0 6px}
.ck{display:flex;align-items:flex-start;gap:10px;font-size:16px;color:var(--navy);font-weight:700;margin-top:18px;font-family:var(--head)}
.ck small{display:block;font:400 12.5px var(--sans);color:var(--ink-2);margin-top:2px}
.ck svg{width:24px;height:24px;padding:4px;border-radius:50%;background:var(--navy);color:#fff}
.ck svg{flex:none;margin-top:3px}
.lead-strong{font-family:var(--head);font-weight:700;font-size:clamp(17px,1.8vw,20px);line-height:1.8}

/* 比べる */
.cmp{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:28px 0 14px}
.cmp-col{border-top:1px solid var(--ink);padding:14px 4px 6px}
.cmp-col h4{font-size:15.5px;margin-bottom:8px}
.cmp-col dl{font-size:13.5px;line-height:1.7}
.cmp-col dt{font-size:11.5px;color:var(--ink-2);margin-top:8px}
.cmp-col dd{color:var(--ink-2)}
.cmp-col.us{background:var(--paper);border:1px solid var(--rule);border-top:3px solid var(--navy);border-radius:0 0 8px 8px;padding:14px 16px 10px}
.cmp-col.us dd{color:var(--ink);font-weight:500}
@media (max-width:760px){.cmp{grid-template-columns:1fr}.cmp-col.us{order:-1}.cmp-col dl{display:grid;grid-template-columns:9.5em 1fr;gap:4px 12px}.cmp-col dt{margin-top:2px}}

/* 管理画面の見本 */
.dash{background:var(--paper);border:1px solid var(--rule);border-radius:6px;overflow:hidden}
.dash-hd{display:flex;justify-content:space-between;align-items:center;padding:12px 18px;border-bottom:1px solid var(--rule);font-size:12.5px;color:var(--ink-2);gap:12px}
.dash-hd .mihon{margin-left:0}
.kpis{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;border-bottom:1px solid var(--rule)}
.kpis>div{padding:16px 18px;border-left:1px solid var(--rule-2)}.kpis>div:first-child{border-left:0}
.kpis small{display:block;font-size:12px;color:var(--ink-2);white-space:nowrap}
.kpis b{display:block;font-weight:400;font-size:36px;line-height:1.2;margin-top:4px}
.kpis>div:first-child b{color:var(--navy)}
.kpis span{font-size:11.5px;color:var(--ink-2)}
@media (max-width:760px){.kpis{grid-template-columns:1fr 1fr}.kpis>div{padding:12px 14px}.kpis>div:nth-child(3){border-left:0}.kpis>div:nth-child(-n+2){border-bottom:1px solid var(--rule-2)}.kpis b{font-size:28px}}
.dtbl{width:100%;border-collapse:collapse;font-size:13.5px}
.dtbl th,.dtbl td{padding:10px 18px;border-bottom:1px solid var(--rule-2);text-align:left;white-space:nowrap}
.dtbl th{font-weight:400;font-size:12px;color:var(--ink-2)}
.dtbl .c{text-align:center;font-family:var(--mono)}
.dtbl .c.x{color:var(--shu);font-weight:500}
.dtbl .c small{font-size:10.5px;color:var(--ink-2);font-family:var(--sans);margin-left:2px}
@media (max-width:640px){.dtbl th,.dtbl td{padding:9px 8px}.dtbl{font-size:12.5px}.dtbl .c small{display:block;margin:0}}
.dash .cap{font-size:12px;color:var(--ink-2);padding:8px 18px 12px}
#f12 tr.you td{background:var(--bg);box-shadow:inset 0 1px 0 rgba(200,68,43,.6),inset 0 -1px 0 rgba(200,68,43,.6)}
#f12 tr.you td:first-child{box-shadow:inset 1px 1px 0 rgba(200,68,43,.6),inset 0 -1px 0 rgba(200,68,43,.6);font-weight:500}
#f12 tr.you td:last-child{box-shadow:inset -1px 1px 0 rgba(200,68,43,.6),inset 0 -1px 0 rgba(200,68,43,.6)}
.js[data-motion="on"] #f12.seen tr.you td{animation:glow .8s ease both}
@keyframes glow{0%{box-shadow:none}50%{box-shadow:inset 0 2px 0 var(--shu),inset 0 -2px 0 var(--shu)}}

.todo{margin-top:56px;background:var(--paper);border:1px solid var(--rule);border-radius:14px;padding:24px 28px}
.todo h3{margin-bottom:10px}
.todo ul{list-style:none;margin-bottom:10px}
.todo li{display:grid;grid-template-columns:13em 1fr;gap:4px 16px;padding:11px 0;border-top:1px solid var(--rule-2);font-size:14.5px;line-height:1.7}
.todo li span{color:var(--ink-2);font-size:13.5px}
.todo li b{font-weight:700}.todo li b.w{font-weight:500}.todo li b small{font-weight:400;color:var(--ink-2);font-size:12.5px}
@media (max-width:640px){.todo{padding:18px 18px}.todo li{grid-template-columns:1fr;gap:0}}

/* 棒 */
.bars{display:grid;gap:20px;margin:36px 0 18px}
.bar{display:grid;grid-template-columns:minmax(0,1fr) 120px;gap:4px 20px;align-items:end}
.bar .lb{font-size:14px;color:var(--ink-2);grid-column:1/-1}
.bar .tr{height:10px;background:var(--rule-2);position:relative;overflow:hidden;align-self:center}
.bar .fl{position:absolute;inset:0;width:calc(var(--v)*1%);background:var(--rule);transform-origin:left;transform:scaleX(var(--g,1))}
.bar.key .fl{background:var(--navy)}
.bar .val{font-family:var(--mono);font-size:52px;line-height:1;text-align:right;color:var(--ink-2);transition:opacity .3s}
.bar.key .val{color:var(--navy)}
.bar .val small{font-size:.42em;margin-left:2px}
@media (max-width:640px){.bar{grid-template-columns:1fr 80px}.bar .val{font-size:38px}}
.js[data-motion="on"] .bars .fl{--g:0}
.js[data-motion="on"] .bars .val{opacity:0}
.js[data-motion="on"] .bars.seen .fl{--g:1;transition:transform .6s cubic-bezier(.33,1,.68,1)}
.js[data-motion="on"] .bars.seen .val{opacity:1;transition-delay:.6s}

/* 料金 */
.plans{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--rule);margin-top:40px}
.plan{padding:26px 26px 28px;border-left:1px solid var(--rule);position:relative}
.plan:first-child{border-left:0;padding-left:0}
.plan::before{content:"";position:absolute;left:0;right:0;top:-1px;height:3px;background:var(--navy);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.plan.hl::before,.plan.cur::before{transform:scaleX(1)}
.plan h3{font-size:20px}
.plan .tg{font-size:13px;color:var(--ink-2);margin-top:2px}
.plan .pp{margin-top:18px;display:flex;align-items:baseline;gap:6px}
.plan .pp b{font-family:var(--head);font-weight:500;font-size:42px;line-height:1;font-variant-numeric:tabular-nums}
.plan .pp span{font-size:13px;color:var(--ink-2)}
.plan .yr{font-size:13.5px;color:var(--ink-2);margin-top:8px}
.plan .yr .num{color:var(--ink)}
.plan ul{list-style:none;margin-top:18px;border-top:1px solid var(--rule-2)}
.plan li{font-size:14px;line-height:1.7;padding:9px 0 9px 18px;border-bottom:1px solid var(--rule-2);position:relative}
.plan li::before{content:"";position:absolute;left:2px;top:19px;width:7px;height:1px;background:var(--ink-2)}
.plan .pick{margin-top:14px;font-size:14px;font-weight:500;color:var(--navy)}
@media (max-width:900px){.plans{grid-template-columns:1fr}.plan{border-left:0;padding:24px 0;border-bottom:1px solid var(--rule)}.plan.biz{order:-1}}
.calc{margin-top:40px;background:var(--paper);border:1px solid var(--rule);border-radius:8px;padding:24px 28px;display:grid;grid-template-columns:auto 1fr;gap:16px 36px;align-items:center}
.calc label{display:flex;align-items:center;gap:12px;font-family:var(--head);font-weight:700;font-size:16px;white-space:nowrap}
.calc input{width:140px;height:52px;border:1px solid var(--rule);border-radius:4px;padding:0 14px;font:500 22px var(--head);font-variant-numeric:tabular-nums;text-align:right;color:var(--ink);background:var(--paper)}
.calc input:focus{outline:none;border-color:var(--navy)}
.calc .out{font-size:15px;min-height:1.9em}
.calc .out .tier{font-family:var(--head);font-weight:700;margin-right:12px}
.calc .amt{font-family:var(--head);font-weight:500;font-variant-numeric:tabular-nums;font-size:30px;display:inline-flex;overflow:hidden;vertical-align:-4px;line-height:1.1}
.calc .amt i{font-style:normal;display:inline-block}
.calc .amt i.roll{animation:roll .25s var(--ease)}
@keyframes roll{from{transform:translateY(100%);opacity:0}to{transform:none;opacity:1}}
.calc .hint{grid-column:1/-1;font-size:14px;border-top:1px solid var(--rule-2);padding-top:14px;display:none}
.calc .hint.on{display:block}
@media (max-width:760px){.calc{grid-template-columns:1fr;padding:20px 18px}.calc .amt{font-size:24px}}
.fine{margin-top:14px}
.deadline+.sm,.deadline~.sm{margin-top:6px}
.deadline{margin-top:18px;font-size:13.5px;font-weight:700;line-height:1.8}

/* 特典 */
.perks{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:32px 0 24px}
.perk{background:var(--paper);border:1px solid var(--rule);border-radius:14px;padding:22px 24px}
.perk .num{display:block;font-size:13px;color:var(--navy);font-weight:500;margin-bottom:8px}
.perk h3{font-size:17px;margin-bottom:10px}
.perk p{font-size:14.5px;line-height:1.8}
.perk .sm{margin-top:10px;padding-top:10px;border-top:1px solid var(--rule-2)}
@media (max-width:760px){.perks{grid-template-columns:1fr}}
.kit{display:grid;grid-template-columns:7fr 4fr;gap:24px 40px;align-items:center;margin:40px 0 8px}
.kit ul{list-style:none;border-top:1px solid var(--rule)}
.kit li{padding:12px 0;border-bottom:1px solid var(--rule);font-size:15px;font-weight:500}
.kit li span{display:block;font-size:13px;color:var(--ink-2);font-weight:400}
@media (max-width:760px){.kit{grid-template-columns:1fr}}

/* フォーム */
.lpform{margin-top:28px;display:grid;gap:14px;max-width:600px}
.fld{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--ink-2)}
.fld input,.fld select{height:52px;border:1px solid var(--rule);border-radius:6px;padding:0 14px;font:inherit;font-size:16px;color:var(--ink);background:var(--paper);letter-spacing:.02em;width:100%}
.fld.big{font-size:14px;color:var(--ink);font-weight:500}
.fld.big input{height:60px;font-size:17px;border-color:var(--ink-2)}
.fld select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235B6B76' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}
.fld input:focus,.fld select:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 1px var(--navy)}
.opt{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:640px){.opt{grid-template-columns:1fr}}
.lpform .btn{justify-self:start}
.hp{position:absolute;left:-9999px;width:1px;height:1px}
.fmsg{font-size:14px;min-height:1.5em}
.fmsg.ok{color:var(--ok);font-weight:500}.fmsg.ng{color:var(--shu)}
.lpform .sm a{color:var(--ink-2)}

/* 3人の質問 */
.trio{display:flex;justify-content:center;gap:4%;background:var(--paper);border-radius:16px;padding:20px 8% 0;margin:24px 0 32px;aspect-ratio:3/1;align-items:flex-end;overflow:hidden}
.trio img{width:26%;height:auto}
.qa{display:flex;flex-direction:column;gap:10px}
.ans{background:var(--paper);border:1px solid var(--rule);border-radius:14px;padding:14px 18px;font-size:14.5px;line-height:1.85;margin:2px 0 22px;align-self:stretch}
.faq{border-top:1px solid var(--rule);margin-top:28px}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:1fr 22px;gap:12px;padding:18px 0;font-weight:500;font-size:15px;align-items:start}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{width:20px;height:20px;margin-top:3px;transition:transform .3s var(--ease);color:var(--ink-2)}
.faq details[open] summary svg{transform:rotate(45deg)}
.faq .a{padding:0 30px 20px 0;color:var(--ink-2);font-size:14.5px}

/* 最後の段 */
.final{background:var(--ink);color:#fff}
.final h2{color:#fff}
.final .body{color:rgba(255,255,255,.86)}
.final .fld{color:rgba(255,255,255,.72)}.final .fld.big{color:#fff}
.final .fld input,.final .fld select{border-color:transparent}
.final .fld input:focus,.final .fld select:focus{border-color:#8FB3C9;box-shadow:0 0 0 1px #8FB3C9}
.final .sm,.final .sm a{color:rgba(255,255,255,.62)}
.final .fmsg.ok{color:#9FD3BC}.final .fmsg.ng{color:#F2A08E}
.final :focus-visible{outline-color:#fff}
.links{list-style:none;margin-top:40px;padding-top:24px;border-top:1px solid rgba(255,255,255,.18);font-size:14px;color:rgba(255,255,255,.75);display:grid;gap:14px}
.final .tl{color:#fff;text-decoration-color:rgba(255,255,255,.4)}

/* フッター */
.ft{background:var(--bg);padding:40px 0 calc(110px + env(safe-area-inset-bottom));font-size:13px;color:var(--ink-2)}
.ft .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px 40px;align-items:flex-start}
.ft b{font-family:var(--head);font-weight:700;color:var(--ink);font-size:15px;letter-spacing:.08em;display:block;margin-bottom:6px}
.ft-note{margin-top:6px;font-size:12px}
.ft nav{display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center}
.ft nav a{color:var(--ink-2)}
.mo{display:inline-flex;align-items:center;gap:6px;background:none;border:0;font:inherit;font-size:12px;color:var(--ink-2);cursor:pointer;padding:6px 0;letter-spacing:.04em}
.mo svg{width:14px;height:14px}
.mo .play,.mo .mo-off{display:none}html[data-motion="off"] .mo .pause,html[data-motion="off"] .mo .mo-on{display:none}html[data-motion="off"] .mo .play{display:block}html[data-motion="off"] .mo .mo-off{display:inline}

/* 画面下の帯 */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:45;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(242,244,245,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--rule);display:flex;align-items:center;justify-content:center;gap:16px;transform:translateY(110%);transition:transform .2s var(--ease)}
.dock.on{transform:none}
.dock .btn{height:48px;min-height:48px;font-size:15px;width:auto;flex:0 1 380px}
.dock .btn .arw{width:32px;height:32px}
.dock .sm{white-space:nowrap}
.dock .btn{white-space:nowrap;letter-spacing:.03em}
@media (max-width:640px){.dock{gap:10px;padding-left:12px;padding-right:12px}.dock .btn{flex:1;padding:0 6px 0 16px;font-size:14px;gap:8px}.dock .sm{font-size:10.5px}}

/* ---------- 動き ---------- */
.js[data-motion="on"] .say{opacity:0;transform:translateY(8px)}
.js[data-motion="on"] .say.in{opacity:1;transform:none;transition:opacity .24s var(--ease),transform .24s var(--ease)}
.js[data-motion="on"] .stamp.wait{opacity:0;transform:scale(1.6) rotate(-8deg)}
.js[data-motion="on"] .stamp.press{opacity:.88;transform:rotate(-4deg);transition:transform .22s cubic-bezier(.3,1.4,.6,1),opacity .4s}
.js[data-motion="on"] .sink{animation:sink .08s}
@keyframes sink{50%{translate:0 1px}}
html[data-motion="off"] *,html[data-motion="off"] *::before,html[data-motion="off"] *::after{animation:none!important;transition:none!important}
html[data-motion="off"] [data-px]{transform:none!important}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{.dock,.mode,.pr nav{display:none}.stage{position:static}}

/* 物語の段の、絵の列に合わせて右の列に置くもの（PC） */
@media (min-width:761px){.wrap.offset>*{margin-left:calc((100% - 56px)*5/12 + 56px)}}
#three{padding-bottom:32px}
/* 説明の段の小場面：PCでも絵を上、吹き出しを下（本文の列幅に揃える） */
@media (min-width:761px){
  .ex-scene{grid-template-columns:1fr;gap:18px}
  .ex-scene .stage{top:12px;padding:18px 14% 0;min-height:0}
  .ex-scene .stage .actor{width:24%;max-width:150px}
}
/* PCの画面（S2） */
.pcdoc{background:var(--paper);border:1.5px solid var(--line);border-radius:10px;overflow:hidden;margin:8px 0 14px;max-width:520px}
.pcdoc-hd{background:var(--bg-2);border-bottom:1px solid var(--rule);padding:7px 14px;font-size:11.5px;color:var(--ink-2);display:flex;align-items:center;gap:8px}
.pcdoc-hd::before{content:"";width:28px;height:7px;background:radial-gradient(circle,var(--rule) 3px,transparent 3.5px) 0 0/10px 7px repeat-x;flex:none}
.pcdoc-bd{padding:16px 20px 18px}
.pcdoc-t{font-family:var(--head);font-weight:700;font-size:15px;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--rule-2)}
.pcdoc ol{padding-left:1.4em;font-size:13.5px;line-height:1.9;color:var(--ink-2)}
.pcdoc u{color:var(--ink);text-decoration-color:rgba(200,68,43,.55);text-decoration-thickness:2px;text-underline-offset:4px}
/* 体験版の箱（S4の最後） */
.demo-box{display:grid;grid-template-columns:104px 1fr;gap:18px 22px;align-items:start;background:var(--paper);border:1px solid var(--rule);border-radius:14px;padding:22px 24px}
.demo-box>img{width:104px;height:auto;aspect-ratio:4/5;background:var(--bg-2);border-radius:12px;padding:6px 4px 0}
.demo-box .tx{margin-top:0}
.demo-box .btn{margin-top:4px}
@media (max-width:640px){.demo-box{grid-template-columns:72px 1fr;padding:18px 16px;gap:12px 14px}.demo-box>img{width:72px}.demo-box .btn{grid-column:1/-1}.demo-box>div{display:contents}.demo-box .tx{grid-column:2}.demo-box .note{grid-column:1/-1}}

/* 強調（各段で一番言いたい1行だけ） */
.say p.big{font-size:20px;font-weight:700;padding:8px 18px}
.say p.key{font-weight:700;font-size:17px;border-width:2.5px}
.sum3{font-family:var(--head);font-weight:700;font-size:clamp(24px,3vw,34px);line-height:1.5;color:var(--navy);margin-bottom:6px}
.price-key{font-family:var(--head);font-weight:700;font-size:clamp(20px,2.2vw,26px);margin:8px 0 20px}
.price-key b{font-family:var(--head);color:var(--navy);font-size:1.35em;background:linear-gradient(transparent 64%,rgba(31,58,77,.12) 64%)}
/* 罠1の画面の「中を見る」 */
.peek{display:inline-block;margin-top:8px;font-size:12px;color:var(--navy);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--rule)}
/* 種類で比べる表（3列×3行） */
.cmpt{width:100%;border-collapse:collapse;margin:24px 0 12px;font-size:14px;table-layout:fixed}
.cmpt th,.cmpt td{padding:12px 10px;border-bottom:1px solid var(--rule);text-align:center;vertical-align:middle;line-height:1.55}
.cmpt thead th{font-family:var(--head);font-weight:500;font-size:13px;border-bottom:1px solid var(--ink);color:var(--ink-2)}
.cmpt thead th:first-child{width:40%;text-align:left}
.cmpt tbody th{text-align:left;font-weight:500;font-size:13.5px}
.cmpt tbody th .num{display:block;font-size:11px;color:var(--ink-2)}
.cmpt td{color:var(--ink-2);font-size:13px}
.cmpt .us{background:var(--paper);color:var(--navy);font-weight:700}
.cmpt thead .us{border-bottom:3px solid var(--navy);color:var(--navy)}
@media (max-width:640px){.cmpt th,.cmpt td{padding:10px 5px}.cmpt td,.cmpt thead th{font-size:12px}.cmpt tbody th{font-size:12.5px}}
/* 料金のプランは開閉式 */
.plans-d{margin-top:28px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.plans-d summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:16px 0;font-weight:500;font-size:15px}
.plans-d summary::-webkit-details-marker{display:none}
.plans-d summary svg{width:20px;height:20px;color:var(--ink-2);transition:transform .3s var(--ease)}
.plans-d[open] summary svg{transform:rotate(45deg)}
.plans-d .plans{margin-top:0}
/* 資料の実物（見本） */
.docthumb{position:relative;margin:12px 0 14px;max-width:220px}
.docthumb img{width:100%;height:auto;border:1px solid var(--rule);border-radius:4px;box-shadow:0 10px 24px -14px rgba(22,35,45,.45);background:#fff}
.docthumb .mihon{position:absolute;right:8px;top:8px;background:#fff;margin:0}
.kit .docthumb{max-width:240px;margin:0 auto}
@media (max-width:760px){.kit .docthumb{max-width:200px}}
/* 長さを詰める（スマホ） */
.h2-gap{margin-top:72px}
@media (max-width:640px){
  :root{--sec:56px}
  .h2-gap{margin-top:56px}
  .flow{gap:8px}.gap{height:12px}
  .perk{display:grid;grid-template-columns:1fr 96px;gap:0 14px;padding:18px}
  .perk>*{grid-column:1/-1}
  .perk .docthumb{grid-column:2;grid-row:3;margin:6px 0 0;max-width:none}
  .perk .docthumb+p{grid-column:1;grid-row:3}
  .kit{grid-template-columns:1fr 110px;gap:14px;margin-top:28px}
  .kit .docthumb{max-width:none;margin:0;order:0}
  .kit li{font-size:14px;padding:10px 0}
  .ft{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
}
/* 素材担当の場面絵（自前の角丸面を持つので、下に面を敷かない） */
.stage.art-stage{background:none;padding:0;min-height:0;border-radius:0;box-shadow:none;display:block;overflow:visible}
.scene-img{width:100%;height:auto;display:block}
.ex-scene .stage.art-stage.side{position:static;max-width:440px;width:100%;margin:0 auto}
@media (max-width:760px){
  .stage.art-stage{margin:0;background:var(--bg);padding-top:6px}
  .ex-scene .stage.art-stage.side{max-width:300px;padding-top:0;background:none}
}
@media (max-width:760px){.stage.art-stage{position:static}}

/* 測定マン（S7の頭） */
.mascot-fig{max-width:560px;margin:18px auto 22px}
.mascot-fig img{width:100%;height:auto;display:block}
@media (max-width:640px){.mascot-fig{margin:12px -4px 18px}}

/* 吹き出しの横の顔アイコン（data-who×data-face で切り替え） */
.say[data-face]{position:relative;padding-left:56px}
.say.r[data-face]{padding-left:0;padding-right:56px}
.say[data-face]::before{content:"";position:absolute;left:0;top:22px;width:44px;height:44px;border-radius:50%;background:#eceff0 center/cover no-repeat;box-shadow:0 0 0 2px var(--c),0 2px 6px rgba(0,0,0,.12)}
.say.r[data-face]::before{left:auto;right:0}
@media (max-width:640px){.say[data-face]{padding-left:46px}.say.r[data-face]{padding-left:0;padding-right:46px}.say[data-face]::before{width:36px;height:36px;top:22px}}
.say[data-who="hirano"][data-face="n"]::before{background-image:url(/kensa/lp/img/a-hirano-n.webp?v=2610132245)}
.say[data-who="hirano"][data-face="n-pc"]::before{background-image:url(/kensa/lp/img/a-hirano-n.webp?v=2610132245)}
.say[data-who="hirano"][data-face="w"]::before{background-image:url(/kensa/lp/img/a-hirano-w.webp?v=2610132245)}
.say[data-who="hirano"][data-face="s"]::before{background-image:url(/kensa/lp/img/a-hirano-s.webp?v=2610132245)}
.say[data-who="hirano"][data-face="k"]::before{background-image:url(/kensa/lp/img/a-hirano-k.webp?v=2610132245)}
.say[data-who="mori"][data-face="n"]::before{background-image:url(/kensa/lp/img/a-mori-n.webp?v=2610132245)}
.say[data-who="mori"][data-face="n-phone"]::before{background-image:url(/kensa/lp/img/a-mori-n.webp?v=2610132245)}
.say[data-who="mori"][data-face="e"]::before{background-image:url(/kensa/lp/img/a-mori-e.webp?v=2610132245)}
.say[data-who="mori"][data-face="q"]::before{background-image:url(/kensa/lp/img/a-mori-q.webp?v=2610132245)}
.say[data-who="mori"][data-face="k"]::before{background-image:url(/kensa/lp/img/a-mori-k.webp?v=2610132245)}
.say[data-who="onishi"][data-face="n"]::before{background-image:url(/kensa/lp/img/a-onishi-n.webp?v=2610132245)}
.say[data-who="onishi"][data-face="h"]::before{background-image:url(/kensa/lp/img/a-onishi-h.webp?v=2610132245)}
.say[data-who="onishi"][data-face="s"]::before{background-image:url(/kensa/lp/img/a-onishi-s.webp?v=2610132245)}
.say[data-who="onishi"][data-face="k"]::before{background-image:url(/kensa/lp/img/a-onishi-k.webp?v=2610132245)}
.say[data-who="onishi"][data-face="k-phone"]::before{background-image:url(/kensa/lp/img/a-onishi-k.webp?v=2610132245)}
.say.q[data-who]{position:relative;padding-left:56px}
.say.q[data-who]::before{content:"";position:absolute;left:0;top:22px;width:44px;height:44px;border-radius:50%;background:#eceff0 center/cover no-repeat;box-shadow:0 0 0 2px var(--c),0 2px 6px rgba(0,0,0,.12)}
.say.q[data-who="hirano"]::before{background-image:url(/kensa/lp/img/a-hirano-n.webp?v=2610132245)}
.say.q[data-who="mori"]::before{background-image:url(/kensa/lp/img/a-mori-n.webp?v=2610132245)}
.say.q[data-who="onishi"]::before{background-image:url(/kensa/lp/img/a-onishi-n.webp?v=2610132245)}
@media (max-width:640px){.say.q[data-who]{padding-left:46px}.say.q[data-who]::before{width:36px;height:36px}}
@media (min-width:641px){.say[data-face],.say.q[data-who]{padding-left:66px}.say.r[data-face]{padding-left:0;padding-right:66px}.say[data-face]::before,.say.q[data-who]::before{width:54px;height:54px;top:18px}}
@media (max-width:640px){.say[data-face],.say.q[data-who]{padding-left:50px}.say.r[data-face]{padding-left:0;padding-right:50px}.say[data-face]::before,.say.q[data-who]::before{width:40px;height:40px}}

/* ================= 2026-10-13 メリハリ（明るい背景・物語と説明の色分け・決め台詞） ================= */
:root{--bg:#FFFFFF;--bg-2:#EAF5FD;--cream:#FFF7EA;--sky:#4BA3E3;--sky-d:#2C7FC0;--rule:#D3DEE5;--rule-2:#E6EEF3}
body{background:#fff}
@media (min-width:1025px){body::before,body::after{display:none}}
.pr,.ft{background:#fff}
.dock{background:rgba(255,255,255,.95)}
/* 表紙 */
header,.cover{background:linear-gradient(180deg,#EAF5FD 0%,#fff 100%)}
.f01{background:linear-gradient(160deg,#D8EEFC 0%,#FFF1DA 100%)}
.f01-bg{opacity:.22}
.brief{border:0;box-shadow:0 14px 40px -24px rgba(31,58,77,.45)}
/* 物語＝クリーム色＋うすい網点、説明＝白と水色 */
.part.story{background:var(--cream) radial-gradient(rgba(224,165,38,.16) 1px,transparent 1.4px) 0 0/14px 14px}
.part.expl{background:#fff}
.sec.alt{background:var(--bg-2)}
.stage{background:#FFE9C4}
.stage.art-stage{background:none}
@media (max-width:760px){.part.story .stage.art-stage{background:var(--cream)}}
.switch{margin:0 auto;padding:0;max-width:none;background:var(--navy);color:#fff}
.switch span{border:0;padding:16px var(--gut);font-weight:500;letter-spacing:.08em}
/* 地の文＝漫画のナレーション枠 */
.nar{display:inline-block;align-self:flex-start;background:var(--navy);color:#fff;font-weight:500;font-size:15px;line-height:1.75;padding:10px 18px;margin:14px 0 6px;border-radius:2px;box-shadow:4px 4px 0 var(--c-mori);letter-spacing:.06em}
.offset>.nar{display:table}
/* 心の声＝点線の吹き出し */
.say.think p{background:#fff;border:2px dashed var(--c);border-radius:22px;font-style:normal;color:var(--ink)}
.say.think .nm{background:transparent;color:var(--sky-d);padding:0;margin-left:2px}
.say.think.in-fig{margin:10px 0}
/* 演習の画面＝スマホのアプリの見た目 */
.scr{border:0;border-radius:14px;overflow:hidden;box-shadow:0 18px 40px -22px rgba(22,35,45,.55),0 0 0 1px rgba(31,58,77,.08)}
.scr-hd{background:var(--navy);color:#fff;border-bottom:0;font-weight:500}
.scr-hd i{background:var(--sky)}
.scr-hd .mihon{color:#fff;border-color:rgba(255,255,255,.6)}
.scr.result .scr-hd{background:var(--shu)}
.req{background:#F1F7FC}
.mockfig{background:#DCEFFC;border-radius:20px;padding:18px 16px 0}
@media (min-width:641px){.mockfig{padding:26px 28px 0}}
.mockfig .mini-actor{background:#fff}
/* 決め台詞 */
.punch{margin:34px 0 8px;background:#fff;border-radius:18px;padding:26px 24px 22px;border-left:6px solid var(--shu);box-shadow:0 18px 40px -26px rgba(31,58,77,.5)}
.punch p{font-family:var(--head);font-weight:700;font-size:clamp(20px,2.4vw,27px);line-height:1.65;letter-spacing:.04em;color:var(--ink)}
.punch em,.punch-h em{font-style:normal;background:linear-gradient(transparent 58%,rgba(224,165,38,.55) 58%)}
.punch footer{margin-top:12px;font-size:14px;color:var(--ink-2)}
.punch-h{font-size:clamp(26px,3.6vw,42px);line-height:1.55;margin:72px 0 26px}
.punch-h .ln{display:block}
.punch-h em{color:var(--shu)}
.say p.key{font-weight:700}
/* 分かれ目・間違えやすいところ */
.know{background:#fff;border:2px solid var(--navy);border-radius:16px;padding:18px 20px 16px;margin:22px 0 18px}
.know-h{display:inline-block;background:var(--navy);color:#fff;font-size:12.5px;font-weight:700;padding:2px 12px;border-radius:999px;margin-bottom:10px;letter-spacing:.08em}
.know ul{list-style:none;display:grid;gap:8px}
.know li{display:grid;grid-template-columns:5.5em 1fr;gap:12px;align-items:baseline;font-size:15px;line-height:1.75}
.know li b{font-size:13px;text-align:center;border-radius:6px;padding:2px 0;color:#fff}
.know b.ok{background:var(--ok)}.know b.ng{background:var(--shu)}
.know-ft{margin-top:12px;font-size:14px;color:var(--ink-2)}
/* 罠2のメール */
.mail-btn{margin:12px 0 4px;display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.mail-btn span{display:inline-block;background:#1A73E8;color:#fff;font-weight:500;padding:8px 20px;border-radius:6px;font-size:13.5px}
.mail-btn small{font-family:var(--mono);font-size:11.5px;color:var(--ink-2)}
.ai-sum{margin-top:12px;background:#EEF7EF;border-radius:10px;padding:10px 14px;font-size:13.5px;line-height:1.75}
.ai-sum b{display:block;font-size:11.5px;color:var(--ok);letter-spacing:.06em}
.zoom{border:2px solid var(--shu);border-radius:12px}
.zoom .hit{background:linear-gradient(transparent 55%,rgba(200,68,43,.22) 55%);padding:0 .05em}
.zoom .hit svg{display:none}
/* 罠3の表 */
.src-note{font-size:12.5px;color:var(--ink-2);margin-bottom:8px}
.src-note b{color:var(--ink)}
.sum tr.ghost{display:none}
#sumFig.swapped .sum tr.ghost{display:table-row}
.sum tr.ghost td{color:var(--shu);font-weight:700;background:rgba(200,68,43,.08)}
.cnt-note{display:flex;justify-content:flex-end;gap:10px;align-items:baseline;margin-top:8px;font-size:12.5px;color:var(--ink-2);opacity:0;transition:opacity .3s}
.cnt-note b{color:var(--shu);font-size:16px}
#sumFig.checked .cnt-note{opacity:1}
#sumFig.checked .src-note b{background:rgba(224,165,38,.35)}
.calc-note{display:none}
/* 100社の点 */
.dots2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:26px 0 10px}
.dg{background:#fff;border-radius:16px;padding:16px 16px 18px;box-shadow:0 14px 36px -24px rgba(31,58,77,.5)}
.dg figcaption{margin-bottom:12px;line-height:1.4}
.dg figcaption b{font-family:var(--head);font-size:clamp(40px,6vw,64px);color:var(--navy);letter-spacing:0}
.dg figcaption small{font-size:16px;font-weight:700;color:var(--navy);margin-left:2px}
.dg figcaption span{display:block;font-size:13.5px;font-weight:500;color:var(--ink);margin-top:4px}
.dg.bad figcaption b,.dg.bad figcaption small{color:var(--shu)}
.dg .grid{display:grid;grid-template-columns:repeat(10,1fr);gap:4px}
.dg .grid i{aspect-ratio:1;border-radius:50%;background:#E3E9ED;transition:background .25s}
.dg .grid i.on{background:var(--navy)}
.dg.bad .grid i.on{background:var(--shu)}
.dg-cap{grid-column:1/-1;text-align:center;font-size:13px;color:var(--ink-2)}
.body.small{font-size:14px;color:var(--ink-2)}
@media (max-width:640px){.dots2{gap:10px}.dg{padding:12px 10px 14px}.dg .grid{gap:3px}}
/* 料金の早見 */
.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:26px 0 8px;max-width:860px}
.quick>div{background:#fff;border-radius:16px;padding:16px 10px;text-align:center;box-shadow:0 14px 36px -26px rgba(31,58,77,.55);display:flex;flex-direction:column;gap:2px}
.quick .hc{font-size:15px;font-weight:700;color:var(--ink-2)}
.quick .yen{font-family:var(--head);font-weight:700;font-size:clamp(28px,3.4vw,40px);color:var(--navy);letter-spacing:0;line-height:1.2}
.quick small{font-size:.45em;margin-left:2px}
.quick .hc small{font-size:12px}
.quick .hl{background:var(--navy)}
.quick .hl .hc,.quick .hl .yen{color:#fff}
.quick-cap{font-size:13.5px;color:var(--ink-2)}
.unit{margin-top:18px;font-size:14.5px}
.unit b{font-family:var(--head);font-size:1.15em;color:var(--navy)}
#price .calc{margin-top:18px;border:2px solid var(--sky);max-width:860px}
@media (max-width:640px){.quick{grid-template-columns:repeat(2,1fr);gap:10px}}
/* 最後の段 */
.final{background:linear-gradient(150deg,#2C7FC0 0%,#1F3A4D 100%)}
.know li{grid-template-columns:6.8em 1fr}
.know li b{font-size:12px;letter-spacing:.02em}
.punch-blk{padding:8px 0 56px}
.punch-blk .punch{margin:0}
.know li{grid-template-columns:6.8em 1fr}
.know li b{font-size:12px;letter-spacing:.02em}
.punch-blk{padding:8px 0 56px}
.punch-blk .punch{margin:0}
/* 2026-10-13 夜：暗く見える紺の面を減らす */
.nar{background:#fff;color:var(--ink);border:2px solid var(--ink);box-shadow:4px 4px 0 var(--c-mori)}
.switch{background:var(--sky)}
.final{background:linear-gradient(150deg,#5CB3EE 0%,#2C7FC0 100%)}
/* 決裁する方へ：チェックで3行 */
.brief-ck{list-style:none;display:grid;gap:10px;margin-top:6px}
.brief-ck li{display:flex;align-items:center;gap:12px;padding:0;border:0;font-size:16px;line-height:1.6}
.brief-ck li::before{display:none}
.brief-ck svg{flex:none;width:28px;height:28px;padding:5px;border-radius:50%;background:var(--ok);color:#fff}
.brief-ck b{font-weight:700;background:linear-gradient(transparent 62%,rgba(224,165,38,.4) 62%)}
.brief .brief-ft{border-top:0;padding-top:4px;margin-top:10px}
@media (max-width:640px){.brief-ck li{font-size:15px}}
/* 2026-10-13 文字が小さい：小さい字の下限を上げる */
.note{font-size:14px}
.sm{font-size:13.5px}
.src{font-size:12.5px}
.brief .brief-ft{font-size:14px}
.brief-ck li{font-size:17px}
@media (max-width:640px){.brief-ck li{font-size:16px}}
.slide-t{font-size:clamp(13px,1.5vw,18px)}
.slide-q{font-size:clamp(56px,6vw,88px)}
.kicker{font-size:14px}
.say p{font-size:16px}
@media (max-width:640px){.say p{font-size:15.5px}}
.dock .sm{font-size:12.5px}
.slide-t{font-size:clamp(15px,1.6vw,19px)}
/* 2026-10-13 申し込みボタンを本部長の吹き出し（紺）と分ける：ボタンだけオレンジ */
:root{--cta:#E8602C;--cta-h:#D04F1E}
.btn:not(.ln-btn):not(.inv){background:var(--cta);border-color:var(--cta);color:#fff;box-shadow:0 10px 24px -12px rgba(232,96,44,.75);font-weight:700}
.btn:not(.ln-btn):not(.inv):hover{background:var(--cta-h);border-color:var(--cta-h)}
.btn:not(.ln-btn):not(.inv) .arw{background:#fff;color:var(--cta)}
.final .btn.inv{color:var(--cta);font-weight:700}
.final .btn.inv .arw{background:var(--cta);color:#fff}
/* 2026-10-13 夜 キング「文字をもっと大きく、目立たせたい」＋エッコの指摘 */
body{font-size:17px}
@media (max-width:640px){body{font-size:16px}}
h2{font-size:clamp(24px,2.8vw,34px)}
@media (max-width:640px){h2{font-size:clamp(23px,6.4vw,27px)}}
.say p{font-size:17px}
@media (max-width:640px){.say p{font-size:16.5px}}
.say .nm,.mode span{font-size:13px}
.say p.key{font-size:20px;line-height:1.7;background:linear-gradient(transparent 58%,rgba(224,165,38,.32) 58%),var(--paper)}
@media (max-width:640px){.say p.key{font-size:18.5px}}
.result .res-h{font-size:18px!important;color:var(--shu)!important;line-height:1.6}
.res-h .x{font-size:30px;vertical-align:-4px}
.note,.top-cta .note,.cta-blk .note{font-size:16px;font-weight:700;color:var(--ink)}
.dock .sm{font-size:13px;font-weight:700;color:var(--ink)}
@media (max-width:640px){.dock .sm{font-size:12px}}
.sm{font-size:14px}
.src{font-size:13px}
.know-h{font-size:14px}
.know li{font-size:16.5px}
.cmpt td,.cmpt thead th,.cmpt tbody th{font-size:14px}
@media (max-width:640px){.cmpt td,.cmpt thead th,.cmpt tbody th{font-size:13px}}
.dtbl{font-size:14.5px}.dtbl th{font-size:13px}
@media (max-width:640px){.dtbl{font-size:13.5px}}
.brief li,.kit li,.faq summary,.calc .out{font-size:16px}
.quick-cap{font-size:15px;color:var(--ink)}
.quick-cap b{background:linear-gradient(transparent 62%,rgba(224,165,38,.4) 62%)}
.fine-d{margin:18px 0 6px}
.fine-d summary{cursor:pointer;font-size:14px;color:var(--ink-2);text-decoration:underline;text-underline-offset:3px}
.fine-d .fine{margin-top:8px}
.res-h .x{font-size:26px;line-height:1;display:inline-block;vertical-align:-3px}
.result .res-h{line-height:1.55}
/* 10/13 エッコ J003・J006 */
.mid-lk{margin-top:14px;font-size:16px}
.cmp-sp{display:none}
@media (max-width:640px){.cmp-sp{display:block}.cmpt{display:none}}
@media (max-width:640px){.cmp-pc{display:none}}
/* 10/14 決め台詞のマーカー：箱の下半分が塗られて見えるのをやめ、文字の行ごとに引く */
.say p.key{background:var(--paper);text-decoration:underline;text-decoration-color:rgba(224,165,38,.45);text-decoration-thickness:.42em;text-underline-offset:-.22em;text-decoration-skip-ink:none}