@charset "utf-8";

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

.m-sw-200901m .skin-header {
    margin: 0 auto;
    max-width: var(--main-width);
    padding-bottom: 20px;
}

.m-sw-200901m .skin-header .title {
    display: block;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5;
}

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

.m-sw-200901m .skin-wrap.ty-1 {
    width: 100%;
    max-width: 600px;
    margin: auto;
}

.m-sw-200901m .swiper-group {position:relative; width:calc(100% + 20px); margin-top:-20px;}
.m-sw-200901m .swiper-container {position:relative; margin-left:-20px; padding:0 0 0 20px;}
.m-sw-200901m .swiper-wrapper {position:relative;}
.m-sw-200901m .swiper-slide {display:inline-block; vertical-align:top;}
.m-sw-200901m .swiper-slide li {display:inline-block; vertical-align:top;}

.m-sw-200901m ul.swiper-slide {display:block; position:relative; left:-20px; top:20px; width:calc(100% + 20px);}
.m-sw-200901m .swiper-slide li {position:relative; margin:0 0 20px 20px; display:inline-block; vertical-align:top;}

.m-sw-200901m.w4 .swiper-slide li {width:calc(25% - 20px);}
.m-sw-200901m.w3 .swiper-slide li {width:calc(33.333% - 20px);}
.m-sw-200901m.w2 .swiper-slide li {width:calc(50% - 20px);}
.m-sw-200901m.w1 .swiper-slide li {width:calc(100% - 20px);}

.m-sw-200901m .swiper-slide li img {display:block; width:100%; height:100%; border:0;}

.m-sw-200901m .swiper-slide li .image {position:relative; margin-bottom:10px;}
.m-sw-200901m .swiper-slide li .image > a {z-index:5; display:block; position:absolute; left:0; top:0; width:100%; height:100%; background-color:#ffffff; opacity:0;}

.m-sw-200901m .swiper-slide li .icon {transition:opacity 0.4s; z-index:2; display:block; position:absolute; right:0; top:0; width:84px; height:84px; opacity:0;}
.m-sw-200901m .swiper-slide li .icon img {width:100%; height:100%; border:0;}

.m-sw-200901m .swiper-slide li .block {position:relative; overflow:hidden; display:block; width:100%; height:100%;}
.m-sw-200901m .swiper-slide li .block > img {z-index:1; position:relative; width:100%; height:100%; border:0;}

.m-sw-200901m .swiper-slide li .block {position:relative; overflow:hidden; display:block; width:100%; height:100%;}
.m-sw-200901m .swiper-slide li .block > img {z-index:1; position:relative; width:100%; height:100%; border:0;}

.m-sw-200901m .swiper-slide li .discount {transition:top 0.4s, opacity 0.4s; z-index:2; display:block; position:absolute; left:0; top:-30px; width:45px; height:45px; text-align:center; opacity:0; pointer-events:none;}
.m-sw-200901m .swiper-slide li .discount:before {z-index:-1; display:block; content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:#333333;}

.m-sw-200901m .swiper-slide li .discount > div {margin:0px 0 0 2px;}
.m-sw-200901m .swiper-slide li .discount > div > span {display:inline-block; vertical-align:top;}
.m-sw-200901m .swiper-slide li .discount .num {font-family: var(--family-bold);font-weight: var(--weight-bold); line-height:45px; font-size:16px; color:#ffffff; letter-spacing:-0.5px;}
.m-sw-200901m .swiper-slide li .discount .percent {margin-left:0px; position:relative; top:2px;}
.m-sw-200901m .swiper-slide li .discount .percent {font-family: var(--family-bold);font-weight: var(--weight-bold); line-height:45px; font-size:12px; color:#ffffff;}

.m-sw-200901m .swiper-slide li .adult {position:absolute; left:0; right:0; top:0; bottom:0; display:block; width:100%; height:100%;}
.m-sw-200901m .swiper-slide li .adult:before {z-index:1; display:block; content:''; position:absolute; left:0; top:0; width:100%; height:100%; background-color:#000000; opacity:0.5;}
.m-sw-200901m .swiper-slide li .adult:after {z-index:2; display:block; content:''; position:absolute; width:100%; height:100%; background:url('../img/Adult-only.png') no-repeat; background-size:100%;}

.m-sw-200901m .swiper-slide li .state:before {z-index:1; display:block; content:''; position:absolute; left:0; top:0; width:100%; height:100%; background-color:#000000; opacity:0.5;}
.m-sw-200901m .swiper-slide li .state:after {z-index:2; display:block; content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:url('../img/soldout.png') no-repeat; background-size:100%;}

.m-sw-200901m .swiper-slide li .adult,
.m-sw-200901m .swiper-slide li .thumb,
.m-sw-200901m .swiper-slide li .state {display:block; position:absolute; left:0; right:0; top:0; bottom:0; width:100%; height:100%;}

.m-sw-200901m .swiper-slide li .adult > div,
.m-sw-200901m .swiper-slide li .thumb > div {display:block; position:absolute; left:0; right:0; top:0; bottom:0; width:100%; height:100%;}

.m-sw-200901m .swiper-slide li .adult img,
.m-sw-200901m .swiper-slide li .thumb img,
.m-sw-200901m .swiper-slide li .state img {position:absolute; left:0; right:0; top:0; bottom:0; width:100%; height:100%; border:0; transition: all ease .5s; object-fit: cover; object-position: center;}
.m-sw-200901m .swiper-slide li .thumb img {transition: all ease .5s;}
.m-sw-200901m .swiper-slide li .adult img:nth-child(2),
.m-sw-200901m .swiper-slide li .thumb img:nth-child(2),
.m-sw-200901m .swiper-slide li .state img:nth-child(2) {opacity:0;}

.m-sw-200901m .swiper-slide li .btn {
    transition: bottom 0.4s;
    z-index: 6;
    display: block;
    width: 100%;
    height: 20px;
    padding-top: 10px;
}

.m-sw-200901m .swiper-slide li .btn:before {
    z-index: -1;
    display: block;
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    opacity: 0.9;
}

.m-sw-200901m .swiper-slide li .btn p {
    z-index: 1;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    cursor: pointer;
    margin-right: 10px;
}

.m-sw-200901m .swiper-slide li .btn svg {
    width: 20px;
    height: 20px;
}

.m-sw-200901m .swiper-slide li .btn p span {
    transition: opacity 0.2s;
    display: inline-block;
    width: 65px;
    text-align: center;
    position: absolute;
    top: -30px;
    left: -20px;
    z-index: 10;
    opacity: 0;
    font-family: 'px-f1';
    line-height: 22px;
    font-size: 13px;
    color: #ffffff;
}

.m-sw-200901m .swiper-slide li .btn p span:before {
    z-index: -2;
    display: block;
    width: 65px;
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: #666;
    border-radius: 4px;
}

.m-sw-200901m .swiper-slide li .btn p span:after {
    z-index: -1;
    display: block;
    content: '';
    position: absolute;
    left: calc(50% - 4px);
    top: 22px;
    width: 7px;
    height: 4px;
    background: url('../img/btn.png') no-repeat;
    background-position: 0 0
}

.m-sw-200901m .swiper-slide li .btn p:hover span {
    opacity: 1;
}

.m-sw-200901m .swiper-slide li .btn svg {
    opacity: .3;
}

.m-sw-200901m .swiper-slide li .btn p:hover svg {
    opacity: 1;
}

.m-sw-200901m .swiper-slide li .btn p:hover .svg-cart line,
.m-sw-200901m .swiper-slide li .btn p:hover .svg-wishlist path,
.m-sw-200901m .swiper-slide li .btn p:hover .svg-preview line {
    stroke: var(--color1);
}

.m-sw-200901m .swiper-slide li .image:hover .discount {top:0; opacity:1;}
.m-sw-200901m .swiper-slide li .image:hover .icon {opacity:1;}

.m-sw-200901m .swiper-slide li:hover .image .adult div img,
.m-sw-200901m .swiper-slide li:hover .image .state div img  {-webkit-transform:scale(1.3); -ms-transform:scale(1.3);}

.m-sw-200901m .swiper-slide li:hover .image .thumb.ty-1 div img {-webkit-transform:scale(1.3); -ms-transform:scale(1.3);}
.m-sw-200901m .swiper-slide li:hover .image .thumb.ty-2 div img:nth-child(1) {opacity:0;}
.m-sw-200901m .swiper-slide li:hover .image .thumb.ty-2 div img:nth-child(2) {opacity:1;}

.m-sw-200901m .swiper-slide li .brand {margin:0; border-bottom:1px solid rgba(0,0,0,0.1);}
.m-sw-200901m .swiper-slide li .brand span {display:block; word-break:break-all; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.m-sw-200901m .swiper-slide li .brand span {font-family: var(--family-regular);font-weight: var(--weight-regular); line-height:1.5; font-size:13px; color:#000000; padding:10px 0 10px 0; opacity:.5;}

.m-sw-200901m .swiper-slide li .title {padding:8px 0 0  0;}
.m-sw-200901m .swiper-slide li .title p {margin-top:-2px;}
.m-sw-200901m .swiper-slide li .title span,
.m-sw-200901m .swiper-slide li .title a {display:-webkit-box; display:-ms-flexbox; display:box; width:100%; word-break:break-all; overflow:hidden; -webkit-line-clamp:2; -webkit-box-orient:vertical; text-overflow:ellipsis;}
.m-sw-200901m .swiper-slide li .title span,
.m-sw-200901m .swiper-slide li .title a {font-family: var(--family-medium);font-weight: var(--weight-medium); line-height:1.5; font-size:13px; color:#000000;}

.m-sw-200901m .swiper-slide li .open_price {margin:10px 0 10px 0;}
.m-sw-200901m .swiper-slide li .open_price {font-family: var(--family-bold);font-weight: var(--weight-bold); line-height:1.4; font-size:13px; color:#000000;}
.m-sw-200901m .swiper-slide li .open_price.type2 {color:#666666;}

.m-sw-200901m .swiper-slide li .price {padding:10px 0;}
.m-sw-200901m .swiper-slide li .price p {position:relative; display:inline-block;}
.m-sw-200901m .swiper-slide li .price p.price1 span {position:relative; display:inline-block; vertical-align:bottom;}
.m-sw-200901m .swiper-slide li .price p.price1 span {font-family: var(--family-regular);font-weight: var(--weight-regular); line-height:15px; font-size:13px; color:#000000;}
.m-sw-200901m .swiper-slide li .price p.price1 .currency-price {font-family: var(--family-bold);font-weight: var(--weight-bold); line-height:15px; font-size:15px; color:#000000;}
.m-sw-200901m .swiper-slide li .price p.price1 .currency-decimal {margin-left:2px; vertical-align:top;}
.m-sw-200901m .swiper-slide li .price p.price1 .currency-decimal {font-family: var(--family-bold);font-weight: var(--weight-bold); line-height:14px; font-size:12px; color:#000000;}
.m-sw-200901m .swiper-slide li .price p.price1 .swung {vertical-align:top;}
.m-sw-200901m .swiper-slide li .price p.price1 .swung {font-family: var(--family-bold);font-weight: var(--weight-bold); line-height:14px; font-size:12px; color:#000000;}
.m-sw-200901m .swiper-slide li .price p.price2 {margin-right:10px;}
.m-sw-200901m .swiper-slide li .price p.price2 span {position:relative; display:inline-block; vertical-align:bottom;}
.m-sw-200901m .swiper-slide li .price p.price2 .text {font-family: var(--family-regular);font-weight: var(--weight-regular); line-height:15px; font-size:13px; color:#000000; letter-spacing:-0.5px;}
.m-sw-200901m .swiper-slide li .price p.price2 .currency-text {margin-left:4px;}
.m-sw-200901m .swiper-slide li .price p.price2 .price-line {color:#898989;}
.m-sw-200901m .swiper-slide li .price p.price2 .price-line:before {z-index:1; display:block; content:''; position:absolute; left:0; top:8px; width:100%; height:0; border-top:1px solid #959595;}
.m-sw-200901m .swiper-slide li .price.currency-KRW p:nth-child(1) .swung {font-family: var(--family-bold);font-weight: var(--weight-bold); line-height:22px; font-size:20px; color:#000000;}

.m-sw-200901m .swiper-slide li .price.no-price p:nth-child(2) {margin-left:0;}
/*

.m-sw-200901m .swiper-slide.ty-not {position:relative;}
.m-sw-200901m .swiper-slide.ty-not li .block:before {display:block; content:''; position:absolute; left:0; top:0; width:100%; height:100%; background-color:#dddddd;}
.m-sw-200901m .swiper-slide.ty-not li .block:after {z-index:1; display:block; content:''; position:absolute; left:calc(50% - 25px); top:calc(50% - 25px); width:50px; height:50px; background:url('../img/btn.png') no-repeat; background-position:-350px 0px; opacity:0.5;}
*/

/* ty-not */

.m-sw-200901m .swiper-slide.ty-not li {
    position: relative;
}

.m-sw-200901m .swiper-slide.ty-not li .block:before {
    display: block;
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #dddddd;
}

.m-sw-200901m .swiper-slide.ty-not .svg-product {
    z-index: 1;
    position: absolute;
    left: calc(50% - 25px);
    top: calc(50% - 25px);
    width: 50px;
    height: 50px;
    fill: #fff;
    opacity: 1;
}

/* swiper-buttons */

.m-sw-200901m .swiper-buttons {
    position: absolute;
    left: -20px;
    right: 0;
    top: 50%;
    margin: 0 auto;
}

.m-sw-200901m .swiper-buttons .button-prev,
.m-sw-200901m .swiper-buttons .button-next {
    transition: all .3s ease;
    z-index: 20;
    margin: 0;
    display: block;
    position: absolute;
    width: 40px;
    height: 80px;
    top: calc(50% - 40px);
    opacity: 0;
    cursor: pointer;
}

.m-sw-200901m .swiper-buttons .button-prev svg,
.m-sw-200901m .swiper-buttons .button-next svg {
    transition: all .3s ease;
    margin: 0;
    width: 40px;
    height: 80px;
    stroke: #666;
}

.m-sw-200901m .swiper-buttons .button-prev:before,
.m-sw-200901m .swiper-buttons .button-next:before,
.m-sw-200901m .swiper-buttons .button-prev:after,
.m-sw-200901m .swiper-buttons .button-next:after {
    display: none !important;
    opacity: 0 !important;
}

.m-sw-200901m .swiper-buttons .button-prev {
    left: 20px;
}

.m-sw-200901m .swiper-buttons .button-next {
    right: 20px;
}

.m-sw-200901m .swiper-buttons .button-next svg {
    transform: rotate(180deg);
}

.m-sw-200901m:hover .button-prev,
.m-sw-200901m:hover .button-next {
    opacity: .2;
}

.m-sw-200901m:hover .button-prev svg {
    margin-left: -20px;
}

.m-sw-200901m:hover .button-next svg {
    margin-left: 20px;
}

.m-sw-200901m .button-prev:hover,
.m-sw-200901m .button-next:hover {
    opacity: 1;
}

.m-sw-200901m .button-prev:hover svg,
.m-sw-200901m .button-next:hover svg {
    stroke: #000;
}
