/*header*/
#header{
	position:fixed;
	z-index:200;
	width:100%;
	background:rgba(0,0,0,0);
	transition: all .3s;
}
#header.header_scroll{background:rgba(0,0,0,.6);}

#header > div{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 3rem 6rem;
}
#header > div > *{
	position: relative;
	z-index: 30;
}
#header h1 > a{display:block;}
#header .gnb_side{
	display: flex;
	gap: 2rem;
}
#header .gnb_side a{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	width: 17rem; 
	height: 5.4rem;
	text-align: center;
	line-height: 1.7;
	font-size: 1.7rem;
	font-weight: bold;
	color: #fff;
	background: rgba(255,255,255,0);
	border: 2px solid #fff;
	border-radius: 10rem;
	transition: all .3s;
}
#header .gnb_side a img{
	filter: brightness(0) invert(1);
	transition: all .3s;
}
#header .gnb_side a:first-child img{width: 2.4rem;}
#header .gnb_side a:last-child img{width: 3rem;}
#header .gnb_side a:hover{
	color: #000;
	background: rgba(255,255,255,1);
}
#header .gnb_side a:hover img{filter: brightness(1) invert(0);}
@media(max-width:1199.98px){
	#header > div{padding: 3rem;}
}
@media(max-width:991.98px){
	#header > div{padding: 2rem;}
	#header h1 > a img{max-width: 160px !important;}
	#header .gnb_side{gap: 1rem;}
	#header .gnb_side a{
		gap: .5rem;
		width: 15rem; 
		height: 5rem;
		font-size: 1.6rem;
	}
	#header .gnb_side a:first-child img{width: 2rem;}
	#header .gnb_side a:last-child img{width: 2.5rem;}
}
@media(max-width:575.98px){
	#header > div{padding: 1.5rem 15px;}
	#header h1 > a img{max-width: 130px !important;}
	#header .gnb_side a{
		width: 4.5rem; 
		height: 4.5rem;
	}
	#header .gnb_side a span{display: none;}
	#header .gnb_side a img{max-width: 100%;}
}
