/* BASIC css start */
body{min-width:1620px}
#mask { display:none; position:fixed; top:0; left:0; right:0; bottom:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:200 }

/* header */
#header { position:relative; width:100%; background:#fff; z-index:10 }
#header .headerTop { margin:0 auto; position:relative; width: 95%; max-width: 1800px; *zoom:1 }

/* 상단고정 */
#header.header-scroll{ position: fixed; top: 0;}
#header.header-scroll .headerTop .tlogo{ margin: 30px 0; }
 
/* 왼쪽 */
#header .headerTop .menu_icon{position: absolute; top: 0; left: 0; cursor: pointer;}

/* 로고 */
#header .headerTop .tlogo { margin:60px 0; text-align:center }

/* 오른쪽 */
#header .headerTop .tnbRight{position: absolute; top: 0; right: 0;}
#header .headerTop .tnbRight:after { display:block; clear:both; content:'' }
#header .headerTop .tnbRight ul{float: left; margin-left: 10px;}
#header .headerTop .tnbRight ul:after { display:block; clear:both; content:'' }
#header .headerTop .tnbRight ul li{ float: left;}
#header .headerTop .tnbRight ul.log_pket li:before { content:" / "; display:inline-block; margin: 0 10px; color: #4c4c4c; font-size: 13px; font-family: "맑은 고딕",'Malgun Gothic',sans-serif;}
#header .headerTop .tnbRight ul.log_pket li:first-of-type:before{content: none;}
#header .headerTop .tnbRight ul.rit_pket li{ position: relative; margin-left: 28px;}
#header .headerTop .tnbRight ul.rit_pket li .user_basket_quantity{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -56%); color: #000; font-size: 10px; font-family: "맑은 고딕",'Malgun Gothic',sans-serif; font-weight: 600;}
#header .headerTop .tnbRight ul li a{color: #4c4c4c; font-size: 13px; font-family: "맑은 고딕",'Malgun Gothic',sans-serif; text-transform: lowercase;}

#header .headerGnb { min-width:1100px; border-bottom:1px solid #231f20 }
#header .headerGnb .gnbInner { margin:0 auto; position:relative; width:1100px }
#header .headerGnb .gnbInner ul { *zoom:1 }
#header .headerGnb .gnbInner ul:after { display:block; clear:both; content:'' }
#header .headerGnb .gnbInner ul li { margin:0 31px; position:relative; float:left }
#header .headerGnb .gnbInner ul li a { display:block; height:41px; font-size:14px; color:#202020; line-height:41px; white-space:nowrap; -webkit-transform:perspective(1px) translateZ(0); transform:perspective(1px) translateZ(0); box-shadow:0 0 1px transparent }
#header .headerGnb .gnbInner ul li a:before { content:""; position:absolute; left:50%; right:50%; bottom:0; height:2px; z-index:-1; background:#231f20; -webkit-transition-property:left, right; transition-property:left, right; -webkit-transition-duration:0.3s; transition-duration:0.3s; -webkit-transition-timing-function:ease-out; transition-timing-function:ease-out }
#header .headerGnb .gnbInner ul li a:active:before,
#header .headerGnb .gnbInner ul li a:focus:before,
#header .headerGnb .gnbInner ul li a:hover:before { left:0; right:0 }
#header .headerGnb .gnbInner ul li a:hover { *height:39px; *border-bottom:2px solid #000; }
#header .headerGnb .gnbInner ul li.first { padding-left:0 }
#header .headerGnb .gnbInner ul li.last { padding:0 0 0 40px }

/*슬라이드 메뉴*/
.mask{position: fixed; height: 100%; width:100%; background-color: rgba(0,0,0,0.6); z-index: 12; top:0;}
.mask{display:none;}
.smenuBox{background: #fff; width: 400px; height: 100vh; position: fixed; z-index: 15; border-right: 1px solid #ddd; padding: 60px 0 0; left:-440px; transition: 0.7s; top: 0; }
.smenuBox.on {left:0px;}
.smenuBox .closebtn{position: absolute; right: 30px; cursor: pointer;}
.smenuBox > img{width: 135px; margin: 0 0 0 40px;}

.headerGnb .gnbInner .menu-list{padding: 60px 0 20px;}
.headerGnb .gnbInner .menu-list > li{position: relative; border-top: 1px solid #d9d9d9; line-height: 55px; }
.headerGnb .gnbInner .menu-list > li:last-of-type{border-bottom: 1px solid #d9d9d9;}
.manuinba{position: absolute; bottom: 140px; left: 120px;}
.menu_list_in a, .menu-container .menu-list li.toggle > a{ padding: 19px 40px; color: #000; font-family: "맑은 고딕",'Malgun Gothic',sans-serif; font-size: 13px;}
.toggle, .menu-submenu { cursor: pointer; font-size: 14px; position: relative; letter-spacing: 1px;}
.menu-submenu { display: none; padding: 15px 40px; border-top: 1px solid #d9d9d9;}
.menu-submenu li {line-height: 30px;}
.menu-submenu .depth3{ display: none; padding: 10px 20px;}
.menu-submenu .depth3 li{line-height: 27px;}

/* 아이콘 */
.smenuBox .nalog{padding: 25px 16px; }
.smenuBox .nalog ul{ font-size: 0;}
.smenuBox .nalog ul li{ display: inline-block; width: 20%; text-align: center;}
.smenuBox .nalog ul li a{font-size: 13px; color: #4c4c4c; font-family: "맑은 고딕",'Malgun Gothic',sans-serif; text-transform: lowercase;}
.smenuBox .nalog ul li a img{display: block; margin: 0 auto 16px;}

/* 화살표 */
.ddBtn {
  padding:15px 20px;
  position: absolute;
  right: 17px;
  top: 15px;
}
.ddBtn:before{
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 1;
    z-index: 2;
}
.ddBtn:before, .ddBtn:after {
  content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: 12px;
    width: 15px;
    height: 1px;
    margin-top: -1px;
    background-color: #808080;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transition: all 0.3s;
    transition: all 0.3s ease-out;
}
.ddBtnActive {
  padding:15px 20px;
}
.ddBtnActive:before{   -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    background: #808080 !important;}

.ddBtnActive:after {   -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    background: #808080 !important;
    opacity: 0;

}
.menu-submenu li a{font-size: 13px; color: #808080; font-family: "맑은 고딕",'Malgun Gothic',sans-serif;}
/* BASIC css end */