@charset "utf-8";

#top_nav_wrap{position:relative;min-width:1070px;width:100%;height:72px;line-height:1.5;background:rgba(255,255,255,.7)}

/* 로고 */
.main_logo{position:fixed;top:50px;left:230px}
.sub_logo{position:absolute;top:26px;left:40px}

/*메인 탑메뉴 스타일*/
#main_hd_wrapper{position:fixed;left:-52%;width:353px;height:100%;background:#26272b}
#main_top, #main_top *, #main_top:before, #main_top:after{box-sizing:border-box}
#main_top > ul{margin-top:104px}
#main_top li.bmenu:hover{background-color:rgb(22, 22, 25)}
#main_top li.bmenu > a{display:block;position:relative;width:100%;height:50px;padding-left:30px;font-size:15px;line-height:50px;color:#b1b1b1;letter-spacing:-0.3px;transition:all .2s}
#main_top li.bmenu > a:after{display:block;position:absolute;top:0;right:28px;content:"\f105";font-size:20px;font-weight:normal;color:#666666;font-family:'FontAwesome';transform:rotate(90deg)}
#main_top li.bmenu > a.active:after{transform:rotate(-90deg)}
#main_top li.bmenu > ul.smenu{display:none;padding-bottom:10px}
#main_top li.bmenu > ul.smenu li a{display:block;width:100%;padding-left:30px;font-size:13px;line-height:26px;color:#9d9d9d;transition:all .2s}
#main_top li.bmenu > ul.smenu li a:hover{color:#fff}
#sh_hd_wrapper .top_contact{padding:30px;font-family:'arita-medium'}
#sh_hd_wrapper .top_contact li{position:relative;padding-left:18px;margin-bottom:7px;font-size:14px;color:#919193}
#sh_hd_wrapper .top_contact li.tel:before{display:block;position:absolute;top:0;left:0;content:"\f095";color:#b8b8bb;font-family:'FontAwesome'}
#sh_hd_wrapper .top_contact li.address:before{display:block;position:absolute;top:0;left:0;content:"\f041";color:#b8b8bb;font-family:'FontAwesome'}
#sh_hd_wrapper .top_contact li.email:before{display:block;position:absolute;top:0;left:0;content:"\f0e0";font-size:11px;color:#b8b8bb;font-family:'FontAwesome'}

/*서브 탑메뉴 스타일 */
#sub_hd_wrapper{position:relative;width:100%;height:81px;background:rgba(255,255,255,.9);font-family:'arita-medium'}
#sub_top, #sub_top *{box-sizing:border-box}
#sub_top .top_nav{position:absolute;top:30px;right:30px;visibility:visible}
#sub_top .top_nav:after{display:block;content:"";visibility:hidden;clear:both}
#sub_top .top_nav > li{float:left;position:relative;padding:0 20px 28px}
#sub_top .top_nav > li > a{display:block;font-size:15px;letter-spacing:-0.3px;color:#777;transition:all .2s}
#sub_top .top_nav > li > ul{display:none;position:absolute;top:70%;left:0;z-index:1002;min-width:140px;width:auto;border:1px solid #e7e7e7;border-radius:2px;background-color:#fff}
#sub_top .top_nav > li > ul > li{float:none;padding:10px 20px;transition:all .2s}
#sub_top .top_nav > li > ul > li:hover{background-color:#f7f7f7}
#sub_top .top_nav > li > ul > li a{position:relative;font-size:13px;color:#666;transition:all .2s}
#sub_top .top_nav > li > ul > li a:hover{color:#222}


/* 메뉴 전체보기 버튼 ----------------------------------------- */
#allmn_btn_wrap{position:absolute;top:0;left:0;z-index:1002}
#allmn_btn_wrap, #allmn_btn_wrap *{box-sizing:border-box}
#allmn_btn{display:block;position:relative;width:115px;height:100px;cursor:pointer;background:url('/sh_img/hd/top_menu/open_allmn.png') center no-repeat;transition:all .1s}
#allmn_btn.active{z-index:200;background:url('/sh_img/hd/top_menu/close_allmn.png') center no-repeat}
#allmn_btn .cross_btn{position:relative}
#allmn_btn.active span{background-color:transparent}
#allmn_btn.active span:before{width:2px;height:16px;border-radius:0;-webkit-transform:translateY(10px) translateX(0) rotate(45deg);-ms-transform:translateY(10px) translateX(0) rotate(45deg);transform:translateY(10px) translateX(0) rotate(45deg)}
#allmn_btn.active span:after{width:2px;height:16px;border-radius:0;-webkit-transform:translateY(-10px) translateX(0) rotate(-45deg);-ms-transform:translateY(-10px) translateX(0) rotate(-45deg);transform:translateY(-10px) translateX(0) rotate(-45deg)}

/* sns 로고 */
#sns_logo{position:absolute;left:50px;bottom:30px;display:flex;flex-direction:column;align-items:center;gap:20px}
#sns_logo a{display:block;font-size:24px;}
#sns_logo a img{width:24px;}