@charset "utf-8";

.m-sw-230210m {position:relative; line-height:0; font-size:0;}

.m-sw-230210m .skin-header {width: calc(100% - 40px); display: flex; padding: 0 20px 0 20px; margin-bottom: 14px; overflow: hidden;}
.m-sw-230210m .skin-header.type-a {width: 320px;}
.m-sw-230210m .skin-header .title {width: calc(100% - 50px); max-height: 400px;  display: block; position: relative;}
.m-sw-230210m .skin-header .title.ty-1 {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.4; font-weight: 700;}
.m-sw-230210m .skin-header .btn-popup {width: 53px; display: flex; justify-content: center; align-items: center; margin-left: 10px;}
.m-sw-230210m .skin-header .btn-popup span {font-weight: 600; font-size: 13px; line-height: 16px; letter-spacing: 0.01em; color: #CCCCCC; margin-right: 5px;}
.m-sw-230210m .skin-header img {max-width: 100%; max-height: 100%;}

.m-sw-230210m .skin-body {display: flex; justify-content: center;}

.m-sw-230210m ul {width: 100%;}
.m-sw-230210m li {position: relative; width: 130px; height: unset; background-color: #FFFFFF;}
.m-sw-230210m .skin-body.type-a li {width: calc(100% - 40px);}
.m-sw-230210m .skin-body.type-b li {width: calc((100% - 50px) / 2);}
.m-sw-230210m .skin-body.type-b li:nth-child(2) {margin-left: 10px;}

.m-sw-230210m li a {position: absolute; width: 100%; height: 100%; z-index: 3;}

.m-sw-230210m .image-div {position: relative;}
.m-sw-230210m .image-div .thumb {position: relative; width: 130px; display: flex; align-items: center; justify-content: center; background-color: #dddddd;}
.m-sw-230210m .image-div .thumb img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
.m-sw-230210m .skin-body.type-a .image-div .thumb {width: 100%;}
.m-sw-230210m .skin-body.type-b .image-div .thumb {width: 100%;}

.m-sw-230210m .image .adult {position: absolute; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; z-index: 2;}
.m-sw-230210m .image .adult:before {content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #FFFFFF; z-index: 1; opacity: 0.8;}
.m-sw-230210m .image .adult svg {z-index: 3;}

.m-sw-230210m .image .soldout {position: absolute; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; z-index: 2;}
.m-sw-230210m .image .soldout:before {content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #000000; z-index: 1; opacity: 0.7;}
.m-sw-230210m .image .soldout p {font-weight: 700; font-size: 20px; line-height: 18px; color: #FFFFFF; z-index: 2;}

.m-sw-230210m .content-div {padding-top: 12px;}

.m-sw-230210m .content-div .brand-title p {font-weight: 400; font-size: 13px; line-height: 16px; color: #000000;}
.m-sw-230210m .content-div .brand-title p {overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
.m-sw-230210m .content-div .brand {font-weight: 700; margin-right: 5px;}

.m-sw-230210m .content-div .original_price {position: relative; font-weight: 500; font-size: 11px; line-height: 13px; color: #999999; margin-top: 9px;}
.m-sw-230210m .content-div .original_price span {position: relative;}
.m-sw-230210m .content-div .original_price span:before {display: block; content: ''; position: absolute; left: 0; top: 50%; width: 100%; height: 0; border-top: 1px solid #999999;}
.m-sw-230210m .content-div .original_price .currency-text {font-size: 10px; margin-left: 1px;}

.m-sw-230210m .content-div .discount {display: flex; margin-top: 3px;}
.m-sw-230210m .content-div .discount .percent p {font-weight: 700; font-size: 13px; line-height: 16px; color: #FF0000; margin-right: 3px;}
.m-sw-230210m .content-div .discount .price p {font-weight: 700; font-size: 13px; line-height: 16px; color: #000000;}
.m-sw-230210m .content-div .discount .price .currency-text {font-size: 13px; margin-left: 1px;}

.m-sw-230210m .content-div .level-price {margin-top: 5px;}
.m-sw-230210m .content-div .level-price p {font-weight: 500; font-size: 12px; line-height: 15px; color: #000000;}

.m-sw-230210m .content-div .icon {width: fit-content; padding: 3px 5px; background: #F5F5F5; border-radius: 2px; margin-top: 13px;}
.m-sw-230210m .content-div .icon p {font-weight: 400; font-size: 11px; line-height: 13px; letter-spacing: 0.01em; color: rgba(0, 0, 0, 0.8);}

.m-sw-230210m .content-div .quick-menu {display: flex; margin-top: 13px;}
.m-sw-230210m .content-div .quick-menu .btn-wishlist {width: 24px; height: 24px; display: flex; justify-content: center; align-items: center; z-index: 4;}
.m-sw-230210m .content-div .quick-menu .btn-wishlist svg:nth-child(2) {display: none;}
.m-sw-230210m .content-div .quick-menu .btn-wishlist.active svg:nth-child(1) {display: none;}
.m-sw-230210m .content-div .quick-menu .btn-wishlist.active svg:nth-child(2) {display: block;}
.m-sw-230210m .content-div .quick-menu .btn-cart {width: 24px; height: 24px; display: flex; justify-content: center; align-items: center; margin-left: 20px; z-index: 4;}

.m-sw-230210m.side-layer {width: 100%; height: 100%; position: fixed; top: 0; display: flex; flex-direction: column; align-items: center; background-color: #FFFFFF; z-index: 1001;}
.m-sw-230210m.side-layer {transform: translate3d(100%,0,0); transition: transform .3s; animation-timing-function: linear;}
.m-sw-230210m.side-layer__show {transform: translate3d(0,0,0);}

.m-sw-230210m.side-layer .side-layer__header {width: 100%; padding: 15px 0; display: flex; justify-content: space-between; border-bottom: 0.5px solid rgba(0, 0, 0, 0.4);}
.m-sw-230210m.side-layer .side-layer__title {width: calc(100% - 62px); display: flex; align-items: center; margin-left: 20px;}
.m-sw-230210m.side-layer .side-layer__title p {font-weight: 600; font-size: 13px; line-height: 16px; letter-spacing: 0.01em; color: #000000; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.m-sw-230210m.side-layer .side-layer__close {width: 32px; height: 32px; display: flex; justify-content: center; align-items: center; margin-right: 20px;}

.m-sw-230210m.side-layer .side-layer__body {width: calc(100% - 40px); max-height: calc(100% - 63px); padding: 20px 20px 30px 20px; overflow: auto;}
.m-sw-230210m.side-layer .side-layer__body .item-wrap {position: relative; display: flex; margin-top: 20px;}

.m-sw-230210m.side-layer .side-layer__body .item-wrap  a {position: absolute; width: 100%; height: 100%; z-index: 3;}
.m-sw-230210m.side-layer .side-layer__body .item-wrap .thumb {width: 70px; height: 70px;}
.m-sw-230210m.side-layer .side-layer__body .item-wrap .soldout p {font-weight: 700; font-size: 12px; line-height: 16px;}
.m-sw-230210m.side-layer .side-layer__body .item-wrap .content-div {margin-left: 10px; padding: unset;}
.m-sw-230210m.side-layer .side-layer__body .item-wrap .content-div .brand-title p {overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}

.m-sw-230210m.side-layer .side-layer__body .item-wrap .content-div .price-div {display: flex; margin-top: 5px; align-items: center;}
.m-sw-230210m.side-layer .side-layer__body .item-wrap .content-div .price-div .percent {font-weight: 700; font-size: 12px; line-height: 15px; color: #FF0000; margin-right: 5px;}
.m-sw-230210m.side-layer .side-layer__body .item-wrap .content-div .price-div .price {font-weight: 500; font-size: 12px; line-height: 15px; color: #000000;}
.m-sw-230210m.side-layer .side-layer__body .item-wrap .content-div .price-div .original_price {margin-top: 0; margin-left: 5px;}
.m-sw-230210m.side-layer .side-layer__body .item-wrap .content-div .quick-menu {margin-top: 5px;}