/* 2026-10-07 모바일·태블릿 메뉴 신형 (1500px 이하 오른쪽에서 열리는 메뉴판)
   main_page_menu.php · sub_page_menu.php 에서 add_layout_*_menu.css 다음에 불러옴 — PC 메뉴(1501px 이상)는 건드리지 않음 */
@media screen and (max-width:1500px) {
	/* 메뉴판 — !important 대신 id 선택자로 이김 (transition 에 !important 를 붙이면 열리지 않던 문제 2026-10-07) */
	html body #topNavs.top-navs {
		width: min(88vw, 400px);
		right: -110%;
		padding-top: 0;
		background: #fff;
		border-radius: 20px 0 0 20px;
		box-shadow: -28px 0 56px -28px rgba(10, 12, 16, .45);
		transition: right .38s cubic-bezier(.2, .8, .2, 1);
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
	}
	html body.top-navs--open #topNavs.top-navs { right: 0; }
	.top-navs::before {   /* 메뉴판 위 로고 줄 — 내려도 위에 고정 (닫기 X 단추가 글자와 겹치지 않게) */
		content: ""; position: sticky; top: 0; z-index: 2; display: block; height: 76px;
		background: #fff url(/theme/webs01_en/images/logo_en.png) 22px center / 118px 28px no-repeat;
		border-bottom: 1px solid #f0f1f3;
	}
	.top-navs-curtain { background: rgba(12, 14, 18, .52) !important; -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }

	.top-area .gnb { padding: 6px 20px 32px !important; border-top: 0 !important; }

	/* 대메뉴 */
	#gnb-list .gnb-item { position: relative; margin: 0 !important; padding: 0 !important; border-bottom: 1px solid #f1f2f4 !important; }
	#gnb-list .gnb-item > .gnb-link {
		display: block; padding: 17px 50px 17px 4px !important; font-size: 17px !important; font-weight: 700 !important;
		line-height: 1.3; letter-spacing: -.02em; color: #1c1e22 !important; transition: color .2s;
	}
	#gnb-list .gnb-item:has(.gnb-dep1-toggle.close) > .gnb-link { color: #E52E20 !important; }

	/* 펼침 단추 : 둥근 칸 + 꺾쇠 하나 */
	#gnb-list .gnb-dep1-toggle {
		top: 10px !important; right: 0 !important; width: 38px !important; height: 38px !important;
		border-radius: 11px; background: transparent; cursor: pointer; transition: background .2s;
	}
	#gnb-list .gnb-dep1-toggle::after { display: none !important; }
	#gnb-list .gnb-dep1-toggle::before {
		content: "" !important; left: 50% !important; top: 50% !important; width: 8px !important; height: 8px !important;
		background: none !important; border-right: 2px solid #8b9099; border-bottom: 2px solid #8b9099;
		transform: translate(-50%, -70%) rotate(45deg) !important; transition: transform .25s, border-color .2s !important;
	}
	#gnb-list .gnb-dep1-toggle.close { background: #fdeeec; }
	#gnb-list .gnb-dep1-toggle.close::before { border-color: #E52E20; transform: translate(-50%, -25%) rotate(-135deg) !important; }

	/* 하위 메뉴 : 두 줄 바둑판 단추 */
	#gnb-list .gnb-d1-list {
		margin: 0 0 16px !important; padding: 0 !important; background: none !important;
		column-count: 2; column-gap: 8px;
	}
	#gnb-list .gnb-d1-item { margin: 0 0 8px !important; padding: 0 !important; break-inside: avoid; min-width: 0 !important; }
	#gnb-list .gnb-d1-link {
		display: block; padding: 11px 12px !important; border-radius: 11px; background: #f5f6f8;
		font-size: 14px !important; font-weight: 500 !important; line-height: 1.35; color: #3a3f48 !important;
		letter-spacing: -.01em; transition: background .15s, color .15s;
	}
	#gnb-list .gnb-d1-link:active, #gnb-list .gnb-d1-link:hover { background: #fdeeec; color: #E52E20 !important; }

	/* 사업자문의 : 빨간 단추 */
	#gnb-list .gnb-item--biz { border-bottom: 0 !important; }
	html body #gnb-list .gnb-item--biz > .gnb-link, html body .top-area-box #gnb-list .gnb-item--biz > .gnb-link, html body .top-area-box.active #gnb-list .gnb-item--biz > .gnb-link {
		display: block; line-height: 1.3; color: #fff !important;
		margin-top: 18px; padding: 15px 16px !important; border-radius: 13px; background: #E52E20; color: #fff !important;
		text-align: center; font-size: 16px !important; box-shadow: 0 10px 20px -12px rgba(229, 46, 32, .8);
	}

	/* 바로가기 (아이키친몰 · 고객센터 · SNS) */
	.mnav-quick { margin-top: 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
	.mnav-quick a {
		display: flex; flex-direction: column; gap: 2px; padding: 13px 14px; border-radius: 13px; border: 1px solid #e8e9ec;
		background: #fff; color: #1c1e22 !important; text-decoration: none; line-height: 1.3;
	}
	.mnav-quick a b { font-size: 14.5px; font-weight: 700; letter-spacing: -.01em; }
	.mnav-quick a small { font-size: 12px; color: #8b9099; }
	.mnav-quick a .material-icons-round { font-size: 20px; color: #E52E20; margin-bottom: 4px; }
	.mnav-sns { display: flex; gap: 8px; margin-top: 14px; }
	.mnav-sns a {
		flex: 1; display: flex; align-items: center; justify-content: center; height: 40px; border-radius: 11px; background: #f5f6f8;
		font-size: 13px; font-weight: 600; color: #5a606b !important; text-decoration: none;
	}

	/* 로그인 · 언어 */
	.member_wrap_box_m { margin-top: 18px !important; padding: 0 !important; border: 0 !important; height: auto !important; }
	.member_wrap_box_m .member_wrap_m > * { line-height: 1.4 !important; height: auto !important; }
	.member_wrap_box_m .member_wrap_m {
		display: flex !important; align-items: center; justify-content: space-between; gap: 10px;
		height: auto !important; min-height: 0 !important; padding: 12px 16px !important; border-radius: 13px; background: #f5f6f8; margin: 0 !important;
	}
	.member_wrap_box_m .member_wrap_m p { margin: 0 !important; }
	.member_wrap_box_m .member_wrap_m .gnb-link { font-size: 14.5px !important; font-weight: 600 !important; color: #1c1e22 !important; padding: 0 !important; }
	.member_wrap_box_m .vl_3_t { width: 1px; height: 14px; background: #d5d8de; border: 0 !important; }
	.member_wrap_box_m .lang-switch { margin-left: auto; }

	/* 닫기(X) 단추 : 메뉴판 위에서 또렷하게 */
	.top-navs--open .top-nav-btn .pnb-bar-top, .top-navs--open .top-nav-btn .pnb-bar-btm { background-color: #1c1e22 !important; }
}
/* PC(1501px 이상) 에서는 모바일 바로가기 숨김 */
@media screen and (min-width:1501px) { .mnav-quick, .mnav-sns { display: none !important; } }

/* 영문 : 로그인이 없어 언어 칸 왼쪽에 이름 */
@media screen and (max-width:1500px) { .member_wrap_box_m .member_wrap_m::before { content: "Language"; font-size: 14.5px; font-weight: 600; color: #1c1e22; } }