/* Scoped recreation of the Toyama BPO two-row gallery. */
.daily-gallery{--gallery-card:320px;--gallery-gap:16px;position:relative;isolation:isolate;background:#f1ebde;color:#444;margin-top:73px;padding:106px 0 64px;font-family:'Zen Kaku Gothic Antique','Noto Sans JP',sans-serif;letter-spacing:0;line-height:1.6;scroll-margin-top:84px}
.daily-gallery:before,.daily-gallery:after{content:"";position:absolute;left:0;width:100%;background-repeat:no-repeat;background-size:100% 100%;pointer-events:none}
.daily-gallery:before{background-image:url('assets/gallery/gallery_bg_before_sp.svg');height:140px;top:-25px;z-index:-1}
.daily-gallery:after{background-image:url('assets/gallery/gallery_bg_after_sp.svg');height:96px;top:-10px;z-index:-2}
.daily-gallery__heading{padding-inline:20px;text-align:center}
.daily-gallery__heading>p{margin:0;font-size:14px;font-weight:700;line-height:1.6}
.daily-gallery__heading h2{position:relative;background:#4191bc;color:#fff;border-radius:40px;font-family:inherit;font-size:18px;font-weight:700;letter-spacing:0;line-height:1.6;max-width:308px;margin:8px auto 0;padding:8px 24px;text-align:center}
.daily-gallery__heading h2:after{content:"";position:absolute;bottom:-15px;left:76px;width:16px;aspect-ratio:1;background:url('assets/gallery/balloon_polygon_blue.svg') center/contain no-repeat}
.daily-gallery.is-enhanced .daily-gallery__heading h2{opacity:0;transform:scale(.9)}
.daily-gallery.is-enhanced .daily-gallery__heading.is-revealed h2{animation:gallery-heading-pop .3s .1s both}
@keyframes gallery-heading-pop{0%{opacity:0;transform:scale(.9)}33.33%{opacity:1;transform:scale(1.2)}66.67%{opacity:1;transform:scale(.9)}100%{opacity:1;transform:scale(1)}}
.daily-gallery__sliders{margin-top:40px;position:relative;overflow:hidden}
.daily-gallery__row{overflow-x:auto;scrollbar-width:none}
.daily-gallery.is-enhanced .daily-gallery__row{overflow:hidden}
.daily-gallery__row+.daily-gallery__row{margin-top:max(16px,1.1111111111vw)}
.daily-gallery__track{display:flex;gap:var(--gallery-gap);list-style:none;margin:0;padding:0;width:max-content;will-change:transform}
.daily-gallery__card{position:relative;flex:0 0 var(--gallery-card);width:var(--gallery-card);margin:0;padding:0}
.daily-gallery__card>img{display:block;width:100%;height:auto;aspect-ratio:440/297;object-fit:cover;border-radius:8px 8px 1px}
.daily-gallery__bubble{position:absolute;right:6px;bottom:6px;max-width:calc(100% - 12px);margin:0;padding:4px 8px;border-radius:5.415px 5.415px 1px;background:#fff;color:#444;font-size:10px;font-weight:700;line-height:1.6;text-align:center;text-transform:uppercase;pointer-events:none}
.daily-gallery.is-enhanced .daily-gallery__bubble{opacity:0;transform:translateY(20px) scale(.9);transition:opacity .4s ease,transform .6s cubic-bezier(.34,1.56,.64,1)}
.daily-gallery.is-enhanced .is-bubble-visible .daily-gallery__bubble{opacity:1;transform:translateY(0) scale(1)}
.daily-gallery__control{position:absolute;z-index:2;left:16px;bottom:16px;width:32px;aspect-ratio:1;padding:10px;display:flex;align-items:center;justify-content:center;border:1px solid #1e2654;border-radius:4px 4px 1px;background:#fff;cursor:pointer;transition:opacity .3s ease}
.daily-gallery__control:hover{opacity:.7}
.daily-gallery__control:focus-visible{outline:3px solid #4191bc;outline-offset:4px}
.daily-gallery__control img{display:block;width:12px;height:12px;max-width:none}
.daily-gallery__control[hidden],.daily-gallery__control img[hidden]{display:none}
.daily-gallery__note{margin:22px 20px 0;font-size:10px;line-height:1.6;color:#7b756d;text-align:center}
.gallery-in-view .floating-offer{opacity:0;visibility:hidden;pointer-events:none}
@media(min-width:768px){
 .daily-gallery{--gallery-card:max(440px,30.5555555556vw);margin-top:max(280px,19.4444444444vw);padding:max(120px,8.3333333333vw) 0 max(245px,17.0138888889vw)}
 .daily-gallery:before,.daily-gallery:after{height:max(240px,16.6666666667vw);top:min(-120px,-8.3333333333vw)}
 .daily-gallery:after{background-image:url('assets/gallery/gallery_bg_after_pc.svg')}
 .daily-gallery__heading>p{font-size:max(20px,1.3888888889vw)}
 .daily-gallery__heading h2{border-radius:max(42px,2.9166666667vw);font-size:max(28px,1.9444444444vw);margin-top:max(12px,.8333333333vw);max-width:max(704px,48.8888888889vw);padding:max(12px,.8333333333vw) max(44px,3.0555555556vw)}
 .daily-gallery__heading h2:after{bottom:min(-19px,-1.3194444444vw);left:max(98px,6.8055555556vw);width:max(20px,1.3888888889vw)}
 .daily-gallery__mobile-break{display:none}
 .daily-gallery__sliders{margin-top:max(60px,4.1666666667vw)}
 .daily-gallery__card>img{border-radius:max(12px,.8333333333vw) max(12px,.8333333333vw) 1px 12px}
 .daily-gallery__bubble{border-radius:max(12px,.8333333333vw) max(12px,.8333333333vw) 1px;bottom:max(12px,.8333333333vw);right:max(12px,.8333333333vw);font-size:max(16px,1.1111111111vw);padding:max(8px,.5555555556vw) max(20px,1.3888888889vw);max-width:calc(100% - 24px)}
 .daily-gallery__control{border-radius:max(4px,.2777777778vw) max(4px,.2777777778vw) max(1px,.0694444444vw);bottom:max(32px,2.2222222222vw);left:max(32px,2.2222222222vw);width:max(40px,2.7777777778vw)}
 .daily-gallery__control img{height:max(16px,1.1111111111vw);width:max(16px,1.1111111111vw)}
}
@media(prefers-reduced-motion:reduce){.daily-gallery.is-enhanced .daily-gallery__heading h2{opacity:1;transform:none;animation:none}.daily-gallery.is-enhanced .daily-gallery__bubble{transition:none}}

/* Dense three-row gallery; keep the complete artwork and overlay its bubble. */
.daily-gallery--courses{--gallery-card:200px;--gallery-gap:12px}
.daily-gallery--courses .daily-gallery__sliders{padding-bottom:48px}
.daily-gallery--courses .daily-gallery__row{padding-block:8px}
.daily-gallery--courses .daily-gallery__row+.daily-gallery__row{margin-top:0}
.daily-gallery--courses .daily-gallery__card{padding:0}
.daily-gallery--courses .daily-gallery__card>img{aspect-ratio:16/9;object-fit:contain;background:#fff}
.daily-gallery--courses .daily-gallery__bubble{z-index:1;right:8px;bottom:8px;max-width:calc(100% - 16px);font-size:10px;line-height:1.45;padding:5px 8px;border-radius:8px 8px 1px;box-shadow:0 3px 14px #302b231f;text-transform:none;transform-origin:85% 100%}
.daily-gallery--courses .daily-gallery__control{bottom:0}
.daily-gallery__member-thumb{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;padding:9% 8%;border-radius:8px 8px 1px;background:var(--tbg);color:var(--tink);font-family:Roboto,'Noto Sans JP',sans-serif;letter-spacing:0;container-type:inline-size}
.daily-gallery__member-thumb:before{content:"";position:absolute;right:-12%;top:-18%;width:52%;aspect-ratio:1;border-radius:50%;background:var(--tacc);opacity:.22}
.daily-gallery__member-thumb:after{content:"";position:absolute;right:10%;bottom:12%;width:16%;aspect-ratio:1;border-radius:30%;background:var(--tacc);opacity:.35;transform:rotate(18deg)}
.member-thumb__category{position:absolute;top:8%;left:8%;font-size:clamp(9px,3.4cqi,15px);background:#fff;color:var(--tink);padding:.2em .7em;border-radius:999px;font-weight:700;z-index:1}
.member-thumb__title{font-size:9.5cqi;font-weight:800;line-height:1.25;letter-spacing:.02em;z-index:1;text-wrap:balance}
.member-thumb__title mark{background:linear-gradient(transparent 62%,color-mix(in srgb,var(--tacc) 55%,transparent) 62%);color:inherit;padding:0 .05em}
.member-thumb__subtitle{font-size:4.6cqi;font-weight:700;line-height:1.6;color:var(--tink);opacity:.8;margin-top:2.5cqi;z-index:1}
@media(min-width:768px){
 .daily-gallery--courses{--gallery-card:clamp(240px,19vw,300px);--gallery-gap:14px}
 .daily-gallery--courses .daily-gallery__bubble{font-size:12px;padding:6px 10px}
 .daily-gallery__member-thumb{border-radius:12px 12px 1px 12px}
}
@media(hover:hover) and (pointer:fine){
 .daily-gallery--courses .daily-gallery__card:hover{z-index:2}
 .daily-gallery--courses .daily-gallery__card:hover>.daily-gallery__bubble{opacity:1;animation:gallery-course-bubble-pop .5s both}
 .daily-gallery--courses .daily-gallery__card:hover>img,
 .daily-gallery--courses .daily-gallery__card:hover>.daily-gallery__member-thumb{animation:gallery-course-thumb-pop .5s both}
}
@keyframes gallery-course-bubble-pop{0%{transform:translateY(5px) scale(.88)}45%{transform:translateY(-4px) scale(1.07)}72%{transform:translateY(1px) scale(.98)}100%{transform:translateY(0) scale(1)}}
@keyframes gallery-course-thumb-pop{0%{transform:scale(1)}45%{transform:translateY(-3px) scale(1.025)}72%{transform:translateY(1px) scale(.995)}100%{transform:translateY(-1px) scale(1.01)}}
@media(prefers-reduced-motion:reduce){
 .daily-gallery--courses .daily-gallery__card:hover>img,
 .daily-gallery--courses .daily-gallery__card:hover>.daily-gallery__member-thumb,
 .daily-gallery--courses .daily-gallery__card:hover>.daily-gallery__bubble{animation:none;transform:none}
}

/* Blue wave backdrop with a rising cyan ribbon, inspired by the TOYOX entry area.
   Keep the existing course cards, three rows, hover bubbles and slider control. */
.daily-gallery--courses{background:transparent;color:#fff;margin-top:56px;padding:128px 0 96px;overflow:hidden}
.daily-gallery--courses::before,.daily-gallery--courses::after{content:none}
.daily-gallery__wave-background{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.daily-gallery__wave-surface{position:absolute;inset:0;width:100%;height:100%;fill:#006fbf}
.daily-gallery__wave-ribbon{position:absolute;left:-5%;top:30%;width:110%;height:clamp(160px,19vw,280px)}
.daily-gallery__wave-ribbon svg{display:block;width:100%;height:100%;overflow:visible;fill:none;stroke:#aeecff;stroke-width:30;stroke-linejoin:round}
.daily-gallery--courses.is-enhanced .daily-gallery__wave-ribbon{clip-path:inset(-50% 100% -50% 0);transform:translateY(64px);opacity:0}
.daily-gallery--courses.is-wave-visible .daily-gallery__wave-ribbon{animation:gallery-wave-rise 1.8s .1s cubic-bezier(.22,.61,.36,1) both}
.daily-gallery--courses .daily-gallery__heading{position:relative;z-index:1}
.daily-gallery--courses .daily-gallery__heading>p{color:#fff}
.daily-gallery--courses .daily-gallery__heading h2{background:#fff;color:#006fbf}
.daily-gallery--courses .daily-gallery__heading h2::after{background:#fff;clip-path:polygon(0 0,100% 0,100% 100%)}
.daily-gallery--courses .daily-gallery__note{color:#fff;position:relative}
.daily-gallery--courses .daily-gallery__control:focus-visible{outline-color:#fff}
@keyframes gallery-wave-rise{from{clip-path:inset(-50% 100% -50% 0);transform:translateY(64px);opacity:0}25%{opacity:1}to{clip-path:inset(-50% -5% -50% 0);transform:translateY(0);opacity:1}}
@media(min-width:768px){
 .daily-gallery--courses{margin-top:72px;padding:clamp(172px,14vw,235px) 0 clamp(125px,11vw,180px)}
}
@media(max-width:767px){
 .daily-gallery__wave-surface{width:160%;max-width:none;left:-30%}
 .daily-gallery__wave-ribbon{left:-46%;top:31%;width:192%;height:190px}
 .daily-gallery__wave-ribbon svg{stroke-width:22}
}
@media(prefers-reduced-motion:reduce){
 .daily-gallery--courses.is-enhanced .daily-gallery__wave-ribbon,
 .daily-gallery--courses.is-wave-visible .daily-gallery__wave-ribbon{animation:none;clip-path:none;transform:none;opacity:1}
}
