/* Section-specific composition, with unobstructed reading surfaces. */
:root{--frame:#d8c5b4;--soft:#f4ede4;--quiet:#e8dfd3}
body{font-kerning:normal}
p,li,dd{hanging-punctuation:allow-end;text-spacing-trim:trim-start;font-feature-settings:"palt" 1}
.chunk{vertical-align:baseline}
.hero-art{margin-top:24px;padding:20px 0 0 20px;position:relative}
.hero-art:before{content:"";position:absolute;inset:0 20px 40px 0;border:1px solid #d9b99c;border-radius:100px 0 0 0;pointer-events:none}
.hero-art>.illustration{position:relative;border-radius:72px 4px 4px 4px;border:0}
.hero-art .cap{position:relative}
.hero .cond{max-width:100%}

/* Classroom: a spacious heading with a bound, quiet reading column. */
.cls .wrap{position:relative;padding-top:48px}
.cls h2{margin-bottom:28px}
.cls .big{position:relative;border:0;background:linear-gradient(90deg,#f5e7d7, #fcf7f0);padding:30px 36px 30px 36px;margin-bottom:34px;max-width:100%}
.cls .big:after{content:"";position:absolute;right:0;top:0;width:36px;height:36px;border-top:2px solid #c7af96;border-right:2px solid #c7af96;pointer-events:none}
.cls .spec:not(.days){border-left:1px solid var(--frame);padding-left:28px}
.cls .spec:not(.days)>li{padding-top:28px;padding-bottom:32px;padding-left:164px}
.cls .spec:not(.days)>li>b{top:28px;width:140px;font-size:20px;line-height:1.75}
.cls .spec:not(.days)>li+li{margin-top:0;border-top:1px solid var(--quiet)}
.cls .spec-copy>.conclusion{font-size:17px;font-weight:700;line-height:1.9;margin-bottom:24px}
.cls .spec-copy>.reading-group:not(.conclusion){max-width:748px}
.cls .spec-copy>.reading-group+.reading-group{margin-top:20px}
.days{background:#f0ebe3;border-top:2px solid #bbaa96;border-bottom:1px solid #d7c9b8;margin-top:10px}
.days .day-name{font-size:18px}
.days .day-time{font-size:16px}

/* Equipment: a dedicated illustration alcove and flush specification rows. */
.pc>.shape{padding-top:36px;position:relative}
.pc .shape>.illustration{padding:20px 12px;background:#efe8de;border:0;border-radius:0 64px 0 0;max-width:460px}
.pc .shape>.cap{padding-left:12px}
.pc .spec>li:nth-child(2){margin:8px 0 24px;padding:30px 24px!important;background:#f8eddf;border-left:3px solid #c8ae8d}
.pc .spec>li:nth-child(2)>b{margin-left:0}
.pc .spec>li:nth-child(2) .spec-copy{padding-right:0}
.pc .spec>li:nth-child(2) .conclusion{font-size:17px;line-height:1.95}
.pc .spec>li:nth-child(2) .reading-group+.reading-group{margin-top:24px}
.pc .shape>div>p:not(.big):not(.src){background:transparent;border-left:2px solid #c6baa9;padding:8px 0 8px 28px;margin-top:28px}

/* Experience: shared header baseline, distinct space between each scene. */
.experience{background:var(--paper)}
.experience h2{margin-bottom:32px}
.steps{gap:44px;margin-top:36px;background:#f5f0e8;padding:28px 28px 32px}
.step{grid-template-rows:minmax(72px,auto) auto;align-content:start;row-gap:0;border-top:1px solid #a9957e;padding-top:26px}
.step h3{align-self:start;line-height:1.7;padding-top:1px}
.step>.no{margin-top:0;background:#e6dacb;border-radius:50%}
.step>p{margin-top:20px}
.wrap>p.big.mid{margin-top:44px;margin-bottom:32px;background:var(--paper);border-top:1px solid #c6b39d;border-bottom:1px solid #c6b39d;padding:24px 0}
.scenes{gap:32px}
.scene{padding-bottom:26px;border-bottom:2px solid #cbb8a3}
.scene>.illustration{border-radius:0 28px 0 0;margin-bottom:22px}
.scene .body{grid-template-rows:minmax(68px,auto) auto;align-content:start}
.scene h3{align-self:start;padding-top:2px;min-height:0}
.scene .no{background:#efe5d9}
.scene .body>p{margin-top:16px}
.scenes-group>.cap{border-top:0;padding-top:0;margin-top:14px}
.parent-note{padding-top:16px}
.parent-note>p.big{border:0;border-top:3px solid #c5ad91;background:#f4eadc;padding:26px 32px;max-width:100%;font-size:22px}
.parent-note>p:not(.big){max-width:960px}

/* Pricing: an inset ledger, with equal outer edges for important rows. */
.pricing{background:#efeae2;padding-top:64px;padding-bottom:64px}
.terms{border:1px solid #cbbba8;border-top:4px solid #81674e;background:var(--paper);padding:40px 36px 28px}
.terms .sum{margin-bottom:30px;max-width:940px}
.terms dl{border-top:1px solid #d7c9b8}
.trow{grid-template-columns:172px minmax(0,1fr);column-gap:28px;padding:30px 24px;margin:0;border-top:0;border-bottom:1px solid #ded2c4}
.trow dt{font-size:19px;font-weight:700;line-height:1.85;padding-top:1px}
.trow dd{max-width:748px}
.trow dd>.answer{line-height:1.85}
.trow.key{margin:0;padding:30px 24px;border:0;border-left:3px solid #c6a27c;background:#f8ead9}
.trow.key dt{margin-left:-3px}
.trow.key dd{margin-left:-3px}
.trow.decision-row.key{margin:26px 0 0;padding:30px 24px;background:#f0ebe3;border:1px solid #cbbba8;border-left:3px solid #99836b}
.trow.decision-row:not(.key){padding:30px 24px 36px;border-bottom:2px solid #b49b7e}
.trow:nth-child(7){padding-top:36px}
.trow:nth-child(n+8){padding-top:28px;padding-bottom:28px}
.trow:nth-child(n+8) dt{font-size:18px}
.trow dd small.details{margin-top:24px;line-height:1.95;padding:0;color:var(--ink);font-size:16px}
.trow dd small .reading-group+.reading-group{margin-top:24px}
.price-line+.plan-detail{margin-top:24px}
.price-line+.price-line{margin-top:12px}
.plan-detail+.plan-detail{margin-top:12px}
.trow:last-child{border-bottom:0}
.trow dd .chunk{hanging-punctuation:allow-end}

@media(min-width:860px){
 .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px}
 .hero-art{align-self:start}
 .hero h1{font-size:56px}
 .pc .shape>div>.spec>li{grid-template-columns:172px minmax(0,1fr);gap:28px}
 .pc .shape>div>.spec>li:nth-child(2){grid-template-columns:172px minmax(0,1fr);padding-left:21px!important}
 .pc .shape>div>.spec>li:not(:nth-child(2)){padding-inline:24px}
 .pc .shape>div>p:not(.big):not(.src){margin-inline:24px}
}
@media(max-width:859px){
 .hero-art{padding:12px 0 0 12px;margin:6px 0 22px;max-width:400px}
 .hero-art:before{inset:0 16px 36px 0;border-radius:64px 0 0 0}
 .hero-art>.illustration{border-radius:42px 4px 4px 4px;max-height:none}
 .hero-art .cap{margin-top:12px}
 .cls .wrap{padding-top:38px}
 .cls .big{padding:26px 20px;font-size:20px;margin-bottom:28px}
 .cls .spec:not(.days){padding-left:16px}
 .cls .spec:not(.days)>li{padding:24px 0 28px}
 .cls .spec:not(.days)>li>b{width:auto;font-size:20px;margin-bottom:18px}
 .cls .spec-copy>.conclusion{font-size:16px;margin-bottom:20px;line-height:1.95}
 .days .day-name{font-size:17px}
 .pc>.shape{padding-top:26px}
 .pc .shape>.illustration{padding:16px 10px;border-radius:0 46px 0 0}
 .pc .shape>.cap{padding-left:0}
 .pc .spec>li{padding-inline:16px}
 .pc .spec>li:nth-child(2){margin:8px 0 22px;padding:26px 16px 26px 13px!important}
 .pc .spec>li:nth-child(2) .conclusion{font-size:16px}
 .pc .shape>div>p:not(.big):not(.src){padding:4px 0 4px 18px;margin-top:24px}
 .steps{gap:36px;margin-top:30px;padding:24px 18px 28px}
 .step{grid-template-rows:auto auto;padding-top:24px}
 .step h3{padding-top:1px}
 .step>p{margin-top:20px}
 .wrap>p.big.mid{margin-top:38px;margin-bottom:30px;font-size:19px;padding:24px 0;background:transparent}
 .scenes{gap:40px}
 .scene{padding-bottom:30px}
 .scene .body{grid-template-rows:auto auto}
 .scene>.illustration{border-radius:0 24px 0 0;margin-bottom:22px}
 .scene .body>p{margin-top:18px}
 .parent-note>p.big{padding:24px 20px;font-size:20px}
 .pricing{padding-block:48px}
 .terms{padding:30px 16px 18px;margin-inline:-8px}
 .terms h2{font-size:30px}
 .terms .sum{margin-bottom:28px}
 .trow{grid-template-columns:1fr;padding:28px 12px;gap:16px}
 .trow dt{font-size:20px}
 .trow.key,.trow.decision-row.key{padding:28px 12px;margin-inline:0}
 .trow.decision-row:not(.key){padding:28px 12px 32px}
 .trow dd small.details{margin-top:22px}
 .trow:nth-child(7){padding-top:32px}
 .trow:nth-child(n+8) dt{font-size:19px}
 .trow dd small .reading-group+.reading-group{margin-top:22px}
}
@media(max-width:359px){
 .cls .big{padding-inline:16px}
 .cls .spec:not(.days){padding-left:12px}
 .pc .spec>li{padding-inline:12px}
 .pc .spec>li:nth-child(2){padding-left:9px!important;padding-right:12px!important}
 .parent-note>p.big{padding-inline:16px}
 .terms{padding-inline:12px}
 .trow,.trow.key,.trow.decision-row.key,.trow.decision-row:not(.key){padding-left:10px;padding-right:10px}
 .trow dd .price-value,.trow .yen{font-size:23px}
}