@charset "utf-8";

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

.m-sw-230208m .skin-header {
    max-height: 360px;
    margin: 0 auto;
    padding: 0 30px 0 30px;
    margin-bottom: 20px;
    overflow: hidden;
}

.m-sw-230208m .skin-header .title {
    display: block;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.4;
    font-weight: bold;
}

.m-sw-230208m .skin-header img {width: 100%;}

.m-sw-230208m ul {width: 100%;}
.m-sw-230208m li {position: relative; width: calc((100% - 38px) * 0.46); height: unset; background-color: #FFFFFF;}
.m-sw-230208m li.only-one {width: calc(100% - 60px);}

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

.m-sw-230208m .image-div .image {overflow: hidden;}
.m-sw-230208m .image-div .thumb {position: relative; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;}
.m-sw-230208m .image-div .no-img {background-color: #dddddd;}
.m-sw-230208m .image-div .thumb:after {display: block; content: ""; padding-bottom: 100%;}
.m-sw-230208m .image-div .thumb img {width: 100%; height: 100%; object-fit: cover; object-position: center;}

.m-sw-230208m .image .adult {position: absolute; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; z-index: 2;}
.m-sw-230208m .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-230208m .image .adult svg {z-index: 3;}

.m-sw-230208m .image .soldout {position: absolute; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; z-index: 2;}
.m-sw-230208m .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-230208m .image .soldout p {font-weight: 700; font-size: 20px; line-height: 18px; color: #FFFFFF; z-index: 2;}

.m-sw-230208m .content-div {padding: 10px 16px 20px 16px; }

@media screen and (min-width: 700px) {
    .m-sw-230208m .content-div {padding: 10px 20px 20px 20px;}
}

.m-sw-230208m .content-div .brand {width: 100%;}
.m-sw-230208m .content-div .brand p {font-weight: 700; font-size: 12px; line-height: 18px; color: #000000; margin-bottom: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.m-sw-230208m .content-div .title {width: 100%;}
.m-sw-230208m .content-div .title p {font-weight: 400; font-size: 14px; line-height: 16px; color: #666666; margin-top: 6px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}

.m-sw-230208m .content-div .original_price {position: relative; font-weight: 400; font-size: 12px; line-height: 16px; color: #666666; margin-top: 10px;}
.m-sw-230208m .content-div .original_price span {position: relative;}
.m-sw-230208m .content-div .original_price span:before {display: block; content: ''; position: absolute; left: 0; top: 50%; width: 100%; height: 0; border-top: 1px solid #666666;}

.m-sw-230208m .content-div .discount {display: flex; justify-content: space-between; margin-top: 6px;}
.m-sw-230208m .content-div .discount .percent p {font-weight: 700; font-size: 16px; line-height: 16px; color: #FF0000;}
.m-sw-230208m .content-div .discount .price p {font-weight: 700; font-size: 16px; line-height: 16px; color: #000000;}
.m-sw-230208m .content-div .discount .price .currency-text {font-size: 15px; margin-left: 1px;}

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