/* BASIC css start */
/* 메인타이틀 설정 */
.main .title{margin-bottom:37px;}
/*.main {margin-bottom:80px;}*/
.main > .title{display:block;text-align:center;}
.main > .title:after {content:"";display:none;clear:both;}
.main > .title h2 {}  
 

.main > .title h2:after {display:none; content:"";position:absolute;width:calc(100%);height:1px;left:0;bottom:-7px;background:#8e8e8e;}
.main > .title h2 span{font-size:22px;font-weight:600; color: #202020; position: relative;}
.main > .title h3{  display:block;text-align:center;font-size:11px;letter-spacing:0;line-height:18px;padding-top:25px;color:#999;}








/******** 메인 본문 최상단 슬라이드 ********/
.mainTopSlider {position:relative;overflow:hidden;width:100%; height:656px; margin:0 auto; background:#eee; opacity:0; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}
.mainTopSlider:before{content:""; display:block; width:25px; height:656px; background:#fff; position:absolute; top:0; left:calc(50% - 775px); z-index:99;}
.mainTopSlider:after{content:""; display:block; width:25px; height:656px; background:#fff; position:absolute; top:0; left:calc(50% + 750px); z-index:99;}
.mainTopSlider .slider {width:1500px; margin:0 12.5px; opacity:0.4; background:#ddd;}
.mainTopSlider .slider.is-selected{opacity:1;}
.mainTopSlider .slider img {max-width:100%;}

/* 페이저, 화살표 */
.mainTopSlider .flickity-page-dots{width:auto; display:inline-block; bottom:20px; left:calc(50% + 590px);}
.mainTopSlider .flickity-page-dots .dot{background: rgba(255,255,255,0.9); width:25px; height:5px; margin:0 4px; border-radius:0;}
.mainTopSlider .flickity-prev-next-button.previous{left:80px;}
.mainTopSlider .flickity-prev-next-button.next{right:80px;}







/******** 배너영역1 ********/
.bannerArea1 {padding:97px 0 100px; position:relative; width:100%; overflow:hidden; height:466px;}
.bannerArea1:before{content:""; display:block; width:100%; height:700px; background:#fff; position:absolute; top:0; left:0; z-index:-1;}
.bannerArea1 .inner{width:1417px; margin:0 auto; font-size:0; line-height:0; letter-spacing:0;}
.bannerArea1 .inner > div{display:inline-block; vertical-align:top; width:423px; height:466px; margin-right:30px;}
.bannerArea1 .inner > div:first-child{width:511px;}
.bannerArea1 .inner > div img {max-width:100%;}
.bannerArea1 .inner > div:last-child{margin-right:0;}
.bannerArea1 .inner > div .bottom{margin-top:18px;}
.bannerArea1 .slider-ban1,
.bannerArea1 .slider-ban2{display:inline-block; width:100%;}
.bannerArea1 .slider-ban1 img,
.bannerArea1 .slider-ban2 img{max-width:100%;}

/* 페이저 */
.bannerArea1 .flickity-page-dots{width:auto; display:inline-block; bottom:17px; left:inherit; right:20px;}
.bannerArea1 .flickity-page-dots .dot{background: rgba(255,255,255,0.8); width:10px; height:10px; margin:0 4px; border-radius:0; opacity:1;}
.bannerArea1 .flickity-page-dots .dot.is-selected{background:rgba(0,0,0,0.3);}








/******** 배너영역2 ********/
.bannerArea2 {margin:0px auto 100px; position:relative; width:100%; padding-top:80px; height:900px; overflow:hidden;}
.bannerArea2:before{content:""; background:#fcf9f5;; width:100%; height:100%; position:absolute; bottom:0; left:0; right:0;}
.bannerArea2 ul{width:1280px; padding:0 10%; height:708px; text-align:center; margin:0 auto;}
.bannerArea2 .slider-ban3{display:inline-block; width:100%; height:100%; font-size:0; line-height:0; letter-spacing:0;}
.bannerArea2 .slider-ban3 > a{display:inline-block; width:278px; height:344px; margin-right:20px; margin-bottom:20px;}
.bannerArea2 .slider-ban3 > a:nth-child(4n){margin-right:0;}
.bannerArea2 .slider-ban3 > a:nth-child(5),
.bannerArea2 .slider-ban3 > a:nth-child(6),
.bannerArea2 .slider-ban3 > a:nth-child(7),
.bannerArea2 .slider-ban3 > a:nth-child(8){margin-bottom:0;}
.bannerArea2 .slider-ban3 > a img{width:100%; height:100%;}

/* 화살표 */
.bannerArea2 .flickity-prev-next-button{width:50px; height:50px; top:50%;}
.bannerArea2 .flickity-prev-next-button svg{display:none;}
.bannerArea2 .flickity-prev-next-button.previous{left:5%; background:url('/design/leelin/onedesign2/images/arrow_left.png') no-repeat center;}
.bannerArea2 .flickity-prev-next-button.next{right:5%; background:url('/design/leelin/onedesign2/images/arrow_right.png') no-repeat center;}







/* 베스트상품 */
.ec-base-product ul.grid2 > li { width:49%; margin-right:2%; }
.ec-base-product ul.grid3 > li { width:32%; margin-right:2%; }
.ec-base-product ul.grid4 > li { width:calc(25% - 18.75px); max-width: 356px; margin-right: 25px; }
.ec-base-product ul.grid5 > li { width:18.8%; margin-right:1.5%; }
.ec-base-product ul.grid6 > li { width:15%; margin-right:2%;}

.ec-base-product ul.grid2 > li:nth-child(2n){margin-right:0;}
.ec-base-product ul.grid3 > li:nth-child(3n){margin-right:0;}
.ec-base-product ul.grid4 > li:nth-child(4n){margin-right:0;}
.ec-base-product ul.grid5 > li:nth-child(5n){margin-right:0;}
.ec-base-product ul.grid6 > li:nth-child(6n){margin-right:0;}










/* 4분할 배너 */
.bnLayout4{display:table;width:100%;}
.bnLayout4 ul{clear:both;font-size:0; line-height:0;letter-spacing:0;margin-bottom:27px;}
.bnLayout4 ul li{vertical-align:top; position:relative;overflow:hidden; display:table-cell;}
.bnLayout4 ul li.bn1 {}
.bnLayout4 ul li.bn2 {padding-left:27px;}
.bnLayout4 ul li.bn3 {padding-right:27px;}
.bnLayout4 ul li.bn4 {text-align:right;}
.bnLayout4 ul li .slider {display:block;}
.bnLayout4 img {width:100%;}
/* 4분할 배너 슬라이드 버튼 */

.bnLayout4 .bx-wrapper .bx-controls-direction a {position: absolute;top: 50%;margin-top: -16px;outline: 0;visibility:visible;opacity:1;width: 38px;height: 38px;text-indent: -9999999px;z-index: 99;font-size:0;}
.bnLayout4 .bx-wrapper .bx-controls-direction a.bx-prev {left: 30px;background: url('/design/leelin/onedesign2/images/banLeft.png') no-repeat 0 0 !important;}
.bnLayout4 .bx-wrapper .bx-controls-direction a.bx-next {right: 30px;background: url('/design/leelin/onedesign2/images/banRight.png') no-repeat 0 0 !important;}
















/* ===============================
   BEST SELLER Swiper (prd01)
   기존 메이크샵 영향 차단
   =============================== */
/* ===== BEST SELLER 레이아웃 ===== */

.prd01 {
  width: 100%;
  max-width: 1320px;
  margin: 120px auto;
  position: relative;
   z-index: 1;
}


.prd01::before {
  content: "";
  position: absolute;
  top: -80px;              /* 타이틀 위 여백까지 포함 */
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;            /* 화면 가로 끝까지 */
  height: calc(100% + 125px); /* 위/아래 여백 포함 */
  background: #fcf9f5;     /* bannerArea1과 동일 색 */
  z-index: -1;
  top: -95px;
}



.prd01 .item-wrap {
  position: relative;
}

.prd01 .mySwiper {
  width: 100%;
  overflow: hidden;
}

.prd01 .swiper-wrapper {
  align-items: stretch;
}

/* 4개 고정 */
.prd01 .swiper-slide {
  width: calc((100% - 120px) / 4) !important; /* 40px * 3 */
}

/* 이미지 비율 통일 */
.prd01 .thumb img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.prd01 .thumb {
  position: relative;
  width: 100%;
  padding-top: 140%;
  overflow: hidden;
}



/* 화살표 */
.prd01 .swiper-button-prev,
.prd01 .swiper-button-next {
  width: 40px;
  height: 40px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 50;
  top: 50%;
  transform: translateY(-50%);
}

.prd01 .swiper-button-prev {
  background: url('/design/leelin/onedesign2/images/arrow_left.png') no-repeat center !important;
  background-size: contain !important;
  width: 50px;
  height: 50px;
  left: -70px;
}

.prd01 .swiper-button-next {
  background: url('/design/leelin/onedesign2/images/arrow_right.png') no-repeat center !important;
  background-size: contain !important;
  width: 50px;
  height: 50px;
  right: -70px;
}



/* 타이틀 기준 */
.prd01 .cateTit {
  position: relative;
}




/* 제목 영역 */
.cateTit.title-flex {
  display: flex;
  align-items: center;  
  justify-content: space-between;
  margin-bottom: 40px;
}

/* 제목 */
.cateTit.title-flex h3 {
  font-size: 22px;
  font-weight: 600;
  color: #202020;
  margin: 0;
}

/* 오른쪽 영역 */
.cateTit.title-flex .right {
  display: flex;
  align-items: center;
  gap: 14px;
}

/* more 버튼 */
.cateTit.title-flex .btn-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  font-size: 13px;
  border: 1px solid #000;
  padding: 6px 12px;   /* 위아래 여유 살짝 */
  background: #fff;
  color: #000;

  line-height: 1;      /* 이제 문제 없음 */
  transition: background-color 0.25s ease, color 0.25s ease;
}

.cateTit.title-flex .btn-more:hover {
  background: #000;
  color: #fff;
}



/* 페이지네이션 */
.cateTit.title-flex .controller {
  width: 90px;
  text-align: right;
}

/* 왼쪽 (제목 + more) */
.cateTit.title-flex .left {
  display: flex;
  align-items: center;
  gap: 30px;   /* 제목과 more 간격 */
}


/* BEST SELLER 컨트롤러 정렬 */
.prd01 .cateTit {
  position: relative;
   margin-bottom: 40px;
}



.prd01 .controller {
  position: absolute;
  top: -20px;
  right: 0;
  width: 90px;
  text-align: right;
}





/* 페이지 숫자 */
.prd01 .swiper-fraction {
text-align: right;
    color: #ce7777;
    font-size: 12px;
    font-weight: 800;
    padding-bottom: 8px;
}







/* 프로그레스 바 */
.prd01 .swiper-pagination {
  position: relative;
  width: 90px;
  height: 1px;
  background: #e5e5e5;
}

.prd01 .swiper-pagination-progressbar-fill {
  background: #c37a7a;
}



.prd01 .swiper-pagination-progressbar {
   position: relative !important;
}


.prd01 .swiper-pagination-fraction {
  font-size: 12px;
  font-weight: 600;
  color: #e1b6b6;
  margin-bottom: 6px;
}


.prd01 .swiper-pagination-fraction .swiper-pagination-current {
  color: #c37a7a;
}

.prd01 .swiper-pagination-current {
  color: #c37a7a;
}




/* 상품 정보 전체 */
.prd01 .prd-info {
  margin-top: 14px;
}

.prd-info .prd-name a {
  display: inline-block;
  padding-bottom: 6px;
  border-bottom: 1px solid #e5e5e5;
}



/* 리뷰
.prd01 .prd-review { font-size: 11px;  color: #aaa;  margin-bottom: 4px;} */
 
 
 
/* 상품명 */
.prd01 .prd-name {
  font-size: 13px;
  line-height: 1.4;
  color: #222;
  margin-bottom: 8px;
}

/* 가격 영역 */
.prd01 .prd-price {
  /*border-bottom: 1px solid #eee;*/ /*가격 밑에 밑줄선 비활성화 추후 상세설명 추가 시 같이 풀기*/
  padding-bottom: 10px;
  margin-bottom: 10px;
}

.prd01 .prd-price strike {
  color: #bbb;
  font-size: 12px;
  margin-left: 6px;
}

/* 간단설명 */
.prd01 .prd-subdesc {
  font-size: 12px;
  color: #999;
  line-height: 1.6;
  margin-top: 8px;
  word-break: keep-all;
}


/* 할인율 검정 네모
.prd01 .discount-txt {
font-size: 12px;
    font-family: 'Montserrat', sans-serif;
    font-weight: bold;
    background: #3a3a3a;
    color: #fff;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 52px;
    line-height: 27px;
    text-align: center;
}
 */





/* 가격 아래 추가 상품 설명 (간단설명) */
.prd01 .description,
.prd01 .description .txtDesc,
.prd01 .txtDesc {
  display: block !important;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #eee;   /* 가격 아래 구분선 느낌 */
  font-size: 12px;
  color: #999;
  line-height: 1.6;
  word-break: keep-all;
}




.main > .title {
  position: relative;
  top: -20px;
}



.prd01 .controller .swiper-pagination {
    width: 90px;
    height: 2px;
    position: static;
    background: #f7f7f7;
    }



.prd01 .controller .swiper-pagination span {
    background: #ce7777;
}


/* 기본 Swiper 화살표 SVG 제거 */
.prd01 .swiper-button-prev::after,
.prd01 .swiper-button-next::after {
  display: none;
}



/* CART 장바구니
.item-wrap .item-cont .item-list .prd-preview {
    display: inline-block;
    width: 48px;
    height: 22px;
    line-height: 20px;
    border-radius: 11px;
    border: 1px solid #fff;
    background-color: #deadad;
    text-align: center;
    font-size: 10px;
    color: #ffffff;
    font-weight: 700;
    font-family: "Montserrat", sans-serif;
    float: right;
    box-sizing: border-box;

*/



/* 주제들 부분적 백그라운드 컬러 변경 */
.prd01[data-swiper="add3"]::before,
.prd01[data-swiper="add6"]::before, 
.prd01[data-swiper="add2"]::before {
  background: #fff;
}


.prd01[data-swiper="add3"]::before,
.prd01[data-swiper="add6"]::before,
.prd01[data-swiper="add2"]::before {
  top: -95px;
  height: calc(100% + 160px);
}




/* 제목 + more + 컨트롤러 정렬 */
.cateTit.title-flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* 오른쪽 영역 (more + 페이지네이션) */
.cateTit .right {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* more 버튼 */
.btn-more {
  font-size: 13px;
  border: 1px solid #000;
  padding: 3px 10px;
  line-height: 1;
  text-transform: lowercase;
  background: #fff;
  transition: all 0.2s ease;
}

.btn-more:hover {
  background: #000;
  color: #fff;
}





/* 소비자가 */
.prd-price .price-origin {
  font-size: 13px;
  color: #aaa;
  text-decoration: line-through;
  margin-bottom: 2px;
}

/* 판매가 + 할인율 */
.prd-price .price-sale {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 500;
  color: #121212;
}

/* 할인율 */
.prd-price .sale-percent {
  font-size: 14px;
  color: #888;
}

/* 리뷰 */
.prd-price .price-review {
  margin-top: 2px;
  font-size: 13px;
  color: #888;
}





#footerTop {margin-top:0 !important}
/* BASIC css end */

