/* v17: ??????????????? */
.hero{background:#FFF1E6;overflow:hidden;padding-bottom:44px}
.hero::before{content:'';position:absolute;inset:0;z-index:-1;background:url('assets/geometry-hero-pc.webp') center/100% 100% no-repeat;mask-image:linear-gradient(90deg,transparent 47%,#000 56%),linear-gradient(#000 55%,transparent 94%);mask-composite:intersect;pointer-events:none}
.hero .cond{background:transparent;box-shadow:none}
.hero-grid>div:last-child{padding:28px 0 0}
.hero .illustration{border-radius:0;border:0}
.hero .cap{background:transparent;border:0;padding:0;margin:18px 0 0;color:#655046}
.hero-grid>div:first-child::before{content:none}
/* ??????????????????????????????? */
.supervision-section .picture-mat{padding:18px!important;background:#FFF1E6!important;border-radius:28px 28px 0 0;overflow:hidden}
.supervision-section .picture-mat::before,.supervision-section .picture-mat::after{content:none!important}
.supervision-section .card:nth-child(2) .picture-mat{border-radius:0 64px 0 0}
.supervision-section .picture-mat>.illustration{border:0!important;border-radius:0;background:transparent;height:260px;object-fit:contain;mix-blend-mode:multiply!important}
.supervision-section .card .body{padding-top:24px}
.supervision-section .card .cap{margin-top:14px}
.break-sec .figure{padding:28px 24px;background:#FFF1E6;border:0;border-radius:0}
.break-sec .figure::before,.break-sec .figure::after{content:none}
.break-sec .figure .illustration{border:0;border-radius:0;mix-blend-mode:multiply!important}
.break-sec .figure .cap{padding:0;margin:18px 0 0;text-align:left}
/* ?????????????????????????? */
.shelf::before{content:none}
.shelf .toys{isolation:isolate;max-width:none;margin:0 0 30px;padding:20px 0 0;background:transparent;border:0;overflow:hidden}
.shelf .toys::before{content:'';position:absolute;z-index:-1;inset:0 0 46px;background:#FFF1E6;border-radius:0 80px 0 0}
.shelf .art-toys{width:100%;border:0;mix-blend-mode:multiply!important;aspect-ratio:3.1;object-fit:cover;object-position:center 62%}
.shelf .toys .cap{margin:14px 0 0;padding:0;background:#FFFAF6}
/* ?????????????????????????????? */
.course .c .n,.course .c.self .n{font-size:21px;line-height:1.6;padding:0;margin:0}
.course .c .p,.course .c.self .p{font-size:28px;line-height:1.5;padding:0;margin:0;border:0}
.course .c.self .n{color:#655B55}
.course .c p:not(.p){line-height:1.9}
@media(min-width:860px){
 .course .c,.course .c.self{display:grid;grid-template-rows:34px 66px 90px auto auto auto;align-content:start;padding:28px 18px}
 .course .c .n{align-self:start}
 .course .c .p{align-self:start;padding-top:10px}
 .course .c p:nth-of-type(2){align-self:stretch;padding-top:14px!important}
 .course .c p:nth-of-type(n+3){align-self:start}
}
/* ?? ? ???? ? ??????????????16px???? */
.trow .term-lead,.trow:first-child .term-lead{font:700 23px/1.65 var(--round);margin-bottom:24px;padding:0;border:0}
.trow.minimum-term .term-lead{font:900 28px/1.5 var(--round)}
.trow.cancel-term .term-lead>.copy-block:first-child{font:700 23px/1.65 var(--round)}
.trow.cancel-term .term-lead>.copy-block+.copy-block{font:400 16px/2 var(--sans);margin-top:16px}
.trow .term-part .d{font:700 18px/1.8 var(--round);color:#65412C;margin:0 0 12px;padding:0;border:0;background:none}
.trow .term-part,.trow .term-part+.term-part{margin-top:36px;padding-top:0;border:0}
.trow .term-part:first-child{margin-top:0}
.trow .detail-intro+.term-part{margin-top:32px}
.trow dd small,.trow .detail-intro{font:400 16px/2 var(--sans);color:var(--ink)}
.trow .para-break{height:16px}
.trow .copy-block+.copy-block{margin-top:16px}
.trow.key{margin-inline:-16px;padding-inline:16px}
/* ??????????????????????????????? */
.shelf .reading-copy{line-break:strict;word-break:normal;text-wrap:wrap}
.shelf .reading-copy .flow-inline{display:inline;white-space:normal;text-wrap:wrap}
.shelf>.course~.pl>.copy-block+.copy-block{margin-top:16px}
/* ?????????????????????????? */
.timeline{padding-bottom:100px!important}
.timeline .timeline-art{filter:saturate(.72);mask-image:linear-gradient(#000 67%,rgba(0,0,0,.72) 82%,transparent 98%);margin-bottom:-6%;width:100%;height:auto}
.timeline .time-band{margin-top:46px;height:14px;border:1px solid #B39782;border-radius:2px;background:#E5C4A7}
.timeline .play-days{background:#E5C4A7}
.timeline .plan-days{background:#BDD5DF;border-left:1px solid #8BAAB8}
.timeline .time-band::before{width:2px;height:22px;top:-5px;left:0;background:#8B634B;transform:translateX(-50%)}
.timeline .plan-days::before,.timeline .plan-days::after{width:2px;height:22px;top:-5px;background:#547B8D}
.timeline .plan-days::before{left:0}.timeline .plan-days::after{left:100%}
.timeline .floor-labels{height:100px;bottom:0;font:700 16px var(--round)!important}
.timeline .floor-labels>g:first-child{stroke:#8B634B;stroke-width:1}
.timeline .floor-labels>g:last-child{stroke-width:1}
@media(max-width:859px){
 .hero{background:#FFF1E6;padding-bottom:30px}
 .hero::before{inset:auto 0 0;height:48%;background-image:url('assets/geometry-hero-mobile.webp');background-position:center bottom;background-size:100% 100%;mask-image:linear-gradient(transparent,#000 25%,#000 65%,transparent 98%);mask-composite:add}
 .hero-grid>div:first-child::before{content:none}
 .hero-grid>div:last-child{padding:18px 0 0}
 .hero .cond{background:transparent;box-shadow:none}
 .hero .cap{background:transparent;margin-top:16px;padding:0}
 .supervision-section .picture-mat{padding:16px!important}
 .supervision-section .picture-mat>.illustration{height:auto;max-height:none}
 .supervision-section .card .body{padding-top:22px}
 .break-sec .figure{padding:22px 18px}
 .shelf .toys{padding-top:10px}
 .shelf .toys::before{border-radius:0 48px 0 0;bottom:68px}
 .shelf .art-toys{aspect-ratio:2.75}
 .course .c,.course .c.self{display:block}
 .course .c .n,.course .c.self .n{font-size:21px;margin-bottom:12px}
 .course .c .p,.course .c.self .p{margin-bottom:8px}
 .trow .term-lead,.trow:first-child .term-lead,.trow.cancel-term .term-lead>.copy-block:first-child{font-size:22px}
 .trow.minimum-term .term-lead{font-size:27px}
 .trow .term-part .d{font-size:18px}
 .trow dt{margin-bottom:8px}
 .trow.key{margin-inline:-8px;padding-inline:8px}
 .timeline .time-band{margin-top:44px}
}

/* 同じ列の共通項目だけを同じ基準線に配置。 */
@media(min-width:860px){
 .course .c:not(.self),.course .c.self{display:grid;grid-template-rows:34px 66px 76px auto auto auto;align-content:start;border-top:2px solid #D3AF94;padding:28px 18px}
 .course .c.self{border-top-color:#B7ADA4}
 .course .c .p,.course .c.self .p{padding-top:10px}
 .course .c p:nth-of-type(2),.course .c.self p:nth-of-type(2){padding-top:14px!important}
}
/* 画像の淡い背景色を二重に掛けず、周囲と同じ紙色で受ける。 */
.supervision-section .picture-mat{background:#FFF3EA!important}
.supervision-section .picture-mat>.illustration{mix-blend-mode:darken!important}
.break-sec .figure{background:#FFF3EA}
.break-sec .figure .illustration{mix-blend-mode:darken!important}
.shelf .toys{padding-top:0}
.shelf .toys::before{content:none}
.shelf .art-toys{mix-blend-mode:normal!important}
/* 背景の帯は滑らかに地色へ収め、読み面との矩形境界を残さない。 */
.hero::before{mask-image:linear-gradient(90deg,transparent 46%,#000 62%),linear-gradient(#000 46%,transparent 86%);mask-composite:intersect}
.timeline .time-band{margin-top:54px}
@media(max-width:859px){
 .hero::before{mask-image:linear-gradient(transparent,#000 28%,#000 57%,transparent 83%);mask-composite:add}
 .timeline .time-band{margin-top:54px}
}

:root{--sans:"Hiragino Sans","Yu Gothic UI","Meiryo",sans-serif}
.timeline .time-band{height:18px;border-color:#B39782;box-shadow:inset 0 2px 0 #FFFFFF60}
.timeline .play-days{background:linear-gradient(#EDD1B8,#E1BE9F)}
.timeline .plan-days{background:linear-gradient(#C9DEE6,#B5CFDB)}
.timeline .time-band::before,.timeline .plan-days::before,.timeline .plan-days::after{height:26px}

/* 図の透明な余白にも文字を入れず、絵とラベルの領域を分ける。 */
.timeline .timeline-art{margin-bottom:0}

/* 共通SVGの幅上限を外し、目盛りとラベルを時間帯の実幅に一致させる。 */
.timeline .floor-labels{max-width:none;margin:0}
