/***   공통   ***/
h1.logo a {font-size: 25px;}
h1.logo a span {vertical-align: middle;}


/***  Header  ***/
#header{position:absolute; z-index:1025; width:100%;  transition: all 0.3s; height: 95px;}
#header a, #header button span, #header i {color: #fff;}

/*  fixed + hover  */
#header.fixed, #header:hover {position:fixed;background:#fff;}
#header.fixed a, #header.fixed button span, #header.fixed i,
#header:hover a, #header:hover button span, #header:hover i{color: #111;}
#header.fixed button span, #header:hover button span{color: #666;}
#header.fixed .header_in .lang_wrap button.lang_btn, #header.fixed .header_in .lang_wrap.on .lang_list,
#header:hover .header_in .lang_wrap button.lang_btn, #header:hover .header_in .lang_wrap.on .lang_list{border: 1px solid #666;}
#header.fixed .header_in .lang_wrap.on .lang_list, #header:hover .header_in .lang_wrap.on .lang_list {background: #fff;border-top: none;}

#header .header_in {display: flex;justify-content: space-between;max-width:1730px;margin:0 auto;box-sizing:border-box;align-items: center;height: 100%;}
#header .header_in h1 {display:inline-block;}
h1.logo a img {max-width: 100px;}
#header .header_in .sitemap {display:none;}

#header .header_in #gnb_nav{text-align: center;}
#header .header_in #gnb_nav #menu .menu {display: flex;}
#header .header_in #gnb_nav #menu .menu > li  {transition: all 0.3s;}
#header .header_in #gnb_nav #menu .menu li {position:relative;display:inline-block;width: 160px;}
#header .header_in #gnb_nav #menu .menu li a{display:block;font-size: 18px;font-weight: 500;padding: 36px 20px;}
/* hover */
#header .header_in #gnb_nav #menu .menu > li:hover {background: #ffffff; transition: all 0.3s; box-shadow: -10px 0 10px -10px #ededed, 10px 0 10px -10px #ededed;}
#header .header_in #gnb_nav li:hover a {color: #da0000;}
#header .header_in #gnb_nav #menu .menu > li:hover .menu_depth { box-shadow: 0 10px 10px -10px #ededed, -10px 0 10px -10px #ededed, 10px 0 10px -10px #ededed;}

#header .header_in #gnb_nav #menu .menu .menu_depth {position:absolute;background: #fbfbfa;top: 95px;left: 0;visibility:hidden;opacity: 1;}
#header .header_in #gnb_nav #menu .menu .menu_depth ul {margin: 15px 0;}
#header .header_in #gnb_nav #menu .menu .menu_depth li {display:block;margin:0;padding:0;text-align:center;width: 160px;}
#header .header_in #gnb_nav #menu .menu .menu_depth li a {position:relative;display: block;font-size: 16px;line-height:1;white-space:nowrap;font-weight: 400;padding: 10px 0 15px; color: #111111;}
#header .header_in #gnb_nav #menu .menu .menu_depth li:last-child a {margin-bottom:0;}
/* hover */
#header .header_in #gnb_nav #menu li:hover > .menu_depth {visibility:visible; opacity:1;}
#header .header_in #gnb_nav #menu .menu .menu_depth li a:hover {text-decoration: underline;}

#header .header_in .lang_wrap {position: relative;text-align: center;cursor:pointer;font-family: 'Oxanium', cursive;color: #666;margin-left: 80px;}
#header .header_in .lang_wrap button.lang_btn {border-radius: 50px;background: none;position: relative;line-height: 30px;border: 1px solid #fff;padding: 5px 20px;}
#header .header_in .lang_wrap a {display: block;width: 100%;line-height: 2;}
#header .header_in .lang_wrap span, #header .header_in .lang_wrap a {font-size: 16px;}
#header .header_in .lang_wrap i {padding-left: 30px;font-weight: 600;font-size: 16px;}
#header .header_in .lang_wrap .lang_list {width: 100%;height: 0%;background: transparent;position: absolute;top: 44%;left: 0;padding-top: 40px;overflow: hidden;transition: all 0.5s;z-index: -1;}
#header .header_in .lang_wrap .lang_wrap a {display: block;width: 100%;line-height: 33px;}
/* hover */
#header .header_in .lang_wrap li:hover > a {color: #006abc;}
/* on */
#header .header_in .lang_wrap.on .lang_list {height: 120px;border: 1px solid #fff;border-top: none;padding-top: 40px;transition: all 0.5s;}





/***  mobile  ***/
.noScroll{overflow:hidden;}
#menuArea {position:fixed;top:0;right:0;width:100%;overflow-x:hidden;z-index:9999999999;height:100%;transform: translateX(100%);transition: all .5s;}
/* open */
#menuArea.open {transform: translateX(0);transition: all .5s;}
#menuArea .menuList {position:absolute;top:0;height:100%;width:100%;box-sizing:border-box;overflow-x:hidden;overflow-y:auto;background: #006abc;}
.menuList .menuUtil {display:none;}

.menuList h1{display:inline-block; padding:25px 0; z-index:99999999999;}
.menuList h1 a{display:block; color: #fff; font-size: 37px; font-style: italic; font-weight: 500;}
#menuArea .menuList .width1240{position: relative;border-bottom: 1px solid #eeeeee;height: 80px;}
.btnMenu_mClose {position:absolute;right:2%;top: 27.5px;}


#menuArea .menuList>.list {position:relative;top: 0;left: 0;}
#menuArea .menuList>.list>li.active {}
#menuArea .menuList>.list>li>a {position:relative;display: block;padding: 20px 2% 15px;font-size: 24px;line-height:100%;color:#fff;font-weight:400;text-decoration:none !important;z-index: 1;}
#menuArea .menuList>.list>li.active ul {background: #fff;}


#menuArea .menuList>.list .sMenu {position: relative;padding: 10px 0;display:none;}
#menuArea .menuList>.list .sMenu>li {}
#menuArea .menuList>.list .sMenu>li>a {position:relative;display: block;padding: 10px 2%;border:none;text-decoration:none !important;font-size: 20px;color: #222;}
/* #menuArea .menuList>.list .sMenu>li>a:after {content:'';width:0;height:1px;background-color:#fff;position:absolute;bottom:5px;left: 50%;transition:all 0.3s;} */
#menuArea .menuList>.list .sMenu>li>a:hover{color: #006abc;transition: all 0.3s;font-weight:bold;}
#menuArea .menuList>.list .sMenu>li>a:hover:after {width:100%; transition:all 0.3s;}


#grayLayer {width:100%; height:100%; background:rgba(0,0,0,0.9); position:fixed; left:0; top:0; z-index:1; overflow-x:hidden;overflow-y:auto;display:none;}
#grayLayer > a {display:block;width:100%;height:100%}


/***  footer  ***/
#footer .c_white {color: #fff !important;}
/**/
#footer {position:relative;width:100%;clear:both;background: #262626;cursor: default;}
#footer .foot_in {position:relative;margin:0 auto;width: 100%;max-width: 1730px;padding: 55px 0;}
#footer .foot_in h1.logo a span, #footer .foot_in .menu .fsite span {color: #939393;}
#footer .foot_in > h1.flogo {margin:0 0 40px; }
#footer .foot_in .menu{margin: 45px 0 20px; font-size: 16px}
#footer .foot_in .menu, #footer .foot_in .menu .ft_menu{display: flex;}
#footer .foot_in .ft_menu li:first-child a {padding-left: 0;}
#footer .foot_in .ft_menu li:last-child a {padding-right: 0;}
#footer .foot_in .ft_menu li a, #footer .foot_in .ft_menu li:after {color: #8d8d8d;}
#footer .foot_in .ft_menu li a{font-family: 'SUIT', sans-serif; padding: 0 15px;}
#footer .foot_in .ft_menu li:after {content: "/";display: inline-block;}
#footer .foot_in .ft_menu li:last-child:after {display: none;}
#footer .foot_in div > p.address {color: #bdbdbd;line-height: 1.6;}
#footer .foot_in div > p.address, #footer .foot_in div > p.copyright, #footer .foot_in .menu .fsite ul li a {font-size: 15px;}
#footer .foot_in div > p.address, #footer .foot_in div > p.copyright span {color: #eee;}
#footer .foot_in div > p.address span {position: relative; padding: 0 30px 0 5px;}
#footer .foot_in div > p.address span, #footer .foot_in div > p.copyright {color: #999;}
#footer .foot_in div > p.address span:after {content: '';width: 1px;height: 13px;position: absolute;background-color: #bdbdbd;top: 5px;right: 13px;}
#footer .foot_in div > p.address span:last-child:after {display: none;}
#footer .foot_in div > p.copyright {margin-top: 20px;}
#footer .foot_in div > p.copyright br {display: none;}
#footer .foot_in div > p br {display: none;}

#footer .foot_in .menu .fsite {position: absolute;top: 110px;right: 0;border: 1px solid #939393;width: 260px;height: 50px;cursor: pointer;transition: all 0.5s;} 
#footer .foot_in .menu .fsite span {position: relative;display: flex;justify-content: space-between;padding: 14.5px 20px;align-items: baseline;} 
#footer .foot_in .menu .fsite ul {transform:translateY(-100%);transition: all 0.5s;position: absolute;top: -1px;right: auto;width: 100%;height: 0;background: #006abc;z-index: -1;overflow: hidden;}
#footer .foot_in .menu .fsite span.open+ul {display: block;transition: all 0.5s;height: 120px;z-index: 1;}
#footer .foot_in .menu .fsite ul li {border-bottom: 1px solid #eee;}
#footer .foot_in .menu .fsite ul li a {display: block;color: #fff;padding: 10px 10px;} 
#footer .foot_in .menu .fsite ul li a, #footer .top_btn_box span {color: #fff;} 
#footer .foot_in .menu .fsite ul li:last-child {border-bottom: none;}
	/* hover */
#footer .foot_in .menu .fsite:hover, #footer .foot_in .menu .fsite:active { background: #eee; transition: all 0.5s;}

#footer .top_btn_box{font-size: 18px;position: absolute;right: 10px;top: 55px;cursor: pointer;}





/*************** 반응형 ***************/

@media all and (max-width:1780px) { /* 간격 */
#header .header_in {padding: 0 2%}
#footer .foot_in {padding: 55px 2%;}
/**/
#footer .top_btn_box, #footer .foot_in .menu .fsite {right: 2%;}
}
@media all and (max-width:1540px) { 
.section5 {overflow: hidden;} /* 임시 */
h1.logo a {font-size: 22px;}
h1.logo a img {max-width: 90px;}
#header .header_in #gnb_nav #menu .menu li, #header .header_in #gnb_nav #menu .menu .menu_depth li {width: 130px;}
#header .header_in #gnb_nav #menu .menu li a {padding: 36px 5px;}
#header .header_in .lang_wrap {margin-left: 0px;}
}
@media all and (max-width:1300px) { /* 모바일 메뉴 */
#header {height: 80px;}
#header .header_in #gnb_nav {display: none;}
#header .header_in .lang_wrap {margin-right: 60px;}
#header .header_in .sitemap {position:absolute;top: 27.5px;right:2%;display:block;width: 25px;height: 22px;background-size: cover;background: url("../img/sitemap.png") center no-repeat;border: transparent;}
#header.fixed .header_in .sitemap, #header:hover .header_in .sitemap {background: url("../img/sitemap_on.png") center no-repeat;}
}


@media all and (max-width:1023px) { 
#header, #menuArea .menuList .width1240 {height: 70px;}
h1.logo a {font-size: 20px;}
h1.logo a img {max-width: 75px;}
#header .header_in .lang_wrap button.lang_btn {padding: 5px 15px;}
#header .header_in .lang_wrap i {padding-left: 20px;}
#header .header_in .lang_wrap.on .lang_list {height: 100px;padding-top: 35px;}
#header .header_in .sitemap, .btnMenu_mClose {top: 22.5px;}
#menuArea .menuList>.list>li>a {font-size: 22px;}	
/**/
#footer .foot_in .menu .fsite {width: 200px;top: 100px;}
}


@media all and (max-width:767px) { 
#header, #menuArea .menuList .width1240 {height: 60px;}
#header .header_in .lang_wrap {margin-right: 45px;}
#header .header_in .lang_wrap button.lang_btn {line-height: 25px;}
#header .header_in .lang_wrap a {line-height: 1.8;}
#header .header_in .lang_wrap i {padding-left: 15px;vertical-align: middle;}
#header .header_in .lang_wrap.on .lang_list {height: 90px;padding-top: 25px;}
#header .header_in .sitemap, .btnMenu_mClose {top: 17.5px;}
#menuArea .menuList>.list>li>a {font-size: 20px;}
#menuArea .menuList>.list .sMenu>li>a {font-size: 18px;padding: 7px 2%;}
/**/
#footer .foot_in .menu {font-size: 15px;}
#footer .foot_in .menu {margin: 80px 0 20px;}
#footer .foot_in .menu .fsite {width: 160px;height: 40px;}
#footer .foot_in .menu .fsite span {padding: 10px;}
#footer .foot_in div > p.address, #footer .foot_in div > p.copyright, #footer .foot_in .menu .fsite ul li a {font-size: 14px;}
}
@media all and (max-width:620px) {
#footer .foot_in div > p.address span:after {display: none;}
#footer .foot_in div > p.mb_block span:after {display: block;}
#footer .foot_in div > p br {display: block;}	

h1.logo a {font-size: 14px;}
}