@charset "UTF-8";.image-comparison-banner{--change-ratio: 0}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner{position:relative;display:block}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner .before-item{height:100%;position:relative;padding:2rem;background:rgb(var(--color-background))}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner .before-item .media{position:absolute;left:0;top:0;width:100%;height:100%;z-index:-1;background:rgba(var(--color-foreground),.6)}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner .before-item .media .placeholder-svg{fill:rgb(var(--color-background))}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner .after-item{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;align-items:flex-end;justify-content:flex-end;padding:2rem}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner .after-item .media{position:absolute;left:0;top:0;width:100%;height:100%;z-index:-1}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner .button{position:absolute;transform:translate(-50%,-50%);z-index:2;cursor:col-resize}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner .button .icon{width:.75rem}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner:before{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(var(--color-foreground),.05)}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner:after{content:"";position:absolute;background:rgb(var(--color-background));pointer-events:none}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner.image-height--small{height:25rem}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner.image-height--medium{height:35rem}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner.image-height--large{height:45rem}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner.button--is-dragging .before-heading,.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner.button--is-dragging .after-heading{animation:fadeOut .3s cubic-bezier(0,0,.3,1) forwards}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner[data-vertical] .before-item{clip-path:polygon(0 0,100% 0,100% var(--change-ratio),0% var(--change-ratio))}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner[data-vertical] .button{width:3rem;left:50%;top:var(--change-ratio);cursor:row-resize}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner[data-vertical]:after{top:var(--change-ratio);transform:translateY(-50%);left:0;height:3px;width:100%}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner[data-vertical].enable-transition .button,.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner[data-vertical].enable-transition:after{transition:top .5s cubic-bezier(0,0,.3,1)}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner:not([data-vertical]) .before-item{clip-path:polygon(0 0,var(--change-ratio) 0,var(--change-ratio) 100%,0 100%)}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner:not([data-vertical]) .button{height:3rem;left:var(--change-ratio);top:50%}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner:not([data-vertical]):after{top:0;left:var(--change-ratio);transform:translate(-50%);height:100%;width:3px}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner:not([data-vertical]).enable-transition .button,.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner:not([data-vertical]).enable-transition:after{transition:left .5s cubic-bezier(0,0,.3,1)}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner.enable-transition .before-item{transition:clip-path .5s cubic-bezier(0,0,.3,1)}@media screen and (max-width: 749px){.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner.image-height--small{height:15rem}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner.image-height--medium{height:20rem}.image-comparison-banner .image-comparison-banner__wrapper .image-comparison-banner-inner.image-height--large{height:30rem}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/section-image-comparison-banner.css.map */