:root{--paper:#f7f5f2;--ink:#14110f;--paper-inv:#f3f0eb;--ink-inv:#121110;--surface:var(--paper);--surface-raised:#fff;--surface-sunken:#efece7;--surface-dark:var(--ink-inv);--surface-dark-2:#1b1917;--text:var(--ink);--text-muted:#6b635c;--text-faint:#a39a91;--text-on-dark:var(--paper-inv);--text-on-dark-muted:#f3f0eb9e;--line:#14110f1a;--line-strong:#14110f2e;--line-on-dark:#f3f0eb24;--accent:#de4513;--accent-soft:#f0d5c4;--accent-on-dark:#ff7540;--pastel-1:#c9d2ea;--pastel-2:#e7d8de;--pastel-3:#d3e2df;--pastel-4:#efe4cf;--on-pastel-1:#1a2033;--on-pastel-2:#2a1e24;--on-pastel-3:#1c2a26;--on-pastel-4:#2b2416;--font-sans:"Geist", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Sans", "Noto Sans JP", sans-serif;--font-mono:ui-monospace, "SF Mono", Menlo, monospace;--tracking-display:-.035em;--tracking-tight:-.02em;--tracking-wide:.16em;--measure:62ch;--wrap:min(1680px, 94vw);--pad-x:clamp(20px, 4vw, 56px);--section-y:clamp(88px, 12vw, 152px);--radius:14px;--radius-lg:18px;--radius-xl:18px;--radius-pill:999px;--shadow:0 1px 2px #14110f0a, 0 8px 28px #14110f0f;--shadow-lg:0 2px 6px #14110f0d, 0 24px 60px #14110f1f;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-in-out:cubic-bezier(.65, 0, .35, 1);--dur-fast:.18s;--dur:.32s;--dur-slow:1s}@media (width<=720px){:root{--section-y:58px}}@media (prefers-reduced-motion:reduce){:root{--dur-fast:0s;--dur:0s;--dur-slow:0s}}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{color:#171614;-webkit-font-smoothing:antialiased;background:#f7f5f2;margin:0;font:16px/1.8 Geist,Noto Sans JP,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}img,video{max-width:100%;display:block}h1,h2,h3,p{margin:0}h1,h2,h3{letter-spacing:-.035em;line-height:1.4}h2{font-size:clamp(28px,3vw,42px);font-weight:800}h3{font-size:23px}small,.eyebrow{letter-spacing:.08em;font-size:12px}a:focus-visible,button:focus-visible,summary:focus-visible{outline-offset:5px;outline:3px solid #de4513}.wrap{width:min(1080px,calc(100% - 2 * var(--pad-x)));margin:auto}.eyebrow{margin-bottom:24px;font-weight:600}.hero-actions{flex-wrap:wrap;align-items:center;gap:25px;display:flex}.button{border-radius:5px;justify-content:space-between;align-items:center;gap:34px;padding:17px 23px;font-size:14px;font-weight:600;transition:transform .2s,background .2s;display:inline-flex}.button:hover{transform:translateY(-3px)}.primary{color:#fff;background:#db4313}.dark{color:#fff;background:#171614}.text-link{border-bottom:1px solid #b5ada5;font-size:14px}.section-heading{justify-content:space-between;align-items:end;gap:48px;margin-bottom:38px;display:flex}.section-heading>p{color:#68615a;max-width:360px;font-size:14px;line-height:1.9}.section-heading .eyebrow{margin-bottom:16px}.muted{color:#82786f;margin-top:12px;font-size:12px;display:block}.course-section{background:#edeae4;padding:90px 0}.filters{flex-wrap:wrap;gap:8px;margin-bottom:28px;display:flex}.filters button{cursor:pointer;background:0 0;border:1px solid #d2ccc4;border-radius:30px;padding:8px 22px;font-size:14px}.filters button[aria-pressed=true]{color:#fff;background:#191817;border-color:#191817}.badge{letter-spacing:0;color:#6b635c;border:1px solid #d8d1c8;border-radius:4px;padding:1px 8px;font-size:12px}.detail-head{padding:65px 0 50px}.back-link{color:#6b635c;margin-bottom:30px;font-size:14px;display:inline-block}.detail-head h1{max-width:900px;margin:22px 0;font-size:clamp(34px,4.5vw,64px)}.detail-head>p{color:#68615a;max-width:700px}.article{max-width:800px;margin:auto;padding:0 0 90px}.article section{margin:38px 0}.article h2{margin-bottom:16px;font-size:25px}.article p{color:#5d5751;line-height:2}.sample-label{background:#eae4db;border-radius:4px;padding:15px 20px;font-size:14px}.article .button{margin-top:30px}@media (width<=1000px){.wrap{width:calc(100% - 48px)}.section-heading{align-items:start}.section-heading>p{max-width:290px}}@media (width<=720px){.wrap{width:calc(100% - 36px)}.eyebrow{margin-bottom:18px;font-size:11px}.section-heading{margin-bottom:27px;display:block}.section-heading>p{max-width:none;margin-top:17px;font-size:14px}.course-section{padding-block:55px}.detail-head{padding-top:35px}.detail-head h1{font-size:36px}.article{padding-inline:18px}.detail-head .eyebrow{font-size:11px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}[hidden]{display:none!important}.course-section{background:0 0;padding-top:45px}.detail-head .hero-actions{margin-top:28px}.curriculum-note{margin-bottom:25px;font-size:14px}.classroom{grid-template-columns:260px minmax(0,1fr);max-width:1360px;min-height:80vh;margin:auto;display:grid}.lesson-sidebar{border-right:1px solid var(--line);background:0 0;padding:32px 20px}.lesson-sidebar h2{overflow-wrap:anywhere;margin:0 0 22px;font-size:18px;font-weight:600;line-height:1.6}.lesson-sidebar .back-link{margin-bottom:20px;font-size:12px}.lesson-sidebar nav h3{letter-spacing:0;color:var(--text-muted);margin:22px 0 8px;font-size:12px;font-weight:500}.lesson-sidebar nav button{text-align:left;cursor:pointer;color:#514c46;background:0 0;border:0;border-left:2px solid #0000;border-radius:0 5px 5px 0;align-items:baseline;gap:8px;width:100%;min-height:44px;padding:10px 12px;font-size:13px;line-height:1.7;display:flex}.lesson-sidebar nav button small{letter-spacing:0;color:#84786d;font-size:11px;display:block}.lesson-sidebar nav button[aria-current=step]{border-left-color:var(--accent);color:#171614;background:#fff;font-weight:600}.lesson-sidebar nav button:hover{background:#fff}.lesson-content{width:100%;min-width:0;max-width:940px;margin-inline:auto;padding:44px clamp(24px,4vw,60px) 64px}.lesson-content>.lesson-panel>.eyebrow{color:var(--text-muted);margin-bottom:16px}.lesson-content h1{overflow-wrap:anywhere;font-size:clamp(26px,2.6vw,36px);font-weight:600;line-height:1.5}.lesson-state{color:#786d64;align-items:center;gap:18px;margin:20px 0 30px;font-size:13px;display:flex}.lesson-state:empty{display:none}.lesson-body{max-width:800px;margin:30px 0;font-size:18px;line-height:2.1}.lesson-video{aspect-ratio:16/9;object-fit:contain;background:#101010;border-radius:8px;width:100%;max-height:450px}.lesson-placeholder{aspect-ratio:16/6;text-align:center;background:#efebe5;border:1px dashed #bfb4a9;border-radius:7px;flex-direction:column;justify-content:center;align-items:center;padding:25px;display:flex}.lesson-placeholder>span{color:#c44b21;font-size:42px}.lesson-placeholder p{color:#77695c;max-width:500px;font-size:14px}.exercise{border:1px solid var(--line);background:#fff;border-radius:7px;margin:32px 0;padding:24px}.exercise .eyebrow{color:#b43d16;margin-bottom:15px}.exercise h2{font-size:24px}.exercise p{margin:15px 0;font-size:16px}.exercise a{border-bottom:1px solid;font-size:14px;display:inline-block}.lesson-pagination{border-top:1px solid #d8cfc5;justify-content:space-between;gap:20px;margin-top:40px;padding-top:24px;display:flex}.lesson-pagination button{cursor:pointer;background:0 0;border:0;padding:8px;font-size:14px}.lesson-pagination button:disabled{opacity:.35;cursor:default}input[type=radio]{accent-color:#de4513}@media (width<=1000px){.classroom{grid-template-columns:240px minmax(0,1fr)}.lesson-sidebar{padding:25px 16px}.lesson-content{padding:35px 25px}}@media (width<=720px){.course-section{padding-top:30px}.classroom{flex-direction:column;display:flex}.lesson-sidebar{border-bottom:1px solid #d5cec4;border-right:0}.lesson-sidebar nav{max-height:230px;overflow:auto}.lesson-content{padding:30px 20px}.lesson-body{font-size:16px}.exercise{padding:22px}.lesson-placeholder{aspect-ratio:auto;min-height:190px}}.markdown-body h2{margin:35px 0 15px;font-size:25px}.markdown-body p{margin:18px 0;line-height:2}.article-meta{color:#76685d;margin:18px 0;font-size:13px}.lesson-body h2{margin:28px 0 12px;font-size:24px}.lesson-body p{margin:16px 0}.lesson-video{border:0}.blog-policy p{color:#6a6660;line-height:1.9}.blog-policy{background:#eeeae4;margin-top:70px;padding:30px}.course-search{align-items:center;gap:20px;margin:22px 0 12px;font-size:13px;display:flex}.course-search input{max-width:480px;font:inherit;background:#fff;border:1px solid #d9d4cc;border-radius:8px;flex:1;padding:14px 18px}#course-count{color:#777;font-size:12px}body{font-family:var(--font-sans);color:var(--text);background:var(--paper)}[data-lang=ja] .en,[data-lang=en] .ja{display:none}.learn-intro{padding-block:70px 44px}.learn-intro .eyebrow{color:var(--text-muted);margin-bottom:18px;font-size:11px}.learn-intro h1{letter-spacing:-.045em;font-size:clamp(34px,4.5vw,54px);font-weight:600}.learn-intro>p:last-child{color:var(--text-muted);margin-top:18px;font-size:15px;line-height:1.9}@media (width<=720px){.learn-intro{padding-block:38px 28px}}.skip-link{z-index:1000;background:var(--ink);color:#fff;padding:10px 16px;position:fixed;top:12px;left:16px;transform:translateY(-180%)}.skip-link:focus{transform:none}input:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:3px}main:focus{outline:none}.wrap>*{min-width:0}main{overflow-wrap:anywhere}.course-search input{min-width:0;font-size:16px}.filters button{min-height:44px}.button{white-space:normal;text-align:left;max-width:100%;min-height:44px}.lesson-content{scroll-margin-top:145px}.lesson-body pre,.markdown-body pre{max-width:100%;font-size:14px;overflow:auto}.lesson-body img{height:auto}@media (width>=721px) and (width<=1050px){.detail-grid{grid-template-columns:minmax(0,1fr) 280px}.classroom{grid-template-columns:240px minmax(0,1fr)}}@media (width<=860px){html{scroll-padding-top:145px}}@media (width<=520px){.course-search{flex-direction:column;align-items:stretch;gap:8px}.course-search input{width:100%;max-width:none}.filters{gap:8px}.filters button{padding:8px 14px}.lesson-pagination{gap:8px}.lesson-pagination button{min-height:44px}.price{flex-wrap:wrap}}@media (prefers-reduced-motion:reduce){.button:hover{transform:none}}.lesson-body{max-width:740px;font-size:16px;line-height:1.95}.lesson-body h2{letter-spacing:-.02em;margin:44px 0 16px;line-height:1.5}.lesson-body h3{margin:30px 0 12px;font-size:18px;line-height:1.6}.lesson-body ul,.lesson-body ol{margin:18px 0;padding-left:1.4em}.lesson-body li{margin:9px 0}.lesson-body blockquote{border-left:3px solid var(--accent);background:var(--surface-sunken);margin:24px 0;padding:4px 20px}.lesson-body table{border-collapse:collapse;width:100%;margin:24px 0;font-size:14px;line-height:1.8;display:block;overflow-x:auto}.lesson-body th,.lesson-body td{border-bottom:1px solid var(--line);text-align:left;vertical-align:top;min-width:120px;padding:12px 14px}.lesson-body th{background:var(--surface-sunken)}.lesson-body pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#efeeeb;border-radius:8px;padding:22px;line-height:1.8}.lesson-body img{border:1px solid var(--line);border-radius:8px;max-width:min(100%,360px);margin:28px auto;display:block}.lesson-body a{text-underline-offset:4px;overflow-wrap:anywhere;text-decoration:underline}.lesson-body details{border:1px solid var(--line);border-radius:8px;margin:20px 0;padding:18px}.lesson-body summary{cursor:pointer;font-weight:600}.lesson-sidebar{align-self:start;max-height:calc(100vh - 76px);position:sticky;top:76px;overflow-y:auto}@media (width>=721px) and (width<=1000px){.lesson-sidebar{max-height:calc(100vh - 106px);top:106px}}@media (width<=720px){.lesson-sidebar{max-height:none;position:static}.lesson-body h2{font-size:22px}.lesson-body th,.lesson-body td{min-width:110px;padding:10px}.lesson-content{padding-inline:20px}}.lesson-menu>summary{cursor:pointer;color:var(--text-muted);padding:12px 0;font-size:13px}@media (width<=720px){.lesson-sidebar{padding:16px 20px}.lesson-sidebar h2{margin:12px 0;font-size:17px}.lesson-sidebar .back-link{margin-bottom:0}.lesson-menu>summary{align-items:center;min-height:44px;display:flex}.lesson-content{padding-top:24px}.lesson-sidebar{align-self:stretch;width:100%}}.lesson-media{max-width:740px;margin:24px 0}.lesson-media.portrait{width:min(100%,320px)}.lesson-media.portrait .lesson-video{aspect-ratio:9/16;width:100%;height:auto;max-height:none;display:block}.lesson-media figcaption{color:var(--text-muted);margin-top:10px;font-size:12px;line-height:1.7}.learning-diagram{border:1px solid var(--line);background:#f0efeb;border-radius:8px;margin:28px 0;padding:22px}.learning-diagram figcaption{margin-bottom:16px;font-size:13px;font-weight:600}.lesson-body .diagram-flow{grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:12px;margin:0;padding:0;list-style:none;display:grid}.lesson-body .diagram-flow li{background:#fff;border-radius:5px;flex-direction:column;gap:8px;min-width:0;margin:0;padding:16px;display:flex}.diagram-flow .diagram-step{color:#a33e20;letter-spacing:.08em;font-size:11px;font-weight:600}.diagram-flow strong{font-size:15px;line-height:1.6}.diagram-flow li>span:last-child{color:#625c55;font-size:13px;line-height:1.7}.learning-compare{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:24px 0;display:grid}.learning-compare>div{border:1px solid var(--line);border-radius:6px;min-width:0;padding:16px}.learning-compare strong{font-size:14px}.lesson-body .learning-compare pre{padding:12px;font-size:12px}.lesson-body .learning-compare p{margin:10px 0 0;font-size:13px}@media (width<=600px){.learning-diagram{margin:24px 0;padding:16px}.learning-compare{grid-template-columns:1fr}}.lesson-body .wide-example{margin:24px 0}.lesson-body .wide-example img{max-width:100%;margin:0}.wide-example figcaption{color:var(--text-muted);margin-top:8px;font-size:12px}.product-compare{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:28px 0;display:grid}.product-compare>section{background:#f1f5f3;border:1px solid #d9dedb;border-radius:8px;min-width:0;padding:22px}.product-compare>section:nth-child(2){background:#fbf0e9;border-color:#e6d7ce}.diagram-kicker{letter-spacing:.09em;color:#665c54;font-size:11px;font-weight:600}.lesson-body .product-compare h3{margin:10px 0 14px;font-size:20px}.lesson-body .product-compare p,.lesson-body .product-compare li{font-size:14px;line-height:1.85}.diagram-result{border-top:1px solid #cfc8c0;padding-top:14px}.decision-map{border:1px solid var(--line);border-radius:8px;margin:28px 0;padding:20px}.lesson-body .decision-map h3{margin:0 0 16px;font-size:16px}.decision-map>div{border-top:1px solid var(--line);grid-template-columns:1.2fr 1fr;gap:16px;padding:14px 0;font-size:14px;display:grid}.decision-map>div strong{font-weight:500}.decision-map>div span{color:#426055}.diagram-cool{background:#edf2f0;border-color:#d4ded8}.skill-catalog{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:28px 0;display:grid}.skill-catalog>article{border:1px solid var(--line);background:#fff;border-radius:8px;min-width:0;padding:20px}.skill-catalog article>span{color:#665c54;font-size:12px}.lesson-body .skill-catalog h3{overflow-wrap:anywhere;margin:8px 0 12px;font-size:20px}.lesson-body .skill-catalog p,.skill-catalog a{font-size:14px;line-height:1.85}@media (width<=600px){.product-compare,.skill-catalog{grid-template-columns:1fr}.product-compare>section,.skill-catalog>article{padding:18px}.decision-map>div{grid-template-columns:1fr;gap:6px}}.lesson-body .ops-diagram{background:#f0f3f1;border:1px solid #d8e0dc;border-radius:12px;margin:24px 0 32px;padding:22px;line-height:1.6}.ops-diagram figcaption{margin-bottom:20px;font-size:16px;font-weight:650}.lesson-body .ops-diagram ol{gap:24px;margin:0;padding:0;list-style:none;display:flex}.lesson-body .ops-diagram li{background:#fff;border:1px solid #dde2df;border-radius:8px;flex:1;min-width:0;margin:0;padding:14px;position:relative}.ops-diagram li+li:before{content:"→";color:#567369;font-size:18px;position:absolute;top:40px;left:-22px}.ops-number{letter-spacing:.08em;color:#567369;margin-bottom:8px;font-size:11px;display:block}.ops-diagram strong{font-size:14px;line-height:1.6;display:block}.ops-detail{color:#616b65;margin-top:8px;font-size:12px;display:block}.lesson-body .ops-note{color:#52645b;border-top:1px solid #d8e0dc;margin:18px 0 0;padding-top:14px;font-size:12px}.ops-compare li+li:before{content:none}.ops-compare li:nth-child(2){border-top:3px solid #c39254}.ops-compare li:nth-child(3){border-top:3px solid #a27070}.ops-timeline li{border-top:3px solid #567369!important}@media (width<=1100px){.lesson-body .ops-diagram ol{flex-direction:column;gap:20px}.lesson-body .ops-diagram li{padding:12px 16px}.ops-diagram li+li:before{content:"↓";top:-23px;left:24px}.ops-compare li+li:before{content:none}.ops-number{float:left;margin:2px 12px 0 0}.ops-detail{margin-top:4px}.lesson-body .ops-diagram{padding:18px}}.lesson-body .sns-map{background:#f6f8f7;border:1px solid #d7dedb;border-radius:12px;margin:24px 0 32px;padding:22px;line-height:1.5}.sns-map figcaption{margin-bottom:22px;font-size:17px;font-weight:650}.map-lane{background:#fff;border:1px solid #dce3df;border-radius:9px;padding:14px}.lesson-body .lane-label{letter-spacing:.04em;color:#526c61;margin:0 0 12px;font-size:11px;font-weight:650}.map-route{grid-template-columns:1fr 60px 1fr 60px 1fr;align-items:center;display:grid}.map-node{background:#edf2ef;border:1px solid #d6e1da;border-radius:6px;min-width:0;padding:12px}.map-node strong{font-size:13px;line-height:1.5;display:block}.map-node small{color:#58635d;margin-top:6px;font-size:11px;line-height:1.6;display:block}.map-storage{border-top:3px double #8ca598;border-bottom:3px double #8ca598;border-radius:40%/12%}.map-arrow{text-align:center;color:#526c61;padding:0 4px}.map-arrow span{font-size:9px;display:block}.map-arrow b{font-size:23px;display:block}.map-bridge{color:#526c61;padding:12px;font-size:11px}.lesson-body .map-caption{color:#59685f;margin:16px 0 0;font-size:12px}.sequence-head{text-align:center;grid-template-columns:repeat(3,1fr);gap:12px;font-size:12px;display:grid}.sequence-head strong{background:#e4ebe7;border-radius:5px;padding:12px 5px}.lesson-body .sequence-steps{background:linear-gradient(90deg,#0000 16.5%,#d3ddd7 16.5% 16.8%,#0000 16.8% 49.8%,#d3ddd7 49.8% 50.1%,#0000 50.1% 83.1%,#d3ddd7 83.1% 83.4%,#0000 83.4%);margin:0;padding:12px 0;list-style:none;position:relative}.lesson-body .sequence-steps li{background:#f6f8f7;border-bottom:2px solid #719282;width:66.66%;margin:12px 0;padding:12px 8px;font-size:12px}.sequence-steps .seq-right{margin-left:33.33%!important}.sequence-steps .seq-return{color:#526c61;border-bottom-style:dashed!important}.sequence-result{width:60%;margin-top:20px}.decision-start{text-align:center;max-width:280px;margin:auto}.decision-question{text-align:center;border:2px solid #7f9a8b;border-radius:50%;max-width:300px;margin:20px auto;padding:18px;font-size:14px;font-weight:650}.decision-question:before{content:"↓";display:block}.decision-branches{border-top:2px solid #afc1b6;grid-template-columns:repeat(3,1fr);gap:15px;padding-top:14px;display:grid}.branch-label{text-align:center;margin-bottom:10px;font-size:11px;display:block}.branch-label:before{content:"↓";color:#718d7d;display:block}.stop .map-node{background:#f3e7e4;border-color:#d9bab3}.wait .map-node{background:#f5eddd;border-color:#dfceab}.go .map-node{background:#e7f0e9}@media (width<=700px){.lesson-body .sns-map{padding:15px}.map-route{grid-template-columns:1fr}.map-arrow b{transform:rotate(90deg)}.map-arrow{padding:7px}.map-node strong{font-size:14px}.map-node small{font-size:12px}.map-arrow span{font-size:11px}.decision-branches{grid-template-columns:1fr}.decision-branch{grid-template-columns:80px 1fr;align-items:center;display:grid}.branch-label:before{content:"→"}.sequence-head{gap:6px;font-size:11px}.lesson-body .sequence-steps li{font-size:11px}.sequence-result{width:100%}}
