/* BASIC css start */
@import url('https://fonts.googleapis.com/css2?family=Antonio:wght@100..700&display=swap');
@font-face { font-family: 'Swell H2'; src: url(https://cdn.nitroapps.co/fontify/swell-lifetime.myshopify.com/swell-h2.otf?v=1718979451);}

/*--------------------------------------------------------------------------------
//
//            공통
//
--------------------------------------------------------------------------------*/

#contents {padding-top: 0 !important;  /* 헤더만큼 아래로 밀기 */
  margin-top: 0 !important;}

.main section,
.main section *{
    -webkit-box-sizing:border-box;
       -moz-box-sizing:border-box;
            box-sizing:border-box;
}

.main section{
  /* font-family: "Antonio", sans-serif !important; */
    margin-bottom:18vw;
}

.main section h2.secTit,
.main section h2.secTit a{
    display:block;
    margin-bottom:4.167vw;
    font-size:8.556vw;
    font-weight:600;
    line-height:8.333vw;
    font-family: "Antonio", sans-serif !important;
    letter-spacing: -0.02em;
}

html body {
    padding: -58px !important;
}

body header .mainHeader{
    display:block;
}

body header .etcPageHeader{
    display:none;
}



/* 기간할인 아이콘 */

#dcicon {    position: absolute;
    left: 27vw;
    top: 2vw;
    margin: 0 auto;
    z-index: 10; /* 아이콘이 이미지 위에 오도록 설정 */
    width: 9vw; /* 아이콘의 크기를 적절히 조정 */
    height: auto;}

/*--------------------------------------------------------------------------------
//
//            swiper overflow 수정
//
--------------------------------------------------------------------------------*/
.mainSec04,
.mainSec06,
.mainSec07{
    overflow:hidden;
}

.mainSec04 .swiper,
.mainSec06 .swiper,
.mainSec07 .swiper{
    overflow:hidden /*visible*/;
}


/*--------------------------------------------------------------------------------
//
//            메인 대분류 카테고리 리스트
//
--------------------------------------------------------------------------------*/
.categoryListWrap .fixedArea{
    border-bottom:0.278vw solid #e9e9e9;
    background:#fff;
    transition:all 0.3s;
}

.categoryListWrap .fixedArea.fixed{
    position:fixed;
    left:0;
    top:0;
    width:100%;
    z-index:99;
}

.categoryListWrap ul li{
    width:auto;
    margin-right:1.389vw;
}

.categoryListWrap ul li:last-child{
    margin-right:0;
}

.categoryListWrap ul li a{
    display:block;
    position:relative;
    padding: 2.778vw 4.167vw;
    font-size:3.889vw;
    line-height:5vw;
}

.categoryListWrap ul li a.active:after{
    content:'';
    display:block;
    position:absolute;
    bottom:0;
    left: 3.167vw;
    width: calc(100% - 6.333vw);
    height:0.556vw;
    background:#000;
}



/*--------------------------------------------------------------------------------
//
//           action  메인슬라이드
//
--------------------------------------------------------------------------------*/




.action {
    margin-bottom: 7vw;
    position: relative;
    
}


/*      제품영역부분       */

.action .left_area {
    position: relative;
    width: 100%;
    margin-top: -25%;
    margin-bottom: 8%;
}
.action .left_area .slide_item3 {
    opacity: 0;
    visibility: hidden;
    height: 0;
    position: relative; 
}
.action .left_area .slide_item3.active {
    opacity: 1;
    visibility: visible;
    height: auto;
}
.action .left_area .slide_item3 .item-wrap {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    text-align: left;
    padding: 3rem 1.5rem 1rem;
    box-sizing: border-box;
}

.action .left_area .slide_item3 .goodsListWrap ul {
    display: flex;  /* 자식 요소들을 수평으로 배치 */
    flex-wrap: wrap;   /* 자식 요소들이 줄 바꿈을 하도록 설정 */
    gap: 14px 23px;   /* 자식 요소들 간의 간격 */
    padding: 0 38px 0 35px;
}

.action .left_area .slide_item3 .goodsListWrap ul li {
width: calc(40% - 5px) !important; /* 두 개의 항목을 한 줄에 배치하려면 너비를 50%로 설정하고, 간격을 고려하여 10px을 빼줌 */

}


.action #tab3 .act-ttl {
    position: absolute;
    padding: 100% 0 0 30px;
    font-size: 40px;
}

.action #tab3 .act-sub {
    margin:19px 0 0 0;
    font-size: 20px;
    line-height: 1.3;
}


.action .more_btn {
    display: inline-block;
    border: 1px solid black;
    margin-top : 20px;
}
.action .more_btn a {
    display: inline-block;
    padding: 3px 10px;
    font-weight: 500;
    font-size: 11px;
    line-height: 18px;
    color: black;
}
.action .left_area .slide_item3 .bg-img { display:none; }

.action .right_area {
    width: 100%;
    display: flex;
    justify-content: center; /* 가운데 정렬 핵심 */
    align-items: center;
}
.action .swiper_button_wrap {
    display: flex;           /* Flexbox 사용 */
    margin-bottom: 15px;
    align-items: center;
}
.action .swiper_button_wrap > div {
    position: static;
}
.action .swiper_button_wrap .swiper-pagination {
    margin-right: 15px;
    color: black;
    font-size: 12px;
    font-weight: 500;
    text-align: right;
}
.action .swiper_button_wrap .swiper-button-next, 
.action .swiper_button_wrap .swiper-button-prev {
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    margin-top: 0;
    background-image: url('/design/swellstore/11753/icon/arr_circle_bk.svg');
    /*background-image: url('http://swellstore.img15.kr/img/arr_circle.svg');*/
    background-size: cover;
    cursor: pointer;
}
.action .swiper_button_wrap .swiper-button-prev {
    left: 0;
    top: 0;
    transform: translateY(0) rotate(180deg);
    margin-right: 8px;
}

.action .swiper_button_wrap .swiper-button-next:after, 
.action .swiper_button_wrap .swiper-button-prev:after {
display:none;}

.action #tab3 {
        margin: 0px auto 0;
        width: 100%;
        overflow: hidden;
        
}
.action #tab3 .swiper-slide {


}
.action #tab3 .swiper-slide img {
    display: inline-block;
    width: 100%;
    height: auto;
}

/*      제품영역부분       */





/*--------------------------------------------------------------------------------
//
//            section01
//
--------------------------------------------------------------------------------*/
.main .mainSec01{
    width:100%;
    overflow:hidden;
}

.mainSec01 .swiper .swiper-slide img{
    display:block;
    width:100%;
}

.mainSec01 .swiper-horizontal>.swiper-pagination-progressbar,
.mainSec01 .swiper-pagination-progressbar.swiper-pagination-horizontal,
.mainSec01 .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,
.mainSec01 .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{
    width:85%;
    height:2px;
    top:auto;
    bottom:20px;
    left:7.5%;
}

.mainSec01 .swiper-pagination-progressbar{
    background:#000;
}

.mainSec01 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{
    background:#fff;
}

.mainSec01 ul li{
    overflow:hidden;
}

.mainSec01 ul li a{
    display:block;
    position:relative;
}

.mainSec01 ul li .textBox{
    position:absolute;
    bottom:13.444vw;
    left:15px;
}

.mainSec01 ul li .textBox strong{
    display:block;
    margin-bottom:3.556vw;
    font-size:9.333vw;
    line-height:9.722vw;
    font-weight:400;
    color:#fff;
    opacity:0;
    margin-left:-100%;
    font-family: "Antonio", sans-serif !important;
    transition:all 0.5s;
}

.mainSec01 ul li .textBox span{
    display:block;
    font-size:4.167vw;
    line-height:5.556vw;
    color:#fff;
    opacity:0;
    margin-left:-100%;
    
    transition:all 0.8s;
}

.mainSec01 ul li.swiper-slide-active .textBox strong{
    opacity:1;
    margin-left:0;
}

.mainSec01 ul li.swiper-slide-active .textBox span{
    opacity:1;
    margin-left:0;
}



/*--------------------------------------------------------------------------------
//
//            section02
//
--------------------------------------------------------------------------------*/
.mainSec02 .sec02Wrap{
    display:flex;
    font-family: "Antonio", sans-serif !important;
}

.mainSec02 .box1{
    width:31%;
    padding:9.722vw 0 4.167vw 0;
    text-align:center;
    display: block;
    margin-left: 1%
}

.mainSec02 .box1 .text01{
    display: block;
    margin-bottom: 1.944vw;
    font-size: 5.278vw;
    font-weight: 500;
    line-height: 6.944vw;
}

.mainSec02 .box1 .text02{
    display: block;
    margin-bottom: 3.889vw;
    font-size: 10vw;
    font-weight: 500;
    line-height: 12.778vw;
    font-family: 'Georgia';
}

.mainSec02 .box1 .text03{
    display: block;
    font-size: 3.333vw;
    line-height: 4.444vw;
    font-weight:500;
}

.mainSec02 .box2{
    width:68%;
    padding:9.722vw 4.167vw 0 0;
    overflow:hidden;
}

.mainSec02 .box2 .swiper{
    overflow:visible;
}

.mainSec02 .box2 ul{
    padding-right:15px;
}

.mainSec02 .box2 ul li img{
    display:block;
    width:100%;
}

.mainSec02 .box2 ul li span{
    display:block;
    padding-top:1.389vw;
    text-align:center;
    line-height:4.444vw;
    font-size:3.7vw;
    font-weight:500;
}

/*--------------------------------------------------------------------------------
//
//            section03   중간 검은 배너
//
--------------------------------------------------------------------------------*/
.mainSec03 {margin-top:15vw; }

.mainSec03 .middleThinBan {
overflow: hidden;       /* 혹시 넘칠 경우 숨김 */
text-align: center;
height:110px;
max-width:100%;
display: flex;
flex-wrap: wrap;
background: black;
}

.mainSec03 .middleThinBan a { 
display: flex; 
max-width:100%; 
padding:0 4.167vw; 
height:110px;
align-items: center;}

.mainSec03 .middleThinBan img{
    display: inline-block;
    height: auto;
    width: 100%;
}

/* 01번 이미지용 */
/*.mainSec03 .middleThinBan .mi_font {width: 70%; text-align: left; align-items: center;}
.mainSec03 .middleThinBan .mi_img {height:100%; width: auto; align-items: flex-end; margin-left:10px;}*/

/* 02번 이미지용 */
.mainSec03 .middleThinBan .mi_font {width: 80%; text-align: left; align-items: center; z-index:2;}
.mainSec03 .middleThinBan .mi_img {height:100%; width: auto; align-items: flex-end; margin-left:-5vw;}


/*--------------------------------------------------------------------------------
//
//            mainSec05
//
--------------------------------------------------------------------------------*/
.mainSec05{
    overflow:hidden;
}

.mainSec05 .goodsListWrap {
    margin-bottom:11.111vw;
}

.mainSec05 .goodsListWrap .swiper{
    overflow:visible;
}


.mainSec05 .goodsListWrap li:nth-child(1){
    position:relative;
    width:83.333vw;
    margin-left:-4.167vw;
}

.mainSec05 .goodsListWrap li:nth-child(1) a{
    display:block;
}

.mainSec05 .goodsListWrap li:nth-child(1) img{
    width:100%;
}

.mainSec05 .goodsListWrap li:nth-child(1) .textBox{
    position:absolute;
    bottom:13.889vw;
    left:4.167vw;
}

.mainSec05 .goodsListWrap li:nth-child(1) .textBox strong{
    display:block;
    margin-bottom:5.278vw;
    font-size:6.667vw;
    font-weight:400;
    line-height:8.333vw;
    color:#fff;
}

.mainSec05 .goodsListWrap li:nth-child(1) .textBox .hashTag span{
    display:inline-block;
    margin-right:0.556vw;
    padding:0 4.167vw;
    font-size: 3.056vw;
    line-height:6.667vw;
    text-align:center;
    background:#fff;
    border-radius:3.333vw;
}

.mainSec05 .goodsListWrap li:nth-child(n+2){
    width:43.056vw;
    margin-top:11.667vw;
}

.mainSec05 .goodsListWrap li:nth-child(1),
.mainSec05 .goodsListWrap li:nth-child(n+2){
    margin-right:4.167vw;
}

.mainSec05 .goodsListWrap li:last-child{
    margin-right:0;
}

.mainSec05 .goodsListWrap .moreAndPaging{
    padding:4.167vw;
}

.mainSec05 .goodsListWrap .moreAndPaging a{
    display:block;
    width:17.778vw;
    font-size:2.778vw;
    line-height:6.667vw;
    text-align:center;
    color:#fff;
    background:#000;
    border-radius:3.333vw;
}

.mainSec05 .goodsListWrap .moreAndPaging .swiper-pagination-progressbar.swiper-pagination-horizontal{
    width: 59.444vw;
    height: 0.556vw;
    top: auto;
    bottom: 7.222vw;
    left: 23.889vw;
    background:#d9d9d9;
}

.mainSec05 .goodsListWrap .moreAndPaging .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{
    background:#000;
}


/*--------------------------------------------------------------------------------
//
//            mainSec06
//
--------------------------------------------------------------------------------*/
section.mainSec06 h2.secTit, section.mainSec06 h2.secTit a{
    margin-bottom:2.778vw;
}

.mainSec06 .tabBtn{
    padding:0 0 2.778vw;
}


.mainSec06 .bestSellTab{
    display:none;
}

.mainSec06 .bestSellTab:nth-child(1){
    display:block;
}

.mainSec06 .tabBtn li{
    margin-right:6.944vw;
}

.mainSec06 .tabBtn li:last-child{
    margin-right:0;
}

.mainSec06 .tabBtn li a{
    display:block;
    font-size:3.333vw;
    line-height:5.556vw;
    color:#969696;
    font-weight:500;
}

.mainSec06 .tabBtn li.active a{
    color:#000;
}



/*--------------------------------------------------------------------------------
//
//            mainSec07
//
--------------------------------------------------------------------------------*/
.mainSec07 .leftBox{
    margin-bottom:0px;
}

.mainSec07 .planBox .box1{
    margin-bottom:6px;
}

.mainSec07 .planBox .box1 a img{
    width:100%;
}

.mainSec07 .box2 .SubTit{
font-family: "Antonio", sans-serif !important;
margin: 5vw 0 6vw 0;
font-size: 8vw; 
}

.mainSec07 .box2 .SubTit P {
font-size: 3.5vw;
margin: 3vw 0 5vw;
}

.sw-product .sw-product-ul .sw-product-li {width:100% !important; margin-bottom:3vw; }
.sw-product .sw-product-ul .sw-product-li a {display:flex; }
.sw-product .sw-product-ul .sw-product-li > a > .imgBox {width: 30%; }
.sw-product .sw-product-ul .sw-product-li a .imgBox img {width: 90%; }
.sw-product .sw-product-ul .sw-product-li a .textBox {width:65%; }
.sw-product > ul {display:contants !important; height: 36vw; }

.mainSec07 .myWrap .leftBox .planBox .box2 ul li .wishBtn {right:4vw; top: 12vw; left:unset;}

/*--------------------------------------------------------------------------------
//
//            mainSec 10  인스타그램
//
--------------------------------------------------------------------------------*/


.embedsocial-hashtag, .embedsocial-feed, .embedsocial-media-feed {
    padding: 0px !important;
    margin: 0px !important;
  }
  
#es-main-widget {
    padding: 0px !important;
    margin: 0px !important;
}



/* BASIC css end */