.banner-carousel{display:block}.banner-carousel__stage{position:relative}.banner-carousel__viewport{position:relative;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}.banner-carousel__viewport::-webkit-scrollbar{display:none}.banner-carousel__track{display:flex;align-items:flex-start;gap:var(--banner-carousel-gap);margin:0;padding:0}.banner-carousel__slide{flex:0 0 auto;scroll-snap-align:center;width:var(--banner-carousel-sp-width);aspect-ratio:var(--ratio-sp);overflow:hidden;background-color:rgba(var(--color-foreground),.04)}@media screen and (min-width:750px){.banner-carousel__slide{width:auto;height:var(--banner-carousel-pc-height);aspect-ratio:var(--ratio-pc)}}.banner-carousel__link,.banner-carousel__picture{display:block;width:100%;height:100%}.banner-carousel__image{display:block;width:100%;height:100%;object-fit:cover}.banner-carousel__arrow{display:none}@media screen and (min-width:750px){.banner-carousel__arrow{position:absolute;top:50%;z-index:1;display:grid;place-items:center;width:4.4rem;height:4.4rem;padding:0;border:.1rem solid rgba(var(--color-foreground),.15);border-radius:0;background-color:#ffffffeb;cursor:pointer;transform:translateY(-50%)}.banner-carousel__arrow:hover{background-color:#fff}.banner-carousel__arrow span{width:1rem;height:1rem;border-top:.2rem solid rgb(var(--color-foreground));border-right:.2rem solid rgb(var(--color-foreground))}.banner-carousel__arrow--prev{left:max(1.6rem,calc(50% - var(--banner-carousel-pc-height) * .95 - 2.2rem))}.banner-carousel__arrow--next{right:max(1.6rem,calc(50% - var(--banner-carousel-pc-height) * .95 - 2.2rem))}.banner-carousel__arrow--prev span{margin-left:.4rem;transform:rotate(-135deg)}.banner-carousel__arrow--next span{margin-right:.4rem;transform:rotate(45deg)}}.banner-carousel__dots{display:flex;justify-content:center;gap:.8rem;margin-top:1.2rem}.banner-carousel__dot{width:2.4rem;height:.3rem;padding:0;border:0;background-color:rgba(var(--color-foreground),.2);cursor:pointer}.banner-carousel__dot[aria-current]{background-color:rgb(var(--color-foreground))}.banner-carousel__dot{position:relative}.banner-carousel__dot:after{content:"";position:absolute;top:-1rem;right:-.4rem;bottom:-1rem;left:-.4rem}
/*# sourceMappingURL=/cdn/shop/t/3/assets/section-banner-carousel.css.map */
