@charset 'euc-kr';

 

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

#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:90px; top:0; left:50%; 
	padding: 0 5%;	margin: 0px auto;
	display:flex; align-items:center; 
    transform: translate(-50%, 0); 
	box-sizing: border-box;   min-width:1300px;
}
 


h1 {cursor:pointer} 
h1 img.c {display:none}

nav#gnb { position:relative;  top:0px; margin-left:5%;  }
nav#gnb > ul { display:flex; }
nav#gnb > ul > li { display:inline-block;  box-sizing:border-box; margin-right:60px; text-align:Center; position:relative; z-index:999999999999999999999999999999; white-space:nowrap }
nav#gnb > ul > li:last-child  { background:none }
 
nav#gnb > ul > li > a {
	display: inline-block;
	font-weight:600; 
	font-size: 1.35rem;
	line-height:90px;
	 letter-spacing:-.5px; 
 	color: #fff;
}
nav#gnb > ul > li > a:hover {color:#111} 
nav#gnb > ul > li > ul { display:none;  width:200px; background-color:#fff;  position:absolute; left:50%; transform: translate(-50%, 0); box-shadow:4px 4px 5px rgba(0,0,0,.2); border-radius:0 0 10px 10px; padding:20px 0 }
nav#gnb > ul > li > ul > li {width:100%; padding:5px 5px; box-sizing:border-box; white-space:nowrap; }
nav#gnb > ul > li > ul > li > a{display:inline-block;width:100%; font-size:1.05em; color:#333}
nav#gnb > ul > li > ul > li:hover a {color:var(--main_c); text-decoration:underline} 
 
 
.last_div {margin-left:auto; } 
.last_div a {border:1px solid #fff; color:#fff;  font-size:15px; font-weight:300; display:inline-block; padding:5px 20px; cursor:pointer} 
.last_div a:hover {background-color:var(--main_c); border:1px solid var(--main_c) !important; color:#fff} 
.last_div a:before {content:'카탈로그'} 
.last_div a:hover:before {content:'다운로드'; } 
  
 
header#header:hover {background-color:#fff}
header#header:hover h1 img.c {display:inline}
header#header:hover h1 img.w {display:none}
header#header:hover  nav#gnb > ul > li > a {color:#333 }
header#header:hover .last_div a {border:1px solid #333;  color:#333 } 
header#header:hover .last_div:hover a { color:#fff } 

.header.scroll {background-color:#fff}
.header.scroll nav#gnb > ul > li > a {color:#333 }
.header.scroll h1 img.c {display:inline}
.header.scroll h1 img.w {display:none}
.header.scroll .last_div a {border:1px solid #333; color:#333 } 
.header.scroll .last_div a:hover { color:#fff} 



header#header  {transition: all 0.3s ease-out;}
.last_div *  {transition: all 0.3s ease-out;}


 
@media all and (max-width:1600px) {
 
	   nav#gnb > ul > li {margin-right:40px;}
	   nav#gnb > ul > li > a { font-size: 1.3rem; }
	   header#header {padding:0 3%}
 
 }



@media all and (min-width:1400px) {
   #m_top {display:none} 
}

 @media all and (max-width:1400px) {
		header#header {display:none}
		#m_top {width:100%; height:60px; display:flex; align-items:center; background:rgba(255,255,255,1); position:fixed; top:0; left:0; z-index:99999999999; border-bottom:1px solid #ddd;  padding:0 4%; box-sizing:border-box}
		#m_top h1 {font-size:0; height:100%; display:flex; align-items:center;   }
		#m_top h1 img {height:40px; }


		.last_div {margin-left:auto; margin-right:20px} 
		.last_div a {border:1px solid #333; color:#333; } 
   

}