/* 탑메뉴 기본 */
.header-section {font-family: 'pretendard', sans-serif;}
.header-section .container {max-width: 1340px;}
.header-section .logo-box {
	width: 100%;
	height: 50px;
}
.header-section img {
	max-width: unset;
	max-height: unset;
	height: 100%;
	width: auto;
}
.header-section .logo.mar-4 {margin-top: 22px;}
@media only screen and (min-width: 1200px) {
	.header-section.style1 ul li a {padding: 35px 26px;}
	.header-section.style1 ul li a.m-link {padding: 35px 10px;}
	.header-section.style1 ul li .em-lang-select-1 {padding: 32px 10px;}
	.header-section ul li.cart-parent a.m-link,
	.header-section ul li.login-parent a.m-link,
	.header-section ul li.admin-parent a.m-link,
	.header-section ul li.join-parent a.m-link {font-size: 16px;}
}
@media only screen and (max-width: 1199px) {
    .header-section .logo.mar-4 {margin-top: 13px;padding-left: 0;}
	.header-section .logo-box {
		height: 35px;
	}
	.header-section img {}
	.header-section.style1 ul li a {padding: 22px 12px;}
	.header-section.style1 ul li .em-lang-select-1 {padding: 18px 10px;}
	.header-section ul li.menu-icon {padding: 0 0 0 20px;}
	.header-section.style1 ul li.menu-icon a {padding: 20px 10px;}
	.header-section #menu {padding: 23px 0 0;}
	.header-section #menu > ul li a {padding: 15px 25px;text-transform: none;}
	.header-section #menu > ul li .arrow {right: 10px;}
	.header-section.style1 ul li.search-parent .search-box .close-btn.mar-1 {top: 6px;}
}
@media only screen and (max-width: 640px) {
	.header-section {padding-bottom: 10px;}
	.header-section.style1 .mod-menu .row {margin-left: 0;margin-right: 0;}
	.header-section .logo.mar-4 {margin-top: 6px;margin-left: 3px;}
	.header-section .logo-box {
		height: 26px;
	}
	.header-section img {}
	.header-section.style1 ul li a {padding: 10px 10px;}
	.header-section.style1 ul li .em-lang-select-1 {padding:4px 10px;}
	.header-section ul li.menu-icon {padding: 0 0 0 10px;}
	.header-section.style1 ul li.menu-icon a {padding: 7px 10px;}
	.header-section #menu {padding: 12px 0 0;}
	.header-section.style1 ul li.search-parent .search-box .close-btn.mar-1 {top: 18px;}
}
@media only screen and (max-width: 360px) {
	.header-section {padding-bottom: 10px;}
	.header-section .logo.mar-4 {margin-top: 6px;margin-left: 0;}
	.header-section .logo-box {
		height: 23px;
	}
	.header-section img {}
	.header-section.style1 ul li a {padding: 14px 10px;}
	.header-section.style1 ul li .em-lang-select-1 {padding: 10px 10px;}
	.header-section ul li.menu-icon {padding: 0 0 0 10px;}
	.header-section.style1 ul li.menu-icon a {padding: 12px 10px;}
	.header-section #menu {padding: 12px 0 0;}
	.header-section.style1 ul li.search-parent .search-box .close-btn.mar-1 {top: 14px;}
}

/* 탑메뉴 변형 */
/* 밝은 컬러 배경 */
.header-section ul li a {color: #505050;}
.header-section ul li ul li a {color: #505050;}
.header-section ul > li:hover > a {color:#02a1e0;}
.header-section ul li ul > li:hover > a {color:#02a1e0;}
.header-section ul li.mega-menu ul > li:hover > a {color:#02a1e0;}
.header-section ul li.mega-menu ul li ul > li:hover > a {color:#02a1e0;}
.header-section ul li.menu-icon a,
.header-section ul li.search-parent a.m-link, 
.header-section ul li.cart-parent a.m-link, 
.header-section ul li.login-parent a.m-link, 
.header-section ul li.join-parent a.m-link, 
.header-section ul li.inquiry-parent a.m-link, 
.header-section ul li.admin-parent a.m-link {color: #505050;}
.header-section ul li.menu-icon:hover a,
.header-section ul li.search-parent a.m-link:hover, 
.header-section ul li.cart-parent a.m-link:hover, 
.header-section ul li.login-parent a.m-link:hover, 
.header-section ul li.join-parent a.m-link:hover, 
.header-section ul li.inquiry-parent a.m-link:hover, 
.header-section ul li.admin-parent a.m-link:hover {color:#02a1e0;}
/* 어두운 컬러 배경 */
.header-section.menu-bg-2 ul li a {color: #fff;}
.header-section.menu-bg-2 ul li ul li a {color: #323335;}
.header-section.menu-bg-2 ul > li:hover > a {color:#02a1e0;}
.header-section.menu-bg-2 ul li ul > li:hover > a {color:#02a1e0;}
.header-section.menu-bg-2 ul li.mega-menu ul > li:hover > a {color:#323335;}
.header-section.menu-bg-2 ul li.mega-menu ul li ul > li:hover > a {color:#02a1e0;}
.header-section.menu-bg-2 ul li.menu-icon a,
.header-section.menu-bg-2 ul li.search-parent a.m-link, 
.header-section.menu-bg-2 ul li.cart-parent a.m-link, 
.header-section.menu-bg-2 ul li.login-parent a.m-link, 
.header-section.menu-bg-2 ul li.join-parent a.m-link, 
.header-section.menu-bg-2 ul li.inquiry-parent a.m-link, 
.header-section.menu-bg-2 ul li.admin-parent a.m-link {color: #fff;}
.header-section.menu-bg-2 ul li.menu-icon:hover a,
.header-section.menu-bg-2 ul li.search-parent a.m-link:hover, 
.header-section.menu-bg-2 ul li.cart-parent a.m-link:hover, 
.header-section.menu-bg-2 ul li.login-parent a.m-link:hover, 
.header-section.menu-bg-2 ul li.join-parent a.m-link:hover, 
.header-section.menu-bg-2 ul li.inquiry-parent a.m-link:hover, 
.header-section.menu-bg-2 ul li.admin-parent a.m-link:hover {color:#02a1e0;}
/* 투명한 컬러 배경 */
.header-section.menu-bg-3 ul li a {color: #fff;}
.header-section.menu-bg-3 ul li ul li a {color: #323335;}
.header-section.menu-bg-3 ul > li:hover > a {color:#02b7ff;}
.header-section.menu-bg-3 ul li ul > li:hover > a {color:#02a1e0;}
.header-section.menu-bg-3 ul li.mega-menu ul > li:hover > a {color:#323335;}
.header-section.menu-bg-3 ul li.mega-menu ul li ul > li:hover > a {color:#02a1e0;}
.header-section.menu-bg-3 ul li.menu-icon a,
.header-section.menu-bg-3 ul li.search-parent a.m-link, 
.header-section.menu-bg-3 ul li.cart-parent a.m-link, 
.header-section.menu-bg-3 ul li.login-parent a.m-link, 
.header-section.menu-bg-3 ul li.join-parent a.m-link, 
.header-section.menu-bg-3 ul li.inquiry-parent a.m-link, 
.header-section.menu-bg-3 ul li.admin-parent a.m-link {color: #fff;}
.header-section.menu-bg-3 ul li.menu-icon:hover a,
.header-section.menu-bg-3 ul li.search-parent a.m-link:hover, 
.header-section.menu-bg-3 ul li.cart-parent a.m-link:hover, 
.header-section.menu-bg-3 ul li.login-parent a.m-link:hover, 
.header-section.menu-bg-3 ul li.join-parent a.m-link:hover, 
.header-section.menu-bg-3 ul li.inquiry-parent a.m-link:hover, 
.header-section.menu-bg-3 ul li.admin-parent a.m-link:hover {color:#02b7ff;}


.header-section.style1 ul li ul li a {
	font-weight: 500;
}
.header-section.style1 ul li .em-lang-select-1 .gui-input {
	cursor: pointer;
}

@media only screen and (min-width: 1200px) {
    .header-section.style1 ul li a {font-size: 18px;letter-spacing: -0.05em;font-weight: 600;padding: 35px 26px;}
    .header-section.style1 ul li ul li a {font-size: 15px;}
	.header-section.style1 ul li .em-lang-select-1 .gui-input {font-size: 16px;font-weight: 600;}
	.header-section ul li a.m-link span.pc-only {
		font-size: 0.9em;
		letter-spacing: -0.05em;
	}
	/* 1DEPTH 메뉴 센터 정렬 */
	.header-section.style1 #menu {width: calc(100% - (40px + 40px + 30px));margin-right: 30px;} /* 로그인, 로그아웃, 관리자 버튼 */
	.header-section.style1.option-parent #menu {width: calc(100% - (40px + 40px + 40px + 30px));margin-right: 30px;} /* 로그인, 로그아웃, 관리자 버튼 */
	.header-section.style1.language-parent #menu {width: calc(100% - (40px + 40px + 106px + 30px));margin-right: 30px;} /* 로그인, 로그아웃, 관리자 버튼 */
	.header-section.style1.option-parent.language-parent #menu {width: calc(100% - (40px + 40px + 40px + 106px + 30px));margin-right: 30px;} /* 로그인, 로그아웃, 관리자 버튼 */
	.header-section.style1.regjoin-parent #menu {width: calc(100% - (40px + 40px + 40px + 30px));margin-right: 30px;} /* 로그인, 로그아웃, 회원가입, 정보수정, 관리자 버튼 */
	.header-section.style1.regjoin-parent.option-parent #menu {width: calc(100% - (40px + 40px + 40px + 40px + 30px));margin-right: 30px;} /* 로그인, 로그아웃, 회원가입, 정보수정, 관리자 버튼 */
	.header-section.style1.regjoin-parent.language-parent #menu {width: calc(100% - (40px + 40px + 40px + 106px + 30px));margin-right: 30px;} /* 로그인, 로그아웃, 회원가입, 정보수정, 관리자 버튼 */
	.header-section.style1.regjoin-parent.option-parent.language-parent #menu {width: calc(100% - (40px + 40px + 40px + 40px + 106px + 30px));margin-right: 30px;} /* 로그인, 로그아웃, 회원가입, 정보수정, 관리자 버튼 */
	.header-section.style1.shoping-parent #menu {width: calc(100% - (40px + 40px + 40px + 40px + 30px));margin-right: 30px;} /* 로그인, 회원가입, 주문내역, 장바구니, My페이지, 관리자 버튼 */
	.header-section.style1.shoping-parent.option-parent #menu {width: calc(100% - (40px + 40px + 40px + 40px + 40px + 30px));margin-right: 30px;} /* 로그인, 회원가입, 주문내역, 장바구니, My페이지, 관리자 버튼 */
	.header-section.style1.shoping-parent.language-parent #menu {width: calc(100% - (40px + 40px + 40px + 40px + 106px + 30px));margin-right: 30px;} /* 로그인, 회원가입, 주문내역, 장바구니, My페이지, 관리자 버튼 */
	.header-section.style1.shoping-parent.option-parent.language-parent #menu {width: calc(100% - (40px + 40px + 40px + 40px + 40px + 106px + 30px));margin-right: 30px;} /* 로그인, 회원가입, 주문내역, 장바구니, My페이지, 관리자 버튼 */
	.header-section.style1.regjoin-parent-ko #menu {width: calc(100% - (93px + 93px + 93px + 30px));margin-right: 30px;} /* 로그인, 로그아웃, 회원가입, 정보수정, 관리자 버튼 */
	.header-section.style1.regjoin-parent-ko.option-parent #menu {width: calc(100% - (93px + 93px + 93px + 40px + 30px));margin-right: 30px;} /* 로그인, 로그아웃, 회원가입, 정보수정, 관리자 버튼 */
	.header-section.style1.regjoin-parent-ko.language-parent #menu {width: calc(100% - (93px + 93px + 93px + 106px + 30px));margin-right: 30px;} /* 로그인, 로그아웃, 회원가입, 정보수정, 관리자 버튼 */
	.header-section.style1.regjoin-parent-ko.option-parent.language-parent #menu {width: calc(100% - (93px + 93px + 93px + 40px + 106px + 30px));margin-right: 30px;} /* 로그인, 로그아웃, 회원가입, 정보수정, 관리자 버튼 */
	.header-section.style1.shoping-parent-ko #menu {width: calc(100% - (93px + 93px + 93px + 93px + 30px));margin-right: 30px;} /* 로그인, 회원가입, 주문내역, 장바구니, My페이지, 관리자 버튼 */
	.header-section.style1.shoping-parent-ko.option-parent #menu {width: calc(100% - (93px + 93px + 93px + 93px + 40px + 30px));margin-right: 30px;} /* 로그인, 회원가입, 주문내역, 장바구니, My페이지, 관리자 버튼 */
	.header-section.style1.shoping-parent-ko.language-parent #menu {width: calc(100% - (93px + 93px + 93px + 93px + 106px + 30px));margin-right: 30px;} /* 로그인, 회원가입, 주문내역, 장바구니, My페이지, 관리자 버튼 */
	.header-section.style1.shoping-parent-ko.option-parent.language-parent #menu {width: calc(100% - (93px + 93px + 93px + 93px + 40px + 106px + 30px));margin-right: 30px;} /* 로그인, 회원가입, 주문내역, 장바구니, My페이지, 관리자 버튼 */
	.header-section.style1 #menu ul.nav {width: 100%;}
    .header-section.style1 #menu ul.nav li.first {width: auto;text-align: center;} /* 메뉴 분류수로 분할 */
	.header-section.style1 #menu ul.nav li.first ul {text-align: left;}
}
@media only screen and (min-width: 1200px) {
	/* 밝은 컬러 배경 */
    .header-section.style1 {background-color: #fff;}
    .header-section.pin-style.pin {background:rgba(255, 255, 255, 1.0);} /*gnb sticky 백그라운드 색상*/
	.header-section ul li.active > a {
		color:#000;
	}
	.header-section ul li ul > li.active > a {
		color:#000;
	}
	/* 어두운 컬러 배경 */
	.header-section.style1.menu-bg-2 {background: linear-gradient(180deg, rgba(32, 32, 32,1.0) 0%, rgba(32, 32, 32,1.0) 70%, rgba(32, 32, 32,1.0) 100%);border-bottom: 0;}
    .header-section.pin-style.menu-bg-2.pin {background:rgba(0, 0, 0, 0.7);} /*gnb sticky 백그라운드 색상*/
	.header-section.menu-bg-2 ul li.active > a {
		color:#02a1e0;
	}
	.header-section.menu-bg-2 ul li ul > li.active > a {
		color:#02a1e0;
	}
	/* 투명한 컬러 배경 */
	.header-section.style1.menu-bg-3 {background: linear-gradient(180deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.2) 70%, rgba(0,0,0,0) 100%);border-bottom: 0;}
    .header-section.pin-style.menu-bg-3.pin {background:rgba(0, 0, 0, 0.7);} /*gnb sticky 백그라운드 색상*/
	.header-section.menu-bg-3 ul li.active > a {
		color:#02a1e0;
	}
	.header-section.menu-bg-3 ul li ul > li.active > a {
		color:#02a1e0;
	}
}
@media only screen and (max-width: 1199px) {
    .header-section ul li a.m-link span.pc-only {
		display: none;
	}
}
@media only screen and (max-width: 1199px) {
	/* 밝은 컬러 배경 */
    .header-section.style1 {background-color: #fff;border-bottom: 1px solid #dbdbdb;}
    .header-section #menu > ul li:hover > a, .header-section #menu > ul li:active > a,
    .header-section #menu > ul li.hover > a, .header-section #menu > ul li.active > a {color:#000;}
    .header-section #menu > ul li ul > li:hover > a, .header-section #menu > ul li ul > li.active > a {color:#000;}
	/* 어두운 컬러 배경 */
	.header-section.style1.menu-bg-2 {background-color: #202020;border-bottom: 1px solid #202020;}
    .header-section.menu-bg-2 #menu > ul li:hover > a, .header-section.menu-bg-2 #menu > ul li:active > a,
    .header-section.menu-bg-2 #menu > ul li.hover > a, .header-section.menu-bg-2 #menu > ul li.active > a {color:#02a1e0;}
    .header-section.menu-bg-2 #menu > ul li ul > li:hover > a, .header-section.menu-bg-2 #menu > ul li ul > li.active > a {color:#02a1e0;}
	/* 투명한 컬러 배경 */
	.header-section.style1.menu-bg-3 {background-color: #323232;border-bottom: 1px solid #323232;}
    .header-section.menu-bg-3 #menu > ul li:hover > a, .header-section.menu-bg-3 #menu > ul li:active > a,
    .header-section.menu-bg-3 #menu > ul li.hover > a, .header-section.menu-bg-3 #menu > ul li.active > a {color:#02a1e0;}
    .header-section.menu-bg-3 #menu > ul li ul > li:hover > a, .header-section.menu-bg-3 #menu > ul li ul > li.active > a {color:#02a1e0;}
}
/* Extend the existing hamburger layout without changing the shared megamenu CSS. */
@media only screen and (min-width: 1001px) and (max-width: 1199px) {
    .header-section.yunam-home-menu { padding-top: 5px; padding-bottom: 20px; }
    .header-section.yunam-home-menu.pin-start { position: absolute; }
    .header-section.yunam-home-menu.off { position: fixed; }
    .header-section.yunam-home-menu .logo { position: relative; z-index: 9999; }
    .header-section.yunam-home-menu .col-sm-9, .header-section.yunam-home-menu .col-sm-3 { width: 100%; float: none; flex: 0 0 100%; max-width: 100%; }
    .header-section.yunam-home-menu .main-nav .nav.top-nav { position: absolute; right: 0; top: 0; width: 100%; z-index: 2; text-align: right; }
    .header-section.yunam-home-menu .main-nav .nav.top-nav li { display: inline-block !important; vertical-align: top; float: none; }
    .header-section.yunam-home-menu .menu-icon { font-size: 1.71429em; }
    .header-section.yunam-home-menu .navbar-toggle { display: block; }
    .header-section.yunam-home-menu #menu { float: none; border: none; box-shadow: none; margin: 0 -15px; z-index: 99; }
    .header-section.yunam-home-menu #menu.collapse { display: none; }
    .header-section.yunam-home-menu #menu.collapse.in, .header-section.yunam-home-menu #menu.collapse.show { display: block; }
    .header-section.yunam-home-menu #menu > ul { background: #fff; margin: 0; flex-direction: column; justify-content: flex-end; }
    .header-section.yunam-home-menu #menu > ul li { float: none; position: relative; border-bottom: 1px solid #ececec; }
    .header-section.yunam-home-menu #menu > ul li .arrow { width: 40px; height: 40px; position: absolute; top: 5px; right: 10px; cursor: pointer; z-index: 999; }
    .header-section.yunam-home-menu #menu > ul li .arrow:before { content: ""; background: #323335; position: absolute; top: 17px; left: 11px; width: 15px; height: 3px; }
    .header-section.yunam-home-menu #menu > ul li .arrow:after { content: ""; background: #323335; position: absolute; top: 10px; left: 17px; height: 15px; width: 3px; }
    .header-section.yunam-home-menu #menu > ul li.hover > .arrow:after { display: none; }
    .header-section.yunam-home-menu #menu > ul li ul { display: none; opacity: 1; max-height: none; position: relative; width: 100%; left: auto; top: auto; margin: 0; border-top: 1px solid #ececec; overflow: visible; }
    .header-section.yunam-home-menu #menu > ul li.hover > ul { display: block; }
    .header-section.yunam-home-menu #menu > ul li ul li { float: none; width: 100%; padding: 0; border: none; }
    .header-section.yunam-home-menu #menu > ul li ul li a { text-transform: none; font-weight: 400; padding-left: 45px; }
}
@media only screen and (min-width: 1200px) {
    .header-section.yunam-home-menu .menu-icon { display: none !important; }
    .header-section.yunam-home-menu #menu { display: block; height: auto !important; overflow: visible; }
}
/* Desktop (1200px+): the entire shared grid overlays content; only the heading row reserves space. */
@media only screen and (min-width: 1200px) {
    .header-section.yunam-home-menu { overflow: visible; }
    .header-section.yunam-home-menu #menu {
        --yunam-menu-heading-height: 94px; /* Existing 35px + 24px + 35px heading rhythm. */
        position: relative; min-height: var(--yunam-menu-heading-height); overflow: visible; z-index: 1000;
    }
    .header-section.yunam-home-menu #menu > ul {
        display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr);
        position: absolute; top: 0; left: 0;
        grid-template-rows: var(--yunam-menu-heading-height) auto; gap: 0; width: 100%; margin: 0;
    }
    .header-section.yunam-home-menu #menu > ul::before,
    .header-section.yunam-home-menu #menu > ul::after { display: none; }
    .header-section.yunam-home-menu #menu > ul > li.first > .arrow { display: none; }
    .header-section.yunam-home-menu #menu > ul > li.first {
        display: grid; grid-template-rows: subgrid; grid-row: span 2;
        float: none; width: auto; min-width: 0; position: relative;
    }
    .header-section.yunam-home-menu #menu > ul > li.first > a {
        grid-row: 1; display: flex; align-items: center; justify-content: center; text-align: center;
        box-sizing: border-box; min-height: 0; padding: 0 12px; line-height: 24px;
        white-space: normal; overflow-wrap: anywhere;
    }
    .header-section.yunam-home-menu #menu > ul > li.first > ul {
        grid-row: 2; display: none; position: static; margin: 0;
        width: 100%; min-width: 0; max-width: none; max-height: none;
        opacity: 1; visibility: visible; overflow: visible;
        background: #fff; box-shadow: none; border: 0; transition: none;
        align-self: stretch; text-align: center;
    }
    .header-section.yunam-home-menu #menu:hover > ul > li.first > ul,
    .header-section.yunam-home-menu #menu:focus-within > ul > li.first > ul {
        display: block;
    }
    .header-section.yunam-home-menu #menu > ul > li.first > ul > li { float: none; width: 100%; }
    .header-section.yunam-home-menu #menu > ul > li.first > ul > li > a {
        display: block; padding-left: 12px; padding-right: 12px;
        white-space: normal; overflow-wrap: anywhere;
    }
}

/* Keep the existing logo in every closed/mobile state. */
.header-section.yunam-home-menu .yunam-logo-open { display: none; }

@media only screen and (min-width: 1200px) {
    /* One painted surface: shadows extend without adding scrollable layout width. */
    .header-section.yunam-home-menu #menu > ul { isolation: isolate; }
    .header-section.yunam-home-menu #menu > ul::before {
        content: ""; display: block; position: absolute; inset: 0; z-index: -1;
        background: rgba(255,255,255,0.9);
        box-shadow: 0 0 0 100vmax rgba(255,255,255,0.9);
        clip-path: inset(0 -100vmax); pointer-events: none; visibility: hidden;
    }
    .header-section.yunam-home-menu #menu:hover > ul::before,
    .header-section.yunam-home-menu #menu:focus-within > ul::before { visibility: visible; }
    .header-section.yunam-home-menu #menu > ul > li.first > ul { background: transparent; }
    .header-section.yunam-home-menu #menu:hover > ul > li.first > a,
    .header-section.yunam-home-menu #menu:focus-within > ul > li.first > a { color: #323232; }
    .header-section.yunam-home-menu #menu:hover > ul > li.first > ul > li > a,
    .header-section.yunam-home-menu #menu:focus-within > ul > li.first > ul > li > a { color: #525252; }

    .header-section.yunam-home-menu #menu > ul > li.first > a { position: relative; }
    .header-section.yunam-home-menu #menu > ul > li.first > a::after {
        content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px;
        background: #02a1e0; transform: scaleX(0); transform-origin: center;
        transition: transform .2s; pointer-events: none;
    }
    .header-section.yunam-home-menu #menu:is(:hover, :focus-within) > ul > li.first:is(.active, :hover, :focus-within) > a::after {
        transform: scaleX(1);
    }
    /* Reuse the dark blue from Yunam product headings and ESG emphasis. */
    .header-section.yunam-home-menu #menu > ul > li.first > ul > li > a { text-align: center; margin-left: 0; }
    .header-section.yunam-home-menu #menu:is(:hover, :focus-within) > ul > li.first:is(.active, :focus-within) > a {
        color: #163e70;
    }
    .header-section.yunam-home-menu #menu:is(:hover, :focus-within) > ul > li.first > ul > li.active > a,
    .header-section.yunam-home-menu #menu:is(:hover, :focus-within) > ul > li.first > ul > li > a:is(:focus, :focus-visible) {
        color: #163e70;
    }
    .header-section.yunam-home-menu #menu:is(:hover, :focus-within) > ul > li.first:is(.active, :focus-within) > a::after {
        background: #163e70;
    }
    /* Logo is a preceding sibling branch, so its state follows the menu via :has(). */
    .header-section.yunam-home-menu:has(#menu:hover, #menu:focus-within) .logo,
    .header-section.yunam-home-menu:has(#menu:hover, #menu:focus-within) .main-nav > .top-nav {
        position: relative; z-index: 1001;
    }
    .header-section.yunam-home-menu:has(#menu:hover, #menu:focus-within) .yunam-logo-default { display: none; }
    .header-section.yunam-home-menu:has(#menu:hover, #menu:focus-within) .yunam-logo-open { display: inline-block; }
}
