/* 공통 상단 메뉴 (g5/layout :: nav) */
.kmMemberHeader { position: fixed; top: 0; left: 0; right: 0; z-index: 1030; box-sizing: border-box; width: 100%; height: 72px; margin: 0; padding: 0 clamp(18px, 3vw, 44px); display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px; background: #fff !important; border-bottom: 1px solid #e7ebf3; color: #172d50; font-family: Arial, "Noto Sans KR", sans-serif; font-size: 13px; line-height: normal; text-align: left; }
.kmMemberHeader * { box-sizing: border-box; }
.kmMemberHeader a { text-decoration: none !important; }
.kmMemberHeader svg { flex: 0 0 auto; }
.kmHeaderSpace { height: 72px; }

.kmMemberBrand { display: inline-flex; align-items: center; justify-self: start; min-width: 0; }
.kmMemberLogo { display: block; width: 164px; height: 60px; max-width: 100%; object-fit: contain; object-position: left center; }

.kmMemberNav { display: flex; height: 100%; align-items: stretch; justify-content: center; gap: 28px; margin: 0; padding: 0; white-space: nowrap; }
.kmNavItem { position: relative; display: flex; align-items: stretch; }
.kmNavItem > a { display: inline-flex; align-items: center; gap: 4px; padding: 0 4px; border-bottom: 3px solid transparent; font-size: 13px; font-weight: 650; color: #7d8ca4 !important; background: transparent !important; }
.kmNavItem > a svg { color: #b4bfcf; transition: transform .15s; }
.kmNavItem:hover > a, .kmNavItem.open > a, .kmNavItem.kmMemberSelected > a { color: #777b83 !important; border-bottom-color: #777b83; }
.kmNavItem.kmMemberSelected > a { font-weight: 800; }
.kmNavItem:hover > a svg, .kmNavItem.open > a svg { transform: rotate(180deg); }
.kmNavDrop { position: absolute; left: 50%; top: calc(100% - 4px); transform: translateX(-50%); min-width: 160px; padding: 8px; background: #fff !important; border: 1px solid #f5f5f6; border-radius: 12px; box-shadow: 0 14px 42px rgba(28, 54, 100, .15); display: none; z-index: 1031; }
.kmNavItem:hover .kmNavDrop, .kmNavItem.open .kmNavDrop { display: grid; }
.kmNavDrop a { display: block; padding: 10px 12px; border-radius: 8px; font-size: 13px; font-weight: 600; color: #455c7e !important; background: transparent; }
.kmNavDrop a:hover { background: #f2f5fb; color: #3468ba !important; }

.kmMemberActions { display: flex; align-items: center; justify-self: end; justify-content: flex-end; gap: 10px; min-width: 0; }
.kmMemberIcon { position: relative; display: grid; place-items: center; width: 35px; height: 35px; border-radius: 50%; color: #8797b2 !important; }
.kmMemberIcon:hover { background: #f3f4f6; }
.kmMsgBadge { position: absolute; top: 1px; right: -2px; min-width: 17px; height: 17px; padding: 0 5px; border-radius: 9px; background: #ef454a; color: #fff; font-size: 10px; font-weight: 800; line-height: 17px; text-align: center; box-shadow: 0 0 0 2px #fff; box-sizing: border-box; }
.kmMsgBadge[hidden] { display: none; }
.kmMemberMoney { display: inline-flex; align-items: center; gap: 6px; height: 35px; padding: 0 14px; border-radius: 999px; background: #f2f5fb; color: #41567a !important; font-size: 12px; font-weight: 700; white-space: nowrap; }
.kmMemberMoney em { font-style: normal; }
.kmMemberMoney b { color: #17223b; font-size: 13px; }
.kmMemberUser { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: #292b31 !important; white-space: nowrap; }
.kmMemberProfile { width: 35px; height: 35px; border-radius: 50%; background: #f3f4f6; color: #222; border: 1px solid #e4e7ec; display: grid; place-items: center; font-size: 12px; font-weight: 800; }
.kmMemberBtn { display: inline-flex; align-items: center; height: 35px; padding: 0 15px; border-radius: 8px; font-size: 12px; font-weight: 750; white-space: nowrap; border: 1px solid #e4e7ec; color: #41567a !important; background: #fff !important; }
.kmMemberBtn:hover { background: #f7f9fc !important; }
.kmMemberBtn.fill { background: #1f3a6b !important; border-color: #1f3a6b; color: #fff !important; }
.kmMemberBtn.fill:hover { background: #3468ba !important; border-color: #3468ba; }

@media (max-width: 1200px) {
	.kmMemberHeader { height: 94px; grid-template-columns: 1fr auto; grid-template-rows: 52px 42px; gap: 0 10px; padding: 0 16px; }
	.kmHeaderSpace { height: 94px; }
	.kmMemberBrand { grid-area: 1 / 1; }
	.kmMemberActions { grid-area: 1 / 2; }
	.kmMemberNav { grid-area: 2 / 1 / auto / -1; justify-content: flex-start; gap: 22px; }
	.kmMemberLogo { width: 140px; height: 50px; }
}
@media (max-width: 640px) {
	.kmMemberHeader { padding: 0 10px; column-gap: 6px; }
	.kmMemberLogo { width: 120px; height: 44px; }
	.kmMemberNav { gap: 15px; justify-content: space-between; }
	.kmNavItem > a { font-size: 12px; }
	.kmNavItem > a svg { display: none; }
	.kmNavItem:first-child .kmNavDrop { left: 0; transform: none; }
	.kmNavItem:last-child .kmNavDrop { left: auto; right: 0; transform: none; }
	.kmMemberActions { gap: 5px; }
	.kmMemberUser .kmMemberNick, .kmMemberIcon { display: none; }
	.kmMemberMoney { padding: 0 10px; font-size: 11px; }
	.kmMemberMoney em { display: none; }
	.kmMemberBtn { padding: 0 10px; font-size: 11px; height: 32px; }
}
