@charset "UTF-8";

@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');




*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}




/******************** WEB ********************/
@media all and (min-width:761px) {

	#header_nav{
		display: fixed;
		display: flex;
		height: 100px;
		padding: 32px;
		justify-content: space-between;
		align-items: center;
		flex-shrink: 0;
		align-self: stretch;
		
		border-bottom: 1px solid var(--grey-200, #E5E5E5);
		background: #FFF;
	}
	
	.nav_logo{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}
	
	.nav_logoBox{
		display: flex;
		align-items: center;
		gap: 10px;
		
		cursor: pointer;
	}
	
	
	.nav_logoBox span{
		color: var(--brown-800, #2E1403);
		font-family: Pretendard;
		font-size: 40px;
		font-style: normal;
		font-weight: 900;
		line-height: 140%; /* 56px */
		letter-spacing: -0.8px;
	}
	
	.nav_menu{
		display: flex;
		justify-content: flex-end;
		align-items: center;
		gap: 32px;
	}
	
	
	
	.hamberger{
		display: none;
	}
	
	
	.nav_menu div{
		float: left;
	}
	
	.nav_common{
		display: flex;
		padding: 24px;
		justify-content: flex-end;
		align-items: center;
		gap: 10px;
	}
	
	.nav_common{
		cursor: pointer;
	}
	
	.nav_menu span{
		color: var(--grey-700-black, #1D1D1D);
		text-align: right;
		
		/* title3 */
		font-family: Pretendard;
		font-size: 20px;
		font-style: normal;
		font-weight: 600;
		line-height: 180%; /* 36px */
		letter-spacing: -0.4px;
	}
	
	
	.nav_menu_service{
		width: 116px;
		height: 84px;
		
		
		display: flex;
		padding: 24px;
		justify-content: flex-end;
		align-items: center;
		gap: 10px;	
		
	}

}



/******************** MOBILE ********************/
@media all and (max-width: 760px){
	
	/* 헤더 */
	#header_nav{
		display: flex;
		height: 56px;
		padding: 0px 20px;
		justify-content: space-between;
		align-items: center;
		align-self: stretch;
	
		border-bottom: 1px solid var(--grey-200, #E5E5E5);
		background: var(--grey-0-white, #FFF);
	}


	.nav_logoBox{
		cursor: pointer;
	}

	
	.nav_logoBox img {
		width: 76.364px;
		height: 20px;
		flex-shrink: 0;
	}

	.nav_logoBox span{
		color: var(--brown-800, #2E1403);
		font-family: Pretendard;
		font-size: 24px;
		font-style: normal;
		font-weight: 900;
		line-height: 140%;  
		letter-spacing: -0.48px;
	}
	
	
	.nav_menu{
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 10px;
	}
	
	
	.hamberger{
		cursor: pointer;
		width: 24px;
		height: 24px;
	}
	
	
	.ham_svg2{
		display: none;
	}
	
	
	.nav_common{
		display: none;
	}
	
	
}
