@charset "UTF-8";

/* HEADER */
.qw{justify-content:space-between ;}

.row{
    max-width: 1620px;
    margin: 0 auto;
}

.header{width: 100%;height: 100px; position: absolute; top: 0; left: 0; margin: 0 auto; z-index: 5; transition: all 0.3s;}
.header.on{ background: #fff; border-bottom: 1px solid #d7d7d7;}

.navbar{ display: flex; align-items: center; justify-content: space-between; align-items: center; height: 100px}
.navbar_logo{ position: relative;}
.navbar_logo a{ display: block; width: 178px; height: 47px; margin-top: -15px;}
.navbar_logo a img:nth-child(1){;opacity: 1;}
.navbar_logo a img.on:nth-child(1){ opacity: 0;}
.navbar_logo a img:nth-child(2){position: absolute;top: -15px;left: 0;opacity: 0;}
.navbar_logo a img.on:nth-child(2){ opacity: 1;}

.navbar_menu{ display: flex; width: 730px; justify-content: space-around; text-align: center; align-items: center; z-index: 5}
.navbar_menu > li{position: relative; width: 100%; max-width: 110px; text-align: center;}
.navbar_menu > li.on > a{color: #7b7a7a;}
.navbar_menu > li > a{color: #fff; display: block; font-family: 'Noto Sans KR', sans-serif; font-size: 18px; display: block;height: 100px; line-height: 100px; box-sizing: border-box; position: relative;}
.navbar_menu > li > a::after{position: absolute; bottom: 0px; left:0; width: 100%;height: 6px; background: #0f21a7; z-index: 5; display: none; content:"";}
.navbar_menu > li:hover > a::after{display: block;}

.navbar_link a{display: block; width: 136px;  height: 42px;line-height: 44px;border: 1px solid #fff; text-align: center; color: #fff; transition: 0.3s;}
.navbar_link a:hover{border: 1px solid #1b3248; background: #fff; color: #1b3248;}
.navbar_link a.on{border: 1px solid #1b3248; background: #fff; color: #1b3248;}

.navbar_sub{width: 100%; text-align: center; z-index: 5;}
.navbar_sub ul{position: absolute; top: 115px; left: 0; width: 100%; text-align: center; display: none;}
.navbar_sub ul li a{color: #7c7c7c; padding: 18px 0 18px; display: block; font-weight: 300; font-family: 'Noto Sans KR', sans-serif; font-size: 14px;}
.navbar_sub ul li:hover a{color: #417db7; font-weight: 510;}
.navbar_sub ul li.on a{color: #417db7; font-weight: bold;}

.navbar_sub ul li a.paddi{ padding: 33px 0 5px;}
.navbar_sub ul li > p{color: #7c7c7c; line-height: 1.5em; font-weight:300; font-family: 'Noto Sans KR', sans-serif; cursor: pointer; display: block; font-size: 13px;}
.navbar_sub ul li > p:hover{ color: #417db7;}

.navbar_sub ul li a.last_paddi{padding-bottom: 33px;}

.navbar_sub ul .bar10 a{font-size: 11px;padding:15px 0 5px;}
.navbar_sub ul .bar11 a{font-size: 11px;padding:5px 0;}

.navbar_bg{ position: absolute; top: 101px; left: 0; width: 100%; height: 330px; background: #fff;z-index: 4; display: none; cursor: pointer;}


.lang > ul > li{position: relative; text-align: center;}
.lang > ul > li > a{font-weight: 600;}
.lang > ul > li > a > span{padding-left: 5px; display: inline-block; vertical-align: middle; color: #fff; }
.lang > ul > li > a.on > span{color: #7b7a7a;}
.lang ul li a{color: #fff; font-family: 'Noto Sans KR', sans-serif; font-size: 13.75px; display: block;width: 120px;}

.lang ul > li > a.on{color: #7b7a7a;}

.lang > ul ul{position: absolute; top: 80px;left: 0 ; width: 100%; z-index: 5; right: 0; display: none;}
.lang > ul ul li{padding: 15px 0; border-bottom: 1px solid #ccc;}
.lang > ul ul li a.on{color: #7c7c7c;}
.lang > ul ul li a{font-weight: 300; box-sizing: content-box;}
.lang > ul ul li a:hover{color: #417db7; font-weight: 600;  box-sizing: content-box;}
.lang > ul ul li img{padding-right: 5px;}

.lang_link_wrap{display: flex; align-items: center; justify-content: space-between;}
.navbar_link a:nth-child(2){display: none;}

/*모바일*/
.m_godo{position: absolute; top: 0; left: 0;right: 0;width: 100%;margin: 0 auto; z-index: 10;}
.m_godo_wrap{width: 100%; height: 100px;}
.m_godo_menu{display: flex; justify-content: space-between; padding: 0 10px; align-items: center; height: 100px;}

.m_godomenu_btn{width: 50px; height: 50px; text-align: center;}
.m_godomenu_btn span{font-size: 3em; cursor: pointer;display: block; text-align: center; line-height: 50px; color: #fff;}


/*모바일 네이게이션*/
.m_godo{display: none;}

.m_menumain{position: fixed; top: 0;width: 100%; height: 100%; background: rgba(0,0,0,0.9); margin: 0 auto; /*right: -100% ;*/ left: 0; z-index: 10; transition: all 0.3s ease-out; display: none;}
.m_main_wrap{position: absolute;top: 0;right: 0; max-width: 320px; height: 100%;z-index: 10; background: #fff; overflow-y: auto; white-space: nowrap;}
.m_close{width: 320px; height: 100px; display: flex; align-items: center; justify-content: space-between; background: #11356b; z-index: 10;}
.m_close img{padding-left: 10px; max-width: 210px; }
.m_close span{padding-right: 10px; display: block; font-size: 2.5em; color: #fff;width: 50px; height: 50px; line-height: 50px; text-align: center; cursor: pointer;}

.m_main_wrap > ul{padding-top: 20px;}
.m_main_wrap > ul > li{text-align: center;}
.m_main_wrap > ul > li > a{text-align: center;width: 100%; height: 60px; line-height: 60px; color: #202020; font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 20px; display: block;}
.m_main_wrap > ul > li:hover > a{font-weight: 700; color: #1e2874;}
.m_main_wrap > ul > li.on > a{font-weight: 700; color: #1e2874;}

.m_main_wrap > ul ul{width: 300px; margin: 0 auto;background: #f4f4f4; border-top: 2px solid #1e2874; display: none;}
.m_main_wrap > ul ul li{}
.m_main_wrap > ul ul li a{width: 280px; height: 45px; line-height: 45px;color: #7c7c7c; }

.m_contus{width: 100%; margin: 0 auto; padding-top: 40px;}
.m_contus a{display: block; width: 180px; height: 50px; line-height: 50px; color: #11356b; border: 1px solid #11356b; box-sizing: border-box; text-align: center; margin: 0 auto;}

.m_lang{padding-top: 20px;}
.m_lang ul{display: flex; justify-content: center;}
.m_lang ul li{padding: 5px 10px; }
.m_lang ul li a{display: block; color: #202020;}
/* FOOTER */


.footer{ width: 100%;  height: 125px; background: #393939;}

.fot{ display: flex; justify-content: space-between; vertical-align: middle; text-align: center; align-content: center;}

.fot_logo{ padding-top: 38px;}

.fot_logo img{ width: 100%; max-width: 174px; margin: 0 auto; opacity: 0.2;}

.fot_text{text-align: center;}


.fot_text ul{padding-bottom: 10px;}
.fot_text ul.first{ display: flex;padding-top: 37px; font-size: 12px; text-align: center; align-items: center; justify-content: center;}
.fot_text ul.first > li{color: #868585;}
.fot_text ul.first > li::after{content: ''; display: inline-block; width: 1px; height: 11px; line-height: 11px; background: #868585; margin: 0 10px; vertical-align: middle;}
.fot_text ul.first > li:last-child::after{display: none;} 


.fot_text ul.secon{display: flex; font-size: 12px; text-align: center;align-items: center; justify-content: center;}
.fot_text ul.secon > li{color: #868585;}
.fot_text ul.secon > li::after{content: ''; width: 1px; height: 11px; line-height: 11px; background: #868585; margin: 0 10px; vertical-align: middle; display: inline-block;}
.fot_text ul.secon > li:last-child::after{display: none;}

.fot_text p{ color: #a7a7a7; display: block; font-size: 12px;}

.youtube{text-align: center; margin-top: 38px; display: flex;width: 172px; height: 42px; border: 1px solid #868585; text-align: center;align-items: center; justify-content: center;}

.youtube a.youtex{display: block; color: #868585;padding-left: 10px; font-size: 15px;}

.youtube a img{width: 100%; max-width: 65px; opacity: 0.4;}

.m_footer{display: none;}


.topBtn{ background: #fff; box-shadow: 0px 0px 12px rgba(0,0,0,0.4); box-sizing: border-box; display: flex; align-items: center; justify-content: center; cursor: pointer; position: fixed; z-index: 10; bottom: 100px; right: 15px; display: none;}
.topBtn p{font-size: 14px; font-weight: 300; font-family: 'Noto Sans KR', sans-serif; color: #1e2874; width: 45px; height: 45px; display: flex; align-items: center; justify-content: center; }

.topBtn:hover{ background: #1e2874;}
.topBtn:hover p{color: #fff;}

/*반응형*/

@media screen and (max-width:1100px){
    .footer{display: none;}
    .m_footer{display: block; width: 100%; min-height: 320px; height: auto;  background: #393939;}
    .m_foot .fot_text{padding-top: 30px;}
    .m_foot .fot_text ul li{line-height: 1.5em; color: #868585; font-size: 15px; font-family: 'Noto Sans KR', sans-serif; font-weight: 400;} 
    .m_foot .youtube{text-align: center; margin: 0 auto;}
    .m_foot{padding-top: 30px;}
    .m_foot .fot_logo{text-align: center; padding-top: 30px; padding-bottom: 30px;}
    
    
}

@media screen and (max-width:1040px){
    .navbar_link a:nth-child(1) span{font-size: 2.5em;}
    .navbar_link a{width: 55px; height: 55px; line-height: 50px; box-sizing: border-box; border: 0;}
    .navbar_link a.on{border: 0; background: none;}
    .navbar_link a:hover{border: 0; background: none; color: #fff;}
    .navbar{padding: 0 10px;}
    .header{display: none;}
    .m_header{display: block; position: absolute; top: 0;left: 0 ;right: 0;width: 100%; margin: 0 auto; z-index: 5;}
    .m_nav{display: flex; justify-content: space-between; align-items: center; height: 100px;}
    .m_godo{display: block;}
	
	
	
}

@media screen and (max-width:600px){
     .m_foot .fot_text ul li{font-size: 14px;}
}









































