        /* 헤더 상단 고정 세팅 */
        .site-header {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            background-color: #fff;
            z-index: 1000;
            border-bottom: 1px solid #e0e0e0;
            transition: box-shadow 0.3s ease;
        }

        /* 스크롤 시 그림자 효과 (JS와 연동) */
        .site-header.scrolled {
            box-shadow: 0 4px 15px rgba(0,0,0,0.08);
        }

        /* 1. 상단 정보 영역 */
        .header-top {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 20px 40px;
            border-bottom: 1px solid #f0f0f0;
        }
        .logo h1 { font-size: 24px; font-weight: 700; display: inline-block; margin-right: 10px; }
        .logo .sub-logo { font-size: 11px; color: #888; letter-spacing: 1px; }
        .contact-info, .cert-info { font-size: 13px; color: #666; }
        .cert-info { text-align: right; line-height: 1.4; }

        /* 2. 네비게이션 컨테이너 */
        .main-nav-container {
            position: relative;
            background-color: #fff;
        }

        /* 3. 메인 메뉴 및 서브 메뉴 컨테이너 통일 */
        .main-menu,
        .mega-menu-inner {
            display: flex;
            justify-content: center;
            width: 100%;
            max-width: 100%;
            margin: 0 auto;
        }

        /* 4. 대메뉴 항목과 서브메뉴 뼈대 완벽 동기화 */
        .main-menu > li,
        .sub-menu {
            flex: 1;
            min-width: 0;
            box-sizing: border-box;
            text-align: center;
            border-right: 1px solid #f0f0f0;
        }

        /* 첫 번째 항목 좌측 세로줄 통일 */
        .main-menu > li:first-child,
        .sub-menu:first-child {
            border-left: 1px solid #f0f0f0;
        }

        /* 5. 대메뉴 디자인 */
        .main-menu > li > a {
            display: block;
            padding: 20px 0;
            font-size: 18px;
            font-weight: 600;
            white-space: nowrap;
			color:#000;
        }
        .main-menu > li:hover > a { background-color: #fcfcfc; }

        /* 6. 메가 메뉴 (슬라이딩 로직) */
        .mega-menu-wrapper {
            position: absolute;
            top: 100%;
            left: 0;
            width: 100%;
            background-color: #fbfbfb;
            border-bottom: 1px solid #e0e0e0;

            /* 초기 상태 */
            max-height: 0;
            opacity: 0;
            visibility: hidden; /* 완전히 닫혔을 때 내부 링크 클릭 방지 */
            overflow: hidden;

            /* 부드러운 가감속을 위한 cubic-bezier 적용 및 transition 분리 */
            transition: max-height 0.4s cubic-bezier(0.25, 1, 0.5, 1),
                        opacity 0.3s ease-in-out,
                        visibility 0.4s;
        }

        /* 호버 시 메가메뉴 노출 */
        .main-nav-container:hover .mega-menu-wrapper {
            /* 실제 콘텐츠 높이(약 300~350px)에 최대한 가깝게 맞춰주세요.
               이 값이 실제 높이와 비슷할수록 마우스를 뗐을 때 즉각적으로 부드럽게 올라갑니다.
            */
            max-height: 380px;
            opacity: 1;
            visibility: visible;
        }

        /* 7. 서브메뉴 디자인 */
        .sub-menu {
            padding: 25px 0 40px 0;
        }
		.sub-menu li { width:100%; }

        .sub-menu li a {
            display: block;
            padding: 8px 0;
            font-size: 14px;
            color: #666;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
			text-align:center;
        }
        .sub-menu li a:hover {
            color: #000;
            font-weight: bold;
        }

        /* 8. 특정 컬럼 너비 비율 조정 */
        .main-menu > li:nth-child(2),
        .sub-menu:nth-child(2) { flex: 1.1; }

        .main-menu > li:nth-child(3),
        .sub-menu:nth-child(3) { flex: 1.5; }

        .main-menu > li:nth-child(4),
        .sub-menu:nth-child(4) { flex: 1.2; }

        .main-menu > li:nth-child(6),
        .sub-menu:nth-child(6) { flex: 1.1; }

        /* 9. 반응형 (태블릿/모바일 분기) */
        @media (max-width: 1024px) {
            .header-top { flex-direction: column; gap: 10px; text-align: center; }
            .main-menu > li > a { font-size: 14px; padding: 15px 0; }
            .sub-menu li a { font-size: 13px; }
        }