*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:#f7fbff;color:#243754;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:1.8}a{color:inherit;text-decoration:none}img{max-width:100%}header{display:flex;align-items:center;justify-content:space-between;padding:19px 5%;background:#edf6ff;border-bottom:1px solid #cfe0ef;font-size:14px}.brand{font-weight:700;letter-spacing:2px}.brand b{color:#5174da;margin-left:6px;font-size:12px}.wrap{max-width:1120px;margin:auto;padding:0 32px}.guide-hero{padding:54px 0;background:linear-gradient(145deg,#d9edfc,#cbdff5 58%,#e3f0fb)}.hero-grid{display:grid;grid-template-columns:minmax(300px,440px) 1fr;gap:60px;align-items:center}.hero-grid>img{display:block;width:100%;border:2px solid #91b9de;border-radius:24px;box-shadow:0 20px 45px #244b781f}.eyebrow{margin:0 0 10px;color:#5274d5;font-size:13px;font-weight:800;letter-spacing:.16em}.hero-grid h1{margin:0 0 20px;font-size:clamp(42px,6vw,72px);line-height:1.25;letter-spacing:-.04em}.hero-grid p:not(.eyebrow){max-width:520px;font-size:18px;color:#526985}.primary,.back{display:inline-flex;margin-top:22px;padding:14px 24px;border-radius:999px;background:linear-gradient(115deg,#397fe4,#6759e6);color:#fff;font-weight:700;box-shadow:0 9px 22px #3e68b42b}.flow{padding-top:72px;padding-bottom:80px}.flow h2,.step h2{margin:0;font-size:clamp(28px,4vw,42px);line-height:1.4}.flow-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:30px}.flow-grid a{display:flex;flex-direction:column;min-height:180px;padding:23px;border:1px solid #c9daeb;border-radius:20px;background:#fff;box-shadow:0 10px 24px #2d5a8510}.flow-grid b{font-size:34px;color:#5f74db}.flow-grid span{margin-top:auto;font-size:18px;font-weight:800}.flow-grid small{font-size:14px;color:#6d8095}.step{padding:78px 0;background:#fff}.step-blue{background:#edf6ff}.step-head{display:flex;gap:22px;align-items:flex-start;margin-bottom:35px}.step-head>span{display:grid;place-items:center;flex:0 0 58px;height:58px;border-radius:18px;background:linear-gradient(135deg,#3b91e8,#6759df);color:#fff;font-size:20px;font-weight:800;box-shadow:0 8px 18px #3d73b52e}.step-head p:last-child{margin:8px 0 0;max-width:760px;font-size:16px;color:#62758b}.screen-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.screen-grid figure{margin:0;overflow:hidden;border:1px solid #c9dbea;border-radius:18px;background:#fff;box-shadow:0 12px 28px #30557813}.screen-grid img{display:block;width:100%;height:auto}.screen-grid figcaption{padding:17px 20px;font-size:15px;color:#63768a}.screen-grid figcaption b{display:block;margin-bottom:3px;color:#2d4565;font-size:17px}.screen-grid .result-screen{grid-column:1/-1}.screen-grid .result-screen img{max-height:760px;object-fit:contain;background:#f8fbff}.action-card{display:grid;grid-template-columns:90px 1fr;gap:25px;max-width:760px;padding:30px;border:1px solid #d5e1ec;border-radius:22px;background:#f8fbfe}.icon{display:grid;place-items:center;width:76px;height:76px;border-radius:24px;background:linear-gradient(135deg,#e4efff,#dcdcff);color:#5365cd;font-size:28px}.action-card h3{margin:0 0 8px;font-size:24px}.action-card ol{margin:0;padding-left:24px;font-size:16px}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.choice-grid article{padding:30px;border:2px solid #b8d5ee;border-radius:22px;background:#fff}.choice-grid article:last-child{border-color:#bcb8ee}.choice-grid small{color:#5374d7;font-weight:800;letter-spacing:.15em}.choice-grid h3{margin:8px 0;font-size:25px}.choice-grid p{margin:0;color:#62758a}.finish{background:#f7fbff}.route{display:flex;align-items:center;justify-content:center;gap:13px;flex-wrap:wrap;padding:28px;border:1px solid #ccdcea;border-radius:22px;background:#fff}.route span,.route strong{padding:10px 16px;border-radius:12px;background:#edf5ff}.route strong{background:#526bd1;color:#fff}.route i{font-style:normal;color:#66809d}.back{float:right}footer{display:flex;justify-content:space-between;padding:30px 6%;background:#142d52;color:#eaf4ff;font-size:13px;letter-spacing:.12em}.top{position:fixed;right:18px;bottom:20px;width:54px;height:60px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #8cb7e4;border-radius:12px;background:#426eb3ed;color:#fff;line-height:1.2;box-shadow:0 5px 20px #142d5230}.top span{font-size:10px;margin-top:4px}a:focus-visible{outline:3px solid #4778d5;outline-offset:4px}@media(max-width:700px){header{padding:15px 18px;font-size:11px}.brand{letter-spacing:1px}.brand b{display:block;margin:0}.wrap{padding:0 18px}.guide-hero{padding:28px 0 38px}.hero-grid{grid-template-columns:1fr;gap:28px}.hero-grid>img{max-width:420px;margin:auto;border-radius:18px}.hero-grid h1{font-size:38px}.hero-grid p:not(.eyebrow){font-size:16px}.flow{padding-top:48px;padding-bottom:52px}.flow-grid{grid-template-columns:repeat(2,1fr);gap:10px}.flow-grid a{min-height:145px;padding:16px}.flow-grid b{font-size:28px}.flow-grid span{font-size:15px}.flow-grid small{font-size:12px}.step{padding:52px 0}.step-head{gap:14px}.step-head>span{flex-basis:45px;height:45px;border-radius:14px;font-size:16px}.step h2{font-size:26px}.step-head p:last-child{font-size:14px}.screen-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding-bottom:8px}.screen-grid figure{flex:0 0 88%;scroll-snap-align:start}.screen-grid figcaption{padding:14px;font-size:13px}.screen-grid figcaption b{font-size:15px}.action-card{grid-template-columns:1fr;padding:22px}.icon{width:62px;height:62px}.action-card h3{font-size:21px}.choice-grid{grid-template-columns:1fr}.choice-grid article{padding:24px}.route{justify-content:flex-start;gap:8px;padding:20px}.route span,.route strong{font-size:13px;padding:8px 10px}.back{float:none;width:100%;justify-content:center}footer{padding-bottom:86px;flex-direction:column;gap:5px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Preserve the source ratio even when HTML supplies intrinsic dimensions. */
.hero-grid > img { height: auto; object-fit: contain; }
.screen-grid { align-items: start; }
