@charset "UTF-8"; body { padding-bottom:constant(safe-area-inset-bottom); padding-bottom:env(safe-area-inset-bottom); } img.lazyload:not([src]) { visibility:hidden; } @media (max-width:767.98px) { .container-gap { padding-top:1.25rem; padding-bottom:1.25rem; } } @media (min-width:768px) { .container-gap { padding-top:3.5rem; padding-bottom:3.5rem; } } @media (max-width:767.98px) { .container-page-gap { padding-top:3.75rem; padding-bottom:3.75rem; } } @media (min-width:768px) { .container-page-gap { padding-top:3.5rem; padding-bottom:3.5rem; } } @media (max-width:767.98px) { .container-empty-gap { padding-top:3.75rem; padding-bottom:3.75rem; } } @media (min-width:768px) { .container-empty-gap { padding-top:6.25rem; padding-bottom:12.5rem; } } @media (max-width:767.98px) { .mb-padding { padding-left:15px; padding-right:15px; } } .common__img-wrapper_lazy { position:relative; display:block; width:100%; } .common__img-wrapper_lazy img { max-width:100%; height:100%; max-height:100%; position:absolute; margin:auto; top:0; right:0; bottom:0; left:0; } .common__img-wrapper_lazy img.lazyloaded { height:auto; } .common__img-wrapper_lazy img.img-full-width { width:100%; height:unset; max-height:unset; margin:unset; } .lazyload,
.lazyloading { background-color:#f1f1f1; } .lazyloaded { background-color:transparent; } .common__mask_title { position:relative; } .common__mask_title img { transition:all 0.5s; } .common__mask_title::before { content:''; position:absolute; background:rgba(0, 0, 0, 0.1); z-index:1; bottom:0; right:0; left:0; top:0; } .common__mask_title::after { content:attr(title); position:absolute; z-index:1; top:50%; transform:translateY(-50%); text-align:center; color:#fff; font-size:1.5rem; padding:0 1.875rem; word-break:break-word; line-height:1.2; } @media (max-width:1024px) { .common__mask_title::after { font-size:1.25rem; padding:0 0.9375rem; } } @media (max-width:767.98px) { .common__mask_title::after { font-size:1.125rem; padding:0 0.9375rem; } } @media (max-width:376px) { .common__mask_title::after { font-size:1rem; } } @media (max-width:321px) { .common__mask_title::after { font-size:0.875rem; } } .common__mask_title:hover img { transform:translate(-50%, -50%) scale(1.1) !important; } .common__mask_title:hover::before { background:rgba(0, 0, 0, 0.3); } .product-snippet { position:relative; } .product-snippet__soldout { position:absolute; width:100%; background:#999; font-size:12px; color:#fff; text-align:center; padding:2px 0; left:0; bottom:0; } .product-snippet__img-wrapper { display:block; overflow:hidden; position:relative; } .product-snippet__img-wrapper .product-snippet__mask { display:flex; position:absolute; z-index:2; opacity:0; top:0; width:100%; height:100%; flex-direction:column; align-items:center; justify-content:flex-end; } .product-snippet__img-wrapper .product-snippet__mask .product-snippet__btn { margin-bottom:1.875rem; width:70%; height:2.25rem; font-size:0.8125rem; white-space:nowrap; } .product-snippet__img-wrapper:hover .product-snippet__mask { opacity:1; transition:all 0.3s linear; } .product-snippet__img-wrapper:hover img,
.product-snippet__img-wrapper:hover video { opacity:0; } .product-snippet__img-wrapper:hover img:first-child,
.product-snippet__img-wrapper:hover video:first-child { opacity:1 !important; } .product-snippet__title-normal { font-size:0.8125rem; text-align:center; text-decoration:none; margin-top:0.75rem; } @media (min-width:768px) { .product-snippet__title-normal { margin-top:0.9375rem; } } .product-snippet__title-plus { font-size:0.8125rem; text-align:center; text-decoration:none; margin:0.9375rem 0 0.25rem; } @media (min-width:768px) { .product-snippet__title-plus { margin:1.25rem 0 0.25rem; } } .product-snippet__price-wrapper { margin-top:0.8125rem; font-size:0.9375rem; } @media (min-width:768px) { .product-snippet__price-wrapper { margin-top:0.625rem; } } .product-snippet__price-wrapper span,
.product-snippet__price-wrapper del { display:inline-block; max-width:100%; padding:0 0.3125rem; vertical-align:middle; line-height:1; } .two_line_text_truncate { overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; } .three_line_text_truncate { overflow:hidden; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; } .sep-loading { position:fixed; top:0; left:0; z-index:1060; display:flex; align-items:center; justify-content:center; width:100%; height:100%; background:rgba(255, 255, 255, 0.8); } .sep-loading__content, .sep-loading__content::after { width:3em; height:3em; border-radius:50%; } .sep-loading__content { position:relative; font-size:10px; border-top:0.16em solid #f0f0f0; border-right:0.16em solid #f0f0f0; border-bottom:0.16em solid #f0f0f0; border-left:0.16em solid #c4c4c4; transform:translateZ(0); animation:load 1.1s infinite linear; } @keyframes load { 0% { transform:rotate(0deg); } 100% { transform:rotate(360deg); } } .sep-toast { position:fixed; z-index:1060; background:#fff; color:#000; font-size:1rem; width:30rem; min-height:56px; line-height:1.5; padding:0.9375rem; border-radius:4px; box-shadow:0 2px 6px 0 rgba(0, 0, 0, 0.2); text-align:center; top:50%; left:50%; transform:scale(0.5); } @media (max-width:767.98px) { .sep-toast { width:16.375rem; min-height:2.5625rem; font-size:0.875rem; padding:0.625rem 0.75rem; box-shadow:0 2px 6px 2px rgba(0, 0, 0, 0.15); } } .sep-toast.error { color:#b60400; } .sep-toast.show { transform:scale(1); } .sep-toast.isShowing { transition:transform 0.3s ease-out; } .sep-toast.isLeave { transform:scale(0.5); opacity:0; transition:all 0.3s ease-out; } @media (max-width:767.98px) { .common__product-gap { margin-bottom:2.03125rem; padding:0 0.46875rem; } } @media (min-width:768px) { .common__product-gap { padding:0 0.75rem; margin-bottom:2.5rem; } } @media (max-width:767.98px) { .common__product-row { margin:0 -0.46875rem; } } @media (min-width:768px) { .common__product-row { margin:0 -1.6875rem; } } .common-card-title { text-align:center; font-weight:500; } @media (max-width:767.98px) { .common-card-title { font-size:1.375rem; margin-bottom:1.25rem; } } @media (min-width:768px) { .common-card-title { font-size:2.125rem; margin-bottom:2.5rem; } } .common__mask { position:relative; overflow:hidden; } .common__mask:hover::after { content:' '; position:absolute; top:0; left:0; bottom:0; right:0; background:#fff; opacity:0.3; } .common__img-desc { position:relative; } .common__img-desc::before { content:attr(data-title); position:absolute; z-index:1; bottom:0.9375rem; right:0.9375rem; color:#999; font-size:1rem; } .common__select { position:relative; display:inline-block; } .common__select select { -webkit-appearance:none; font-size:0.875rem; padding-right:1.5625rem !important; color:inherit; cursor:pointer; width:10.3125rem; border-color:#d4d4d4; } @media (min-width:768px) { .common__select select { width:11.25rem; } } .common__select::after { content:''; color:#212121; width:0.53125rem; height:0.53125rem; border:2px solid; border-top:none; border-right:none; position:absolute; right:1rem; top:0.8125rem; transform:rotate(-45deg); } .common__load-more-btn { color:#777; font-size:11px; cursor:pointer; } .common__group { height:7.0625rem; } @media (max-width:767.98px) { .common__group { height:6.125rem; } } .common__input { width:28.75rem; height:2.75rem; background:white; border:1px solid #dfdfdf; padding-left:0.9375rem; font-size:0.875rem; line-height:1.0625rem; -webkit-appearance:none; outline:none; border-radius:0; } .common__input:focus { border-radius:0; border:1px solid black; } .common__input:-ms-input-placeholder { font-size:0.875rem; color:#bcbcbc; line-height:1.125rem; } .common__input:-webkit-input-placeholder { font-size:0.875rem; color:#bcbcbc; line-height:1.125rem; } @media (max-width:767.98px) { .common__input { width:100%; height:2.75rem; border:0.0625rem solid #d7dcde; padding-left:0.9375rem; font-size:0.875rem; line-height:1.03125rem; border-radius:0; } .common__input:focus { border-radius:0; border:0.0625rem solid black; } .common__input:-ms-input-placeholder { font-size:0.875rem; color:#777777; line-height:1.03125rem; } .common__input:-webkit-input-placeholder { font-size:0.875rem; color:#777777; line-height:1.03125rem; } } .common__input_error { border:1px solid #e24247 !important; } .common__input_error:focus { border:1px solid #e24247 !important; } .common__label { height:1rem; font-size:0.875rem; color:#777777; line-height:1rem; margin-bottom:0.75rem; display:block; } @media (max-width:767.98px) { .common__label { font-size:0.875rem; line-height:1.03125rem; margin-bottom:0.65625rem; } } @media (min-width:768px) { .col-md-2_4 { flex:0 0 20%; max-width:20%; } } .common__img_hover:hover { opacity:0.7; } @media (min-width:768px) { .hero--large { height:600px; } .hero--medium { height:500px; } .hero--small { height:400px; } .hero .page-width { padding:0 55px; max-width:750px; } .hero .mega-subtitle { margin:24px auto 0; } .hero .mega-title-large { font-size:48px; } .hero .mega-subtitle-large { font-size:18px; } .hero .mega-title-medium { font-size:36px; } .hero .mega-subtitle-medium { font-size:16px; } .hero .mega-title-small { font-size:24px; } .hero .mega-subtitle-small { font-size:14px; } .hero .hero-btn { font-size:14px; padding:10px 30px; display:inline-block; margin-top:50px; } .hero .hero-btn:hover { background:#f5f5f5; font-weight:500; } } @media (max-width:767.98px) { .hero--large { height:28.6875rem; } .hero--medium { height:25rem; } .hero--small { height:18.75rem; } .hero .page-width { padding:0 0.6875rem; max-width:21.5625rem; } .hero .mega-subtitle { margin:0.9375rem auto 0; max-width:21.875rem; } .hero .mega-title-large { font-size:1.875rem; } .hero .mega-subtitle-large { font-size:1.125rem; } .hero .mega-title-medium { font-size:1.5rem; } .hero .mega-subtitle-medium { font-size:1rem; } .hero .mega-title-small { font-size:1.125rem; } .hero .mega-subtitle-small { font-size:0.875rem; } .hero .hero-btn { cursor:pointer; font-size:0.875rem; padding:10px 30px; display:inline-block; margin-top:1.875rem; } .hero .hero-btn:hover { background:#f5f5f5; font-weight:500; } } .hero { position:relative; } @media (min-width:768px) { .hero .col-12 { padding:0; } } .hero .hover-zoom { transition:all 0.5s; } .hero a[href] .hover-zoom:hover { transform:scale(1.1); } .hero.url-cursor { cursor:pointer; } .hero.hover-enlarge { transition:transform 0.3s linear; } .hero.hover-enlarge:hover { transform:scale(1.1); } .hero.hover-enlarge:hover.hero__overlay::before { opacity:0.3; } .hero .hero__inner { position:absolute; top:0; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; z-index:2; } .hero .hero__inner .mega-title,
.hero .hero__inner .mega-subtitle { color:#fff; } @media (max-width:767.98px) { .common__collection-gap { margin-bottom:0.9375rem; padding:0 0.46875rem; } } @media (min-width:768px) { .common__collection-gap { padding:0 0.375rem; margin-bottom:0.75rem; } } @media (max-width:767.98px) { .common__collection-row { margin:0 -0.46875rem; } } @media (min-width:768px) { .common__collection-row { margin:0 -1.3125rem; } } .modal-header { border-bottom:none; } .modal-footer { border-top:none; } .modal__header { width:100%; text-align:center; display:flex; border-bottom:1px solid #ddd; justify-content:center; } .modal__close.close { position:absolute; top:0.9375rem; right:0.9375rem; background:none; z-index:1051; margin:0; padding:0; cursor:pointer; outline:none; font-size:1rem; color:#212121; opacity:1; } .modal__close.close:hover { color:#212121 !important; opacity:0.7 !important; } @media (max-width:767.98px) { .modal__close.close { top:0.3125rem; right:0.3125rem; } } .container { position:relative; } .dj-mce-view img { position:relative; max-width:100%; vertical-align:bottom; height:auto; } .dj-mce-view iframe { width:100%; } .dj-mce-view table { max-width:100%; } .dj-mce-view table td,
.dj-mce-view table th { border:1px solid #ddd; } .dj-mce-view blockquote { margin:1em 40px; } html[dir='rtl'] body { text-align:right; } html[dir='rtl'] .common__input { padding-right:0.9375rem; } html[dir='rtl'] .common__select::after { right:unset; left:1rem !important; } .dj_skin_link { opacity:1; } .dj_skin_link:hover { opacity:0.7; } .placeholder-noblocks { padding:40px; text-align:center; } @media (max-width:767.98px) { .product-info__social-sharing { display:none; } } .product-info__label { position:absolute; top:0; text-align:center; font-size:14px; font-weight:700; line-height:1.2; z-index:1; } .product-info__label-flag { display:flex; flex-direction:column; justify-content:center; align-items:center; right:0; min-height:30px; max-width:120px; padding:2px 5px 2px 14px; -webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%, 10px 50%); clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%, 10px 50%); } @media (max-width:576px) { .product-info__label-flag { max-width:105px; line-height:1.1; font-size:11px; } } .product-info__label-badge { left:10px; min-width:40px; padding:2px 5px 10px; clip-path:polygon(0 0, 100% 0, 100% calc(100% - 10px), 50% 100%, 0 calc(100% - 10px)); -webkit-clip-path:polygon(0 0, 100% 0, 100% calc(100% - 10px), 50% 100%, 0 calc(100% - 10px)); } .product-info__label-badge .product-info__save-label, .product-info__label-badge .product-info__discount-label { display:flex; flex-direction:column; align-items:center; padding-top:2px; } @media (max-width:576px) { .product-info__label-badge { font-size:11px; } } .product-info__label-triangle { display:flex; flex-direction:column; align-items:center; justify-content:center; right:0; max-width:108px; min-height:30px; padding-bottom:5px; transform:translateX(30%) rotate(45deg) translateZ(1px); transform-origin:left top; } .product-info__label-triangle div:first-child[class*=product-info__save-label] { display:flex; flex-direction:column; } @media (max-width:576px) { .product-info__label-triangle { max-width:75px; min-height:20px; font-size:10px; } } .text_toggle { position:relative; padding-right:15px; word-break:break-all; } .text_toggle [for^="text_limit"] { position:absolute; top:0; right:0; transition:all 0.3s; } .text_toggle [for^="text_limit"] i { font-size:12px; } .text_toggle:checked + .three_line_text_truncate { -webkit-line-clamp:unset !important; } .text_toggle:checked + .three_line_text_truncate [for^="text_limit"] { transform:rotateZ(180deg); }