:root{--ground:#0d1c2e;--ground2:#122642;--line:#1e3450;--line2:#2a4a6b;--accent:#e8590c;
 --ink:#ffffff;--body:#cfdae6;--dim:#8ea0b5;--wrap:1080px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--ground);color:var(--body);
 font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Noto Sans JP","Meiryo",system-ui,-apple-system,"Segoe UI",sans-serif;
 font-size:17px;font-weight:500;line-height:1.95;-webkit-font-smoothing:antialiased;overflow-wrap:anywhere}
img,svg{max-width:100%;height:auto}
a{color:var(--ink)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px}
header{padding:28px 0}
header img{width:180px;display:block}
/* 1画面1メッセージ */
.screen{min-height:100svh;display:flex;align-items:center;border-top:1px solid var(--line);padding:88px 0}
.screen>.wrap{width:100%}
.hero{border-top:0;min-height:calc(100svh - 82px);padding-top:40px}
.rule{width:56px;height:4px;background:var(--accent);margin-bottom:30px}
.kick{margin:0 0 22px;font-size:clamp(15px,2.6vw,20px);font-weight:700;color:var(--accent);letter-spacing:.04em}
.hero h1{margin:0;color:var(--ink);font-weight:900;letter-spacing:.01em;font-size:clamp(32px,8vw,84px);line-height:1.28}
.nb{display:inline-block}
.ill img{display:block;width:100%;height:auto;-webkit-mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,#000 62%,transparent 100%);mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,#000 62%,transparent 100%)}
.kfig{margin:36px 0}.kfig img{-webkit-mask-image:none;mask-image:none;border-radius:4px}
.hero-ill{margin-top:40px;max-width:820px}
.hero .sub{margin:30px 0 0;font-size:clamp(16px,3.4vw,20px);color:var(--dim)}
/* 段階の画面 */
.stage{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.num{font-size:clamp(88px,16vw,150px);font-weight:900;line-height:1;color:var(--accent)}
.stage h2{margin:10px 0 0;color:var(--ink);font-size:clamp(38px,7vw,62px);font-weight:900;line-height:1.25}
.stage .line{margin:20px 0 0;font-size:clamp(16px,3.2vw,19px);color:var(--body);line-height:1.95}
.khs{list-style:none;margin:30px 0 0;padding:0;border-top:1px solid var(--line)}
.khs li{border-bottom:1px solid var(--line)}
.khs a{display:flex;gap:14px;align-items:baseline;padding:14px 4px;color:var(--ink);text-decoration:none;font-weight:700;font-size:16px;line-height:1.65}
.khs a:before{content:"→";color:var(--accent);flex:none}
.khs a:hover{background:var(--ground2)}
.book{display:flex;gap:20px;align-items:center;margin-top:30px}
.book img{width:88px;flex:none;border:1px solid var(--line2);display:block}
.book .bt{margin:0 0 10px;font-size:14px;color:var(--dim);line-height:1.7}
.cta{display:inline-block;color:var(--ink);text-decoration:none;font-size:16px;font-weight:700;padding:12px 28px;
 border:1.5px solid var(--accent);letter-spacing:.02em}
.cta:hover{background:var(--accent)}
.cta:focus-visible,.khs a:focus-visible{outline:2px solid #fff;outline-offset:3px}
.fig{border:1px dashed var(--line2);background:var(--ground2);min-height:420px;display:flex;align-items:flex-end;padding:22px}
.fig p{margin:0;font-size:12.5px;color:var(--dim);line-height:1.8}
/* これから */
.soon{min-height:auto;padding:96px 0}
.later{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}
.later .c{background:var(--ground);padding:34px 30px 38px}
.later .n{font-size:64px;font-weight:900;line-height:1;color:var(--dim)}
.later h2{margin:12px 0 0;color:var(--ink);font-size:clamp(28px,5vw,40px);font-weight:900;line-height:1.3}
.later p{margin:16px 0 0;font-size:15.5px;color:var(--dim);line-height:1.95}
.tagsoon{display:inline-block;margin-top:20px;font-size:12px;font-weight:700;letter-spacing:.16em;color:var(--accent);border:1px solid var(--accent);padding:3px 12px}
/* 書いている人 */
.eyebrow{margin:0 0 20px;font-size:12px;font-weight:700;letter-spacing:.22em;color:var(--accent)}
.prof{border-left:3px solid var(--accent);padding-left:26px;max-width:760px}
.prof .name{margin:0;color:var(--ink);font-size:clamp(23px,4.8vw,31px);font-weight:900;line-height:1.4}
.prof .bio{margin:18px 0 0;font-size:16px;line-height:2.05}
.plain{padding:84px 0;border-top:1px solid var(--line)}
footer{border-top:1px solid var(--line);padding:44px 0 48px;color:var(--dim);font-size:14px;line-height:2}
footer img{width:150px;display:block;margin-bottom:22px}
footer a{color:var(--body)}
/* ノウハウのページ */
.art{max-width:760px;margin:0 auto;padding:40px 32px 40px}
.art .kick{margin-bottom:18px}
.art h1{margin:0;color:var(--ink);font-size:clamp(28px,5.6vw,46px);font-weight:900;line-height:1.4}
.art .lead{margin:28px 0 0;font-size:clamp(17px,3.4vw,19px);color:var(--ink);line-height:2;border-left:3px solid var(--accent);padding-left:20px}
.art .body h2{margin:56px 0 0;color:var(--ink);font-size:clamp(20px,4vw,25px);font-weight:900;line-height:1.55}
.art .body p{margin:20px 0 0}
.art .fig{margin:52px 0 0;min-height:320px}
.art .close{margin:48px 0 0;font-size:17px;color:var(--ink);font-weight:700}
.art .book{margin-top:22px}
.more{border-top:1px solid var(--line);margin-top:64px;padding-top:36px}
.more .eyebrow{margin-bottom:12px}
.back{display:inline-block;margin-top:30px;color:var(--body);font-size:15px}
.simple{max-width:760px;margin:0 auto;padding:40px 32px 80px}
.simple h1{color:var(--ink);font-size:clamp(24px,5vw,32px);font-weight:900;line-height:1.45;margin:30px 0 16px}
.simple h2{color:var(--ink);font-size:18px;font-weight:900;margin:36px 0 8px}
.simple table{border-collapse:collapse;width:100%;margin:8px 0 20px;font-size:15.5px}
.simple th,.simple td{border:1px solid var(--line2);padding:10px 12px;text-align:left;vertical-align:top}
.simple th{background:var(--ground2);color:var(--ink);width:34%;font-weight:700}
@media (max-width:820px){
  body{font-size:16px}
  .wrap{padding:0 22px}
  .screen{min-height:auto;padding:64px 0}
  .hero{min-height:auto;padding:56px 0 80px}
  .stage{grid-template-columns:1fr;gap:36px}
  .fig{min-height:240px}
  .later{grid-template-columns:1fr}
  .art,.simple{padding-left:22px;padding-right:22px}
  .art .fig{min-height:220px}
}