/* BASIC css start */
.-mov {
    -ms-transition:    all 0.4s ease-out;
    -moz-transition:    all 0.4s ease-out;
    -webkit-transition: all 0.4s ease-out;
    -o-transition:      all 0.4s ease-out;
    transition:         all 0.4s ease-out;
}


/* 상단 배너 */
#topBanner { position:relative; overflow:hidden }
#topBanner .thmb { width:100%;  }
#topBanner .thmb img { width:100% }
#btBnnrClose { margin-top:-9px; position:absolute; top:50%; right:7px; width:17px; height:17px; text-indent:-9999em; background:url(/design/jneeds/wizmobile/btn_bnnr_close.png) 0 0 no-repeat; background-size:17px auto; cursor:pointer; z-index:10 }


/* 상단 */

.top-sp { height:120px;}

#header { position:relative; width:100%; top:0; left:0; z-index:99; background: #fff; border-bottom: 1px solid #000;}

#header .headerLnb {position: relative; width: 90%; max-width: 1024px; margin: 0 auto; font-size: 15px; line-height: 67px; height: 70px;}
#header .headerLnb ul:after { content: ""; display: block; clear: both;}
#header .headerLnb .left {width:20%; float:left; font-weight: bold; font-size: 16px;}
#header .headerLnb .left p { display: inline-block; *display: inline; *zoom: 1;}
#header .headerLnb .left img { max-width:22px; vertical-align:middle; margin-top: -4px; }
#header .headerLnb .center {float:left; width:56%; text-align:center; font-size:16px; font-weight:blod; letter-spacing:0.1em;}
#header .headerLnb .center img {width:60%; /*margin-top:20px;*/ margin-top:26px;}
#header .headerLnb .right {width:22%; float: right;}
#header .headerLnb .right p { display: inline-block; *display: inline; *zoom: 1; padding-left: 15px;}
#header .headerLnb .right img { max-width:20px; vertical-align:middle; margin-top: -4px; }

#header .headerLnb .sideMenuOpen { position:absolute; top:10px; left:17px; font-size:24px; color:#333; cursor:pointer }
#header .headerLnb .tlogo { margin:0 auto; text-align: center; line-height: 45px;}
#header .headerLnb .tlogo a { font-size: 20px; font-family: 'Poppins', 'Lato', 'Nanum Gothic', Arial; font-weight:700;color:#333;text-align: center; line-height: 45px;}


#header .headerLnb .tlogo .on img { height:50px; }
#header .headerLnb .tlogo .off { display: none; }
#header .headerLnb .tlogo .on.tscroll { display: none;   }
#header .headerLnb .tlogo .off.tscroll { display:block }
#header .headerLnb .tlogo .off img { height:50px; }


#header .headerLnb .searchToggle { position:absolute; top:10px; right:17px; font-size:20px; color:#333; cursor:pointer }
#header .searchLy { display:none; position:absolute; top:45px; left:0; width:100%; height:45px; background:#ccc; z-index:100 }
#header .searchLy .search {padding:8px 10px; position:relative; text-align:center; }
#header .searchLy .search .delete_btn { display:none; position:absolute; top:10px; right:40px; width:30px; height:24px; font-size:18px; color:#adadad; line-height:24px; z-index:10 }
#header .searchLy .search input { width:100%; height:29px; border:none; border-radius:15px; outline:none }
#header .searchLy .search .btn_search { position:absolute; top:12px; right:20px; font-size:20px; color:#666; }
#header .searchLy .clearTag { height:200px }

.mask {	display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.5; filter:alpha(opacity=50); z-index:990 }


/* ============= 스크롤후 위치영역 =============== */


#header .headerLnb.small { height: 35px;  box-shadow: 1px 1px 5px rgba(0,0,0,0.3); background:rgba(0,0,0,0.9);   }
#header .headerLnb.small .tlogo  { height: 35px;  }
#header .headerLnb.small .tlogo  a { color:#000; line-height: 35px; font-size: 18px; }
#header .headerLnb.small .tlogo { height: 35px;  padding:0px 0 0;}
#header .headerLnb.small .tlogo img { height: 35px; }


#header .headerLnb.small .hd_left li.menu a { color:#000; }

#header .headerLnb.small .sideMenuOpen { position:absolute;  top:6px; left:15px; font-size:22px; color:#fff; cursor:pointer }
#header .headerLnb.small .searchToggle { position:absolute;  top:6px;  right:15px;font-size:18px; color:#fff; cursor:pointer }
#header .headerLnb.small .searchLy { display:none; position:absolute; top:35px; left:0; width:100%; height:45px; background:#ccc; z-index:100  }


/* ============= 카테고리 영역 =============== */

#wmenu { width:100%; background:#fff;overflow:hidden; border-top:1px solid #ddd;  }
#wmenu li { position:relative;float:left;width:20%; text-align:center; border-right:1px solid #ddd; border-bottom:1px solid #ddd;  overflow: hidden;   text-overflow: ellipsis;  white-space: nowrap;-webkit-box-sizing:border-box;-khtml-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;box-sizing:border-box;}
#wmenu li a { display:block; text-align:center;color:#444; font-size:11px; font-weight:none; height:30px;line-height:30px;  }


#wmenu1.fixed { position:fixed; left:0;  top:35px; width:100%; background:#fff;overflow:hidden; border-top:1px solid #ddd;  z-index:100;}
#wmenu1 { width:100%; background:#fff;overflow:hidden; border-top:1px solid #ddd; }
#wmenu1 li{ position:relative;float:left;width:20%; text-align:center; border-right:1px solid #ddd; border-bottom:1px solid #ddd;   overflow: hidden;   text-overflow: ellipsis;  white-space: nowrap; -webkit-box-sizing:border-box;-khtml-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;box-sizing:border-box;}
#wmenu1 li a { display:block; text-align:center;color:#444; font-size:11px; font-weight:none; height:30px;line-height:30px;  }


#wmenu li:nth-child(1) a { color:#ff0000;  font-weight:bold ; }
#wmenu li:nth-child(2) a { font-weight:bold ; }
#wmenu li:nth-child(12) a { color:#ff0000;  font-weight:bold ; }

#wmenu1 li:nth-child(1) a { color:#ff0000;  font-weight:bold ; }
#wmenu1 li:nth-child(2) a { font-weight:bold ; }
#wmenu1 li:nth-child(12) a { color:#ff0000;  font-weight:bold ; }


/* ============= 상하이동버튼 ============= */
.pageTop {  display:none; position:fixed; bottom:80px; right:10px; z-index:100;}
.pageTop img { width:25px;display: block; margin-bottom:3px; }
.pageTop .btn_up {width:25px; height:25px; line-height:25px; display: block; text-align:center; border-radius:5px; color:#333;margin-bottom:10px; }
.pageTop .btn_down {width:25px; height:25px; line-height:25px; display: block;text-align:center; border-radius:5px; color:#333;}


/* ============= 사이드 메뉴 ============= */
#asideMenu { position:fixed; top:0; left:-82%; width:80%; height:100%; box-shadow:-5px 5px 5px 5px #000; background:#fff; z-index:9999; overflow-y:auto; overflow-x:hidden }

#asideMenu .aside_wrap {position: relative; width: 100%; /*margin: 10px auto;*/margin:20px auto; padding-bottom: 60px; text-align: left; font-size: 14px; line-height: 22px; text-transform:uppercase;}

#asideMenu .aside_wrap .top_menu { width:100%; background:#fff;overflow:hidden;}
#asideMenu .aside_wrap .top_menu ul {margin-left:60px;}
#asideMenu .aside_wrap .top_menu li { position:relative; float:left; /*font-size:12px;*/font-size:15px; display:inline; text-align:left; overflow: hidden;}
#asideMenu .aside_wrap .top_menu li a  { color: #000; font-family:"Noto Sans KR",malgun gothic,맑은고딕,NanumGothic,dotum,돋움,sans-serif; margin-right:30px; font-weight:normal; text-decoration: none; word-wrap:break-word; }


/* 카테고리 리스트 */
#asideMenu .categoryList { font-size: 13px; line-height: 32px; border-top:1px solid #1b1b1b; }
#asideMenu .categoryList ul { display:none; }
#asideMenu .categoryList li { position:relative; border-bottom:1px solid #1b1b1b; padding: 10px 0 10px 40px; }
#asideMenu .categoryList li.selected > ul { display:block; }
#asideMenu .categoryList li.selected > a.cate {  }
#asideMenu .categoryList li.noChild > a.cate { background-image:none !important; }
#asideMenu .categoryList li.noChild:first-child > a.cate { border-top:0; }
#asideMenu .categoryList li.selected.noChild { }
#asideMenu .categoryList > li.selected .slideSubMenu li {  }
#asideMenu .categoryList > li { }
#asideMenu .categoryList > li:first-child { border-top:0; }
#asideMenu .categoryList > li > a.cate {background-size:10px auto;}
#asideMenu .categoryList > li.selected > a.cate {}
#asideMenu .categoryList > li > ul { margin:0 0 20px; }
#asideMenu .categoryList > li > ul > li > a.cate { padding-left:42px; background-size:10px auto; margin-right:30px; }
#asideMenu .categoryList > li > ul > li.selected > a.cate { background-size:10px auto; }
#asideMenu .categoryList > li > ul > li > ul > li > a.cate { padding-left:49px; background-size:10px auto; margin-right:30px; }
#asideMenu .categoryList > li > ul > li > ul > li.selected > a.cate { border-bottom:1px solid #ebebeb; background-size:10px auto; }
#asideMenu .categoryList > li > ul > li > ul > li > ul > li a.cate { padding-left:56px; }
#asideMenu .categoryList a.cate { display:block; padding:0; word-wrap:break-word; }
#asideMenu .categoryList a.view {
    position:absolute; right:70px; top:8px; padding:0 7px; line-height:24px; color:#676767; font-size:0; font-weight:normal; width:100%; 
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    -ms-border-radius:3px;
    -o-border-radius:3px;
    border-radius:3px;
}
#asideMenu .categoryList li.noChild > a.view { display:none; }
#asideMenu .categoryList li.search { font-size: 14px; line-height:60px; text-decoration: underline;}


#asideMenu .boardList { display:none; margin-top:0; font-size: 13px;}
#asideMenu .boardList li {display: block !important; font-size: 12px; color: #000; padding: 5px 0 5px 15px; cursor: pointer; transition-duration: 0.5s;}
#asideMenu .boardList a { color: #000; display: block; font-family: "Noto Sans KR",malgun gothic,맑은고딕,NanumGothic,dotum,돋움,sans-serif; font-weight: 700; text-decoration: none; word-wrap:break-word; }

#asideMenu .menuList { margin: 50px 0 60px 0;}
#asideMenu .menuList li {display: inline-block; *zoom: 1;}
#asideMenu .menuList a {margin: 0 5px; word-wrap:break-word; }

#asideMenu .sns_area { padding:50px 0 20px 30px ; }
#asideMenu .sns_area img { max-height:26px; }

#asideMenu .left_info { font-size:0.9em; line-height:1.8em; padding:0 0 40px 30px; }

#asideMenu .cart_box { padding:0 0 20px 30px; font-size:1.2em; }

#asideMenu .multi_global{position: absolute; bottom: 0; left: 0; width: 100%; border-top: 1px solid #1b1b1b; padding: 20px 0 20px 15px; background: #f4f4f4; text-align: left;}
#asideMenu .btnClose { padding:13px; position: sticky; top:0; right:0; }

#asideClose { position:absolute; /*top:13px;*/top:20px; width:16px; height:16px;  text-align:center; line-height:16px; cursor:pointer; z-index:9999 }
#asideClose img {width:16px;}

/* 퀵메뉴 상단메뉴 */
.subTop-box {  }
.subTop-box a { float:left; width:25%; padding:10px 0; color:#fff; font-size:10px; text-align:center;  border-right:0; background-color:#333;  
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-ms-sizing:border-box;
-o-sizing:border-box;
box-sizing:border-box;
}


#subTop-box a.icon-add { }
#subTop-box a.icon-order {  }
#subTop-box a.icon-basket { }
#subTop-box a.icon-mypage { }


/* 검색 + 로그인 메뉴 */
.loginBox { clear:both; margin:0px 0 0px; padding:10px 0px 30px; text-align:center; background:#f1f1f1;  border:0px solid #000; }

#asideMenu .searchside { clear: both; width:95%; height:45px; padding:20px 0 10px; } 
#asideMenu .searchside .search {padding:8px 10px;  text-align:center; position:relative; }
#asideMenu .searchside .search input { width:100%; height:30px; border:none; background:#f7f7f7; }
#asideMenu .searchside .search .btn_search { position:absolute; top:12px; right:30px; font-size:12px; color:#000; font-weight:700;  z-index:10 }


.loginBox p { display:inline-block;   font-size: 14px;}
.loginBox p span { text-decoration:underline; font-weight: bold; color: #202020; font-size: 0.875em; }
.loginBox ul { font-size:0; margin-top:15px; }
.loginBox li { clear:both; display:inline-block; width:49%; height:35px; text-align:center; margin:0 0.5%; }
.loginBox li a { display:block; font-size:11px; color:#222; letter-spacing:0.1em; line-height:35px; border:1px solid #303030; border-radius: 3px; box-sizing:border-box; -webkit-box-sizing:border-box;  background:#fff; }
.loginBox li.first a { color:#fff; border:1px solid #303030; background:#303030; }


/* 카테고리메뉴 */

aside .asideTop { text-align:center; font-size: 0.875em;  overflow:hidden; padding: 0px 2px 10px;}
aside .asideTop a:first-child { border-left: 1px solid #585858;}
aside .asideTop a { width:33.33%; height:35px;  position:relative; font-weight:bold; border: 1px solid #585858; border-left: 0px;   background-color:#fff; line-height: 35px; color:#585858; display:inline-block; box-sizing: border-box;}
aside .asideTop a .fa {margin-top:10px;}
aside .asideTop a.act { background:#585858; color:#fff; }
aside .asideTop a.act em { position:absolute; left:44%; bottom:-6px; border-top:6px solid #585858; border-left:4px solid transparent; border-right:4px solid transparent;}


aside nav li {border-bottom:1px solid #ccc; position:relative;}
aside nav li a {display: block; height: 35px; line-height:35px; padding:0 0 0 20px; font-size:11px;  margin-right: 40px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: 'Lato','Montserrat','Noto Sans KR', 'Nanum Gothic', Sans-serif;  }
aside nav li .fa {position: absolute; top:0; right: 0; width: 40px; text-align: center; height: 35px; line-height:35px;}
aside nav li > ul {background-color:#f4f4f4; display:none; border-top:1px solid #6e6e6e;}
aside nav li > ul > li {border-bottom:0px none; border-top:1px solid #ccc;}
aside nav li > ul > li:first-child {border-top:0px none;}
aside nav li > ul > li a {padding:0 40px 0 30px; margin: 0;}
aside nav li > ul > li > ul {border-top:0px none; border-top:1px solid #ccc;}
aside nav li > ul > li > ul > li {border-bottom:0px none;}
aside nav li > ul > li > ul > li a {padding:0 0 0 40px; margin: 0; background-color: #DDDDDD;}

aside .navCommunity {display:none;}
aside .navMypage {display:none;}


.navCategory nav li:nth-child(1),
.navCategory nav li:nth-child(2) a { font-weight:bold ; }
.navCategory nav li:nth-child(12) a { color:#ff0000;  font-weight:bold ; }


.modal-body {position: relative; margin:0; padding:0;}
.modal-body ul {margin:0;}
.modal-body ul li{display: block !important; font-size: 12px; color: #000; padding: 5px 0 5px 15px; cursor: pointer; transition-duration: 0.5s;}
.modal-footer { position: absolute; bottom: 0; left: 0; width: 100%; *border-top: 1px solid #1b1b1b; padding: 20px 0 20px 40px; background: #f4f4f4; text-align:left;}
.modal-body ul li a {color:#000; display:block; font-family: "Noto Sans KR",malgun gothic,맑은고딕,NanumGothic,dotum,돋움,sans-serif; font-weight: 700; text-decoration: none;}
.modal-footer a {font-size: 12px; line-height: 23px; color: #1b1b1b; cursor: pointer;}
.modal-body .menu-list { padding-left: 0; display: block; position:relative; width: 100%; max-width: 450px; background: white; z-index: 999; overflow-y: auto; overflow-x: hidden; left:0;}
.modal-body .menu-list .menu-submenu { padding-bottom:10px;}
.modal-body .menu-list .menu-submenu li a {font-weight: 400;}

.modal-body .menu-list li:first-of-type { border-top: 0;}
.accordion-toggle, .accordion-content { cursor: pointer; font-size: 16px; position: relative; letter-spacing: 1px;}
.accordion-content { display: none;}
.accordion-toggle a:before, .accordion-toggle a:after { content: ''; display: block; position: absolute; top: 50%; right: 30px; width: 9px; height: 1px; margin-top: -1px; background-color: #000; transform-origin: 50% 50%; transition: all 0.3s ease-out;}
.accordion-toggle a:before { transform: rotate(-90deg); opacity: 1; z-index: 2;}
.accordion-toggle a.active:before { transform: rotate(0deg); background: #000 !important;}
.accordion-toggle a.active:after { transform: rotate(180deg); background: #000 !important; opacity: 0;}


/* ============= 퀵 메뉴 ============= */

#quick_fix {position:fixed;bottom:10px;left:5px;z-index:999;width:38px;border-radius:38px;}
#quick_fix .qbtn {width:38px;height:38px;text-align:center;background:rgba(0,0,0,0.7);border-radius:38px;line-height:38px;-webkit-transition:all .6s ease;-moz-transition:all .6s ease;-ms-transition:all .6s ease;-o-transition:all .6s ease;transition:all .6s ease;}
#quick_fix .qbtn i{color:#fff;font-size:20px;line-height:42px;}
#quick_fix .quickwrap{position:relative;}
#quick_fix .content{position:absolute;bottom:35px;left:0;height:auto;overflow:hidden;opacity:0;width:120px;margin:0 0 10px 0;background:#f7f7f7;border:2px solid #222;border-radius:7px;visibility:hidden;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;}
#quick_fix .show {height:auto;opacity:1;visibility:visible;}
#quick_fix .show {-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;}
#quick_fix .qbtnin {-webkit-transition:all .6s ease;-moz-transition:all .6s ease;-ms-transition:all .6s ease;-o-transition:all .6s ease;transition:all .6s ease;transform:rotate(135deg);-moz-transform:rotate(135deg);-webkit-transform:rotate(135deg);-o-transform:rotate(135deg);}
#quick_fix .quickwrap {position:relative;}
#quick_fix .footerBoard{overflow:hidden;padding:0;}#quickmenu .footerBoard ul{margin:-1px 0 0 -1px;font-size:12px;color:#333;z-index:999;}
#quick_fix .qmenu li{position:relative;padding:10px 0 10px 5px;margin:0 10px;border-bottom:1px solid #ddd;height:19px;line-height:19px;text-align:left;}
#quick_fix .qmenu li a{display:block;}#quickmenu .footerBoard li span{line-height:19px;}
#quick_fix .qmenu li span i {float:left;width:16px;margin:1px 10px 0 0;}


/* BASIC css end */