@charset "utf-8";
/*
 * index의 반응형디자인
 * 헤더와 푸터의 반응형디자인
 */ 

 
/* ===================================
	모바일 가로 (376px ~ 767px) 
=====================================*/
@media all and (min-width:376px) {
	

}

/* ===================================
	타블렛(768 ~ 1024) 
====================================*/
@media all and (min-width: 768px) {


}

/* =======================================================
	노트북 (1025 ~ 1199)  
	hero와 메인박스 가로 나열, .inner는 100% 너비로 가변함
=======================================================*/
@media all and (min-width: 1025px){
	/* header ------------------------*/
	.logo{
	
	}
	.logo h1{
		font-size:24px;	
		letter-spacing:-1px;
		padding-bottom:20px;
	}
	header{
		width:100%;
	}
	header .inner{ /* .logo-container와 .gnb 가 자식임 */
		width:100%;
		height:140px;
		display:flex;
		flex-direction:column;
		justify-content:flex-end;
	}
	.mobile-bars{ 
		display:none;
	}
	.gnb{
		display:flex;
		justify-content:flex-end;
	}
	.gnb ul{	
		display:block !important;	
		
		}
	.gnb ul li{
		border-top:none;
		float:left;	
	}
	.gnb ul li a{
		padding:5px 18px 10px;	
		-border:1px solid red;
	}
	
	/* footer ----------------------------------*/
	footer{
		width:100%;
	}
	address .address-info-ko{
		font-size:14px;
		display:inline;
	}
	address .address-info-en{
		font-size:14px;
		display:inline;
	}
	address span{
		line-height:1.7;
	}
	address .address-info-en::before{
		content:"";
		display:inline-block;
		width:2px;
		height:11px;
		background-color:#999;
		margin:0px 10px;
	}
}
/* =======================================================
	노트북 (1200 ~ 1279)
	.inner는 1200px 고정 너비 + 중앙 정렬
=======================================================*/
@media all and (min-width: 1200px) {
	/* header ------------------------------*/
	header .inner{
		width:1200px;
		margin:auto;
	}
	.logo-container{	
		display:flex; /* h1을 왼쪽으로 보내기 위함 */
		margin-bottom:7px;
	}
	.logo h1{
		font-size:28px;
		padding-bottom:0px;
	}

	/* footer --------------------------------*/	
	footer .inner{
		width:1200px;
		margin:auto;
	}
	address .email-info{
		font-size:18px;
	}
	address .address-info-ko{
		font-size:14px;
		display:inline;
	}
	address .address-info-en{
		font-size:14px;
		display:inline;
	}

}
/* ==========================================
	작은 데스크탑 (1280 ~ 1535)
==========================================*/
@media all and (min-width: 1280px) {
}

/* ==========================================
	큰 데스크탑 (1536 이상 ~ )
==========================================*/
@media all and (min-width: 1536px) {

}
