/* v15: 全幅の生成背景と、節の情報モードに合わせた大きな面。装飾は全て絵より背面。 */
.hero{position:relative;background:#FFF1E6 url('assets/geometry-hero-pc.webp') center/100% 100% no-repeat;isolation:isolate}
.hero .wrap{position:relative}
.hero-grid>div:last-child{background:transparent;padding:38px 0 48px}
.hero .illustration{border:0;border-radius:48% 48% 42% 42% / 32% 32% 26% 26%}
.hero .cap{background:#FFF1E6;padding:5px 10px;margin-top:22px;width:fit-content;max-width:100%}
.hero .cond{background:transparent}
/* 比較: 二つの開いた半円。文章の背面は白のまま。 */
.comparison-section .ba-card{position:relative;isolation:isolate}
.comparison-section .picture-mat{position:relative;padding:26px 22px 18px!important}
.comparison-section .picture-mat::before{content:''!important;position:absolute;inset:0;border-radius:50% 50% 0 0;background:#F2E7DD;z-index:-1}
.comparison-section .after .picture-mat::before{background:#DCECF2;border-radius:0 50% 50% 0}
.comparison-section .picture-mat>.illustration{position:relative;border:0}
/* 届くもの: 全幅の橙の棚面と右端の水色の円。 */
.shelf{position:relative;isolation:isolate;overflow:hidden;border-top:0;padding-top:42px}
.shelf::before{content:'';position:absolute;z-index:-1;top:0;right:-90px;width:340px;height:340px;border-radius:50%;background:#DCECF2;border:28px solid #F2D4BB;pointer-events:none}
.shelf .section-head{background:transparent}
.shelf .toys{position:relative;background:#F6DEC9;border-radius:0 0 42% 0;padding:20px 12px 18px}
.shelf .art-toys{mix-blend-mode:multiply!important}
/* 監修: 絵の外側で円弧を閉じ、本文へは伸ばさない。 */
.supervision-section .picture-mat{position:relative;isolation:isolate;padding:20px!important}
.supervision-section .picture-mat::before{content:''!important;position:absolute;z-index:-1;inset:0;border:12px solid #F0D4BF;border-radius:50% 50% 0 0}
.supervision-section .card:nth-child(2) .picture-mat::before{border-color:#D4E7EE;border-radius:0 50% 50% 0}
/* FAQ: 左列を狭めず、右列を広げて縦の間延びを抑え、左の大きな面で絵を受ける。 */
.break-sec .figure{position:relative;isolation:isolate;border:0;background:transparent;padding:38px 20px}
.break-sec .figure::before{content:'';position:absolute;z-index:-1;inset:0;background:#F6DEC9;border-radius:48% 48% 0 0;border-bottom:20px solid #B4D3E0}
.break-sec .figure .illustration{border-radius:45% 45% 0 0;mix-blend-mode:multiply!important}
@media(min-width:860px){
 .break-sec>.shape{grid-template-columns:minmax(0,.78fr) minmax(0,1.45fr);gap:48px;align-items:center}
 .break-sec .shape>.figure{align-self:center}
 .faq-section .section-head h2{font-size:34px}
}
/* 交換: 3つの場面を水平の帯でつなぐ。縦のカード枠は作らない。 */
.flow-section .section-head{border:0;padding-top:32px}
.flow-section .scenes{position:relative;isolation:isolate;padding-top:24px}
.flow-section .scenes::before{content:'';position:absolute;z-index:-1;top:0;left:0;right:0;height:190px;background:#DCECF2;border-radius:100px 0 0 0;border-top:12px solid #F2D4BB}
.flow-section .scene .picture-mat{padding:12px!important}
/* 条件の入口: 左に橙の帯、右に半円。条件本文へは入り込まない。 */
.terms .section-head{background:#F9E7D8;border-left:10px solid #B4D3E0;padding:26px 28px;margin-inline:-16px;overflow:hidden;isolation:isolate}
.terms .section-head::before{content:'';position:absolute;z-index:-1;width:240px;height:240px;border-radius:50%;border:28px solid #E7BB96;right:-75px;top:-90px}
.terms .section-head h2{background:transparent}
/* 最後のCTA: 中央を空け、左右の半円で行動を受ける。 */
.terms-section>.wrap>.final{position:relative;isolation:isolate;padding:52px 30px;background:#FFF1E6;overflow:hidden;border-bottom:10px solid #E3B693}
.terms-section>.wrap>.final::before,.terms-section>.wrap>.final::after{content:'';position:absolute;z-index:-1;width:260px;height:260px;border-radius:50%;pointer-events:none}
.terms-section>.wrap>.final::before{left:-130px;top:-70px;border:24px solid #E3B693}
.terms-section>.wrap>.final::after{right:-135px;bottom:-90px;background:#B4D3E0}
@media(max-width:859px){
 .hero{background-image:url('assets/geometry-hero-mobile.webp');background-size:100% 100%}
 .hero-grid>div:last-child{padding:24px 8px 30px}
 .hero .cap{margin-inline:0}
 .comparison-section .picture-mat{padding:22px 16px 16px!important}
 .shelf::before{width:210px;height:210px;right:-100px;border-width:18px}
 .shelf .toys{padding:14px 6px}
 .supervision-section .picture-mat{padding:16px!important}
 .supervision-section .picture-mat::before{border-width:9px}
 .break-sec .figure{padding:24px 16px}
 .flow-section .scenes{padding-top:0}
 .flow-section .scenes::before{content:none}
 .flow-section .scene .picture-mat{position:relative;isolation:isolate;padding:12px 4px!important}
 .flow-section .scene .picture-mat::before{content:''!important;position:absolute;z-index:-1;inset:0;background:#DCECF2;border-radius:60px 0 0 0}
 .flow-section .scene:nth-child(2) .picture-mat::before{background:#F6DEC9;border-radius:0 0 60px 0}
 .flow-section .scene:nth-child(3) .picture-mat::before{background:#DCECF2;border-radius:50% 50% 0 0}
 .terms .section-head{padding:22px 14px;margin-inline:0;border-left-width:6px}
 .terms .section-head::before{width:160px;height:160px;right:-110px;top:-70px;border-width:20px}
 .terms-section>.wrap>.final{padding:42px 12px}
 .terms-section>.wrap>.final::before{width:140px;height:140px;left:-100px;top:-60px;border-width:16px}
 .terms-section>.wrap>.final::after{width:140px;height:140px;right:-105px;bottom:-40px}
}
/* FAQ の二列は導入だけ。詳細が終わるまで左列を空け続けない。 */
@media(min-width:860px){
 .break-sec>.shape{grid-template-columns:minmax(0,.9fr) minmax(0,1.35fr);gap:0 48px;align-items:start}
 .break-sec .shape>div:not(.figure){display:contents}
 .break-sec .shape>.figure{grid-column:1;grid-row:1/4;align-self:center;margin:0}
 .break-sec .shape>div:not(.figure)>*{grid-column:1/-1}
 .break-sec .shape>div:not(.figure)>.section-head{grid-column:2;grid-row:1}
 .break-sec .shape>div:not(.figure)>.big{grid-column:2;grid-row:2}
 .break-sec .shape>div:not(.figure)>.big+.pl{grid-column:2;grid-row:3;margin-bottom:26px}
 .break-sec .shape>div:not(.figure)>.kv{display:grid;grid-template-columns:1fr 1fr;margin-top:32px}
 .break-sec .shape .kv>div{display:block;padding:22px}
 .break-sec .shape .kv>div+div{border-top:0;border-left:1px solid #D8BBA5}
 .break-sec .shape .kv dt{margin-bottom:8px}
}
@media(max-width:859px){.hero{background-size:100% calc(100% - 280px);background-position:center bottom}.hero .cond{position:relative;z-index:1;background:#FFF1E6}}
.supervision-section .picture-mat::before{background:#FFF1E6}