html{background-color: #efefef; height: 100%; overflow-x: hidden; width:100%; font-size: 2.6666666667vw; font-family: 'NanumSquareNeo';}
body{color:#212121; margin-left:auto; margin-right:auto; background-color: #fff; font-size: 1.1em; height: 100%; line-height: 1.4; overflow-x: hidden;}



/* 스와이퍼 */

.swiper {
    width: 100%;
    height: 100%;
  }

  .swiper-slide {
    /* text-align: center; */
    /* font-size: 18px; */
    background: #fff;
    /* display: flex; */
    /* justify-content: center; */
    /* align-items: center; */
  }

  .swiper-slide img {
    display: block;
    width: 100%;
  }

/* header */
.header{position: fixed; width:100%; z-index: 99; top:0; z-index: 100;}
.header .main_nav{position: relative; height: 4em; background-color: #fff; display: flex; align-items: center; justify-content: center;color: #212121;}
.header .loginbtn{cursor: pointer; font-size: 0.8em; line-height: 1; padding: .6em 1em; border-radius: 2em; color: #ff8800; background-color: #ffe5c8;}



.header .main_head .prev img {width: auto;}
/* .header .main_head .prev img, .header .main_nav .prev img {height: .8em;} */
.header .main_head .but_type.right{top:53%;width: auto;}
.header .main_head .nav_inner.right button{width: 100%;padding: .5em 1.1em;border-radius: 1em;font-size: 0.95em;}


.header_flip{background-color:#f4f0ef; position: fixed; top:4em; width: 100%; padding:.5em 0; z-index: 11;}
.header_flip .bd{display: flex; align-items: center; justify-content: space-between;}


.header .prev{text-align: center; cursor: pointer;}
.header .prev img{height: 1.1em; width: auto;}

.header .sub_nav .CategoryList{height:40px; overflow-x: auto; max-width: 100%; overflow-y: hidden; white-space: nowrap; line-height: 36px;}

.header .sub_nav .CategoryList::-webkit-scrollbar {height:4px;}
.header .sub_nav .CategoryList::-webkit-scrollbar-thumb {background: #ded7c7;  border-radius: 4px;}
.header .sub_nav .CategoryList ul li.list_con{vertical-align: middle; display: inline-block; margin:0 12px; height:40px;}
.header .sub_nav .CategoryList ul li.list_con:last-child{margin-right:20px;}
.header .sub_nav .CategoryList ul li.list_con > a{color:#818181;}
.header .sub_nav .CategoryList ul li.list_con.active > a{font-weight:bold; color:#26ae5f; padding-bottom:4px; border-bottom:2px solid #26ae5f;}




/* 사이드바 */
.menu_bg{display: none; width: 100%; height: 100vh; background: rgba(0,0,0,.5); position: fixed; top: 0; z-index: 9998;}
.sidebar_menu{display: none; width: 70%; height: 100vh; background-color: #fff; position: fixed; top: 0; left: -50%; z-index: 9999;}

.sidebar_menu .menuclose{opacity: .5; position: absolute; width: 1.6em; height: 1.6em; border-radius: .5em; right: .2em; top: .2em; line-height: 1; font-size: 1.3em; display: flex; justify-content: center; align-items: center;}
.sidebar_menu ul{margin: 3em 0;}
.sidebar_menu ul li{padding: .6em 1em; width: 100%; font-size: 1.1em; font-weight: 600; color: #333; padding-left: 2.5em;}
.sidebar_menu ul li:nth-child(1){background: url() no-repeat left center;}



/*텍스트 컷*/
.text_cut{white-space: normal; display: -webkit-box !important; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;}
.text_cut02{white-space: normal; display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.text_cut03{white-space: normal; display: -webkit-box !important; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;}
.text_cut04{white-space: normal; display: -webkit-box !important; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;}


.hbgbtn{ width: 1.1em; height: 0.934em; display: none;}
.hbgbtn span{height: .134em; width: 100%; margin-bottom: 0.2667em; background-color: #333;}
.hbgbtn span:last-child{margin-bottom: 0;}


.nav_inner{display:inline-block; position: absolute; }

/* right */
.nav_inner .count{background-color:#3862F5; color:#fff; position: absolute; right: -0.8em; top: -0.6em; 
    width: 1.9em; height: 1.9em; display: flex; align-items: center; justify-content: center;
    border-radius: 50%; padding: 0.1em; font-size: 0.7em; 

}
.mypage_header .nav_inner.right{top: 1.2em;}
.daily_header .nav_inner.right{top: 1.7em;}
.nav_inner.right .count{right: -0.9em; top:-0.3em;}
.nav_inner.right{position: absolute; right: 1em; z-index: 10; top: 50%; transform: translateY(-50%);}
.nav_inner > span.prev{float:left; position: relative; margin-right:0.5em; cursor: pointer;display: block; padding: 0.2em 1em ; padding-left: 0; }
.nav_inner > span.notification{float:left; position: relative; margin-right:0.5em; cursor: pointer;display: block; padding: 0.2em 1em ; padding-right: 0; }
.nav_inner > span.notification img{width: 1em;}

/* .nav_inner.right > span .cart_ea{background-color:#3862F5; color:#fff; position: absolute; right: -1em; top: -1em; 
    width: 2em; height: 2em; display: flex; align-items: center; justify-content: center;
    border-radius: 50%; padding: 0.2em; font-size: 0.5em; 
} */
.nav_inner > span.logo {width:3.5em;}
.nav_inner.right > span:last-child{margin-right:0;}
.nav_inner span img{width: 75%;}
.nav_inner.right .kas{border-radius: 50%; display: inline-flex; overflow: hidden; margin-top: 1px;} 
/* center */
.nav_inner.center{left:50%; top:50%; transform: translate(-50%, -50%);}
.nav_inner.center select{font-weight: 600; text-align: center;  font-family: 'SUIT', sans-serif !important; font-size: 1.15em; padding-right: 1.2em; background: url(https://s3.ap-northeast-2.amazonaws.com/lbcontents/images/PEOPLESTORY/166172294350072.png)no-repeat right center /0.8em;} 
.nav_inner.center select option{display: flex; align-items: center; justify-content: center; padding: 1em;}
.nav_inner.center select:focus{outline: none;}
.nav_inner.center select option{padding: 1.2em; text-align: center;}
.nav_inner .main_logo{font-weight: 600; font-size: 1.1em; width: 30%;}
.nav_inner .ic_wrap {display: block;}
.nav_inner .ic_wrap > img {width: auto; height: 1.5em;}
.nav_inner.center h1.logo > a{text-indent: -9999px; opacity: 0;}

.nav_inner.center h2{font-size:1.125em; font-weight: bold;}

/* left */
.nav_inner.left{z-index: 11; left:1em; position: absolute; top:52%; transform:translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);}


.nav_inner.center .select {position: relative;}
.nav_inner.center .select p{font-weight: 700; font-size: 1.1em;}
.nav_inner.center .select img{width:0.8em;}
.nav_inner.center .select ul{display: none; position: absolute; left: 50%; transform: translateX(-50%); top: 2em; width: 110%; background-color: #fff; padding: 0.7em; box-shadow: 0px 0px 10px rgba(0,0,0,0.1);}
.nav_inner.center .select ul li + li{margin-top: 0.5em;}
/* --------------------------------------------------
------------------------footer-------------------- */
.footer{bottom:0; position: fixed; width: 100vw; background-color: #fff; padding:6px 0; border-top: 1px solid #ededed;}/* 1024px */
.footer li{width:25%; cursor: pointer; float:left; text-align: center; line-height: 1; position: relative; padding-bottom:13px;}
.footer li .nav_img{background-repeat: no-repeat; background-position: center; background-size: contain; height:24px;}
.footer li strong{font-size:10px; font-weight: bold; color:#a1a1a1; margin-top:4px; position: absolute; left:50%; transform: translateX(-50%); bottom:0; width: 100%;}
.footer li.on strong{color:#000;}
.footer li:first-child .nav_img{background-image: url(../images/nav1.svg);}
.footer li:nth-child(2) .nav_img{background-image: url(../images/nav2.svg);}
.footer li:nth-child(3) .nav_img{background-image: url(../images/i_menu.svg);}
.footer li:nth-child(4) .nav_img{background-image: url(../images/nav3.svg);}

.footer li.on:first-child .nav_img{background-image: url(../images/nav1_on.svg);}
.footer li.on:nth-child(2) .nav_img{background-image: url(../images/nav2_on.svg);}
.footer li.on:nth-child(3) .nav_img{background-image: url(../images/i_menu_on.svg);}
.footer li.on:nth-child(4) .nav_img{background-image: url(../images/nav3_on.svg);}





.footer_type1{bottom:0; position: fixed; width: 100vw; height: 50px; background-color: #fafafa;  border-top: 1px solid #ededed;
    display: flex; align-items: center;}
.footer_type1 button{font-size: 1em;}





#gnb .CategoryWrap {height: 0; overflow: hidden;-webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; display: none;
    position: fixed; top: 104px; right: 0; left:0;background: #fff;  width:1920px;}
#gnb .CategoryWrap.open{display: block;}
#gnb.open .CategoryWrap {height: 496px;}
#gnb .CategoryList {position: relative; z-index: 2; height: 100%; padding-top: 24px; box-sizing: border-box; max-width: 1200px; margin:auto;}

#gnb .CategoryList ul li{width:33.333%; float: left; padding-left:32px;}
#gnb .CategoryList ul li:first-child{padding-left:0;}
#gnb .CategoryList ul li .dep-wrap{width:50%; display: inline-block; margin-right:-4px; vertical-align: top; }
#gnb .CategoryList ul li .dep-wrap .dep1{font-weight:500;}
#gnb .CategoryList ul li .dep-wrap p[class*="dep"]{padding:3px 0;}
#gnb .CategoryList ul li .dep-wrap p > a:hover{color:#222; font-weight: 500;}


.sidebar{position: fixed; right:40px; bottom: 64px;}
.sidebar .top_btn{background-color:#fff; border-radius: 50%; border:1px solid #d1d1d1; width:40px; height:40px; text-align: center;}
.sidebar .top_btn span{padding-top:10px; display: block; font-size:13px; font-weight: 500;}


/* ********************************************* *
 * 1024px max
 * ********************************************* */
 @media (max-width:480px){
body{font-size: 15px;}
 }