:root{color-scheme:light;--ink:#173f35;--muted:#4b665d;--green:#17644c;--deep:#143e33;--mint:#e0f1e7;--cream:#fffcf1;--paper:#fff;--line:#bdd4c6;--yellow:#ffe5a0;--radius:22px;font-family:"Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:18px;color:var(--ink);background:var(--cream)}
*{box-sizing:border-box}body{margin:0;line-height:1.8}button,summary,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:var(--green);text-underline-offset:4px}a:hover{text-decoration-thickness:2px}button,summary{cursor:pointer}button:disabled{cursor:default;opacity:.45}button:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid #976400;outline-offset:5px}[hidden]{display:none!important}.skip{position:absolute;top:-100px;left:12px;z-index:10;background:#fff;padding:10px 20px}.skip:focus{top:10px}.site-header{max-width:1320px;margin:auto;padding:20px 40px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{font-size:18px;font-weight:800;text-decoration:none;color:var(--deep)}.header-label{font-size:13px;letter-spacing:.1em;font-weight:700}.hero{background:var(--mint);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.hero-inner{max-width:1240px;margin:auto;padding:38px 30px 32px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:28px}.eyebrow{font-size:13px;font-weight:800;letter-spacing:.13em;margin:0 0 8px}h1{font-size:clamp(30px,3.1vw,44px);line-height:1.5;letter-spacing:.015em;margin:0;max-width:800px}.hero-lead{margin:14px 0 0;max-width:750px}.course-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.pill{font-size:13px;line-height:1.6;border:1px solid #7da48e;border-radius:99px;padding:5px 12px;font-weight:700;background:#ffffff87}.hero-price{background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);padding:24px 28px;min-width:225px;box-shadow:5px 5px 0 #a6c5af55}.hero-price p{margin:0;font-size:13px;font-weight:700}.price-line{font-size:22px;font-weight:800;white-space:nowrap}.price-line strong{font-size:34px}.hero-price small{font-size:12px;color:var(--muted)}.notice{max-width:1240px;margin:0 auto;padding:16px 30px;font-size:14px;color:var(--muted)}.course-layout{max-width:1240px;margin:8px auto 64px;padding:0 30px;display:grid;grid-template-columns:242px minmax(0,1fr);gap:28px;align-items:start}.chapter-nav{position:sticky;top:18px;background:#f1f5eb;border:1px solid var(--line);border-radius:18px;padding:18px 12px}.chapter-nav>summary{font-size:15px;font-weight:800;list-style:none;padding:0 9px 12px;cursor:default}.chapter-nav>summary::-webkit-details-marker{display:none}.chapter-nav ol{list-style:none;margin:0;padding:0}.chapter-nav a{display:grid;grid-template-columns:25px 1fr 16px;gap:6px;text-decoration:none;align-items:center;color:var(--muted);font-size:14px;line-height:1.5;min-height:47px;padding:8px 10px;border-radius:10px;border:1px solid transparent}.chapter-nav a:hover{background:#fff}.chapter-nav a[aria-current]{color:var(--deep);font-weight:800;background:white;border-color:#88b09b}.chapter-no{font-size:12px;font-weight:800}.chapter-nav small{display:block;font-size:12px;color:var(--muted);padding:12px 9px 0;line-height:1.6}.lesson-panel{min-width:0;scroll-margin-top:20px}.progress-bar{display:flex;gap:16px;align-items:center;margin-bottom:20px;font-size:13px;font-weight:800}.progress-bar progress{flex:1;height:7px;border:0;border-radius:9px;background:#dce6d8;accent-color:var(--green)}progress::-webkit-progress-bar{background:#dce6d8;border-radius:9px}progress::-webkit-progress-value{background:var(--green);border-radius:9px}.scene{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:34px;margin-bottom:28px;box-shadow:0 5px 0 #183b2c07}.scene-head{display:flex;gap:13px;align-items:center;margin-bottom:12px}.scene-index{display:grid;place-items:center;border:1px solid #92b29a;background:var(--mint);width:44px;height:44px;border-radius:50%;font-weight:800;font-size:15px;flex-shrink:0}.scene-head p{margin:0;font-size:14px;font-weight:800;letter-spacing:.06em}.scene h2{font-size:clamp(28px,2.5vw,33px);line-height:1.5;margin:0 0 20px;letter-spacing:.01em}.scene h2:focus{outline:none}.definition{font-size:19px;font-weight:700;line-height:1.9;margin:0 0 24px;max-width:44em}.role-figure{margin:24px 0;padding:24px 22px;background:#f4f7f0;border:1px solid #d5e3d5;border-radius:18px}.role-figure figcaption{font-size:13px;font-weight:800;letter-spacing:.04em;margin-bottom:18px;color:#3f6554}.flow{display:flex;align-items:center;justify-content:center;gap:12px}.node{border:1px solid #93b39c;background:#fff;border-radius:12px;padding:17px 14px;min-width:0;text-align:center;flex:1}.node strong{display:block;font-size:20px;line-height:1.6}.node small{display:block;color:var(--muted);font-size:13px;line-height:1.6;margin-top:5px}.node.accent{background:var(--deep);color:#fff;border-color:var(--deep)}.node.accent small{color:#e4f3e8}.arrow{font-size:25px;line-height:1;flex-shrink:0;color:#3d795a}.arrow small{font-size:11px;display:block;text-align:center;line-height:1.5}.browser{border:2px solid #7d9d89;padding-top:0;overflow:hidden;text-align:left}.browser-top{font-size:11px;border-bottom:1px solid #b8ccb8;background:#eef3e9;margin:0 -14px 12px;padding:6px 10px;white-space:nowrap}.browser strong{font-size:18px}.browser .amount{font-size:28px;margin-top:8px;display:block;color:var(--green);font-weight:800}.diagram-note{font-size:13px;color:var(--muted);margin:16px 0 0;line-height:1.8}.domain-name{font-size:23px;font-weight:800;text-align:center;border:1px solid #92b29a;border-radius:10px;padding:10px;background:#fff}.domain-caption{text-align:center;font-size:12px;color:var(--muted);margin:4px 0 12px}.stack{display:grid;gap:10px}.platforms{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.platforms .node{padding:16px 7px}.platforms strong{font-size:17px}.harness{border:2px solid #73a48a;border-radius:14px;padding:15px;background:#e8f3e9}.harness-title{margin:0 0 12px;font-size:15px;font-weight:800}.tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}.tool-grid>div{font-size:14px;text-align:center;padding:11px 5px;background:white;border:1px solid var(--line);border-radius:8px}.tool-grid strong{display:block}.tool-grid small{font-size:11px;color:var(--muted)}.steps{list-style:none;display:grid;gap:8px;margin:0;padding:0;counter-reset:step}.steps li{background:white;border:1px solid var(--line);border-radius:9px;padding:9px 12px;display:flex;align-items:center;gap:12px;font-size:16px;font-weight:700}.steps li:before{counter-increment:step;content:counter(step);border-radius:50%;width:26px;height:26px;display:grid;place-items:center;background:var(--mint);font-size:12px;flex-shrink:0}.example{border-left:4px solid #4d8b64;padding:0 0 0 17px;margin:24px 0}.example .label{font-size:12px;font-weight:800;letter-spacing:.1em;margin:0 0 5px;color:var(--green)}.example p:last-child{margin:0;font-weight:700;font-size:18px}.reading{margin:22px 0}.reading summary{font-size:14px;font-weight:700;min-height:44px;display:flex;align-items:center;gap:8px}.reading summary:before{content:'＋';color:var(--green)}.reading[open] summary:before{content:'−'}.reading p{font-size:16px;color:var(--muted);margin:8px 0 0;line-height:2}.remember{background:var(--cream);border:1px solid #e9dbab;border-radius:12px;padding:15px 18px;font-size:15px;line-height:1.8}.remember strong{display:block;font-size:12px;color:#736235;margin-bottom:5px}.quiz{margin-top:30px;padding-top:26px;border-top:1px solid var(--line)}.quiz-label{font-size:12px;font-weight:800;letter-spacing:.1em;color:var(--green);margin:0 0 6px}.quiz h3{font-size:21px;line-height:1.8;margin:0 0 16px}.answer{border:1px solid #b5cbbb;border-radius:12px;margin:10px 0;overflow:hidden}.answer summary{padding:15px 18px;min-height:58px;list-style:none;font-size:17px;font-weight:700;display:flex;gap:12px;align-items:center;line-height:1.7}.answer summary::-webkit-details-marker{display:none}.choice-letter{display:grid;place-items:center;flex-shrink:0;width:29px;height:29px;border:1px solid #9eb9a7;border-radius:50%;font-size:13px;font-weight:800}.answer summary:hover{background:#f0f7ef}.answer[open]{border-color:#7c9e82;background:#f0f7ef}.answer[data-correct=false][open]{border-color:#c5ae70;background:#fffae9}.answer p{margin:0;padding:0 20px 18px;font-size:15px}.answer p strong{display:block;font-size:13px;margin-bottom:4px}.feedback-status{font-size:13px;color:var(--muted);min-height:1em}.quiz-note{font-size:12px;color:var(--muted);margin:14px 0 0}.lesson-controls{display:flex;gap:14px;justify-content:space-between;position:sticky;bottom:0;background:#fffcf1ed;backdrop-filter:blur(8px);padding:16px 0 12px;z-index:2}.button{display:inline-flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;padding:13px 22px;border-radius:12px;border:1px solid var(--green);font-size:16px;line-height:1.7;font-weight:800;min-height:52px;background:#fff;color:var(--green)}.button.primary{background:var(--green);color:white;box-shadow:0 3px 0 #103e2f}.button:hover{filter:brightness(.96)}.next-arrow{margin-left:18px}.demo-button{margin-top:16px;min-height:48px;font-size:14px;padding:10px 18px}.demo-result{margin-top:16px;padding:14px 18px;border-radius:10px;background:#fff;border:1px dashed #75a487}.demo-result strong{font-size:24px}.demo-result p{font-size:13px;margin:6px 0 0}.final-cta{background:var(--mint);border:1px solid #9aba9f;border-radius:15px;padding:24px;margin-top:28px}.final-cta h3{font-size:24px;margin:0 0 12px;line-height:1.6}.final-cta p{font-size:16px}.final-cta .button{width:100%}.final-cta small{display:block;color:var(--muted);font-size:12px;margin-top:12px}.sources{max-width:1180px;margin:0 auto 45px;padding:24px 30px;border-top:1px solid var(--line)}.sources summary{font-size:15px;font-weight:800;min-height:44px;cursor:pointer}.sources ol{padding-left:24px}.sources li{font-size:13px;margin:18px 0;overflow-wrap:anywhere}.sources li p{font-size:12px;color:var(--muted);margin:4px 0}.source-links{font-size:12px;color:var(--muted);margin-top:20px}.source-links a{margin-right:14px}.footer{font-size:12px;max-width:1180px;margin:auto;padding:20px 30px 35px;color:var(--muted)}.no-script{padding:15px;background:#fff6d4;font-size:14px;border-radius:12px;margin-bottom:20px}.static-nav{font-size:14px;text-align:right;margin-top:22px}.enhanced .static-nav{display:none}
@media(min-width:801px){.chapter-nav>summary{pointer-events:none}}
@media(max-width:1050px){.hero-price{display:none}.hero-inner{grid-template-columns:1fr}.course-layout{grid-template-columns:200px minmax(0,1fr);gap:20px}.scene{padding:26px}.flow{gap:8px}.node{padding:14px 10px}.node strong{font-size:18px}.tool-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.site-header{padding:17px 20px}.header-label{font-size:11px;letter-spacing:0}.brand{font-size:16px}.hero-inner{padding:28px 22px}.hero-lead{font-size:16px}.notice{padding:15px 22px;font-size:13px}.course-layout{display:block;padding:0 16px;margin-top:3px}.chapter-nav{position:static;padding:12px;margin:0 0 22px}.chapter-nav>summary{padding:3px 6px;font-size:14px;cursor:pointer;display:flex;justify-content:space-between;min-height:30px;align-items:center}.chapter-nav>summary:after{content:'章を選ぶ ＋';font-size:12px;font-weight:400}.chapter-nav[open]>summary:after{content:'閉じる −'}.chapter-nav ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;margin-top:10px}.chapter-nav a{font-size:13px;min-height:48px;padding:8px 6px;grid-template-columns:22px 1fr 10px;gap:3px}.chapter-nav small{font-size:11px}.progress-bar{margin:0 4px 16px}.scene{padding:24px 20px;border-radius:18px;margin-bottom:10px}.scene h2{font-size:28px;margin-bottom:16px}.definition{font-size:18px}.role-figure{padding:18px 14px;margin:22px -3px}.role-figure figcaption{font-size:12px;margin-bottom:15px}.flow{flex-direction:column;gap:10px}.node{width:100%;padding:15px}.node strong{font-size:20px}.arrow{transform:rotate(90deg);font-size:23px;height:25px}.arrow small{display:none}.node.browser{padding-top:0}.browser-top{margin:0 -15px 12px}.platforms{grid-template-columns:1fr}.platforms .node{padding:12px;display:flex;align-items:center;justify-content:space-between;text-align:left;gap:10px}.platforms .node small{margin:0;font-size:12px}.tool-grid{gap:7px}.tool-grid>div{font-size:13px}.diagram-note{font-size:12px}.quiz h3{font-size:20px}.answer summary{font-size:16px;padding:14px 12px;gap:9px}.answer p{padding:0 14px 16px}.lesson-controls{padding:12px 3px;gap:10px}.button{padding:12px 17px;font-size:15px;min-height:50px}.lesson-controls .primary{margin-left:auto}.next-arrow{margin-left:12px}.final-cta{padding:20px 16px;margin-left:-4px;margin-right:-4px}.final-cta h3{font-size:23px}.sources{padding:20px 22px;margin-bottom:12px}.footer{padding:18px 22px 30px}.reading p{font-size:16px}.eyebrow{font-size:11px}.course-meta{gap:6px}.pill{font-size:12px;padding:4px 10px}.scene-head{margin-bottom:12px}.scene-index{width:38px;height:38px;font-size:13px}.scene-head p{font-size:13px}.lesson-panel{scroll-margin-top:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media print{.site-header,.chapter-nav,.lesson-controls,.progress-bar,.demo-button{display:none!important}.course-layout{display:block}.scene[hidden]{display:block!important}.scene{break-inside:avoid;box-shadow:none}.reading p,.answer p{display:block}.sources{break-before:page}}
.hero-start{margin-top:20px;text-decoration:none}.node small,.tool-grid small,.diagram-note{font-size:15px;line-height:1.8}.reading summary,.reading p{font-size:17px}.answer p{font-size:16px}.answer p strong,.feedback-status,.notice{font-size:15px}.remember{font-size:16px}.source-links,.sources li,.sources li p,.quiz-note{font-size:14px}.chapter-nav small{font-size:13px}@media(max-width:800px){.platforms .node small{font-size:14px}.node small,.diagram-note{font-size:15px}.hero-start{width:100%;justify-content:center}.reading p{font-size:17px}}
