:root{--navy:#082541;--deep:#061a30;--red:#e23c31;--yellow:#ffc946;--ink:#132337;--muted:#647488;--line:#dbe4ec;--soft:#f2f6f9;--white:#fff;--max:1120px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:"Noto Sans JP",system-ui,sans-serif;line-height:1.75;background:#fff}a{color:inherit;text-decoration:none}.handoff-header{height:78px;padding:0 max(20px,calc((100vw - var(--max))/2));display:flex;align-items:center;justify-content:space-between;background:var(--deep);color:#fff}.handoff-header div{display:flex;align-items:center;gap:20px}.handoff-header span{color:#8097ad;font-size:10px;letter-spacing:.14em}.handoff-header strong{font-size:16px}.handoff-header a{padding:9px 14px;border:1px solid #486078;color:var(--yellow);font-size:11px;font-weight:700}main{max-width:var(--max);margin:auto;padding:0 20px}.intro{padding:95px 0 80px}.eyebrow,.block-title p,.reference>p{margin:0 0 10px;color:var(--red);font-size:10px;font-weight:800;letter-spacing:.18em}.intro h1{margin:0;color:var(--navy);font-size:clamp(42px,6vw,68px);line-height:1.25}.intro>p:not(.eyebrow){max-width:720px;margin:25px 0 45px;color:var(--muted)}.audiences{display:grid;grid-template-columns:1fr 1fr;gap:12px}.audiences article{padding:28px;border:1px solid var(--line)}.audiences article:last-child{background:var(--navy);color:#fff;border-color:var(--navy)}.audiences small{color:var(--red);font-weight:800;letter-spacing:.12em}.audiences article:last-child small{color:var(--yellow)}.audiences h2{margin:5px 0 8px;font-size:19px}.audiences p{margin:0;color:var(--muted);font-size:13px}.audiences article:last-child p{color:#aebdcb}.block{padding:75px 0;border-top:1px solid var(--line)}.block-title{display:flex;align-items:flex-start;gap:18px;margin-bottom:35px}.block-title>span{width:42px;height:42px;display:grid;place-items:center;background:var(--red);color:#fff;font-size:12px;font-weight:800}.block-title p{margin:0}.block-title h2{margin:0;color:var(--navy);font-size:29px}.principle{padding:34px;display:flex;align-items:center;justify-content:center;gap:25px;background:var(--navy);color:#fff}.principle strong{font-size:22px}.principle i{color:var(--yellow);font-size:28px;font-style:normal}.note{margin:18px 0 0;padding-left:15px;border-left:3px solid var(--red);color:var(--muted);font-size:13px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:12px}th{padding:12px;text-align:left;background:var(--navy);color:#fff;white-space:nowrap}td{padding:14px 12px;border-bottom:1px solid var(--line);vertical-align:top}td:first-child{color:var(--red);font-weight:800}.copy-box{padding:38px;background:var(--soft);display:grid;grid-template-columns:1.25fr repeat(3,1fr);gap:25px}.copy-box h3{margin:0;color:var(--navy);font-size:24px;line-height:1.55}.copy-box div{padding-left:17px;border-left:2px solid var(--red)}.copy-box strong{color:var(--navy)}.copy-box p{margin:6px 0 0;color:var(--muted);font-size:12px}.route-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.route-grid article{padding:22px;border:1px solid var(--line)}.route-grid code{color:var(--red);font-size:11px;font-weight:800}.route-grid h3{margin:5px 0;color:var(--navy);font-size:16px}.route-grid p{margin:0;color:var(--muted);font-size:11px}.split{display:grid;grid-template-columns:1fr 1fr;gap:60px}.check-list{margin:0;padding:0;list-style:none}.check-list li{padding:12px 10px 12px 38px;border-bottom:1px solid var(--line);position:relative;font-size:13px}.check-list li:before{content:"□";position:absolute;left:10px;color:var(--red);font-weight:800}.check-list.no li:before{content:"—";color:var(--muted)}.dev{padding-left:40px;padding-right:40px;background:var(--soft);border-top:4px solid var(--navy)}.dev-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.dev-grid article{padding:22px;background:#fff}.dev-grid strong{color:var(--navy)}.dev-grid p{margin:7px 0 0;color:var(--muted);font-size:12px}.reference{margin:55px 0 90px;padding:30px;display:flex;flex-wrap:wrap;align-items:center;gap:12px;background:var(--deep);color:#fff}.reference>p{width:100%;color:var(--yellow)}.reference a{padding:9px 13px;border:1px solid #486078;font-size:11px}footer{padding:35px max(20px,calc((100vw - var(--max))/2));display:flex;justify-content:space-between;background:var(--navy);color:#fff;font-size:11px}footer a{color:var(--yellow);font-weight:700}@media(max-width:800px){.copy-box{grid-template-columns:1fr 1fr}.copy-box h3{grid-column:1/-1}.route-grid{grid-template-columns:1fr 1fr}.split{grid-template-columns:1fr;gap:60px}}@media(max-width:560px){.handoff-header{height:auto;padding-top:16px;padding-bottom:16px}.handoff-header span{display:none}.handoff-header strong{font-size:13px}.intro{padding:65px 0}.intro h1{font-size:39px}.audiences,.copy-box,.route-grid,.dev-grid{grid-template-columns:1fr}.copy-box h3{grid-column:auto}.block{padding:55px 0}.block-title h2{font-size:24px}.principle{padding:25px 15px;gap:10px;flex-wrap:wrap}.principle strong{font-size:16px}.principle i{font-size:18px}.dev{margin-left:-20px;margin-right:-20px;padding-left:20px;padding-right:20px}.reference{margin-bottom:60px}footer{gap:20px}}