.form__label--family{margin-bottom:1.2rem}@media screen and (max-width: 749px){.form__label.form__label--family{text-align:center}}.product-family{display:flex;gap:8px;padding-bottom:8px}.product-family__thumbnail{width:calc((100% / 6) - 8px * 5 / 6);outline:1px solid #e4e4e4;border-radius:2px;overflow:hidden}.product-family__thumbnail[data-current=true]{outline:1.5px solid #404040}:has(.product-family__color) .product-family__thumbnail[data-current=true]{outline-offset:1px}:has(.product-family__color) :is(.product-family__thumbnail,.product-family__expand){width:calc(10% - 7.2px);border-radius:32px;aspect-ratio:1 / 1}.product-family__expand>span{display:block;text-align:center;position:relative;top:50%;transform:translateY(-50%);font-size:12px}.product-family__thumbnail img{width:100%;height:auto;vertical-align:middle}.product-family__color{width:100%;aspect-ratio:1/1;display:block!important}.product-family__item--sold-out{position:absolute;bottom:0;top:0;left:0;right:0;display:flex;align-items:center;justify-content:center}.product-family__item--sold-out>svg{width:100%;height:auto}:not(:has(.product-family__color)) .product-family__thumbnail:has(.product-family__item--sold-out){opacity:.7}:not(:has(.product-family__color)) .product-family__item--sold-out{background-color:#000;opacity:.4}:not(:has(.product-family__color)) .product-family__item--sold-out>svg{display:none}@media screen and (max-width: 749px){.product-family{overflow-x:scroll;padding:1px;scrollbar-width:none}.product-family__thumbnail{width:calc((100% / 4.5) - 8px * 3 / 4);flex-shrink:0;scrollbar-width:none}:has(.product-family__color) .product-family{padding:4px 1px}:has(.product-family__color) .product-family__thumbnail{width:calc((100% / 9.5) - 8px * 9 / 10);border-radius:32px;aspect-ratio:1 / 1}.product-family__expand{display:none}}@media screen and (min-width: 750px){.product-family{flex-wrap:wrap}.product-family:has(:nth-child(14)):has([data-expand=true]){overflow-y:scroll;padding:1px 1px 16px}:has(.product-family__color) .product-family:has(:nth-child(14)):has([data-expand=true]){padding-block:4px}.product-family__expand[data-expand=true]{display:none}.product-family__thumbnail.product-family__expand[data-expand=false]~div{display:none}}.skeleton,.skeleton:after{animation:skeleton-loading 1s linear infinite alternate}@keyframes skeleton-loading{0%{background-color:#c2cfd6}to{background-color:#f0f3f5}}
/*# sourceMappingURL=/cdn/shop/t/24/assets/component-product-family.css.map */