/* BASIC css start */
/* 기본 스타일 */
#contentWrapper h2 {
  font-size: 40px;
  font-family: 'Montserrat', 'SUIT', 'Pretendard', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 40px 0 10px;
  text-align: center;
}

#contentWrapper h3 {

  font-family: 'Pretendard Variable',sans-serif;
}

#contentWrapper h4 {
  font-size: 23px;
  font-family: 'SUIT', 'Pretendard', sans-serif;
  font-weight: 300;
  color: #676666;
  margin-bottom: 10px;
  letter-spacing: 0.2px;
}

/* 모바일 대응 */
@media screen and (max-width: 768px) {
  #contentWrapper h2 { font-size: 24px; }
  #contentWrapper h3 { font-size: 18px; }
  #contentWrapper h4 { font-size: 16px; }
}


/*--------------------------------------------------------------------------------
//
//            공통
//
--------------------------------------------------------------------------------*/
.main section,
.main section *{
    -webkit-box-sizing:border-box;
       -moz-box-sizing:border-box;
            box-sizing:border-box;
}
.main section{
    margin-bottom:10vw;
}


html body {
    padding:0;
}

body header .mainHeader{
    display:block;
}

body header .etcPageHeader{
    display:none;
}

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

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


/*--------------------------------------------------------------------------------
//
//            메인 대분류 카테고리 리스트
//
--------------------------------------------------------------------------------*/
.categoryListWrap .fixedArea {
  position: fixed;           /* ← 고정 위치 기능 유지 */
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  opacity: 0;                /* 보이지 않게 */
  pointer-events: none;      /* 클릭, 터치도 안 되게 */
  z-index: 1000;             /* 기존 우선순위 유지 */
}


.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;
    font-weight: 600;
    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;
}

/*--------------------------------------------------------------------------------
//
//            section01
//
--------------------------------------------------------------------------------*/
.main .mainSec01{
    width:100%;
    margin-bottom:1.389vw;
    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:70%;
    height:2px;
    top:auto;
    bottom:20px;
    left:15%;
}

.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:34.444vw;
    left:15px;
}

.mainSec01 ul li .textBox strong{
    display:block;
    margin-bottom:30px;
    font-size:9.333vw;
    line-height:9.722vw;
    font-weight:400;
    color:#fff;
    opacity:0;
    margin-left:-100%;
    font-weight: 600;
    text-shadow: 0 0 8px rgba(0, 0, 0, 0.8);
    transition:all 0.5s;
}

.mainSec01 ul li .textBox span{
    display:block;
    margin-top:10px;
    margin-bottom:50px;
    font-size:19px;
    line-height:5.556vw;
    color:#fff;
    opacity:0;
    margin-left:-100%;
    font-weight: 700;
    transition:all 0.8s;
    text-shadow: 0 0 8px rgba(0, 0, 0, 0.8);
}

.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
//
--------------------------------------------------------------------------------*/


/* sec2 */

#sec2 {
  text-align: left; /*  상속되는 텍스트 정렬 보정 */
}

#sec2 h2 {
 
  font-size:26px;
  margin-bottom: 20px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 40px 0 10px;
}


#sec2 .sec2_cont{width: 100%;}
#sec2 .sec2_cont ul{width: 100%;}
#sec2 .sec2_cont ul li{ height: auto; width: 75%;}
#sec2 .sec2_cont ul li>div{width: 100%;}
#sec2 .sec2_cont ul li .img_sec{}
#sec2 .sec2_cont ul li .img_sec a{display: block; width: 100%;}
#sec2 .sec2_cont ul li .img_sec a img{width: 100%;}
#sec2 .sec2_cont ul li .info_sec{padding:25px 0px 10px; text-align: center; opacity: 0;transition:  opacity 1.3s,margin-top .5s; margin-top: 10px;}
#sec2 .sec2_cont ul li .info_sec.show{opacity: 1; margin-top: 0px;}

#sec2 .sec2_cont ul li .info_sec h3 {padding-left: 4.167vw; margin-top: 10px; font-family: 'Montserrat', sans-serif; font-size:20px; font-weight: 600; color: #000;}

#sec2 .sec2_cont ul li .info_sec p{font-family: 'Noto Sans KR', sans-serif;font-weight: 400; font-size: 18px;color: #606060; line-height: 1.4; letter-spacing:-.3s}

}
/*--------------------------------------------------------------------------------
//
//            section03
//
--------------------------------------------------------------------------------*/
.mainSec03 img{
    display:block;
    width:100%;
}

/*--------------------------------------------------------------------------------
//
//            mainSec05
//
--------------------------------------------------------------------------------*/

.mainSec05 h3 { margin-bottom: 25px;font-family: 'Montserrat', 'SUIT', 'Pretendard', sans-serif; font-size:19px; font-weight: 600; color: #000;}


.mainSec05{
    overflow:hidden;
}

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

.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:20.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 {padding-left: 3.167vw; margin-top: 20px;margin-bottom: 25px; margin-top: -25px;font-family:'Montserrat', sans-serif; font-size: 26px; font-weight: 600; color: #000;}


.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.444vw;
    line-height:5.556vw;
    color:#969696;
    font-weight:500;

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


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

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

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

/*--------------------------------------------------------------------------------
//
//            mainSec08 (now sale)
//
--------------------------------------------------------------------------------*/

.mainSec08 {
  margin-top: 0;
  padding-top: 0;
}

.mainSec08 h2 {padding-left: 4.2vw; margin: 0 0 30px; font-family:'Montserrat', sans-serif; font-size: 26px; font-weight: 600; color: #000;}
.mainSec08 .sec8_cont{width: 100%;}
.mainSec08 .sec8_cont .swiper{}
.mainSec08 .sec8_cont .swiper ul{width: 100%;}
.mainSec08 .sec8_cont .swiper ul li{ }
.mainSec08 .swiper_btn_prev{position: absolute; top: 50%; transform: translateY(-50%); left: 3%;z-index: 9;cursor: pointer;}
.mainSec08 .swiper_btn_prev img,#sec5 .swiper_btn_next img{transform: scale(.66)}
.mainSec08 .swiper_btn_next{position: absolute; top: 50%; transform: translateY(-50%); right: 3%;z-index: 9; cursor: pointer;}


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


..instargram {
  text-align: center;
  padding: 5px 5px;
  border-radius: 8px; /* 원하는 둥글기 값 */
}

/*  모바일 전용 (640px 이하) */
@media screen and (max-width: 640px) {
  .insta-frame-wrap {
    padding-bottom: 130%; /* 모바일에서 세로형 비율로 조정 */
  }


  .instargram .ttl {
    text-align: center;
    font-size: 20px;
  }

  .instargram .ttl h2 img {
    width: 120px;
    height: auto;
  }

  .instargram .btnFollow {
    margin-top: 10px;
    margin-bottom: 20px;
  }

  .instargram .btnFollow a {
    font-size: 14px;
    padding: 6px 12px;
    background: #000;
    color: #fff;
    border-radius: 4px;
    text-decoration: none;
  }
}

/*--------------------------------------------------------------------------------
//
//      유튜브
//
--------------------------------------------------------------------------------*/
.youtube-frame-wrap {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 비율 */
  height: 0;
  overflow: hidden;
  margin-top: 20px;
}

.youtube-frame-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  border: 0;
}

  .youtube .ttl {
    text-align: center;
    font-size: 20px;
  }

  .youtube .ttl h2 img {
    width: 120px;
    height: auto;
  }

  .youtube .btnFollow {
    margin-top: 10px;
    margin-bottom: 20px;
  }
    .youtube .btnFollow a {
    font-size: 14px;
    padding: 6px 12px;
    background: #000;
    color: #fff;
    border-radius: 4px;
    text-decoration: none;
  }
}

/* BASIC css end */