/* BASIC css start */
/* BASIC css start */
.menu_on {height:100%; overflow:hidden; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden }
.menu_off {height:auto; overflow:initial;}

/* ÃÖ»ó´Ü ¹è³Ê */
#topBanner { position:relative; overflow:hidden }
#topBanner a { display:block }
#topBanner img { width:100% }

/* »ó´Ü ½ÃÀÛ */
#header { position:relative; width:100%; min-height:40px; z-index:100 }
#header .header {position:relative;width:100%;height: 45px;/*transition:all 0.5s ease 0s;*/transform:translateY(0);background: #e9e0d7;border-bottom: 1px solid #e5e5e5;}
#header .header.ani { transition:all 0.5s ease 0s; transform:translateY(-100%) }
#header .hdTop {position:relative;}
#header .hdTop .tlogo {/* padding-top:8px; */height: 45px;text-align:center;display: flex;align-items: center;justify-content: center;}
#header .hdTop .tlogo .fixed-logo{display: none;width: 58px;/* margin-top: 8px !important; */}
#header .hdTop .tlogo a {display:inline-block;/*width:80px;height:35px;text-indent:-9999em;background: url(//ebbda12.jpg3.kr/phps/m/common/sp_tlogo_new.png) 0 0px no-repeat;background-size:76px auto;*/}
#header .hdTop .tlogo a img{width: 58px;}
#header .hdTop .btnLeftAsideOpen {position:absolute;top: 24px;left:4px;width:35px;height:30px;text-indent:-9999em;background: url(//ebbda12.jpg3.kr/phps/m/common/sp_aside_left_btn.png) 0 0px no-repeat;background-size:35px auto;}
#header .hdTop ul { position:absolute;top: 24px; right:4px}
#header .hdTop li { float:left; position:relative; width:30px; height:30px }
#header .hdTop li a { display:block; height:30px; text-indent:-9999em; background:url(//ebbda12.jpg3.kr/phps/m/common/sp_hd_top_right.png) 0 0 no-repeat; background-size:60px auto }
#header .hdTop li a.btnCart {background-position: -5px 0;}
#header .hdTop li a.btnCart .count { position:absolute; top:2px; left:36%; width:16px; height:16px; font-size:8px; color:#fff; text-align:center; line-height:16px; text-indent:0; border-radius:100%; background: #8e6c54 }
#header .hdTop li a.btnRightAsideOpen {background-position: 0px -30px;}

#header .hdCateMenu {padding: 0 30px 0 3px;position:relative;height:35px;/* border-top:1px solid #e5e5e5;*/border-bottom:1px solid #e5e5e5;/* transition: .3s ease;*/transform:translateY(-100%);opacity:0;visibility:hidden;background:rgba(255,255,255,1);}
#header .hdCateMenu .cateArea .circleP::before {content: '';position: absolute;display:inline-block;width:4px;height:4px;border-radius:50%;background:#ff6b29;left: 5px;top: 10px;}
#header .hdCateMenu .cateArea .swiper-container {padding: 0 7px;display:block; overflow:hidden; }
#header .hdCateMenu .cateArea .swiper-slide {text-align: center;font-size: 15px;color: #555555;padding: 0px 10px; 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;width: auto !important;}
#header .hdCateMenu .cateArea .swiper-slide-active {width: auto !important;}
#header .hdCateMenu .cateArea a.active { font-weight:700 }
#header .hdCateMenu .cateArea a.b50 { font-weight:600 } 
 

.gnbSlider { line-height: 35px; }
.gnbSlider .swiper-wrapper { height: 35px; line-height: 35px; margin: 0 auto; }
.gnbSlider .swiper-slide { width: auto; }
.gnbSlider .swiper-slide a.red { color:#b4222a  }
.gnbSlider .headerSwiper-prevBtn:focus,.gnbSlider .headerSwiper-nextBtn:focus { outline: none !important;}
.gnbSlider .swiper-slide a {font-size: 15px;padding-right: 5px;}
.gnbSlider .swiper-slide:last-of-type a {padding-right:0px;}
.gnbSlider .headerSwiper-nextBtn { color:#000; font-size: 18px; right: 0px; left: auto; background-size: cover; position: absolute; top: 50%; transform: translateY(-50%); z-index:10; width: 35px; height: 100%; line-height: 33px; text-align: center; background: linear-gradient(to right,rgba(255,255,255,0),#fff 30%); }
.gnbSlider .headerSwiper-prevBtn { color:#000; font-size: 18px; left: 0px;  right: auto; background-size: cover; position: absolute; top: 50%; transform: translateY(-50%);z-index:10; width: 35px; height: 100%; line-height: 33px; text-align: center; background: linear-gradient(to left,rgba(255,255,255,0),#fff 30%); }
.gnbSlider .swiper-button-disabled { color:#cecece }
.gnbSlider .swiper-slide.swiperIndex a{font-weight:bold; }
.gnbSlider .swiper-wrapper .swiper-wrapper .swiper-slide a.on { font-weight: bold; }

#header.subHeader .hdTop {  }
#header.subHeader .hdTop .tlogo a { background-position:0px 0 }
#header.subHeader .btnLeftAsideOpen { background-position:0 0 }
#header.subHeader .hdTop li a.btnCart { background-position:-5px 0 }
#header.subHeader .hdTop li a.btnRightAsideOpen { background-position:0 -30px }

#header .header.fixed { position:fixed; top:0; left:0; right:0; height:auto; z-index:100 }
#header .header.fixed .hdCateMenu { height:35px; opacity:1; visibility:visible; transform: translateY(0); background:rgba(255,255,255,1) }
#header .header.fixed .hdTop {display:none;}
/* ÁÂÃø »çÀ̵å¸Þ´º */
#leftSideMenu {position:fixed;top:0;left:-100%;bottom:0;width:100%;height: calc(100% - 56px);background:#fff;z-index:3333;overflow-y:auto;-webkit-overflow-scrolling:touch;box-sizing: border-box;padding-bottom: 55px;}
#leftSideMenu .btnLeftAsideClose {position:absolute;top: 35px;right: 17px;}
 

.pageNav .cateList{position:relative;/* margin-bottom: 20px; */}
.pageNav .cateList a {padding-left: 4px;position: relative;height: 66px;font-size: 20px;color: #000;font-weight: 700;line-height: 66px;width: 50%;display: inline-block;}
.pageNav .xi {width: 50%;text-align: center;height: 66px;position: absolute;top: 0px;right: 0;font-size: 18px;line-height: 66px;color: #000;font-weight: bold;text-align: right;}
.pageNav .xi-angle-down-thin.on:before{content:"\e946"}
.pageNav .depth1>ul {display:none;/* margin-bottom: 20px; */overflow: hidden;background: #f6f6f6;padding: 10px 14px;}
.pageNav .depth2 {float: left;width: 50%;/* display: block; */font-size: 14px;background: #f6f6f6;}
.pageNav .depth2:first-child {border-top:0px none;}
.pageNav .depth2 a {padding: 10px 0px 10px 0px;margin: 0;color: #000;font-weight: 400;height: 37px;line-height: 37px;font-size: 14px;background: #f6f6f6;width: 100%;display: inline;}
.pageNav .depth2 > ul{border-top:0px none; display:none;}
.pageNav .depth3 {border-bottom:0px none;}
.pageNav .depth3 a {padding:0 0 0 40px;margin: 0;background-color: #dfdfdf;}
.pageNav.noDepth .cateList a{margin-right:5px;}
.pageNav .depth2 .bold{font-weight:bold}


.top_banner_slide {width:100%;height: 28px;line-height: 28px;background: #8e6c54;}
.top_banner_slide.off {display:none;}
.top_banner_slide .swiper-slide {  }
.top_banner_slide a {width:100%;text-align:center;display: block;color: #fff;letter-spacing: -0.02em;-webkit-box-sizing: border-box;box-sizing: border-box;font-size: 12px;font-weight: 400;display: flex;align-items: center; justify-content: center; height: 28px;}
.top_banner_slide a span { font-weight:700; }

.top_banner_slide a em {
    -webkit-mask: url(/design/ebbda12/newFolder/img/arrow.svg);
    cursor: pointer;
    display: block;
    background: #fff;
    -webkit-mask-position-x: center !important;
    -webkit-mask-position-y: center !important;
    -webkit-mask-size: contain !important;
    -webkit-mask-repeat: no-repeat !important;
    -webkit-mask-origin: initial !important;
    -webkit-mask-clip: initial !important;
    transition: .2s all;
    width: 6px;
    height: 28px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 9px;
}

/* ¸®´º¾ó */
.bottom-nav {
    position: fixed;
    bottom: 0;
    width: 100%;
    background: #fff;
    z-index: 1111;
    border-top: 1px solid #e6e6e6;
    /* box-shadow: 0px -4px 8px rgba(0, 0, 0, 0.06);*/
    box-sizing: border-box;
    padding-bottom: env(safe-area-inset-bottom);
}

.bottom-nav ul {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 0;
    margin: 0;
    list-style: none;
}

.bottom-nav ul li {
    flex: 1;
    height: 56px;
    box-sizing: border-box;
    padding: 5px 0 5px;
}
.bottom-nav ul li + li {border-left:1px solid #fbfafa;}
.bottom-nav li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: #000;
    font-size: 11px;
    font-weight: 500;
    justify-content: flex-end;
    height: 100%;
    position: relative;
}
.bottom-nav ul li a .count {
    position: absolute;
    top: 0px;
    right: 0;
    left: 22px;
    width: 16px;
    height: 16px;
    font-size: 8px;
    color: #fff;
    text-align: center;
    line-height: 16px;
    text-indent: 0;
    border-radius: 100%;
    background: #8e6c54;
    margin: 0 auto;
}
.bottom-nav img {
    max-width: 30%;
    margin-bottom: 5px;
    max-height: 21px;
}

.bottom-nav ul li:nth-child(1) img {
    max-width: 20%;
    margin-bottom: 8px;
    max-height: 14px;
}

.bottom-nav ul li:nth-child(2) img {
    max-width: 38%;
    max-height: 18px;
}

.bottom-nav ul li:nth-child(3) img {
}

.bottom-nav ul li:nth-child(4) img {
    max-width: 28%;
    max-height: 20px;
}

.bottom-nav ul li:nth-child(5) img {
    max-width: 28%;
} 
.menu-wrap {
  display: flex;
  height: calc(100vh - 130px - 112px);
  padding-top: 130px;
}
.menu-left {
  width: 140px;
  background: #f6f6f6;
  overflow-y: auto;
}
.menu-left li {
  padding: 17px 20px;
  cursor: pointer;
  color: #000;
  font-size: 15px;
  line-height: 1;
}
.menu-left li.active {
  background: #fff;
  color: #000;
  font-weight: bold;
}
.menu-right {
  flex: 1;
  overflow-y: auto;
  /*padding: 10px 20px calc(100vh - 315px); ¾Æ·¡°ªÀ¸·Î Á¶Á¤ÇÔ*/
  padding: 10px 20px calc(100vh - 650px);
}
.submenu {
  margin-bottom: 12.5px;
  padding-bottom: 12.5px;
  border-bottom: 1px solid #d2d2d2;
}

.menu-top {height: 130px;overflow: hidden;position: absolute;top: 0;left: 0;width: 100%;background: #fff;}

.menu-top .search {
    padding: 24px 15px 15px;
}

.menu-top .search .searchBox {
    padding-right: 28px;
}

.menu-top .search .searchBox input {
    background: #f5f5f5;
    height: 35px;
    line-height: 35px;
    border: 0;
    padding: 0 15px;
    border-bottom: 1px solid #d2d2d2;
    color: #000;
    outline: 0;
    width: 100%;
    font-size: 16px;
}

.menu-top .search .searchBox input::placeholder {
    color: #9e9e9e;
}

#leftSideMenu .btnLeftAsideClose img {
    width: 12px;
}

.menu-top .search .searchBox .btn_search {
    position: absolute;
    top: 33px;
    right: 60px;
}

.menu-top .search .searchBox .btn_search img {
    width: 15px;
}

.menu-top .hotKeyword {
    display: flex;
    gap: 6px;
    white-space: nowrap;
    padding: 0 15px 15px;
    overflow-y: hidden;
    overflow-x: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE, Edge */
    border-bottom: 1px solid #d2d2d2;
}
.menu-top .hotKeyword::-webkit-scrollbar {
    display: none; /* Chrome, Safari */
}
 

.menu-top .hotKeyword li {}

.menu-top .hotKeyword li a {
    font-weight: 500;
    color: #000;
    font-size: 14px;
    background: #f2ece7;
    line-height: 1;
    padding: 13px;
    display: block;
    border-radius: 45px;
}

.menu-right a {
    font-size: 14px;
    display: block;
    padding: 10px 0;
}

.menu-right a.all {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 3px;
}
   
.asideFixedBottom {
    background: #f6f6f6;
    border-top: 1px solid #d2d2d2;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 55px;
    box-sizing: border-box;
    position: absolute;
    bottom: 0;
    left: 0;
}

.asideFixedBottom .left {
    color: #666666;
    font-size: 12px;
    display: flex;
    gap: 10px;
    align-items: center;
}

.asideFixedBottom .line {
    background: #d2d2d2;
    height: 23px;
    width: 1px;
    margin: 0 14px;
}

.asideFixedBottom .left img {
    width: 20px;
}

.asideFixedBottom .left a {
    color: #666666;
    font-size: 12px;
}

.asideFixedBottom .right {
    display: flex;
    align-items: center;
    gap: 6px;
}

.asideFixedBottom .right img {
    width: 25px;
} 
/* BASIC css end */



/* BASIC css end */