@charset "utf-8";
/* 모바일 대메뉴 고정 띠 — include/mobile_quicknav.php
   780px 이하만: bnr-popup.js 가 이 폭에서만 header 실제 높이로 본문 여백을 다시 잰다.
   header 높이가 고정값(70/50px)이라 띠가 넘치지 않게 header 는 auto 로 풀고 로고 줄 높이를 따로 준다. */
.m_quicknav {display:none;}

@media all and (max-width:780px) {
	header {height:auto;}
	header > .wrapper {height:70px;}
	.m_quicknav {display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); border-top:1px solid #E5E5E5; border-bottom:1px solid #E5E5E5; background-color:var(--white-color);}
	.m_quicknav a {display:flex; align-items:center; justify-content:center; min-width:0; height:44px; font-size:15px; font-weight:700; line-height:1; letter-spacing:-0.02em; white-space:nowrap; color:var(--black-color);}
	.m_quicknav a + a {border-left:1px solid #E5E5E5;}
	.m_quicknav a.on {color:var(--navy-color); box-shadow:inset 0 -2px 0 var(--navy-color);}
	header.open .m_quicknav {display:none;}
	/* 배너 없는 경우 load 전 기본 여백(88px)이 띠 붙은 머리(116px)보다 작아 첫머리가 가려지므로 CSS로 먼저 맞춘다 — load 뒤엔 bnr-popup.js 인라인 값이 덮는다 */
	body.no_bnrpop #container {padding-top:116px;}
}

@media all and (max-width:640px) {
	header > .wrapper {height:50px;}
	body.no_bnrpop #container {padding-top:96px;}
}

@media all and (max-width:374px) {
	.m_quicknav a {font-size:14px; letter-spacing:-0.04em;}
}
