 @font-face {
    font-family: 'SEBANG_Gothic_Bold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2104@1.0/SEBANG_Gothic_Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.eng {font-family:'Montserrat'}
.flex {display:flex}
.t_color {color:var(--main_c2)}
.box_100 {width:100%; display:inline-block}

/* Header */
#header_wrap {width:100%; display:inline-block; z-index:99999; top:0; position:fixed; }

#header_wrap:after {  content:''; width:100%; height:80px; top:0; left:0; position:absolute;  z-index:99999; }  

header#header {
	position:absolute;
	z-index: 99999999;
	width: 100%;
   	height:80px; top:0; left:50%; 
	padding: 0 5%;	margin: 0px auto;
	display:flex; align-items:center; 
     transform: translate(-50%, 0); 
	box-sizing: border-box;
 	border-bottom:1px solid rgba(255,255,255,.3);
	transition: all .3s;
		
}
 



header#header:hover {background-color:#fff}

.header h1 {line-height:0}
.header h1 img {height:50px}
.header img.logo_c {display:none}
.header img.logo_w {display:inline-block}
 

.header.scroll {background-color:#fff;  }
.header.scroll img.logo_w {display:none}
.header.scroll img.logo_c {display:inline-block}
.header.scroll .ham p span { background-color:#333; }

.header:hover   {background-color:#fff}
.header:hover img.logo_w {display:none}
.header:hover img.logo_c {display:inline-block}
.header:hover .ham p span { background-color:#333; }


nav#gnb {
 position:relative;  top:0px;
 width:auto; margin-left:5%; 
}
nav#gnb > ul {display:flex;}
nav#gnb > ul > li {
 display:inline-block;  box-sizing:border-box; padding:0 30px; position:relative; z-index:9999999; white-space:nowrap
  
}
nav#gnb > ul > li:last-child  { background:none }

nav#gnb > ul > li > a {
display: inline-block;

font-size: 1.2em;
line-height:80px;
font-weight:500; 
color: #fff;
}
header#header:hover nav#gnb > ul > li > a {color:#111}
.header.scroll  nav#gnb > ul > li > a {color:#333}

.top_call {font-size:18px;font-family: 'SEBANG_Gothic_Bold'; letter-spacing:1px; color:#fff; display:flex; align-items:center; margin-left:auto }

.header .top_call  i {color:#fff ; font-size:22px; margin-left:15px; margin-right:10px }
.header:hover .top_call  i {color:#111 }
.header.scroll .top_call  i {color:#111 }
.header.scroll .top_call {color:#000; }
.header:hover .top_call  {color:#111 }




nav#gnb > ul > li > ul { display:none;  width:220px; background-color:#fff;  position:absolute; left:50%; transform: translate(-50%, 0); box-shadow:2px 2px 5px rgba(0,0,0,.1); border-radius:0 0 10px 10px; padding:20px 0 }
nav#gnb > ul > li > ul > li {width:100%; padding:6px 5px; text-align:center;  box-sizing:border-box; white-space:nowrap; }
nav#gnb > ul > li > ul > li > a {display:inline-block;width:100%; font-size:1em;}
nav#gnb > ul > li > ul > li:hover a {color:#000; text-decoration:underline;  } 


 



@media screen and (min-width:900px) {

  .mobile_nav {display:none}

}



@media screen and (max-width:900px) {
		header#header {background-color:#fff; height:70px; padding:0 4%; left:0; transform: translate(0, 0); justify-content:space-between; } 
		nav#gnb {display:none}
		.top_call {display:none}
		.mobile_nav {display:block;  }
		.mobile_nav i {font-size:25px}
		.header img.logo_c {display:inline-block}
		.header img.logo_w {display:none}
		.header h1 img {height:43px}


}





.in {width:100%; box-sizing:border-box; padding:0 3%; max-width:1240px; margin:0 auto}

a.basic_btn {background-color:#0d2997;   font-size:1em; box-sizing:border-box; padding:0 20px; width:200px; line-height:50px; color:#fff; border-radius:5px; display:flex; transition: all 0.3s ease-out; }
a.basic_btn:after {content:'→'; margin-left:auto}
a.basic_btn:hover {background-color:#1739c1} 
a.basic_btn + a.basic_btn {margin-left:5px}
 




footer {margin-top:150px; width:100%; background-color:#222; color:rgba(255,255,255,.8); padding:50px 3%; text-align:center; font-size:15px; line-height:1.7; position:relative; box-sizing:border-box}
footer h2 {display:inline-block; margin-bottom:8px; font-size:1.2em; font-weight:500; width:100%; color:#fff}
footer p {border-top:1px solid rgba(255,255,255,.2);  padding:17px 0; margin-top:30px }
footer a {position:absolute; right:3%; top:0; background-color:#597dff; color:#fff !important; letter-spacing:0; width:60px; line-height:60px; display:inline-block }




@media screen and (max-width:900px) {

  footer {font-size:13px}
}
