/****************************** layout.css - 헤더 푸터 css ******************************/
@charset "UTF-8";

@font-face {  /*에스코어 드림 6볼드*/
    font-family: 'S-CoreDream-6Bold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-6Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);

.notosanskr * {  /*노토 산스*/
 font-family: 'Noto Sans KR', sans-serif;
}

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@500&display=swap');

@font-face { /* Exo 2 Bold Italic */
    font-family:"Exo 2 Bold Italic";
    src:url("Exo2-BoldItalic.eot?") format("eot"),url("Exo2-BoldItalic.woff") format("woff"),url("Exo2-BoldItalic.ttf") format("truetype"),url("Exo2-BoldItalic.svg#Exo2-BoldItalic") format("svg");
    font-weight:normal;
    font-style:normal;}

/* manrope 볼드: 메뉴 */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@700&display=swap');


/*---------- 헤더 ----------*/
.header {border-bottom: 1px solid #ddd; width: 100%; height: 110px; position: fixed; top: 0; left: 0; right: 0; z-index: 9999; background-color: transparent;}
.header .header_container {height: 100%; display: flex; justify-content: space-between; width: 1280px; margin: 0 auto;}

.header .logo a {display: flex; align-items: center; height: 100%;}
/* .header .logo a span {font-weight: 600;font-size: 20.52px; font-family: S-CoreDream-6Bold;} */

.main_nav {width: 70%; height: 100%; clear: both;}
.main_nav .main_menu {display: flex; justify-content: space-between; height: 100%; float: right;}
.main_nav .main_menu > li {height: 100%; line-height: 83px; position: relative;width: 188px;text-align: center;}
.main_nav .main_menu > li > a {font-size: 20px; font-family: 'Manrope', sans-serif; display: block;line-height: 110px; color: #fff;}
.main_nav .main_menu > li:after {transition: 0.3s; content: "";display: block;width: 12px;height: 12px;border-radius: 10px;background-color: #5a94de;margin-top: -30px;margin-left: 87px;opacity: 0;}

.main_menu > li:hover:after {opacity: 1; transition: 0.3s;}

/* 서브메뉴 */
.sub_menu {position: absolute; top: 100%; left: 0px; width: 100%; margin: 0 auto; justify-content: center; height: 0px; overflow: hidden; box-shadow: 3px 3px 10px rgb(0 0 0 / 10%);}
.sub_menu > li:hover > a {color: #5a94de; font-weight: 600;}

.sub_menu > li {text-align: center; width: 100%; background-color: rgb(255, 255, 255, 80%);}
.sub_menu > li.height > a{line-height: 18px;}
.sub_menu > li:first-child {padding-top: 15px;}
.sub_menu > li:last-child {padding-bottom: 30px;}
.sub_menu > li > a {color: #666;font-size: 16px;display: block;line-height: 35px;margin: 0px 15px;padding-top: 5px;}
.sub_menu > li:last-child > a {border-bottom: none;}

.main_menu > li:hover .sub_menu{height: auto;}

/* header on */
.header.on {background-color: #fff;box-shadow: 3px 3px 10px rgb(0 0 0 / 10%);}
.header.on .logo a img {content: url(../img/dh_logo.png);}
.header.on .main_nav .main_menu > li > a {color: #222;}
/* header on이 작동하는 동시에 해당 li hover 시 색상 변경 */
/* .main_menu > li:hover >a{color: #0054a7;} */
.header.on .main_nav .main_menu > li:hover > a {color: #5a94de;}




/*---------- 푸터 ----------*/
.footer {width: 100%; background: #252525; position: relative; font-size: 15px;}
.footer .footer_container {width: 1280px;margin: 0 auto 35px;color: #eeeeee;padding-top: 70px;} 
/* padding-top: 50px */

.footer .logo_wrap{display: flex;}
.footer .logo {margin-right: 565px; border-bottom: 0px !important;}
.footer .logo a {display: flex; align-items: center; height: 100%;}

.footer ul {padding: 27px 0px;}
.footer ul li {float: left;position: relative;padding-left: 32px;}
.footer ul li:before {content:" ";display: block;width: 2px;height: 14px;background-color: #999;position: absolute;top: 15%;transform: rotate(25deg);right: -17px;}
.footer ul li:last-child:before {display: none;}
.footer ul li a {color: #999;font-weight: 100;}

.footer .address_wrap {display: flex;flex-wrap: wrap;justify-content: space-between;}
.footer .address_wrap address {flex-grow: 3;}
.footer .address_wrap address span {display: inline-block;padding-right: 30px;position: relative;margin-bottom: 16px;font-weight: 100;color: #999;}
.footer .address_wrap address span.before:before {content:" ";display: block;width: 2px;height: 14px;background-color: #eee;position: absolute;right: 12px;top: 2px;}
.footer .address_wrap address span.tit, .footer .address_wrap address span.before {color: #eee;}
.footer .address_wrap span.etc {transition: 0.3s; color: #999;border: 1px solid #999;width: 170px;line-height: 50px;text-align: center;float: right;height: 50px;}
.footer .address_wrap span.etc a {display: block;}

.footer .bottom_wrap {border-top: 1px solid #999;padding-top: 10px;padding: 20px 0px 35px;}
.footer .bottom_wrap > div {width: 1280px;margin: 0 auto;display: flex;}
.footer .bottom_wrap .copy {font-weight: 100;color: #999;flex-grow: 3;}
.footer .btn_top {width: auto;height: auto;border: none;background: transparent;outline: none;cursor:pointer;background-color: transparent;border-color: transparent;
    bottom: 197px;right: 350px;text-align:center;font-size:15px;z-index:90;color: #999;}
.footer .btn_top i {font-size: 28px;vertical-align: middle;}

/* hover */
.footer .address_wrap span.etc:hover {background-color: rgba(255,255,255,0.5); color: #222; transition: 0.3s}