@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard-dynamic-subset.min.css");



body { 
  font-family: "Pretendard Variable", "Pretendard", "Montserrat", sans-serif; 
  letter-spacing: -50;
  overflow-x: hidden; 
  font-size: 16px;
}

#wrap { 
  max-width: 1920px;
     box-sizing: border-box; 
}

header {  
  height: 8vh; 
  width: 100vw;
  background-color: #000;
  box-sizing: border-box;
}

header .inner {
	width: 94vw;
	height:  8vh; 
	margin: 0 auto;
	display: flex; 
	/* flex-wrap: wrap;   */
	justify-content: space-between; 
	align-items: center; 
	
}



header .inner .logo img { 
	width: 60%;
	margin-left: 2vw;
	object-fit: contain;
}

header .adask { 
  padding: 12px 16px; 
  background-color: #3d3d3d; 
  border-radius: 4px; 
  color:#fff; 
  font-weight: 500;
  box-sizing: border-box;
}

header .adask:hover { 
  background-color: #541b86; 
}

footer {
	width: 100vw;
	background-color: #1d1d1e;
	padding: 3%;
	font-size: 0.9rem;
	 box-sizing: border-box; 
}

footer .inner {
	width: 90vw;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	word-break: keep-all;
}

footer .inner .logo {
	align-self: flex-start;
}



footer .inner .info {
	line-height: 1.4;
	color: #f5f5f7;

}


footer .inner .copy {
	margin-top: 24px;
	color: #999;
}

@media screen (min-width: 320px) and (max-width: 374px) {
	header .inner .logo {
		width: 160px;
	}	

	header .inner {
		width: 90vw;
	}


	footer .inner .logo {
		width: 120px;
	}

}

 @media screen and (min-width: 375px) and (max-width: 575px) {
	
	header .inner .logo {
		width: 220px;
	}	
	
	header .inner {
		width: 90vw;
	}

	
	header .inner .logo img { 
		width: 50%;
	}



	footer .inner .logo {
		width: 180px;
	}


 }


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

	footer {
		padding: 6%;
	}



	footer .inner {
		flex-direction: column;
		gap: 4vh;
	}
  }



@media screen and (min-width: 577px) and (max-width: 768px) {

	footer {
		padding: 6%;
	}



	footer .inner {
		flex-direction: column;
		gap: 4vh;
	}
}


  @media screen and (min-width: 769px) and (max-width: 1024px) {

	footer {
		padding: 6%;
	}

	footer .inner {
		flex-direction: column;
		gap: 4vh;
	}


}