sa-case-box4{--container-width: 85%;--container-max-width: 1440px;--container-gap: 6.5rem;--text-gap: 2.5rem;--title-size: clamp(46px, 4.2vw, 60px);--description-size: clamp(16px, 1.25vw, 18px);--videos-gap: 2.5rem;--video-border-radius: 1rem;--video-height: 40rem;--video-btn-position: 1.5rem;--video-btn-size: 2.8rem;--overlap: 4rem;--preview-width: 20%;--active-width: calc(100% - var(--preview-width) + var(--overlap));display:block;width:100%;padding-top:clamp(60px,calc(60px + (80 - 60) * (100vw - 375px) / (1920 - 375)),80px);padding-bottom:clamp(90px,calc(90px + (160 - 90) * (100vw - 375px) / (1920 - 375)),160px);overflow:hidden}sa-case-box4 .sa-case-box4__title,sa-case-box4 .sa-case-box4__description,sa-case-box4 .sa-case-box4__swiper{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s ease}sa-case-box4.is-visible .sa-case-box4__title,sa-case-box4.is-visible .sa-case-box4__description,sa-case-box4.is-visible .sa-case-box4__swiper{opacity:1;transform:translateY(0)}sa-case-box4.is-visible .sa-case-box4__description{transition-delay:.2s}sa-case-box4.is-visible .sa-case-box4__swiper{transition-delay:.4s}.sa-case-box4__container{width:var(--container-width);max-width:var(--container-max-width);margin:0 auto;display:flex;flex-direction:column;gap:var(--container-gap)}.sa-case-box4__text{display:flex;flex-direction:column;gap:var(--text-gap);align-items:center;text-align:center}.sa-case-box4__title{line-height:1.2;font-weight:400;margin:0;color:#000}.sa-case-box4__description{max-width:950px;color:#45464b;margin:0 auto}.sa-case-box4__description *,.sa-case-box4__title *{margin:0}.sa-case-box4__swiper{overflow:hidden;margin:0 auto;border-radius:var(--video-border-radius);position:relative;height:var(--video-height);touch-action:pan-y}.sa-case-box4__swiper .swiper-wrapper{width:100%;height:100%;display:flex;transform:none!important}.sa-case-box4__swiper .swiper-slide{position:relative;height:100%;width:var(--preview-width)!important;flex:0 0 var(--preview-width)!important;min-width:0;margin-left:calc(var(--overlap) * -1);transition-property:width,flex-basis!important;transition-duration:.6s!important;transition-timing-function:cubic-bezier(.25,1,.5,1)!important;will-change:width,flex-basis;cursor:pointer;border-radius:var(--video-border-radius);overflow:hidden;box-sizing:border-box;z-index:1;border:2px solid rgba(255,255,255,.5)}.sa-case-box4__swiper .swiper-slide:first-child{margin-left:0}.sa-case-box4__swiper .swiper-slide-active{box-shadow:0 0 30px #00000040}.sa-case-box4__swiper .swiper-slide:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#0009;opacity:1;transition:opacity .6s cubic-bezier(.25,1,.5,1);pointer-events:none;z-index:3}.sa-case-box4__swiper .swiper-slide-active:after{opacity:0}.sa-case-box4__swiper .swiper-slide-active{width:var(--active-width)!important;flex:0 0 var(--active-width)!important;z-index:2}.sa-case-box4__video-wrapper{position:relative;width:100%;height:100%;margin:0 auto;border-radius:var(--video-border-radius);overflow:hidden}.sa-case-box4__video{width:100%;height:100%;object-fit:cover;display:block}.sa-case-box4__ctrl{display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;position:absolute;right:var(--video-btn-position);bottom:var(--video-btn-position);width:var(--video-btn-size);height:var(--video-btn-size);border-radius:50%;padding:0;border:none;background:none}.sa-case-box4__ctrl-ring{--progress: 0deg;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:conic-gradient(#FFF var(--progress),#a3a4a3 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px));mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px))}.sa-case-box4__ctrl-icon{display:block;width:auto;height:28%;object-fit:contain;margin-left:1px}.sa-case-box4__swiper .swiper-slide:not(.swiper-slide-active) .sa-case-box4__ctrl{display:none}@media (max-width: 1580px){sa-case-box4{padding-top:59.6px;padding-bottom:89px;--text-gap: 26.4px;--container-gap: 46px;--video-height: 542.52px;--video-border-radius: 8px;--video-btn-position: 13px;--video-btn-size: 29px}}@media (max-width: 768px){sa-case-box4{--container-width: 90%;--container-gap: 3.33rem;--text-gap: 1.11rem;--title-size: 1.7rem;--description-size: 1.05rem;--videos-gap: 1.25rem;--video-border-radius: .5rem;--video-height: 15rem;--video-btn-position: 1rem;--video-btn-size: 2rem;--overlap: 2rem;--preview-width: 15%;--active-width: calc(100% - var(--preview-width) + var(--overlap));padding:6rem 0 3rem}.sa-case-box4__swiper .swiper-slide-next{transform:none}.sa-case-box4__ctrl-icon{margin-left:0}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/sa-case-box4.css.map */