/* BASIC css start */
/*메인 공통*/
.section,.section :is(*){box-sizing: border-box; font-family:'Noto Sans KR', "Helvetica Neue", Helvetica, NanumGothic,"Malgun Gothic",Dotum,Gulim,sans-serif;
  letter-spacing : -0.025rem; word-break: keep-all;}
.section:not(#sec1, #icosec){margin-top: 50px;}
.section .sec_inner{padding:0 10px}
.section h2{font-size:25px; color: #111111; font-weight: 600; }
.section .txt_area p.sub{color: #000; line-height: 1.6;font-weight: 500;transition: all .4s;font-size: 14px; }
.section .txt_area p.big{ color: #000; font-weight: 500;line-height: 1.3; transition: all .4s;font-size: 27px; }
.section .txt_area a.more{ width:auto; display: inline-block; font-size: 13px; transition: transform .4s, opacity .4s;border: 1px solid #000;color: #000; margin-top: 8px;font-weight: 600;padding:5px 15px; }
.section :is(.sec_next,.sec_prev){position: unset;color: #000;width: 30px; background-color: #ddd; height:30px; border-radius: 50%; margin-top: 0; transition:all .1s}
.section :is(.sec_next,.sec_prev)::after{font-size: 11px; font-weight:700}
.section :is(.sec_next,.sec_prev):not(.swiper-button-disabled):hover{background-color:var(--main-color);color:#fff}
.section .swiper-pagination-bullet-active{background-color:var(--main-color)}
.section .swiper-scrollbar-drag {
  background-color:var(--main-color);
  height: 100%;
  position: relative;
 }
.section .prd_more_btn{text-align:center; margin-top:40px;}
.section .prd_more_btn>a {display:inline-block;font-family: 'Noto Sans KR', sans-serif;display:inline-block; border:1px solid #e8e9ed; padding:4px 0px; width:100%  }
.section .prd_more_btn>a button.btn_moreGray{background-color:#fff !important; color:#000; font-size:13px; font-weight:500; width:100%; display:flex; align-items:center ;justify-content:center; gap:10px}
.section .prd_more_btn>a button span{display:flex; align-items:center; justify-content:center;color:#000; }
.section .prd_more_btn>a button span img{display:inline-block;  transform:scale(.66); transform-origin:center center}

/* 롤링배너 */

#mainSpot .swiper-container {
    width:100%;
    z-index:0;
    height: auto;
    background: #fff;
    padding-bottom:0px; position: relative; overflow: hidden;
  
  }
  #mainSpot .swiper-slide {
    text-align: center;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
  }
  
#mainSpot .swiper-slide img { width: 100%;  overflow: hidden;}

#mainSpot .swiper-btn {position:relative; display:flex;  }
#mainSpot .swiper-btn .swiper-pagination { position: absolute; left: 24px !important;  bottom: 16px !important; width: 50px; height: 29px; line-height: 29px; background-color: rgba(0,0,0,0.1); text-align: center; color: #fff; font-size: .7rem; font-weight: bold;}
#mainSpot .swiper-btn .swiper-button-prev {background: url(//skin.makeshop.co.kr/skin/allshop/m/icon/mainbanleft.png) center no-repeat; background-size: 22%; left: 0;  border-radius: 20px 0 0 20px;}
#mainSpot .swiper-btn .swiper-button-next {background: url(//skin.makeshop.co.kr/skin/allshop/m/icon/mainbanright.png) center no-repeat; background-size: 22%; left: 75px; border-radius: 0 20px 20px 0;}
#mainSpot .swiper-btn .swiper-button-next:after,
#mainSpot .swiper-btn .swiper-button-prev:after { font-family: inherit !important; font-size: 0}
#mainSpot .swiper-btn .swiper-button-next,
#mainSpot .swiper-btn .swiper-button-prev { top: auto !important; bottom: 16px; width: 23px; height: 29px; margin-top: 0 !important; background-color: rgba(0,0,0,0.1); outline: 0;}
#mainSpot .swiper-btn .allview { width: 29px; height: 29px; line-height: 29px; background-color: rgba(0,0,0,0.1);
    text-align: center; color: #8763c2; font-size: .9rem; font-weight: bold; border-radius: 50%;}

/* //롤링배너 */


#mainSpot { position:relative }
#mainSpot img { width:100% }
#mainSpot .paginationWrap { padding:6px 35px 6px 15px; position:absolute; bottom:4px; left:5px; height:auto;
   font-size:12px; color:#fff; text-align:center; z-index:10; background:rgba(0,0,0,0.5); border-radius: 10%; padding: 5px 10px; }
#mainSpot .paginationWrap .spot-pagination { position:relative; bottom:0; font-size:12px; color:#fff }
#mainSpot .paginationWrap .spot-pagination .swiper-pagination-total,
#mainSpot .paginationWrap .spot-pagination .blit { opacity:0.5 }
#mainSpot .paginationWrap .spot-pagination .swiper-pagination-current { font-weight:700 }
#mainSpot .paginationWrap .btnSpotAll { position:absolute; top:5px; right:10px; width:20px; height:20px; font-size:12px; color:#fff;  }
#mainSpot .spotBulletWrap { position:relative; padding:20px 65px }

#spotAllLayer { display:none; padding:5px; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.6); overflow:hidden; z-index:101 }
#spotAllLayer .spotAllArea { width:100%; height:100%; background:#fff; overflow-y:auto }
#spotAllLayer .spotAllArea .spotAllTitle { padding:13px 20px 10px 20px; position:fixed;
      width: calc(100% - 40px);box-sizing: border-box;   z-index: 99; font-size:15px; color:#242424; text-align:left; line-height:1.5; background:#fff; *zoom:1 }
#spotAllLayer .spotAllArea .spotAllTitle:after { display:block; clear:both; content:'' }
#spotAllLayer .spotAllArea .spotAllTitle .btnSpotAllClose { cursor:pointer;position:absolute; top:8px; right:10px; font-size:20px; color:#666 }
#spotAllLayer .spotAllArea .spotAllList { padding-top:45px;position:relative; width:100% }
#spotAllLayer .spotAllArea .spotAllList img { width:100% }
#spotAllLayer .spotAllArea .spotAllList a{display:block; margin-top:20px;}
#spotAllLayer .spotAllArea .spotAllList a:first-child{margin-top:0}


/* 아이콘 분류 */
.itemIconMenu { padding:15px 0;}
.icon_title_area{overflow: hidden;  height: 70px;  }
.icon_title_area .icon_title{ position: relative;  margin-top: 10px;}
.icon_title_area .icon_title .txt{    display: block;    overflow: hidden; text-align: center;
    text-overflow: ellipsis;    line-height: 24px;    white-space: nowrap;    font-size: 18px; 
    color: #dbfffc;    letter-spacing: -.1px;
}
  
.mainCateMenu { padding:28px 10px; position:relative; margin-top: 20px;
  padding-top: 20px; 
  background-color: #fff; }
.mainCateMenu ul { font-size:0 }
.mainCateMenu ul:first-child { margin-bottom: 15px; }
.mainCateMenu ul:last-child { padding-top:12px }
.mainCateMenu li { display:inline-block; width:20%; text-align:center; vertical-align:top; position: relative; }

.mainCateMenu li .iconWarp { display:inline-block; width:90%; height:auto; border-radius:15%; background:#f5f5f5 }
.mainCateMenu li .ico { display:inline-block; margin-top:10px; width:80%; height:auto; background-repeat:no-repeat; background-position:0 0; background-size:40px auto; vertical-align:top }
.mainCateMenu li .txt { display:block; padding-top:8px; font-size:1rem; color:#222; font-weight:400; line-height:15px; vertical-align:top }

/* sec1 */
/*
#sec1{}
#sec1 .swiper{width: 100%;}
#sec1 .swiper ul{width: 100%;}
#sec1 .swiper ul li{width: 100%;}
#sec1 .swiper ul li a{display: block; width: 100%;}
#sec1 .swiper ul li a img{width: 100%;}
#sec1 .swiper-pagination{ }
#sec1 .swiper-pagination-bullet{background-color:#fff !important; margin:0 4px; opacity: .6; transition: width .5s; transform: scale(.9); }
#sec1 .swiper-pagination-bullet-active{width:20px; border-radius: 10px !important;  opacity: 1 !important;}

*/

.title-warp {position:relative; padding :20px 0; display: block;  text-align: center;}

.title-warp .mainTitle {   line-height:2.5rem;  font-size: 1.5rem;  color: #222;  font-weight:500; }
.title-warp .titleComment {  font-size: 0.9rem;  font-weight: 400;  color: #909090; line-height:1.2rem; padding-bottom:10px;}

/* 3step banner */
#sec_banner1{}
#sec_banner1 .step1-warp .swiper{width: 100%;}
  .step1-warp .swiper ul{width: 100%;}
  .step1-warp .swiper ul li{width: 100%;}
  .step1-warp .swiper ul li a{display: block; width: 100%;}
  .step1-warp .swiper ul li a img{width: 100%;}
  .step1-warp .swiper-pagination{ }
  .step1-warp .swiper-pagination-bullet{background-color:#fff !important; margin:0 4px; opacity: .6; transition: width .5s; transform: scale(.9); }
  .step1-warp .swiper-pagination-bullet-active{background-color: #62acff !important;  width:20px; border-radius: 10px !important;  opacity: 1 !important;}


  .step1-warp .swiper-btn-prev {background: url(//skin.makeshop.co.kr/skin/allshop/m/icon/mainbanleft.png) center no-repeat; background-size: 22%; left: 0;  border-radius: 20px 0 0 20px;}
  .step1-warp .swiper-btn-next {background: url(//skin.makeshop.co.kr/skin/allshop/m/icon/mainbanright.png) center no-repeat; background-size: 22%; left: 75px; border-radius: 0 20px 20px 0;}
  .step1-warp .swiper-btn-next:after,
  .step1-warp .swiper-btn-prev:after { font-family: inherit !important; font-size: 0}
  .step1-warp .swiper-btn-next,
  .step1-warp .swiper-btn-prev { top: auto !important; bottom: 16px; width: 23px; height: 29px; margin-top: 0 !important; background-color: rgba(0,0,0,0.1); outline: 0;}


.step1-warp .step1-swiper .swiper-btn-prev{ position:relative; z-index:60; top:260px; text-align:center; opacity: 0; left:40px; }
.step1-warp .step1-swiper .swiper-btn-next{ position:relative; z-index:60; top:260px; text-align:center; opacity: 0; right:40px;}
.step1-warp .step1-swiper:hover .swiper-btn-prev{  left: 20px; opacity: 1; visibility: visible; transition:all 0.3s ease;-webkit-transition:all 0.3s ease;}
.step1-warp .step1-swiper:hover .swiper-btn-next{ right: 20px; opacity: 1; visibility: visible; transition:all 0.3s ease;-webkit-transition:all 0.3s ease;}

.step1-warp .step1-swiper .swiper_btn_prev,
.step1-warp .step1-swiper .swiper_btn_next {
    -webkit-transition: all .22s 0.0s linear;    transition: all .22s 0.0s linear;    
    width: 40px; height: 40px; font-size: 18px;
    position:absolute;  display: inline-block;line-height: 40px; color:#777; vertical-align: middle;
      background-color: rgba(0,0,0,.25);     color: #fff;border: 0;     box-shadow: none; border-radius: 100%;
    display: flex;    justify-content: center;
}

.step1-warp .step1-swiper .swiper_btn_prev{
  z-index:60; top:50%; text-align:center; opacity: 0; left:40px; 
}
.step1-warp .step1-swiper .swiper_btn_next{
    z-index:60; top:50%; text-align:center; opacity: 0; right:40px; 
}

.step1-warp .step1-swiper:hover .swiper_btn_prev{  left: 20px; opacity: 1; visibility: visible; }
.step1-warp .step1-swiper:hover .swiper_btn_next{ right: 20px; opacity: 1; visibility: visible; }


.step1-warp .step1-swiper .swiper-btn-prev,
.step1-warp .step1-swiper .swiper-btn-next{ vertical-align: middle; text-align: center;}
.step1-warp .step1-swiper .swiper-btn-prev:hover,
.step1-warp .step1-swiper .swiper-btn-next:hover {
    text-decoration: none; transition:all 0.3s ease;-webkit-transition:all 0.3s ease;background-color: rgba(0,0,0,0.8); color:#fff;
    opacity: 1;
    visibility: visible;
  }
  .step1-warp .step1-swiper .swiper_btn_prev img,
  .step1-warp .step1-swiper .swiper_btn_next img{ width:20px ; height:auto; filter: invert(1);}

#sec_banner1 .step2-warp ul{width: 100%; display: flex;}
#sec_banner1 .step2-warp ul li{width: 50% }
#sec_banner1 .step2-warp ul li a{display: block; width: 100%;}
#sec_banner1 .step2-warp ul li a img{width: 100%;}


#sec_banner1 .step3-warp ul{width: 100%;}
#sec_banner1 .step3-warp ul li{width: 100%;}
#sec_banner1 .step3-warp ul li a{display: block; width: 100%;}
#sec_banner1 .step3-warp ul li a img{width: 100%;}


/* msec2-이런상품 어떻세요 탭 */
#msec2{}
#msec2 .sec_inner{padding:0 10px }
#msec2 .sec_inner .title-warp{}

#msec2 .sec_inner .cate-warp.li{}
#msec2 .sec_inner .msec2_cate{padding : 10px 0;}
#msec2 .sec_inner .msec2_cate ul{}
#msec2 .sec_inner .msec2_cate ul li{}
#msec2 .sec_inner .msec2_cate ul li a {height:50px; display: flex; align-items: center;
  overflow: hidden;  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  --chakra-line-clamp: 2;
  font-size: 1rem;
  line-height: 1rem;
  letter-spacing: -0.3px;
  word-break: break-all; }
#msec2 .sec_inner .msec2_cate ul li:first-child{}
#msec2 .sec_inner .msec2_cate ul li {overflow:hidden; display:block; width:100%;background-color: #f4f4f4; border-radius: 0px;
    padding: 0px 10px; text-align:center; position:relative; font-size: 1rem; font-weight: 400; display:block; transition:all .1s}
#msec2 .sec_inner .msec2_cate ul li.on{ color: #fff;background-color: var(--yespen-color-2);}
#msec2 .sec_inner .msec2_cate ul li.on a {color: #fff}
#msec2 .sec_inner .msec2_cate ul li:hover{background-color: #cde5fc;}
#msec2 .sec_inner .msec2_cate ul li:hover a {color: var(--m-gray2);}


#msec2 .msec2_prd{}
#msec2 .msec2_prd>div{display: none; position:relative;opacity:0; transition:opacity .5s; height:640px;}
#msec2 .msec2_prd>div.show{display: block;}
#msec2 .msec2_prd>div.act{opacity:1}

#msec2 .msec2_prd .thumb span.sticker{z-index:1; position:absolute; width:2.5rem; height:2rem; display:inline-block; background-color:#333; color:#fff; border-radius:0%; line-height:2rem; text-align:center; right:0px; top:0px; font-size:.9rem; font-weight:400}

#msec2 .sec_inner .swiper {align-items: center;}

/* msec3-HOT BRAND 탭 */
#msec3{}
#msec3 .sec_inner{padding:0 10px }
#msec3 .sec_inner .title-warp{}
#msec3 .sec_inner .msec3_cate{padding : 10px 0;}
#msec3 .sec_inner .msec3_cate ul{}
#msec3 .sec_inner .msec3_cate ul li{ width:auto;}
#msec3 .sec_inner .msec3_cate ul li:first-child{}
#msec3 .sec_inner .msec3_cate ul li a{overflow:hidden; display:block; width:100%;background-color: #f4f4f4; border-radius: 0px;
    padding: 8px 10px; text-align:center; position:relative; font-size: 13px; font-weight: 400; display:block; transition:all .1s}
#msec3 .sec_inner .msec3_cate ul li.on>a{ color: #fff;background-color: var(--yes-color);}
#msec3 .msec3_prd{}
#msec3 .msec3_prd>div{display: none; position:relative;opacity:0; transition:opacity .5s}
#msec3 .msec3_prd>div.show{display: block;}
#msec3 .msec3_prd>div.act{opacity:1}

#msec3 .msec3_prd .thumb span.sticker{z-index:1; position:absolute; width:2.5rem; height:2rem; 
  display:inline-block; background-color:#333; color:#fff; border-radius:0%; line-height:2rem; text-align:center; right:0px; top:0px; font-size:.9rem; font-weight:500}


#msec3 .sec_inner .sec2_tit .nav_wrap{display: flex; align-items: center;gap: 8px;}
#msec3 .sec_inner .sec2_tit .nav_wrap>*{}
#msec3 .sec_inner .sec2_tit .nav_wrap .swiper-button-next{}
#msec3 .sec_inner .sec2_tit .nav_wrap .swiper-button-prev{}

#msec3 .sec_inner .swiper{}
#msec3 .sec_inner .swiper>ul{}
#msec3 .sec_inner .swiper>ul>li{display: flex; flex-direction: column; gap: 10px; align-items: center;}
#msec3 .sec_inner .swiper>ul>li>a{display: flex;width: 100%;transition: all .1s; overflow: hidden;border-radius: 50%; }
#msec3 .sec_inner .swiper>ul>li>a>img{width: 100%;transition: all .1s;}
#msec3 .sec_inner .swiper>ul>li>p{text-align: center;color: #000;font-size: 14px; font-weight: 600;}


/*sec1*/
/*
#sec1{margin-bottom: 60px}
#sec1 .swiper{}
#sec1 .swiper>ul{}
#sec1 .swiper>ul>li{}
#sec1 .swiper>ul>li>a{display:block; width:100%}
#sec1 .swiper>ul>li>a>img{width: 100%;}
#sec1 .swiper .btn_wrap{padding: 10px; position: absolute; z-index: 4; bottom: 0;right:0; width: max-content;display: flex; align-items: center; gap: 7px;}
#sec1 .swiper .btn_wrap>*{}
#sec1 .swiper .btn_wrap>ul{background-color: rgba(0,0,0,.4);display: flex; align-items: center; gap: 13px; padding: 5px 10px; border-radius: 25px;}
#sec1 .swiper .btn_wrap>ul li{}
#sec1 .swiper .btn_wrap>ul li>div:has(img){display: flex; align-items: center; justify-content: center;}
#sec1 .swiper .btn_wrap>ul li .swiper_prev{cursor: pointer; }
#sec1 .swiper .btn_wrap>ul li .swiper_prev img{}
#sec1 .swiper .btn_wrap>ul li .swiper-pagination{position: unset;color: #fff;font-size: 13px;display: flex; align-items: center; gap: 1px;}
#sec1 .swiper .btn_wrap>ul li .swiper-pagination span{display: inline-block; font-size: 13px;}
#sec1 .swiper .btn_wrap>ul li .swiper_next{cursor: pointer; }
#sec1 .swiper .btn_wrap>ul li .swiper_next img{}
#sec1 .swiper .btn_wrap .control{}
#sec1 .swiper .btn_wrap .control a{cursor: pointer; display: flex;transition: all .1s; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%;background-color: rgba(0,0,0,.4);}
#sec1 .swiper .btn_wrap .control a.clicked{opacity: .5;}
#sec1 .swiper .btn_wrap .control a img{}
#sec1 .swiper ul li.swiper-slide-active .txt_area p{transform: translateY(0px); opacity: 1;}
#sec1 .swiper ul li.swiper-slide-active .txt_area a.more{transform: translateY(0px); opacity: 1;}
#sec1 .swiper ul li .txt_area{overflow: visible; position: absolute; top: 50%; transform: translateY(-50%); width: 100%; left:0; padding-left:6%; max-width:95%}
#sec1 .swiper ul li .txt_area>*{transform: translateY(-25px);}
#sec1 .swiper ul li .txt_area p{opacity: 0; line-height: 1.3;}
#sec1 .swiper ul li .txt_area p.big{transition: all .6s;transition-delay: .1s;margin-bottom: 8px;}
#sec1 .swiper ul li .txt_area p.sub{  font-weight: 500; transition: all .6s; margin-bottom: 17px; transition-delay: .37s;}
#sec1 .swiper ul li .txt_area a.more{opacity: 0; transition-delay: .6s;}
*/

/*sec2*/
#sec2{}
#sec2 .sec_inner{}
#sec2 .sec_inner .sec2_tit{display: flex; align-items: center; justify-content: space-between;margin-bottom: 20px;}
#sec2 .sec_inner .sec2_tit h2{margin-bottom: 0;}
#sec2 .sec_inner .sec2_tit .nav_wrap{display: flex; align-items: center;gap: 8px;}
#sec2 .sec_inner .sec2_tit .nav_wrap>*{}
#sec2 .sec_inner .sec2_tit .nav_wrap .swiper-button-next{}
#sec2 .sec_inner .sec2_tit .nav_wrap .swiper-button-prev{}
#sec2 .sec_inner .swiper{}
#sec2 .sec_inner .swiper>ul{}
#sec2 .sec_inner .swiper>ul>li{display: flex; flex-direction: column; gap: 10px; align-items: center; width:100% !important;}
#sec2 .sec_inner .swiper>ul>li>a{display: flex;width: 100%;transition: all .1s; overflow: hidden;border-radius: 50%; }
#sec2 .sec_inner .swiper>ul>li>a>img{width: 100%;transition: all .1s;}
#sec2 .sec_inner .swiper>ul>li>p{text-align: center;color: #000;font-size: 14px; font-weight: 600;}

/*sec3*/
#sec3 .sec_inner{position:relative;}
#sec3 .sec_inner .sec3_cont .swiper{padding-bottom:25px;}


/* sec_tag */
#sec_tag {width:100%;position:relative;
  background: rgba(229, 214, 197, 0.2); border-bottom:3px dashed #fff; }
.tag_wrap {display:flex;flex-direction: column;align-items: center; margin:0 auto 50px !important;}
.tag_wrap .title_box {margin-bottom:50px;}
.tag_wrap .tag_keyword {max-width:700px;display:flex;flex-wrap:wrap;justify-content:center;}
.tag_wrap .tag_keyword a {display:inline-block;margin-right:16px;margin-bottom:16px;padding:12px 16px;
  border:1px solid #ddd;box-sizing:border-box;font-size:18px;color:#1a1a1a;line-height:24px;letter-spacing:-0.02em;
  border-radius: 10px;}
.tag_wrap .tag_keyword a:hover{background-color:var(--main-color); color:#fff;}
#sec4 .sec_inner .tag_keyword{}
#sec_tag .sec_inner .tag_keyword ul{margin: 0 auto; gap: 3px 5px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
#sec_tag .sec_inner .tag_keyword ul li{}

#sec_tag .sec_inner .tag_keyword ul li a{
    transition: all .1s;
    display: inline-block;
    padding: 8px 15px;
    border-radius: 20px;
    border: 1px solid #e6e6e6;
    font-size: 15px;
    line-height:1.5em;
    font-weight: 400;
}


/*sec4*/
#sec4{}
#sec4 .sec_inner{}
#sec4 .sec_inner ul{display: flex; flex-wrap: wrap; gap: 25px;}
#sec4 .sec_inner ul li{position: relative;width:100%}
#sec4 .sec_inner ul li>a{display: block;width: 100%;}
#sec4 .sec_inner ul li>a>img{width: 100%;}
#sec4 .sec_inner ul li .txt_area{position: absolute; top: 50%;transform: translateY(-50%);  left: 30px;  max-width: 80%  }
#sec4 .sec_inner ul li .txt_area p{}
#sec4 .sec_inner ul li .txt_area p.big{font-size: 25px; font-weight: 600; margin-bottom: 6px;transition-delay: .1s; color:#212121}
#sec4 .sec_inner ul li .txt_area p.sub{font-size: 14px;line-height:1.4;transition-delay: .27s; color:#383838}
#sec4.act .sec_inner ul li .txt_area p{transform: translateY(-15px); opacity: 1;}

/*sec6*/
#sec6{}
#sec6 h2{padding-left:5%}
#sec6 .sec_inner{position:relative; padding:0}
#sec6 .sec_inner .sec6_cont{padding-left:5%}
#sec6 .sec_inner .sec6_cont .swiper{}
#sec6 .sec_inner .sec6_cont .swiper ul{}
#sec6 .sec_inner .sec6_cont .swiper ul li{width:100%}
#sec6 .sec_inner .sec6_cont .swiper ul li a{display: block; width: 100%;overflow:hidden;}
#sec6 .sec_inner .sec6_cont .swiper ul li a img{width: 100%; transition:transform .3s}
#sec6 .sec_inner .sec6_cont .swiper ul li .txt_area{padding:12px 0}
#sec6 .sec_inner .sec6_cont .swiper ul li .txt_area p{transition: all .3s;}
#sec6 .sec_inner .sec6_cont .swiper ul li .txt_area p.big{color: #161616; font-size:17px; margin-bottom:6px}
#sec6 .sec_inner .sec6_cont .swiper ul li .txt_area p.sub{color: #555555; font-size: 14px;line-height:1.4}

/*sec7*/
#sec7{}
#sec7 .sec_inner{}
#sec7 .sec_inner .sec7_cont{}
#sec7 .sec_inner .sec7_cont>div{}
#sec7 .sec_inner .sec7_cont .banner_area{position:relative;flex-grow:1;}
#sec7 .sec_inner .sec7_cont .banner_area>a{display: block;width: 100%;}
#sec7 .sec_inner .sec7_cont .banner_area>a img{width: 100%;}
#sec7 .sec_inner .sec7_cont .banner_area .txt_area{position: absolute; top: 50%;transform:translateY(-50%); left:30px;  max-width: 80%  }
#sec7 .sec_inner .sec7_cont .banner_area .txt_area>*{color: #fff;}
#sec7 .sec_inner .sec7_cont .banner_area .txt_area p.big{font-size: 21px; font-weight: 600; margin-bottom: 7px;}
#sec7 .sec_inner .sec7_cont .banner_area .txt_area p.sub{font-size: 12px;line-height:1.3; transition-delay: .27s;}
#sec7 .sec_inner .sec7_cont .item_area{height:auto; overflow-y:auto; margin-top:12px;}
#sec7 .sec_inner .sec7_cont .item_area .swiper{height:100%}
#sec7 .sec_inner .sec7_cont .item_area ul{}
#sec7 .sec_inner .sec7_cont .item_area ul>li{ width:50%;  height:fit-content; padding:6px 0}
#sec7 .sec_inner .sec7_cont .item_area ul>li .thumb{width:50%}
#sec7 .sec_inner .sec7_cont .item_area ul>li .thumb>a{display:block; width:100%}
#sec7 .sec_inner .sec7_cont .item_area ul>li .thumb>a>img{object-fit: cover;}
#sec7 .sec_inner .sec7_cont .item_area ul>li .info{width:50%; padding:0 20px 0 20px; max-height:100%; }
#sec7 .swiper-vertical>.swiper-scrollbar{height:100%; width:2px; top:0; right:0}
#sec7 .swiper-horizontal>.swiper-scrollbar {  left: 1%;  bottom: 3px;  z-index: 50;  height: 8px;  width: 98%;}

/* sec8 */
#sec8{}
#sec8 .sec_inner{}
#sec8 .sec_inner h2{}
#sec8 .sec_inner .sec8_cate{margin-bottom: 10px; width:100%; overflow: hidden;}
#sec8 .sec_inner .sec8_cate ul{}
#sec8 .sec_inner .sec8_cate ul li{width:130px; height:70px;}
#sec8 .sec_inner .sec8_cate ul li a{display: flex; height:70px; align-items: center; justify-content: space-around;
  overflow: hidden;  text-overflow: ellipsis;
  font-size: 1rem;
  line-height: 1.1rem;
  letter-spacing: -0.3px;
  word-break: break-all;
}

#sec8 .sec_inner .sec8_cate ul li:first-child{}
#sec8 .sec_inner .sec8_cate ul li {overflow:hidden; display:block; 
  background-color: #f4f4f4; border-radius: 0px; padding: 0px 10px; text-align:center;
   color:rgb(67, 51, 139);position:relative; font-size: 1rem; ;
    display:block; transition:all .1s}

#sec8 .sec_inner .sec8_cate ul li:hover{background-color: #cde5fc;;}
#sec8 .sec_inner .sec8_cate ul li:hover.on{color:var(--m-gray2);}
#sec8 .sec_inner .sec8_cate ul li.on{background-color: var(--yespen-color-2);}
#sec8 .sec_inner .sec8_cate ul li.on a{color:#fff}
#sec8 .sec8_prd{}

#sec8 .sec8_prd>div{display: none; position:relative;opacity:0; transition:opacity .5s;}
#sec8 .sec8_prd>div>ul{display: inline-block;}
#sec8 .sec8_prd>div.show{display: block;}
#sec8 .sec8_prd>div.act{opacity:1}
#sec8 .sec8_prd .thumb span.sticker{z-index:1; position:absolute;
   width:2.5rem; height:2rem; display:inline-block; background-color:#e02626; color:#fff; border-radius:0%;
    line-height:2rem; text-align:center; left:0px; top:0px; font-size:.9rem; font-weight:500}
#sec8 .sec8_prd .thumb span.sticker{z-index:1; position:absolute; 
      width:2.5rem; height:2rem; display:inline-block; background-color:#333; color:#fff; border-radius:0%; 
      line-height:2rem; text-align:center; left:0px; top:0px; font-size:.9rem; font-weight:500}
    

#sec8 .brandmore_ {  display: block;     height: 36px;
    color: #e70e22;
    font-weight: 500;
    text-align: center;
    line-height: 36px;
    border-radius: 2px;
    border: 1px solid #f8b6bc
}
#sec8 .brandmore {
  position: relative;
  -webkit-box-align: center;
  text-align: center;
  box-sizing: border-box;
  height: 44px;
  margin-top: 10px;
  padding: 10px 0px 10px 12px;
  border: 1px solid rgb(225, 22, 47);
  background: linear-gradient(90deg, rgb(245, 2, 2) 0%, rgb(190, 4, 26) 100%) text;
    -webkit-text-fill-color: transparent;
}

#sec8 .brandmore .ico_left{width:1rem;  height:1rem;  display: inline-block;
  line-height: 1rem;  flex-shrink: 0;  color: rgb(225, 22, 47);  vertical-align: middle;
  margin: 0px 8px;}

#sec8 .brandmore a{ height:36px; width:100%; font-size: 16px; line-height:1.5 }

/*sec9*/
#sec9 {margin-bottom:70px !important;}
#sec9 .sec_inner h2{display: flex; align-items: center; gap: 16px;}
#sec9 .sec_inner h2 span{display: inline-block;color: #999999; font-size: 13px; font-weight: 500;}

#footer{margin-top:0 !important}


#eapps-instagram-feed-1 a svg{display:none !important; }


.caption-overlay .caption-short-caption {font-size:0 !important;}

.media-image-wrapper:hover .short-caption {font-size:0 !important;}


/* 상품 */
.procont{ margin: 30px 0 0;}
.procont .items li a img{ width: 100%; border-radius: 8px;}
.procont .items .slick-list{ padding-left: 62px;}
.procont .items .slick-slide{padding-right: 15px;}
.procont .items .slick-slide:nth-of-type(1){ margin-left: -48px;}


.cateTit{padding: 20px 16px;}
.cateTit h3{color: #000; font-size: 1.1rem; font-weight: 500;}
.shop_item_list,.shop_item_list2{padding : 5px 5px}
.shop_info{ margin: 11px 0 0;}
.prd-brnd{ margin: 0 0 2px; color: #757575; }
.shop_info .listName,.shop_info .prdname{ overflow: hidden;  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  --chakra-line-clamp: 2;
  font-size: 0.9rem;
  line-height:1rem;
  letter-spacing: -0.3px;
  word-break: break-all;}

.prd-price {display: flex; justify-content: space-around; margin-top:0.2rem;}
.prd-price:after{content:'';  clear:both}
.prd-price .dc_per{ float: left;  color: var(--red); font-size: 1rem; line-height:20px;}
.prd-price .price{ float: left; color: var(--m-gray2); font-size: 1rem; line-height:20px;}
.prd-price strike{ float: left; margin: 0 0 0 2px; color: var(--m-gray7); font-size: 0.85rem; line-height:20px;}

.prd-price1x{display: flex !important;text-align:center; align-items:center;}
.prd-price1x .dc_per{margin: 10px 10px; color: #ff7777; font-size: 16px; line-height:20px;}
.prd-price1x .price{margin: 6px  10px; color: #000; font-size: 16px; line-height:20px;}
.prd-price1x strike{ margin: 10px 10px; color: #757575; font-size: 13px; line-height:20px;}

.shop_item_list{float:left; }
.shop_item_list .thumb{width: 100%;position: relative;  }
.shop_item_list .thumb>a{display: block; width: 100%; overflow:hidden; }
.shop_item_list .thumb>a>img{width: 100%; transition:all .3s}
.shop_item_list .thumb span.num{display: inline-block; width: 50px; height: 50px;font-size:20px; font-weight:600; font-family: 'Pretendard', sans-serif;  position: absolute; top: 0; left: 0;  z-index: 10; background-color: #424e3aad; color: #fff; display: flex; align-items: center; justify-content: center;}
.shop_item_list .thumb .cart_icon{position:absolute; bottom:10px; right:10px; }
.shop_item_list .thumb .cart_icon a{display:flex; align-items:center; transition:all .2s; justify-content:center; width:31px; height:31px; background-color:#ababab; border-radius:50%; border: none;z-index: 1; overflow: hidden; position:relative;}
.shop_item_list .thumb .cart_icon a img{transform:scale(.66); transform-origin:center center; }
.shop_item_list .info{padding:8px 0; }
.shop_item_list .info p{margin-bottom:3px; font-size:15px; font-weight:500; text-align:left;font-family: "Pretendard Variable", Pretendard, sans-serif;}
.shop_item_list .info .prdname{ color:#000;font-weight:500;letter-spacing:-.7px; font-size:14px; line-height:1.8;
   text-overflow: ellipsis; height:30px; overflow: hidden;}
.shop_item_list .info .prdetc{color:#999999; font-size:14px;font-weight:500;  }
.shop_item_list .info .prdprice{margin-top:8px; font-size:13px; font-weight:500;}
.shop_item_list .info .prdprice span.won{ font-size:14px; font-weight:400;color:#111111; }
.shop_item_list .info .prdprice .price{font-size:14px; color:#000; font-weight:700;}
.shop_item_list .info .prdprice strike{ font-size:12px; color:#b6b6b6; display:inline-block; font-weight:500; margin-left:1px }
.shop_item_list .info .prdprice .percent{ font-size:14px;color:var(--main-color); font-weight:600; margin-right:2px}
.shop_item_list .info .prdbtn{}
.shop_item_list .info .prdbtn>span_ img{display:inline-block; margin:0 3px}
.shop_item_list .info .prdbtn>span,
.shop_item_list .shop_info .prdbtn>span {display:flex;}

.shop_item_list .info.listName{overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;  --chakra-line-clamp: 2;  font-size: .9rem;  line-height:.9rem;  letter-spacing: -0.3px;
  word-break: break-all;}
.name_link{    transition-property: var(--m-transition-property-common);  transition-duration: var(--m-transition-duration-fast);  transition-timing-function: var(--m-transition-easing-ease-out);
  cursor: pointer;  text-decoration: none;  display: block;  margin-top: .2rem;  padding-right:1rem;  color: var(--m-gray2);}


.shop_item_list2{float:left;}
.shop_item_list2 .thumb{width: 100%;position: relative;  }
.shop_item_list2 .thumb>a{display: block; width: 100%; overflow:hidden; }
.shop_item_list2 .thumb>a>img{width: 100%; transition:all .3s}
.shop_item_list2 .thumb span.num{display: inline-block; width: 50px; height: 50px;font-size:20px; font-weight:600; font-family: 'Pretendard', sans-serif;  position: absolute; top: 0; left: 0;  z-index: 10; background-color: #424e3aad; color: #fff; display: flex; align-items: center; justify-content: center;}
.shop_item_list2 .thumb .cart_icon{position:absolute; bottom:10px; right:10px; }
.shop_item_list2 .thumb .cart_icon a{display:flex; align-items:center; transition:all .2s; justify-content:center; width:31px; height:31px; background-color:#ababab; border-radius:50%; border: none;z-index: 1; overflow: hidden; position:relative;}
.shop_item_list2 .thumb .cart_icon a img{transform:scale(.66); transform-origin:center center; }
.shop_item_list2 .shop_info{padding:8px 0; }
.shop_item_list2 .shop_info p{margin-bottom:3px; font-size:15px; font-weight:500; text-align:left;font-family: "Pretendard Variable", Pretendard, sans-serif;}
.shop_item_list2 .shop_info .prdname{overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;  --chakra-line-clamp: 2;  font-size: .9rem;  line-height:.9rem;  letter-spacing: -0.3px;
  word-break: break-all;}
.shop_item_list2 .shop_info .prdetc{color:#999999; font-size:14px;font-weight:500;  }
.shop_item_list2 .shop_info .prd-price{display: inline-block; font-weight:500;}
.shop_item_list2 .shop_info .prd-price span.won{ font-size:14px; font-weight:400;color:#111111; }
.shop_item_list2 .shop_info .prd-price .price{font-size:1rem; color:var(--m-gray2); font-weight:700;}
.shop_item_list2 .shop_info .prd-price strike{ font-size:12px; color:#b6b6b6; display:inline-block; font-weight:500; margin-left:1px }
.shop_item_list2 .shop_info .prd-price .percent{ font-size:14px;color:var(--main-color); font-weight:600; margin-right:2px}
.shop_item_list2 .shop_info .prdbtn{}
.shop_item_list2 .shop_info .prdbtn>span_ img{display:inline-block; margin:0 3px}
.shop_item_list2 .ishop_infonfo .prdbtn>span,
.shop_item_list2 .shop_info .prdbtn>span {display:flex;}

.shop_item_list2 .shop_info.listName{overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;  --chakra-line-clamp: 2;  font-size: .9rem;  line-height:.9rem;  letter-spacing: -0.3px;
  word-break: break-all;}


/* BASIC css end */