/* BASIC css start */
/*--------------------------------------------------------------------------------
//
//            공통
//
--------------------------------------------------------------------------------*/

.more-link {
    font-size: 16px; /* '더보기 >'의 크기 조정 */
    color: #999; /* 파란색 링크 스타일 */
    text-decoration: none;
    margin-left: 20px; /* 텍스트와 간격 */
}

.more-link:hover {
   
}


section h3.secTit {
    display: flex; /* Flexbox 사용 */
    justify-content: space-between; /* 공간을 양쪽으로 정렬 */
    align-items: center; /* 세로로 가운데 정렬 */
  
    font-size: 26px;
    font-weight: 600;
    line-height: 1.0;
}

section h3.secTit a {
    display: inline-block;
    font-size: inherit; /* 상위 h2의 폰트 크기와 동일 */
    font-weight: inherit;
    text-decoration: none; /* 밑줄 제거 */
    
}


.cart_button a {color:var(--000);font-size: 0.85rem;box-sizing: border-box;margin:10px 0;display:inline-block;text-align:center;width:100%;}
.cart_button a img {vertical-align:middle;transform: scale(0.7);padding-bottom:2px;   }


.preparing-image {
    display: block;
    margin: -18px 0px 0px;
    max-width: 100px;
    height: auto;
    margin-left: 7px;
    text-align: center;
    }


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

.main section{
    margin-bottom:15.222vw;
}

.main section h2.secTit,
.main section h2.secTit a{
    display:block;
    margin-bottom:2.167vw;
    font-size:5.556vw;
    font-weight:600;
    line-height:8.333vw;
}
.secTit,
.secTit a{
    display:block;
    margin-bottom:2.167vw;
    font-size:5.556vw;
    font-weight:600;
    line-height:8.333vw;
}


.secTit2,
.secTit2 a{
    
    margin-bottom:40px;
      font-size: 15px;
    font-weight: 500;
    line-height: 1.0;
}

.secTit2 span.icon{
    display: inline-block;
    margin-top: -7px;
    margin-left: 10px;
    font-size: 15px;
    vertical-align: middle;
}


html body {
    padding:0;
}

body header .mainHeader{
    display:block;
}

body header .etcPageHeader{
    display:none;
}


/*상품정보 더 보기*/
.goodsDetailMoreViewBtn {
    padding: 3.778vw 0vw 0vw;
}

.goodsDetailMoreViewBtn a{
    display:block;
    width:100%;
    font-size:3.333vw;
    font-weight:500;
    text-align:center;
    line-height:12.889vw;
    border:0.278vw solid #eaeaea;
    color: #666666;
   
}

.goodsDetailMoreViewBtn a svg{
    width:3.333vw;
    margin-left:5px;
}


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

.mainSec04 .swiper,
.mainSec06 .swiper,
.mainSec07 .swiper{
    overflow: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;
}

/*--------------------------------------------------------------------------------
//
//            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: 16.444vw;
    left: 30px;
    text-align: center; /* 텍스트를 가로로 가운데 정렬 */
    width: calc(100% - 60px); /* 부모 크기에 맞게 중앙 정렬을 위한 폭 설정 */
}

.mainSec01 ul li .textBox strong{
    display:block;
    margin-bottom:5.556vw;
    font-size:6.333vw;
    line-height:7.722vw;
     font-weight:800;
    color:#010101;
    opacity:0;
    margin-left:-100%;
    
    transition:all 0.5s;
}

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

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

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


/*--------------------------------------------------------------------------------
//
//            section02
//
--------------------------------------------------------------------------------*/
.mainSec02 .sec02Wrap{
    display:flex;
}

.mainSec02 .box1{
    width:32%;
    
    text-align:center;
}

.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:100%;
    padding:9.722vw 4.167vw 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.333vw;
    font-weight:500;
}

/*--------------------------------------------------------------------------------
//
//            section03
//
--------------------------------------------------------------------------------*/
.mainSec03 {
  position: relative;
  background-color: #fff; /* 배경 흰색 */
  overflow: hidden;

}

.banner-swiper {
  width: 100%;
  height: auto;
}

.banner-swiper .swiper-slide img {
  width: 100%;
  height: auto;
  display: block;
  padding: 0 4.167vw;
}

/* Pagination 스타일 */
.pagination {
  position: absolute;
  top: 2px; /* 상단 위치 */
  right: 6.167vw; /* 여백과 정렬 맞춤 */
  z-index: 10;
}

.pagination .swiper-pagination-switch {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 5px;
  background-color: transparent;
  border: 1px solid #000; /* 연회색 라인 */
  border-radius: 50%;
}

.pagination .swiper-active-switch {
  background-color: #000; /* 활성화된 점은 검은색 */
  border-color: #000;
}
/*--------------------------------------------------------------------------------
//
//            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:90px;
}

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

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


.image-container {
    position: relative;
    display: inline-block;
    width: 100%;
}

.image-container img {
    display: block;
    width: 100%;
    height: auto;
}

.text-overlay {
    position: absolute;
    bottom: 0;
    width: 100%;
    color: #000; /* 텍스트 색상을 블랙으로 설정 */
    padding: 100px 20px 12px;
    background: linear-gradient(to top, rgba(255, 255, 255, 1) 30%, rgba(255, 255, 255, 0) 70%); /* 화이트 그라데이션 */
}

.text-overlay h2, .text-overlay p {
    margin: 0;
}

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

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

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


/* sec2 */
#sec2{}
#sec2 .sec_inner{}
#sec2 .sec_inner ul{display: flex; flex-wrap: wrap; justify-content: space-between;gap:15px}
#sec2 .sec_inner ul li{width:calc((100% - 60px) / 5)}
#sec2 .sec_inner ul li a{display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px;}
#sec2 .sec_inner ul li a img{display: inline-block; border-radius:50px; width:100%}
#sec2 .sec_inner ul li a p{ color: #333333; font-size: 13px; font-weight: 400; text-align: center;}


#sec5{}
#sec5 .sec_inner{}
#sec5 .sec_inner h2{}
#sec5 .sec_inner .sec5_cont{}
#sec5 .sec_inner .sec5_cont>div{}
#sec5 .sec_inner .sec5_cont .banner_img{}
#sec5 .sec_inner .sec5_cont .banner_img a{display: block; overflow: hidden;  width: 100%;}
#sec5 .sec_inner .sec5_cont .banner_img a img{width: 100%;}
#sec5 .sec_inner .sec5_cont .item_cont{}
#sec5 .sec_inner .sec5_cont .item_cont ul{height: 100%; display: flex; flex-direction: row; justify-content: space-between; gap:10px; margin-top:10px; }
#sec5 .sec_inner .sec5_cont .item_cont ul li{width:33%;}
#sec5 .sec_inner .sec5_cont .item_cont ul li .thumb{}
#sec5 .sec_inner .sec5_cont .item_cont ul li .thumb a{display: block; width: 100%; height: 100%;}
#sec5 .sec_inner .sec5_cont .item_cont ul li .thumb a img{width: 100%; height: 100%; object-fit: cover;}
#sec5 .sec_inner .sec5_cont .item_cont ul li .info p{font-size:13px;text-overflow: ellipsis; white-space:nowrap; overflow:hidden}

.list_array {height:52px; border-bottom:1px solid #4a4a4a; border-top:1px solid #c7c7c7; padding:0 8px; margin-bottom: 20px;}
.list_array .list_arrayLeft {float:left; margin-top:12px;}
.list_array .list_arrayLeft select {height:28px;}
.list_array .list_arrayRight {float:right; margin-top:12px;}
.list_array .list_arrayRight img {margin-left:10px;}


.list_shopping1x {text-align:left;}
.list_shopping1x ul {width:100%; display:table; table-layout: fixed; box-sizing: border-box; text-align:left; font-size:0;}
.list_shopping1x li {width:100%; display:inline-block; vertical-align: top;background-color:#fff;padding:5px 0;position:relative;}
.list_shopping1x li:last-child {padding-bottom:10px;}
.list_shopping1x li:first-child {padding-top:10px;}
.list_shopping1x li a {display: block; padding:1px 4px; position:relative; overflow:hidden; zoom:1;background-color:#fff;}
.list_shopping1x li img.listPic {width:100%;}
.list_shopping1x .list_shoppingInfo {width:56%; float:left;padding-top:2%; padding-left:4%; font-size:12px;}
.list_shopping1x .box_relative {position:relative;width:40%; float:left;}


/* BASIC css end */