/* BASIC css start */
.menu_on { height:100%; overflow:hidden;}
.menu_off {height:auto;overflow:initial}

#mask {width:100%;height:100%;position:fixed;top: 0;left:0;right:0;bottom:0;background-color: #111;z-index:1000;display:none;opacity: 0.7;}

#header { position:relative; width:100%; z-index:101 }
#header .gnbWrap { position:relative; height:53px }

#gnb { position:fixed; top:0; left:0; right:0; height:53px; width:100%; background:#fff }
#gnb .gnbact { position:relative; height:52px }
#gnb .gnbact .logo { position:absolute; top:0; left:15px; height:52px; line-height:52px }
#gnb .gnbact .logo a { font-size:28px; font-weight:bold; color:#2e2e2e; }
#gnb .gnbact p { font-size:25px; color:#2e2e2e; line-height:57px; text-align:center }
#gnb .gnbact p.menuOpen { position:absolute; top:0; right:0; width:52px; height:52px; }
#gnb .gnbact p.cart { position:absolute; top:0; right:39px; width:52px; height:52px }
#gnb .gnbact p.cart .user_basket_quantity { font-size: 12px; position: absolute; top: 10px; right: 10px; color: #fff; background-color: #2d2d2d; width: 16px; height: 16px; border-radius: 50px; line-height: 15px;}
#gnb .gnbact .search { position:absolute; top:0; right:75px; width:52px; height:52px }
#gnb .gnbact .search .searchBox { display:none; }
#gnb .gnbact .search .btn_search { display:inline-block; width:52px; height:52px; font-size:25px; color:#2e2e2e; line-height:57px; text-align:center }

/* 사이드 메뉴 */
.leftMenu{transition:all 0.3s;position:fixed;top:0;right:-100%;width:100%;bottom:0;-webkit-overflow-scrolling:touch;z-index:1001}
.leftMenu .topMenuArea { margin:4% auto; width:91%; text-align:center; }
.leftMenu .topMenu { height: 50px;line-height: 50px;}
.leftMenu .topMenu li { display:inline-block;width:18%;text-align:center; position:relative; }
.leftMenu .topMenu li a { color:#2d2d2d;  font-size:28px; }
.leftMenu .topMenu li a .user_basket_quantity { font-size: 12px; position: absolute; top: 10px; right: 10px; color: #fff; background-color: #2d2d2d; width: 16px; height: 16px; border-radius: 50px; line-height: 16px;}
.leftMenu.on{right:0;}
.leftMenu.on .shadow{display:block;}
.leftMenu .menuCnt{position:absolute;top:0;right:0;bottom:0;z-index:1;width:100%; overflow-y:auto; height:100%; background-color:#fff;}
.leftMenu .menuCnt .userInfo { margin: 20px auto 0; text-align:center; font-size:13px; }
.leftMenu .shadow{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.6);}
.leftMenu .loginBx{ position:relative; text-align:center; margin:10px auto 0; width:80%; }
.leftMenu .loginBx li { font-size:12px; float:left; width:50%; }
.leftMenu .loginBx li .xi-user,
.leftMenu .loginBx li .xi-user-o { font-size:30px; margin:0 0 5px; }
.leftMenu .loginBx li a { font-size:13px;padding:13px 0; display:block;margin:8px auto 20px; }
.leftMenu .loginBx li a.join { color:#fff; background-color:#2e2e2e; border:1px solid #2e2e2e; } 
.leftMenu .loginBx li a.login { color:#2e2e2e; background-color:#fff; border:1px solid #2e2e2e; } 
.leftMenu .asideClose{color:#414141;font-size:30px;text-align:center; z-index:100}

.leftMenu .menuCnt .search {width:69%; height:42px; margin:0 auto 30px; position:relative; padding-right:42px; text-align:center; }
.leftMenu .menuCnt .search .searchBox {width:100%;}
.leftMenu .menuCnt .search .searchBox input {width:100%; height:30px; border:0px none; margin-top: 6px; padding: 0 5px; border-bottom: 2px solid #2e2e2e;}
.leftMenu .menuCnt .search .btn_search {width:38px; line-height:46px; position:absolute; top:0; right:0; color:#2e2e2e; text-align:center;font-size:30px;}

.leftMenu .menuListLinkArea{border:1px solid #2e2e2e; border-bottom:none; width:80%;margin:0 auto;}
.leftMenu .menuListLinkArea ul{}
.leftMenu .menuListLinkArea .list{width:50%;float:left;text-align:center;}
.leftMenu .menuListLinkArea .link{position:relative;z-index:1;display:block;font-size:14px;font-weight:700;height:34px;line-height:34px;border-bottom:1px solid #919191;border-top:1px solid transparent;color:#fff;background-color: #e0e0e0;}
.leftMenu .menuListLinkArea .cate:after, 
.leftMenu .menuListLinkArea .board:before{content:"";display:block;position:absolute;bottom:-1px;top:-3px;width:1px;background-color:transparent;}
.leftMenu .menuListLinkArea .board:before{left:0;}
.leftMenu .menuListLinkArea .cate:after{right:0;}
.leftMenu .menuListLinkArea .link.on{z-index:2;border-bottom-color:transparent;color:#383838; background-color:#fff; border-top: 1px solid #2e2e2e; }
.leftMenu .menuListLinkArea .cate.on:after, 
.leftMenu .menuListLinkArea .board.on:before{background-color:#919191;}
.leftMenu .menuListWrap{ width:80%;margin:0 auto; border:1px solid #2e2e2e; border-top:none; padding:15px 0;}
.leftMenu .menuListWrap .menuList{display:none;}
.leftMenu .menuListWrap .menuList.on{display:block;}

/* dorpdown */
.asideNav .list{}
.asideNav .list:after{content:"";display:block;clear:both;}
.asideNav .link{display:block;margin-right:53px;height:35px;line-height:35px;font-size:13px;color:#383838;text-align:left;}
.asideNav .link:focus{color:#ffb400;}
.asideNav .openBtn{border:0;background:none;float:right;text-align:center;width:53px;height:35px;padding-top:3px;box-sizing:border-box;color:#8d8d8d;font-size:13px;}
.asideNav .listWrap{clear:both;display:none;padding:4px 0; }
.asideNav .listWrap>.list:last-child{border-bottom:0;}
.asideNav .depth1>.link{padding-left:30px;}
.asideNav .depth2>.link{padding-left:45px;}
.asideNav .link.last{margin-right:0;}
.asideNav .list.on>.listWrap{display:block;}
.asideNav .list.depth1.on>.link, .asideNav .list.depth1.on>.openBtn{}
.asideNav .list.depth1.on>.link{}
.asideNav .list.depth2 .link{font-size:12px;}
.asideNav .list.depth3{border-bottom:0;}
.asideNav .list.depth3 .link{}

/* BASIC css end */