.color-match-container{height:100vh}.color-match-container.is--show-design-studio{height:initial}@media only screen and (max-width: 1000px){.color-match-container{height:calc(200px + 100vw)}}@media only screen and (max-width: 590px){.color-match-container{height:calc(100vh - 120px + 20vw)}}.btn-start.t4s-btn-color-primary{background-color:#de7641!important;opacity:.5;cursor:wait!important}.btn-start.t4s-btn-color-primary:before{content:none}.btn-start.t4s-btn-color-primary.loaded{opacity:1;cursor:pointer!important}.color-match-container{position:relative;overflow:hidden;min-height:calc(100vh - 120px)}.color-match__design-studio{display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;min-height:inherit;opacity:0;pointer-events:none;transition:opacity 2s}.color-match-container.is--show-design-studio .color-match__design-studio{opacity:1;pointer-events:initial}.color-match__design-studio-inner{font-family:Basis Grotesque Pro,sans-serif;position:relative;transition:opacity 1s;width:100%;padding-bottom:16px;flex:1;display:flex;flex-direction:column;justify-content:center;margin-top:60px}.color-match__dropdown--series{font-family:Basis Grotesque Pro,sans-serif;font-size:clamp(14px,calc(10px + .52083vw),20px);font-weight:500}.color-match__dropdown{position:absolute;top:0;transform:translate(-50%);z-index:20;margin-top:20px}.color-match__dropdown-button{padding:10px 24px;line-height:1;cursor:pointer;display:flex;align-items:center;gap:6px}.color-match__dropdown__overlay{visibility:hidden;opacity:0;pointer-events:none;position:absolute;left:0;top:0;right:0;bottom:0;background-color:#00000080;z-index:98;cursor:pointer;transition:all .3s}.color-match__dropdown__wrapper{visibility:hidden;opacity:0;pointer-events:none;position:absolute;background:#fff;border-radius:12px;padding:24px;left:50%;top:64px;transform:translate(-50%);min-width:320px;z-index:99;transition:all .3s}.color-match__dropdown--series.active .color-match__dropdown__overlay,.color-match__dropdown--series.active .color-match__dropdown__wrapper{visibility:visible;opacity:1;pointer-events:auto}.color-match__dropdown__content{padding:0;margin:0;text-align:center;cursor:default;line-height:1.3}.color-match__dropdown__content li{cursor:pointer;transition:all .2s;pointer-events:none}.color-match__dropdown__content li:not(:last-child){border-bottom:1px solid #D6D6D6;padding-bottom:12px;margin-bottom:12px}.color-match__dropdown__content li:not(.active){color:#999;font-weight:400;pointer-events:initial}@media only screen and (max-width: 590px){.color-match__dropdown--series{font-size:14px}.color-match__dropdown{left:0;transform:none}.color-match__dropdown svg{width:10px;height:auto}.color-match__dropdown__wrapper{width:100%;padding:24px 14px}.color-match__dropdown__content li{padding:8px 0}.color-match__dropdown__content li:not(:last-child){margin-bottom:8px}}.color-match__design-studio .btn-save{position:absolute;cursor:pointer;padding:0 24px;min-height:42px;right:5%;top:0;margin-top:20px;font-size:18px;background-color:#de7641!important;display:flex;align-items:center;justify-content:center;font-family:Basis Grotesque Pro,sans-serif!important;font-weight:500}.color-match__design-studio .btn-save .t4s-btn-atc_text{padding-bottom:2px}.color-match__design-studio .btn-save-label-mb{display:none!important}.color-match__design-studio .btn-save .t4s-btn-atc_text svg{width:1.2em;margin-left:.2em}.color-match__design-studio .btn-save:before{content:none}.color-match__design-studio .btn-save.is--loading{opacity:.5;pointer-events:none;position:absolute}.color-match__design-studio .btn-save.is--disabled{opacity:.5;pointer-events:none}.color-match__design-studio-inner .color-match__design-studio-scroller{position:relative;-webkit-user-select:none;user-select:none}.color-match__design-studio.is--reloading-swiper .color-match__design-studio-inner{animation:color-match__reloading 1s linear}.color-match__design-studio:not(.is--show-swiper) .swiper-container{opacity:0;visibility:hidden;pointer-events:none}@keyframes color-match__reloading{0%{opacity:1;pointer-events:none}40%{opacity:0;pointer-events:none}60%{opacity:0;pointer-events:none}to{opacity:1;pointer-events:initial}}.color-match__design-studio-inner .swiper-slide{width:auto;transition:opacity .3s}.color-match__design-studio-inner .image-wrapper{--wrapper-width: 312px;width:var(--wrapper-width);margin:0;padding:0;overflow:hidden;white-space:normal;text-align:center;display:block;background:none;border:0;position:relative}.color-match__design-studio-inner .image-wrapper img{--image-width: 64vh;width:var(--image-width);height:auto;min-width:400px;max-width:700px;display:block;margin:-2vh calc(var(--image-width) / 2 * -1 + var(--wrapper-width) / 2)}@media only screen and (min-height: 901px) and (min-width: 1501px){.color-match__design-studio-inner .image-wrapper{--wrapper-width: 350px}}@media only screen and (min-height: 1094px){.color-match__design-studio-inner .image-wrapper img{margin-left:-175px}}@media only screen and (max-width: 1500px) and (max-height: 900px){.color-match__design-studio-inner .image-wrapper{--wrapper-width: clamp(166px, 32vh, 312px)}}@media only screen and (max-width: 1000px){.color-match-container{min-height:calc(100vh - 100px)}}@media only screen and (max-width: 1600px){.color-match__design-studio .btn-save{right:4%}}@media only screen and (max-width: 1400px){.color-match__design-studio .btn-save{font-size:16px;min-height:40px}}@media only screen and (max-width: 1099px){.color-match__design-studio .btn-save{padding:0 20px;min-height:40px;font-size:16px}}@media only screen and (max-width: 768px){.color-match__design-studio .btn-save-label-mb+.btn-save-label-pc{display:none!important}.color-match__design-studio .btn-save-label-mb{display:block!important}}@media only screen and (max-width: 590px){.color-match__design-studio .btn-save{right:20px;font-size:16px;padding:0 20px;min-height:36px}.color-match__design-studio-inner{padding-bottom:24px}.color-match__design-studio-inner .image-wrapper{--wrapper-width: 50vw}.color-match__design-studio-inner .image-wrapper img{--image-width: 100vw;margin-left:-25vw}}@media only screen and (max-width: 400px){.color-match__design-studio-inner .image-wrapper{--wrapper-width: 200px}.color-match__design-studio-inner .image-wrapper img{--image-width: 400px;margin-left:-100px}}.color-match__design-studio-inner .btn-swiper{position:absolute;top:50%;font-size:0;display:inline-block;cursor:pointer;transition:opacity.2s;z-index:5}.color-match-container .btn-swiper.swiper-button-disabled{cursor:default;opacity:0}.color-match-container .btn-swiper svg{width:calc(10px + 2.5vw)}.color-match-container .btn-swiper>svg>*{transition:all.2s}.color-match-container .btn-swiper:not(.swiper-button-disabled):hover>svg>ellipse{fill:#fff}.color-match-container .btn-swiper:not(.swiper-button-disabled):hover>svg>circle,.color-match-container .btn-swiper:not(.swiper-button-disabled):hover>svg>path{stroke:#de7641}.color-match-container .btn-swiper-left{left:2%;transform:translateY(-50%)}.color-match-container .btn-swiper-right{right:2%;transform:translateY(-50%)}.swiper-container[data-group-id="1"]{z-index:11;position:relative}.swiper-container[data-group-id="2"]{z-index:12;position:relative}@media only screen and (max-width: 1000px){.color-match__design-studio-inner .btn-swiper{display:none}}.color-match__design-preview{pointer-events:none}.color-match__design-preview .image-wrapper{position:absolute;left:50%;top:0%;transform:translate(-50%);transition:opacity .5s}.color-match__preview-images{opacity:1}.color-match__design-studio.is--show-side-view .color-match__preview-images .image-wrapper,.color-match__design-studio.is--show-side-view .swiper-slide-active{opacity:0}.color-match__preview-images .image-wrapper[data-group-id="1"]{z-index:11}.color-match__preview-images .image-wrapper[data-group-id="2"]{transform:translate(-50%);z-index:12}.color-match__preview-side{pointer-events:none}.color-match__preview-side .image-wrapper{opacity:0;z-index:13}.color-match__design-studio.is--show-side-view .color-match__preview-side .image-wrapper{opacity:1}.color-match__info-wrapper{text-align:center;position:relative;z-index:20}.btn-side-view{cursor:pointer;display:inline-block;margin-bottom:clamp(8px,calc(10px + .52083vw),20px);font-size:16px;line-height:1.2;--link-color: #DE7641}.color-match__info-wrapper__Size{color:#b5b5b5;font-size:18px;font-weight:700;line-height:1.2;margin-bottom:8px}.color-match__info-wrapper__product-title{color:#000;font-size:18px;font-weight:700;line-height:1.2;margin-bottom:8px}.color-match__info-wrapper__product-title>span{display:inline-block}.color-match__info-wrapper__product-title>span.title-with{display:inline}.color-match__info-wrapper__product-price{color:#000;font-size:18px;font-weight:400;line-height:1.2}@media only screen and (max-width: 1920px){.btn-side-view{font-size:calc(8px + .41667vw)}.color-match__info-wrapper__Size,.color-match__info-wrapper__product-title,.color-match__info-wrapper__product-price{font-size:calc(9px + .46875vw)}}@media only screen and (max-width: 1000px){.btn-side-view{font-size:14px}.color-match__info-wrapper__Size,.color-match__info-wrapper__product-title,.color-match__info-wrapper__product-price{font-size:16px}.color-match__info-wrapper{min-height:100px}}@media only screen and (max-width: 590px){.btn-side-view{font-size:12px;margin-bottom:12px}.color-match__info-wrapper__Size,.color-match__info-wrapper__product-title,.color-match__info-wrapper__product-price{font-size:14px}.color-match__info-wrapper__product-title{padding-left:5%;padding-right:5%}}.categories-bar{display:block;text-align:center;white-space:nowrap;font-family:Basis Grotesque Pro,sans-serif;width:100%;margin-bottom:20px;overflow-x:auto;padding:0 12px 20px}.category-item{display:inline-block;--category-item-height: 43px;--category-item-border-width: 4px;height:var(--category-item-height)}.category-item__seq{width:calc(var(--category-item-height) - var(--category-item-border-width) * 2);height:calc(var(--category-item-height) - var(--category-item-border-width) * 2);background-color:#fff;border-radius:50px;color:#d6d6d6;font-size:clamp(15px,calc(9px + .46875vw),18px);font-weight:700;position:relative;display:flex;align-items:center;justify-content:center;margin-right:calc(var(--category-item-border-width)* 2)}.category-item__icon{width:24px;height:24px;display:flex;align-items:center}.category-item__icon img{display:block;margin:auto;height:100%;height:inherit}.category-item.category-item--second .category-item__icon{margin-right:6px}.category-item.category-item--first{background:#e5e5e5;color:#000;border-color:transparent;white-space:nowrap;border:1px solid transparent;border-style:solid;border-width:1px;min-width:28px;font-size:17px;line-height:1.47059;font-weight:400;letter-spacing:-.022em;padding:var(--category-item-border-width);padding-right:16px;border-radius:30px;margin:0 6px;display:inline-flex;align-items:center;cursor:pointer;overflow:hidden}.category-item--first.is--expanded>.category-item__title{font-weight:700;display:none}.category-item--first.is--expanded>.category-item__icon{font-weight:700;display:none}.category-item--first.is--first-expanded-animate>.category-item__title{font-weight:400;padding-right:6px}.category-item--first:not(.is--expanded).is--first-expanded-animate>.category-list--second{max-width:initial;overflow:hidden;transition:max-width .5s}.category-item--first.is--first-expanded-animate{pointer-events:none}.category-item--first.is--first-expanded-animate>.category-list--second>.category-item--second:first-child .category-item__icon{display:none}.category-item--first.is--first-expanded-animate>.category-list--second>.category-item--second:first-child .category-item__title{margin-left:0}.category-item--first>.category-list--second{max-width:0;transition:all 0s;pointer-events:none;align-items:center;display:flex}.category-item--first.is--expanded>.category-list--second{pointer-events:initial;transition:all .8s}.category-item--first:not(.is--expanded):not(.is--first-expanded-animate)>.category-list--second{max-width:0!important;overflow:hidden}.category-list--second{display:inline-block;padding:0;margin:0;transition:all .5s}.category-item.category-item--second{display:inline-flex;align-items:center;position:relative;padding:4px 16px}.category-item.category-item--first:first-child .category-item--second:first-child .category-item__icon,.category-item.category-item--first:nth-child(2) .category-item--second:first-child .category-item__icon{margin-right:12px}.category-item.category-item--second:first-child{padding-left:0}.category-item.category-item--second:last-child{padding-right:6px}.category-item.category-item--second:not(:last-child):after{content:"";position:absolute;top:50%;right:-1px;height:1em;transform:translateY(-50%);border-right:1px solid #BBB}.category-item.category-item--second.is--selected .category-item__title{font-weight:700}.category-item.category-item--second.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.category-item__title{font-size:clamp(14px,calc(10px + .52083vw),20px);line-height:1.47059;font-weight:400;letter-spacing:-.022em;border-radius:30px;margin:0 6px;display:inline-block;cursor:pointer;transition:all .5s}.category-item--second .category-item__title{margin-left:0;margin-right:0}@media only screen and (max-width: 1400px){.category-item{--category-item-height: 40px}.category-item__seq{margin-right:var(--category-item-border-width)}.category-item__title{font-size:16px}.category-item.category-item--first:first-child .category-item--second:first-child .category-item__icon,.category-item.category-item--first:nth-child(2) .category-item--second:first-child .category-item__icon{margin-right:8px}}@media only screen and (max-width: 1000px){.category-item{--category-item-height: 38px}.category-item__seq{margin-right:var(--category-item-border-width)}.category-item__title{font-size:16px}}@media only screen and (max-width: 590px){.category-item{--category-item-height: 35px}.categories-bar{margin-bottom:2vh;padding-bottom:calc(20px + 2vh)}.category-item__seq{font-size:14px}.category-item__title{font-size:15px}.category-item.category-item--first{padding-right:12px}}.color-match-container.is--show-design-studio .color-match__preparation-content{opacity:0;pointer-events:none}.color-match__preparation-content{text-align:center;position:absolute;top:0;left:0;width:100%;height:100vh;display:flex;flex-direction:column;align-items:center;opacity:1;transition:opacity 1s}.color-match__preparation-content h1{margin-top:2%;font-family:Basis Grotesque Pro,sans-serif;font-weight:500;font-size:48px}.color-match__preparation-content .btn-start{--padding-btn: 8px 24px;padding:10px 24px;cursor:pointer;margin-top:2vw;border-radius:50px;color:#fff}.main-product-image img{display:block;margin:-5% auto;width:calc(100vh - 120px - 10vw)}@media only screen and (max-width: 1920px){.color-match__preparation-content h1{font-size:calc(8px + 2vw);line-height:1.3}}@media only screen and (max-width: 1000px){.color-match__preparation-content h1{margin-top:20px;font-size:calc(8px + 3vw)}.color-match__preparation-content .btn-start{margin-top:20px}.category-item__icon{height:20px}}@media only screen and (max-width: 590px){.color-match__preparation-content h1{max-width:70vw;font-size:8vw;line-height:1.2}.main-product-image img{width:calc(100vh - 120px - 50vw);max-width:initial;min-width:400px;object-fit:scale-down}.category-item.category-item--second{padding:4px 12px}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/section-color-match.css.map */