/* sample4 메인·서브에서 함께 사용하는 기존 메인 메뉴 디자인 */
/* Mondrian-inspired framed sample navigation */
.cc-header--sample3,.cc-header--sample3.cc-header--home:not(.is-scrolled){top:30px;left:36px;right:36px;width:auto;height:72px;color:#fff;background:transparent;border:0;box-shadow:none;backdrop-filter:none}
.cc-header--sample3 .cc-header__inner{width:100%;max-width:none}
.cc-header--sample3 .cc-logo{width:166px}
.cc-header--sample3 .cc-logo img{filter:brightness(0) invert(1)}
.cc-header--sample3 .cc-nav>ul{gap:clamp(18px,2.2vw,38px)}
.cc-header--sample3 .cc-nav>ul>li>a,.cc-header--sample3.cc-header--home:not(.is-scrolled) .cc-nav>ul>li>a{padding:24px 0;color:#fff;font-family:"Albert Sans","Noto Sans KR",sans-serif;font-size:15px;font-weight:500}
.cc-nav-amp{display:inline-block;margin-inline:.08em;font-family:Arial,sans-serif;font-weight:700;line-height:1}
.cc-header--sample3 .cc-nav>ul>li>a:after{bottom:15px;background:#fff}
.cc-header--sample3 .cc-language{gap:3px;padding:3px;border:1px solid rgba(255,255,255,.42);border-radius:999px;background:rgba(9,32,48,.24);backdrop-filter:blur(12px)}
.cc-header--sample3 .cc-language a,.cc-header--sample3.cc-header--home:not(.is-scrolled) .cc-language a{min-width:33px;padding:6px 8px;border-radius:999px;color:rgba(255,255,255,.72);font-size:12px;line-height:1;text-align:center;transition:color .18s,background .18s,box-shadow .18s}
.cc-header--sample3 .cc-language a.is-active,.cc-header--sample3.cc-header--home:not(.is-scrolled) .cc-language a.is-active{color:#0b263a;background:#fff;box-shadow:0 3px 12px rgba(0,0,0,.16)}
.cc-header--sample3 .cc-language a:focus-visible{outline:2px solid #6cc7ea;outline-offset:2px}
.cc-header--sample3 .cc-language span{display:none}
.cc-header--sample3 .cc-header__tools{gap:10px}
.cc-header--sample3 .cc-account,.cc-header--sample3 .cc-contact{width:82px;height:45px;min-width:82px;padding:0 12px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.55);border-radius:999px;color:#fff;background:rgba(9,32,48,.2);font-family:Pretendard,"Noto Sans KR",sans-serif;font-size:14px;font-weight:600;line-height:1;transition:color .18s,border-color .18s,background .18s,transform .18s}
.cc-header--sample3 .cc-admin-link{width:82px;height:45px;min-width:82px;padding:0 12px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #0879bd;border-radius:999px;color:#fff;background:#0879bd;font-family:Pretendard,"Noto Sans KR",sans-serif;font-size:14px;font-weight:600;line-height:1;transition:border-color .18s,background .18s,transform .18s}
#ccHeader.cc-header--sample3:not(.is-scrolled) :is(.cc-account,.cc-contact){color:#fff}
#ccHeader.cc-header--sample3 :is(.cc-account,.cc-contact):hover,#ccHeader.cc-header--sample3 :is(.cc-account,.cc-contact):focus-visible{color:#fff;border-color:#0879bd;background:#0879bd;transform:translateY(-1px)}
#ccHeader.cc-header--sample3 .cc-admin-link:hover,#ccHeader.cc-header--sample3 .cc-admin-link:focus-visible{color:#fff;border-color:#075f94;background:#075f94;transform:translateY(-1px)}
.cc-header--sample3.is-scrolled{top:0;left:0;right:0;height:76px;background:rgba(255,255,255,.96);box-shadow:0 12px 35px rgba(0,0,0,.07);backdrop-filter:blur(18px)}
.cc-header--sample3.is-scrolled .cc-logo img{filter:none}
.cc-header--sample3.is-scrolled .cc-nav>ul>li>a{color:#111}
.cc-header--sample3.is-scrolled .cc-language{border-color:#cbd7de;background:#eef3f6}
.cc-header--sample3.is-scrolled .cc-language a{color:#5e7280}
.cc-header--sample3.is-scrolled .cc-language a.is-active{color:#fff;background:#0879bd;box-shadow:0 3px 10px rgba(8,121,189,.24)}
.cc-header--sample3.is-scrolled .cc-account,.cc-header--sample3.is-scrolled .cc-contact{color:#0b263a;border-color:#cfd9df;background:#fff}
.cc-header--sample3 .cc-subnav{border:0;border-radius:18px}
.cc-header--sample3 .cc-menu-toggle span,.cc-header--sample3.cc-header--home:not(.is-scrolled) .cc-menu-toggle span{background:#fff}
.cc-header--sample3.is-scrolled .cc-menu-toggle span{background:#111}
.cc-header--sample3.cc-header--home:not(.is-scrolled) .cc-language a{color:rgba(255,255,255,.72)}
.cc-header--sample3.cc-header--home:not(.is-scrolled) .cc-language a.is-active{color:#0b263a}
@media(max-width:1100px){.cc-header--sample3{left:24px;right:24px}
.cc-header--sample3 .cc-nav>ul{gap:18px}
.cc-header--sample3 .cc-nav>ul>li>a{font-size:14px}
#ccHeader .cc-contact{display:none}}
@media(max-width:1500px) and (min-width:1025px){
.cc-lang-fr .cc-header--sample3 .cc-header__inner{gap:20px}
.cc-lang-fr .cc-header--sample3 .cc-nav>ul{gap:14px}
.cc-lang-fr #ccHeader .cc-contact{display:none}
}
@media(max-width:1200px) and (min-width:1025px){
.cc-lang-fr .cc-header--sample3 .cc-nav{display:none}
.cc-lang-fr .cc-header--sample3 .cc-menu-toggle{display:block}
.cc-lang-fr .cc-header--sample3 .cc-header__tools{margin-left:auto}
.cc-lang-fr .cc-header--sample3 .cc-mobile-menu{position:fixed;inset:76px 0 0;display:block;padding:30px 24px 50px;overflow-y:auto;color:#111;background:#fff}
.cc-lang-fr .cc-header--sample3 .cc-mobile-menu[hidden]{display:none}
}
@media(max-width:760px){.cc-header--sample3,.cc-header--sample3.is-scrolled{top:0;left:0;right:0;height:72px;padding:0 6px}
.cc-header--sample3:not(.is-scrolled){top:20px;left:15px;right:15px}
.cc-header--sample3 .cc-header__inner{gap:12px}
.cc-header--sample3 .cc-logo{width:145px}
.cc-header--sample3 .cc-language{display:none}
.cc-header--sample3 .cc-header__tools{gap:8px}
.cc-header--sample3 .cc-admin-link{display:none}
.cc-header--sample3 .cc-account{width:62px;height:40px;min-width:62px;padding:0 10px;font-size:13px}
.cc-header--sample3 .cc-mobile-menu{inset:72px 0 0;padding:28px 22px;color:#111;background:#fff}
.cc-header--sample3 .cc-mobile-menu nav>a{font-family:"Albert Sans","Noto Sans KR",sans-serif;font-size:26px}}
/* Keep the fixed header aligned with the inset hero after scrolling. */
.cc-header--sample3.is-scrolled{top:30px;left:36px;right:36px;width:auto;height:72px;border-radius:18px}
@media(max-width:760px){.cc-header--sample3.cc-header--home:not(.is-scrolled),.cc-header--sample3.is-scrolled{top:20px;left:15px;right:15px;width:auto;height:72px;border-radius:14px}}

/* 메인에서 확정된 스크롤 상태를 서브에도 동일하게 적용한다. */
.cc-header--sample3.is-scrolled{top:0;border-radius:0 0 18px 18px}

@media(max-width:760px){.cc-header--sample3.is-scrolled{top:0;border-radius:0 0 14px 14px}}


/* 전체 화면 패널 대신 해당 메뉴 아래에 놓이는 세로형 드롭다운: 유리질감 패널 + 좌측 강조선 + 순차 등장 */
#ccHeader.cc-header--sample3 .cc-nav>ul>li.has-sub{position:relative}
#ccHeader.cc-header--sample3 .cc-subnav{position:absolute;top:calc(100% + 12px);left:50%;right:auto;width:256px;min-width:0;max-height:calc(100dvh - 135px);overflow-y:auto;overflow-x:hidden;display:block;padding:10px;margin:0;border:1px solid rgba(19,54,75,.08);border-radius:16px;background:rgba(255,255,255,.94);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 26px 60px -14px rgba(9,32,48,.3),0 4px 16px rgba(9,32,48,.06);opacity:0;visibility:hidden;transform-origin:top center;transform:translate(-50%,4px) scale(.98);transition:opacity .22s cubic-bezier(.16,1,.3,1),transform .22s cubic-bezier(.16,1,.3,1),visibility .22s}
#ccHeader.cc-header--sample3 .cc-subnav:before{content:'';position:absolute;top:-6px;left:50%;width:11px;height:11px;background:rgba(255,255,255,.94);border:1px solid rgba(19,54,75,.08);border-right:0;border-bottom:0;border-radius:3px 0 0 0;transform:translateX(-50%) rotate(45deg)}
#ccHeader.cc-header--sample3 .cc-subnav ul{margin:0;padding:0;list-style:none}
#ccHeader.cc-header--sample3 .cc-subnav li{width:auto;margin:0;display:block;opacity:0;transform:translateY(4px);transition:opacity .3s ease,transform .3s ease}
#ccHeader.cc-header--sample3 .has-sub:hover .cc-subnav li,#ccHeader.cc-header--sample3 .has-sub:focus-within .cc-subnav li{opacity:1;transform:translateY(0)}
#ccHeader.cc-header--sample3 .cc-subnav li:nth-child(1){transition-delay:.03s}
#ccHeader.cc-header--sample3 .cc-subnav li:nth-child(2){transition-delay:.07s}
#ccHeader.cc-header--sample3 .cc-subnav li:nth-child(3){transition-delay:.11s}
#ccHeader.cc-header--sample3 .cc-subnav li:nth-child(4){transition-delay:.15s}
#ccHeader.cc-header--sample3 .cc-subnav li:nth-child(5){transition-delay:.19s}
#ccHeader.cc-header--sample3 .cc-subnav li:nth-child(n+6){transition-delay:.22s}
#ccHeader.cc-header--sample3 .cc-subnav a{position:relative;display:flex;align-items:center;min-height:45px;padding:11px 16px 11px 18px;border:0;border-radius:9px;background:transparent;color:#213646;font-family:Pretendard,sans-serif;font-size:15px;font-weight:500;line-height:1.5;white-space:normal;word-break:keep-all;transition:background .2s,color .2s,padding-left .2s}
#ccHeader.cc-header--sample3 .cc-subnav a:before{content:'';position:absolute;left:4px;top:50%;width:3px;height:0;background:linear-gradient(180deg,#0875bb,#6cc7ea);border-radius:3px;transform:translateY(-50%);transition:height .22s ease}
#ccHeader.cc-header--sample3 .cc-subnav a:hover,#ccHeader.cc-header--sample3 .cc-subnav a:focus-visible{background:#f1f6f9;color:#0867b2;padding-left:23px}
#ccHeader.cc-header--sample3 .cc-subnav a:hover:before,#ccHeader.cc-header--sample3 .cc-subnav a:focus-visible:before{height:18px}
#ccHeader.cc-header--sample3 .has-sub:hover>.cc-subnav,#ccHeader.cc-header--sample3 .has-sub:focus-within>.cc-subnav{opacity:1;visibility:visible;transform:translate(-50%,0) scale(1)}
#ccHeader.cc-header--sample3 .has-sub.is-dismissed>.cc-subnav{opacity:0;visibility:hidden;pointer-events:none}
#ccHeader .s4-mobile-directory details{border-bottom:1px solid #e2e8ec}
#ccHeader .s4-mobile-directory summary{position:relative;padding:19px 32px 19px 0;list-style:none;cursor:pointer;color:#18344d;font:600 21px/1.4 Pretendard,sans-serif}
#ccHeader .s4-mobile-directory summary::-webkit-details-marker{display:none}
#ccHeader .s4-mobile-directory summary:after{content:'+';position:absolute;right:3px;font-size:24px;color:#738795;font-weight:400}
#ccHeader .s4-mobile-directory details[open] summary:after{content:'−'}
#ccHeader .s4-mobile-directory details>div{padding:0 0 14px 12px}
#ccHeader .s4-mobile-directory details a{display:block;padding:11px 10px;min-height:44px;color:#506675;font:400 16px/1.5 Pretendard,sans-serif;border:0}
#ccHeader .s4-mobile-directory details a:hover{color:#0867b2}
#ccHeader .s4-mobile-directory .s4-mobile-inquiry{display:flex;align-items:center;justify-content:space-between;padding:17px 20px;margin-top:24px;border:0;border-radius:8px;background:#0b263a;color:#fff;font:500 17px/1.5 Pretendard,sans-serif}
#ccHeader .cc-mobile-actions a{padding:8px 13px;border:1px solid #d5e0e6;border-radius:999px;color:#5e7280}
#ccHeader .cc-mobile-actions a.is-active{border-color:#0879bd;background:#0879bd;color:#fff;font-weight:700}
@media(prefers-reduced-motion:reduce){#ccHeader .cc-subnav,#ccHeader .cc-subnav li,#ccHeader .cc-subnav a,#ccHeader .cc-subnav a:before{transition:none!important}}
