 /* ==================================================================
       [CSS] 스타일 정의 (Integrated Menu System - Mobile Fixed 기반)
       ================================================================== */
    #wrap { width: 100%; position: relative; transition: all 0.3s ease; ; }

    /* --- 테마 변수 --- */
    #wrap.theme-light {
        --bg-body: #fff;
        --bg-header-solid: #ffffff;  
        --bg-header-glass: rgba(255, 255, 255, 0.1); 
        --bg-header-active: rgba(255, 255, 255, 0.98);
        --border-color: #e5e5e5;
        --border-glass: rgba(255, 255, 255, 0.2);
        --text-primary: #111111; 
        --text-secondary: #555555; 
        --text-hover: #fa4300;     
        --point-color: #fa4300;
        --shadow-sm: 0 2px 10px rgba(0,0,0,0.05);
        --shadow-glass: 0 10px 30px rgba(0,0,0,0.1);
        --text-shadow-light: 0 1px 3px rgba(0,0,0,0.3);
        --bg-fullmenu: rgba(255, 255, 255, 0.98);
        --bg-sub-box: #ffffff;
    }
    #wrap.theme-dark {
        --bg-body: #111;
        --bg-header-solid: #000000;
        --bg-header-glass: rgba(0, 0, 0, 0.3);
        --bg-header-active: rgba(10, 10, 10, 0.95);
        --border-color: #e5e5e5;
        --border-glass: rgba(255, 255, 255, 0.1);
        --text-primary: #ffffff;
        --text-secondary: #cccccc;
        --text-hover: #fa4300;
        --point-color: #fa4300;
        --shadow-sm: 0 2px 10px rgba(0,0,0,0.5);
        --shadow-glass: 0 10px 30px rgba(0,0,0,0.5);
        --text-shadow-light: 0 1px 3px rgba(0,0,0,0.8);
        --bg-fullmenu: rgba(15, 15, 15, 0.98);
        --bg-sub-box: #222222;
    }


    /* --- 헤더 레이아웃 --- */
    header#header { width: 100%; height: 90px; z-index: 1000; display: flex; justify-content: space-between;
	align-items: center; padding: 0 40px; border-bottom: 0;  transition: all 0.4s ease; /* 텍스트 색상 전환 등 */}
    .header-left { flex: 0 0 auto; z-index: 1002;width:250px; }
	.header-left > a{display:block;width:100%}
	.header-left > a > img{width:100%;background:url(../img/logo_1.png) no-repeat center;-webkit-background-size: cover;
	background-size: cover;}



/*테마 타입c 로고. 버튼*/
.type-c  .header-left   a   img{width:100%;background:url(../img/logo_2.png) no-repeat center / cover !important;}
.type-c  header.gnb-open   .header-left   a  img {background:url(../img/logo_1.png) no-repeat center / cover !important;}
.type-c  header.scrolled   .header-left   a  img {background:url(../img/logo_1.png) no-repeat center / cover !important;}


.type-c .all-menu-btn span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: #fff!important;
  border-radius: 3px;
  opacity: 1;
  left: 0;
  transform: rotate(0deg);
  transition: .25s ease-in-out;
}

/*테마 다크 로고*/
.theme-dark  .header-left   a   img{width:100%;background:url(../img/logo_2.png) no-repeat center / cover !important;}
.theme-dark  header.gnb-open   .header-left   a  img {background:url(../img/logo_2.png) no-repeat center / cover !important;}
.theme-dark  header.scrolled   .header-left   a  img {background:url(../img/logo_2.png) no-repeat center / cover !important;}


    .header-center { flex: 1 1 auto; display: flex; justify-content: center; height: 100%; }
    .header-right { flex: 0 0 auto; display: flex; align-items: center; justify-content: flex-end; z-index: 1002; gap: 20px; }

    .logo {  }

    .gnb { display: flex; height: 100%; }
    .gnb > li { height: 100%; display: flex; align-items: center; position: relative; }
    .gnb > li > a {transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1); /* 부드럽고 쫀득한 애니메이션 */ display: block; padding: 0 60px; height: 90px; line-height: 90px; font-size: 1.1rem; font-weight: 600;  color: var(--text-primary); position: relative; z-index: 1002; }
    .gnb > li:hover > a, .gnb > li.active > a { color: var(--text-hover);padding:0 80px }
    .gnb > li > a::after { content:''; position: absolute; bottom: 0; left: 0; width: 0; height: 3px; background: var(--text-hover); transition: 0.3s; }
    .gnb > li:hover > a::after, .gnb > li.active > a::after { width: 100%; }

  
    /* --- 헤더 상태 변화 (출렁임 방지) --- */
    /* scrolled 클래스가 붙을 때 애니메이션으로 툭 떨어지는 대신, 제자리에서 스타일만 부드럽게 변하도록 수정 */
    header.gnb-open, header.scrolled { 
        background: var(--bg-header-active); 
        backdrop-filter: blur(20px); 
        /*border-bottom: 1px solid var(--border-color);*/ 
        box-shadow: var(--shadow-sm);
    }
    




    /* [수정] fixed 대신 sticky를 활용하거나, fixed 전환 시에도 자연스럽게 처리 */
    header.scrolled { 
        position: fixed; top: 0; left: 0; 
    }
    /* --- Type A: Relative --- */
    #wrap.type-a header { position: relative; top: 0; left: 0; background: var(--bg-header-solid); }
    #wrap.type-a header.gnb-open, #wrap.type-a header.scrolled { /*border-bottom: 1px solid var(--border-color);*/ }
    #wrap.type-a header.scrolled { position: fixed; box-shadow: var(--shadow-sm); }
    #wrap.type-a .gnb-bg { border-top: 1px solid var(--border-color); }

    /* --- Type B: Glass Overlay (Fixed) --- */
    #wrap.type-b header { position: fixed; top: 0; left: 0; background: var(--bg-header-glass); backdrop-filter: blur(8px); border-bottom: 1px solid var(--border-glass); }
    
    /* --- Type C: Reverse (Transparent -> Fixed) --- */
    #wrap.type-c header { position: fixed; top: 0; left: 0; background: transparent; }
    #wrap.type-c header.gnb-open, #wrap.type-c header.scrolled { background: var(--bg-header-solid); /*border-bottom: 1px solid var(--border-color);*/ box-shadow: var(--shadow-sm); }
    #wrap.type-c .gnb-bg {/* border-top: 1px solid var(--border-color);*/ }




    /* --- [중요] Type B & C 텍스트 색상 제어 --- */
    /* 1. 기본 상태: 흰색 텍스트 */
    #wrap.type-b header:not(.gnb-open):not(.scrolled) .logo,
    #wrap.type-b header:not(.gnb-open):not(.scrolled) .gnb > li > a,
    #wrap.type-b header:not(.gnb-open):not(.scrolled) .all-menu-btn,
    #wrap.type-c header:not(.gnb-open):not(.scrolled) .logo,
    #wrap.type-c header:not(.gnb-open):not(.scrolled) .gnb > li > a,
    #wrap.type-c header:not(.gnb-open):not(.scrolled) .all-menu-btn {
        color: #fff !important; text-shadow: var(--text-shadow-light);
    }

    /* 2. 활성 상태: 테마 색상으로 복귀 */
    #wrap.type-b header.gnb-open .logo, #wrap.type-b header.scrolled .logo,
	 #wrap.type-c header.gnb-open .logo, #wrap.type-c header.scrolled .logo{ 
        color: var(--text-primary) !important; text-shadow: none; 
    }



    #wrap.type-b header.gnb-open .gnb > li > a, #wrap.type-b header.scrolled .gnb > li > a,
    #wrap.type-c header.gnb-open .gnb > li > a, #wrap.type-c header.scrolled .gnb > li > a { 
        color: var(--text-primary) !important; text-shadow: none; 
    }
    #wrap.type-b header.gnb-open .all-menu-btn, #wrap.type-b header.scrolled .all-menu-btn { 
        color: var(--text-primary) !important; text-shadow: none; 
    }

 #wrap.type-c header.gnb-open .all-menu-btn span, #wrap.type-c header.scrolled .all-menu-btn span { 
        background:  #111 !important; text-shadow: none; 
    }


    #wrap.type-b header.gnb-open .gnb > li:hover > a, #wrap.type-b header.scrolled .gnb > li:hover > a,
    #wrap.type-c header.gnb-open .gnb > li:hover > a, #wrap.type-c header.scrolled .gnb > li:hover > a { 
        color: var(--text-hover) !important; 
    }

    /* --- 서브메뉴 (PC) --- */
    .depth2 { display: none; }
    .depth2 li a { display: block; font-size: 1rem; color: var(--text-secondary); font-weight: 600; transition: 0.2s; white-space: nowrap; }
    .depth2 li a:hover { color: var(--text-hover); transform: translateX(5px); font-weight: 800; }

    .gnb-bg { position: absolute; top: 90px; left: 0; width: 100%; height: 0; background: var(--bg-header-active); backdrop-filter: blur(20px); /*border-bottom: 1px solid var(--border-color);*/ overflow: hidden; transition: height 0.4s ease; z-index: 1001; }
    
    /* 기본 모드일때 Wide 전용 리치 텍스트 숨김 처리 (자연스러운 텍스트 링크로 변환) */
    .wide-icon, .wide-text p, .wide-footer { display: none; }
    .wide-text strong { font-weight: inherit; font-size: inherit; color: inherit; display: inline; }

    /* Type B Glass 모드일 때 서브메뉴 배경 글래스 효과 */
    #wrap.type-b .gnb-bg { background: var(--bg-header-glass); border-color: var(--border-glass); backdrop-filter: blur(20px); }

    /* Mode 1: Single Drop */
    #wrap.menu-single .gnb > li { position: relative; } 
    #wrap.menu-single .gnb-bg { display: none !important; }
    #wrap.menu-single .depth2 { display: block; position: absolute; top: 90px; left: 50%; transform: translateX(-50%) translateY(20px); min-width: 180px; background: var(--bg-sub-box); border: 1px solid var(--border-color); border-top: none; border-radius: 0 0 8px 8px; box-shadow: var(--shadow-glass); padding: 15px 0; text-align: center; opacity: 0; visibility: hidden; z-index: 1002; transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
    #wrap.menu-single .depth2 li a { padding: 10px 20px; }
    #wrap.menu-single .gnb > li:hover .depth2 { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
    #wrap.type-b.menu-single .depth2 { background: var(--bg-header-active); backdrop-filter: blur(20px); border-color: var(--border-glass); }

    /* Mode 2: Full Drop */
    #wrap.menu-full .gnb > li { position: relative; } 
    #wrap.menu-full .gnb-bg { position: absolute; top: 90px; left: 0; width: 100%; }
    #wrap.menu-full .depth2 { display: block; position: absolute; top: 90px; left: 50%; transform: translateX(-50%); min-width: 140px; text-align: center; opacity: 0; visibility: hidden; transition: 0.3s; z-index: 1002; padding: 30px 0; }
    #wrap.menu-full .depth2 li a { padding: 8px 0; }
    #wrap.menu-full header.gnb-open .gnb-bg { height: 280px; }
    #wrap.menu-full header.gnb-open .depth2 { opacity: 1; visibility: visible; }


/* =========================================
   Mode 3: Wide Single Drop (고급 3열 타일/그리드 리디자인)
   ========================================= */
#wrap.menu-wide-single .gnb > li { position: relative; } 
#wrap.menu-wide-single .gnb-bg { display: none !important; }

/* 기존 flex 방식을 grid로 변경하여 완벽한 3열 및 여백 보장 */
#wrap.menu-wide-single .depth2 { 
    display: grid; 
    grid-template-columns: repeat(3, 1fr); /* 무조건 1줄에 3개씩 배치 */
    gap: 20px; /* 아이템 간의 간격 */
    position: absolute; top: 90px; left: 50%; 
    transform: translateX(-50%) translateY(-15px); /* 위에서 아래로 스르륵 내려오는 모션 */
    width: 90vw; max-width: 1050px; /* 최대 너비 고정 */
    background: var(--bg-sub-box); border: 1px solid var(--border-color); border-top: none; 
    border-radius: 0 0 12px 12px; /* 부드러운 모서리 마감 */
    box-shadow: 0 25px 50px rgba(0,0,0,0.06); padding: 40px 20px; 
    opacity: 0; visibility: hidden; z-index: 1002; transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); 
}

#wrap.menu-wide-single .gnb > li:hover .depth2 { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
#wrap.type-b.menu-wide-single .depth2 { background: var(--bg-header-active); backdrop-filter: blur(20px); border-color: var(--border-glass); }

/* 아이템 마진 제거 (Grid의 gap으로 자동 조절됨) */
#wrap.menu-wide-single .depth2 li { margin: 0; display: block; }

/* 타일(박스) 내부 고급화 디자인 */
#wrap.menu-wide-single .depth2 li a.wide-item { 
    display: flex; flex-direction: column; justify-content: center;
    width: 100%; height: 100%;
    text-align: left; transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); white-space: normal; 
  
    border: 1px solid rgba(128, 128, 128, 0.05); /* 아주 얇은 테두리 */
    border-radius: 8px; /* 타일 모서리 둥글게 */
    padding: 30px 15px; 
    position: relative;
    overflow: hidden;
}

/* 호버 시 왼쪽에서 자라나는 포인트 컬러 액센트 라인 */
#wrap.menu-wide-single .depth2 li a.wide-item::before {
    content: ''; position: absolute; top: 0; left: 0; width: 3px; height: 0; 
    background: var(--point-color); transition: height 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

/* 아이템 호버 시 살짝 떠오르는 고급스러운 입체감 */
#wrap.menu-wide-single .depth2 li a.wide-item:hover { 
    background: var(--bg-body); 
    border-color: transparent;

    transform: translateY(-5px); 
}
#wrap.menu-wide-single .depth2 li a.wide-item:hover::before { height: 100%; }
#wrap.theme-dark.menu-wide-single .depth2 li a.wide-item:hover { background: rgba(255, 255, 255, 0.02); }

/* 아이콘 완전 숨김 (텍스트 중심) */
#wrap.menu-wide-single .wide-icon { display: none !important; }

#wrap.menu-wide-single .wide-text { width: 100%; }

/* 제목 텍스트 */
#wrap.menu-wide-single .wide-text strong { 
    display: block; font-size: 1.35rem; font-weight: 800; color: var(--text-primary); 
    margin-bottom: 10px; letter-spacing: -0.3px; transition: color 0.4s; 
}
#wrap.menu-wide-single .depth2 li a.wide-item:hover .wide-text strong { color: var(--point-color); }

/* 설명 텍스트 */
#wrap.menu-wide-single .wide-text p { 
    display: block; font-size: 0.95rem; color: var(--text-secondary); line-height: 1.5; 
    font-weight: 500; margin: 0; opacity: 0.6; transition: opacity 0.4s ease; 
}
#wrap.menu-wide-single .depth2 li a.wide-item:hover .wide-text p { opacity: 0.9; }

/* 푸터 영역 (그리드 전체 1~3열을 모두 가로지름) */
#wrap.menu-wide-single .wide-footer { 
    grid-column: 1 / -1; 
    display: block; width: 100%; text-align: left; border-top: 1px solid var(--border-color); padding-top: 20px; margin-top: 10px; 
}
#wrap.menu-wide-single .wide-footer a { display: inline-block; padding: 5px 20px 5px 0; font-weight: 600; font-size: 0.95rem; color: var(--text-primary); width: auto; transition: 0.3s; }
#wrap.menu-wide-single .wide-footer a:hover { color: var(--point-color); text-decoration: none; transform: translateX(5px); }

 /* 추가: 검색 토글 버튼 아이콘 투명 테마 색상 동기화 */
    #wrap.type-b header:not(.gnb-open):not(.scrolled) .search-toggle-btn,
    #wrap.type-c header:not(.gnb-open):not(.scrolled) .search-toggle-btn { color: #fff !important; text-shadow: var(--text-shadow-light); }
    #wrap.type-b header.gnb-open .search-toggle-btn, #wrap.type-b header.scrolled .search-toggle-btn,
    #wrap.type-c header.gnb-open .search-toggle-btn, #wrap.type-c header.scrolled .search-toggle-btn { color: var(--text-primary) !important; text-shadow: none; }


/* =========================================
       통합 검색 스타일 (Type 1 & Type 2)
       ========================================= */

    /* 검색 돋보기 버튼 */
    .search-toggle-btn { background: transparent; border: none; font-size: 1.4rem; color: var(--text-primary); cursor: pointer; transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); outline: none; padding: 5px; width: 30px; overflow: hidden; }
    .search-toggle-btn:hover { color: var(--point-color) !important; }
    
    /* 검색창 활성화 시 돋보기 버튼 숨김 */
    #wrap.is-search-open .search-toggle-btn { width: 0; opacity: 0; padding: 0; margin: 0; pointer-events: none; }

    /* Type 2 전용 전체화면 딤 처리 오버레이 */
    .search-overlay-bg { display: none; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 1003; opacity: 0; visibility: hidden; transition: all 0.4s ease; cursor: pointer; }
    /* 무조건 어두운 블랙 배경으로 고정 */
    #wrap.search-type-2 .search-overlay-bg { display: block; background: rgba(0,0,0,0.85) !important; backdrop-filter: blur(8px); }
    #wrap.search-type-2.is-search-open .search-overlay-bg { opacity: 1; visibility: visible; }

    /* 검색 폼 공통 스타일 */
    .inline-search-form { position: relative; z-index: 1004; display: flex; align-items: center; transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); white-space: nowrap; }
    .inline-search-form input[type="text"] { flex: 1; width: 100%; border: none; background: transparent; color: var(--text-primary); font-family: inherit; outline: none; }
    .inline-search-form .search-submit-btn, .inline-search-form .search-close-btn { background: transparent; border: none; color: var(--text-primary); cursor: pointer; outline: none; transition: 0.3s; display: flex; align-items: center; justify-content: center; }
    .inline-search-form .search-submit-btn:hover, .inline-search-form .search-close-btn:hover { color: var(--point-color); }

/* --- [Type 1] 헤더 안에서 인라인으로 밀면서 나오는 형태 --- */
    #wrap.search-type-1 .inline-search-form { width: 0; opacity: 0; overflow: hidden; background: rgba(128, 128, 128, 0.1); border-radius: 30px; border: 1px solid transparent; height: 44px; }
    #wrap.theme-dark.search-type-1 .inline-search-form { background: rgba(255, 255, 255, 0.1); }
    
    #wrap.search-type-1.is-search-open .inline-search-form { width: 300px; opacity: 1; padding: 0 15px; margin-right: 15px; border-color: var(--border-color); }
    
    /* 1. Type 1 포커스 시 흰색 배경이 채워지던 현상 제거, 테두리 색상만 강조되도록 수정 */
    #wrap.search-type-1 .inline-search-form:focus-within { border-color: var(--point-color); box-shadow: none; background: transparent; }
    
    #wrap.search-type-1 .inline-search-form input[type="text"] { font-size: 1.05rem; padding: 5px; font-weight: 500; }
    #wrap.search-type-1 .inline-search-form input[type="text"]::placeholder { color: var(--text-secondary); opacity: 0.6; font-weight: 400; }
    #wrap.search-type-1 .inline-search-form .search-submit-btn, #wrap.search-type-1 .inline-search-form .search-close-btn { font-size: 1.2rem; padding: 5px; }

    /* 2. 투명/Glass 테마(Type B, C)에서 포커스(열림) 유무와 상관없이 항상 흰색(#fff) 텍스트 및 아이콘 색상 유지 */
    #wrap.type-b.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form input,
    #wrap.type-c.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form input,
    #wrap.type-b.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form button,
    #wrap.type-c.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form button { color: #fff !important; text-shadow: var(--text-shadow-light); }
    
    #wrap.type-b.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form input::placeholder,
    #wrap.type-c.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form input::placeholder { color: rgba(255,255,255,0.7) !important; }
    /* --- [Type 2] 화면 중앙에 크게 나타나는 모달 형태 --- */
    
    /* [완벽해결] top을 화면 바깥(-20vh)에 배치하여 위에서 아래로 스르륵 떨어지는 애니메이션 적용. */
    #wrap.search-type-2 .inline-search-form { 
        position: fixed; 
        top: -20vh; /* 화면 위쪽 바깥에서 대기 */
        left: 50%; 
        transform: translate(-50%, -50%); 
        width: 90vw; max-width: 700px; 
        background: transparent !important; 
        border: none !important; /* 모든 기본 보더 제거 */
        border-bottom: 3px solid #ffffff !important; /* 밑줄은 항상 강제 흰색 적용 */
        padding: 0 0 15px 0; 
        opacity: 0; visibility: hidden; flex-direction: row; border-radius: 0; 
        transition: all 0.6s cubic-bezier(0.25, 1, 0.3, 1) !important; /* 끊김 없는 부드러운 애니메이션 */
        box-shadow: none !important;
    }
    
    /* 열렸을 때 정중앙 안착 (떨어지는 애니메이션 완료 지점) */
    #wrap.search-type-2.is-search-open .inline-search-form { 
        top: 50vh; /* 화면 중앙 높이 */
        opacity: 1; visibility: visible; 
    }
    
    /* [완벽해결] Type 2 입력창 포커스 시 배경과 보더 색상이 변하는 현상 완전히 차단 (무조건 흰색) */
    #wrap.search-type-2 .inline-search-form:focus-within { 
        background: transparent !important; 
        box-shadow: none !important; 
        border: none !important; 
        border-bottom: 3px solid #ffffff !important; 
    }

	    /* [완벽해결] Type 1 입력창 포커스 시 배경과 보더 색상이 변하는 현상 완전히 차단 (무조건 흰색) */
#wrap.search-type-1 .inline-search-form:focus-within { 

}
    
    /* Type 2 폰트 및 버튼 색상 흰색 강제 고정 */
    #wrap.search-type-2 .inline-search-form input[type="text"] { font-size: 3rem; font-weight: 700; padding: 10px 60px 10px 20px; text-align: center; color: #ffffff !important; }
    #wrap.search-type-2 .inline-search-form input[type="text"]::placeholder { font-weight: 300; opacity: 0.4; color: #ffffff !important; }
    #wrap.search-type-2 .inline-search-form .search-submit-btn { font-size: 2.5rem; padding: 10px; position: absolute; right: 0; top: 0; bottom: 15px; color: #ffffff !important; }
    #wrap.search-type-2 .inline-search-form .search-close-btn { position: absolute; top: -80px; right: 0; font-size: 3rem; color: #ffffff !important; }
    
    #wrap.search-type-2 .inline-search-form .search-submit-btn:hover,
    #wrap.search-type-2 .inline-search-form .search-close-btn:hover { color: #ffffff !important; opacity: 0.7; }


    /* ★ 서브메뉴 없는 항목은 Single / Wide Single 에서 박스 노출 완전 방지
    #wrap.menu-single .gnb > li.no-sub .depth2,
    #wrap.menu-wide-single .gnb > li.no-sub .depth2 {
        display: none !important;
    }
 */

    @media (max-width: 769px) {
/* 1. iOS 기본 인풋 스타일 렌더링 무력화 */
  #wrap.search-type-1 .inline-search-form input[type="text"] {
    -webkit-appearance: none; 
    border-radius: 0;
  }

  /* 2. 웹킷(아이폰 사파리, 안드로이드 크롬 등) 전용 플레이스홀더 */
  #wrap.search-type-1 .inline-search-form input[type="text"]::-webkit-input-placeholder {
    color: #5a5a5a !important; 
    -webkit-text-fill-color: #5a5a5a !important; /* 글자 내부 색상을 강제로 채움! (핵심) */
    opacity: 1 !important;
    text-shadow: none !important;
  }

  /* 3. 파이어폭스 전용 */
  #wrap.search-type-1 .inline-search-form input[type="text"]::-moz-placeholder {
    color: #5a5a5a !important;
    opacity: 1 !important;
    text-shadow: none !important;
  }

  /* 4. 구형 IE/Edge 전용 (혹시 모를 대비) */
  #wrap.search-type-1 .inline-search-form input[type="text"]:-ms-input-placeholder {
    color: #5a5a5a !important;
    opacity: 1 !important;
    text-shadow: none !important;
  }

  /* 5. 표준 플레이스홀더 */
  #wrap.search-type-1 .inline-search-form input[type="text"]::placeholder {
    color: #5a5a5a !important;
    -webkit-text-fill-color: #5a5a5a !important; 
    opacity: 1 !important;
    text-shadow: none !important;
  }
	
	}
    /* --- 햄버거 버튼 & 풀스크린 메뉴 --- */
   

		/* 기존 .hamburger-btn 스타일을 .all-menu-btn으로 변경 */
        .all-menu-btn {
            width: 30px;
            height: 27px;
            position: relative;
            cursor: pointer;
            display: block;
            /* 기존 버튼 스타일 초기화 */
            background: transparent;
            border: none;
        }

        /* 햄버거 막대기 3개 공통 스타일 */
        .all-menu-btn span {
            display: block;
            position: absolute;
            height: 3px;
            width: 100%;
            background: var(--text-primary) !important;;
            border-radius: 3px;
            opacity: 1;
            left: 0;
            transform: rotate(0deg);
            transition: .25s ease-in-out;
        }

        /* 막대기 위치 지정 */
        .all-menu-btn span:nth-child(1) { top: 0px; }
        .all-menu-btn span:nth-child(2) { top: 10px; }
        .all-menu-btn span:nth-child(3) { top: 20px; }

        /* ★ [활성화 상태] X자로 변신하는 애니메이션 */
        .all-menu-btn.active span:nth-child(1) {
            top: 10px;
            transform: rotate(135deg);
        }

        .all-menu-btn.active span:nth-child(2) {
            opacity: 0;
            left: -60px;
        }

        .all-menu-btn.active span:nth-child(3) {
            top: 10px;
            transform: rotate(-135deg);
        }

    .full-menu-wrap { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: var(--bg-fullmenu); z-index: 9999; opacity: 0; visibility: hidden; transition: 0.4s ease-in-out; display: flex; flex-direction: column; backdrop-filter: blur(15px); }
    .full-menu-wrap.active { opacity: 1; visibility: visible; }

    .full-menu-top { position: absolute; top: 0; left: 0; width: 100%; height: 100px; display: flex; justify-content: space-between; align-items: center; padding: 0 40px; /*border-bottom: 1px solid var(--border-color);*/ z-index: 10; }
    .full-util { display: flex; align-items: center; gap: 15px; }
    .full-util-btn { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--border-color); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; color: var(--text-primary); transition: 0.3s; }
    .full-util-btn:hover { background: var(--text-primary); color: var(--bg-body); border-color: transparent; }
    
    .full-menu-close { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--border-color); display: flex; align-items: center; justify-content: center; font-size: 1.5rem; color: var(--text-primary); cursor: pointer; transition: 0.4s; }
    .full-menu-close:hover { color: var(--text-hover); transform: rotate(180deg); }

    .full-menu-inner { flex: 1; display: flex; align-items: center; justify-content: center; width: 100%; padding: 100px 5% 50px; overflow-y: auto; }
    
    .full-gnb { display: grid; grid-template-columns: repeat(4, 1fr); gap: 60px; width: 100%; max-width: 100%; text-align: left; }
    	.LogOut_Btn{color:#e70118 !important}
    /* [중요] PC/Tablet 이상일 때만 애니메이션 적용 (모바일 오류 수정 핵심) */



    @media (min-width: 769px) {
        .full-gnb > li { position: relative; opacity: 0; transform: translateY(30px); transition: 0.5s ease-out; }
        .full-menu-wrap.active .full-gnb > li:nth-child(1) { transition-delay: 0.1s; opacity: 1; transform: translateY(0); }
        .full-menu-wrap.active .full-gnb > li:nth-child(2) { transition-delay: 0.2s; opacity: 1; transform: translateY(0); }
        .full-menu-wrap.active .full-gnb > li:nth-child(3) { transition-delay: 0.3s; opacity: 1; transform: translateY(0); }
        .full-menu-wrap.active .full-gnb > li:nth-child(4) { transition-delay: 0.4s; opacity: 1; transform: translateY(0); }
		.full-menu-wrap.active .full-gnb > li:nth-child(5) { transition-delay: 0.1s; opacity: 1; transform: translateY(0); }
        .full-menu-wrap.active .full-gnb > li:nth-child(6) { transition-delay: 0.2s; opacity: 1; transform: translateY(0); }
        .full-menu-wrap.active .full-gnb > li:nth-child(7) { transition-delay: 0.3s; opacity: 1; transform: translateY(0); }
        .full-menu-wrap.active .full-gnb > li:nth-child(8) { transition-delay: 0.4s; opacity: 1; transform: translateY(0); }
		.full-menu-wrap.active .full-gnb > li:nth-child(9) { transition-delay: 0.4s; opacity: 1; transform: translateY(0); }
		.full-menu-wrap.active .full-gnb > li:nth-child(10) { transition-delay: 0.4s; opacity: 1; transform: translateY(0); }
    }

    .full-gnb > li > a { font-size: 2.2rem; font-weight: 800; color: var(--text-primary); 
	display: block; margin-bottom: 30px; position: relative; }
    .full-gnb > li > a::after { content: ''; display: inline-block; width: 6px; height: 6px; background: var(--text-hover); border-radius: 50%; margin-left: 5px; margin-bottom: 5px; opacity: 0; transition: 0.3s; }
    .full-gnb > li:hover > a::after { opacity: 1; }
    .full-gnb > li:hover > a { color: var(--text-primary); }

    .full-depth2 { display: flex; flex-direction: column; gap: 0; border-left: 1px solid var(--border-color); padding-left: 20px; }
    .full-depth2 li a { font-size: 1.05rem; color: var(--text-secondary); font-weight: 500; transition: 0.3s; padding: 10px 0; display: block; position: relative; opacity: 0.9; }
    .full-depth2 li a::before { content: '\f178'; font-family: 'Font Awesome 6 Free'; font-weight: 900; 
	position: absolute; left: -15px; top: 50%; transform: translateY(-50%); font-size: 0.8rem;
	color: var(--text-hover); opacity: 0; transition: 0.3s; display:none !important}
    .full-depth2 li a:hover { color: var(--text-primary); opacity: 1; padding-left: 15px; font-weight: 700; }
    .full-depth2 li a:hover::before { opacity: 1; left: 0; }

    /* 모바일 반응형에서 아이콘 등 불필요 요소 제거 */
    .full-depth2 .wide-icon, .full-depth2 .wide-text p, .full-depth2 .wide-footer { display: none !important; }
    .full-depth2 .wide-text strong { font-weight: inherit; font-size: inherit; color: inherit; display: inline; }

    /* --- 모바일 반응형 (768px 이하) --- */
    .mobile-back-btn { display: none; padding: 20px; font-weight: 700; color: var(--point-color); border-bottom: 1px solid var(--border-color); cursor: pointer; background: rgba(128,128,128,0.05); font-family: 'Montserrat', sans-serif; }
    .mobile-back-btn i { margin-right: 10px; }

    @media (max-width: 768px) {
	 .is-auto-generated { display: none !important; } /* 가짜 서브메뉴 숨김 */
        header { padding: 0 20px; }
        .header-center, .gnb-bg { display: none !important; }
        .header-left {
  flex: 0 0 auto;
  z-index: 1002;
  width: 200px;
}


 /* 모바일에서 돋보기와 햄버거 간격 조정 */
        .header-right { gap: 20px; } 
        .search-toggle-btn { font-size: 1.4rem; padding: 0; }
        
        /* --- 모바일 전용: 검색 Type 1 (헤더 덮기) --- */
        #wrap.search-type-1 .inline-search-form { 
            position: absolute; top: 0; left: 0; width: 100% !important; height: 100%; margin: 0; padding: 0 20px; 
            background: var(--bg-header-solid); border-radius: 0; border: none; border-bottom: 1px solid var(--border-color); 
            z-index: 1050; opacity: 0; visibility: hidden; transform: translateY(-10px); box-shadow:none !important;
            transition: all 0.3s ease; 
        }
        #wrap.search-type-1.is-search-open .inline-search-form { opacity: 1; visibility: visible; transform: translateY(0); }
        
        #wrap.type-b.search-type-1.is-search-open .inline-search-form,
        #wrap.type-c.scrolled.search-type-1.is-search-open .inline-search-form { background: var(--bg-header-active); backdrop-filter: blur(20px); }
        
        #wrap.search-type-1 .inline-search-form input[type="text"] { font-size: 1.1rem; padding: 5px 10px;color:#3a3a3a !important }
        #wrap.search-type-1 .inline-search-form .search-submit-btn, #wrap.search-type-1 .inline-search-form .search-close-btn { font-size: 1.3rem; padding: 5px 10px; }

#wrap.type-b.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form input, #wrap.type-c.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form input, #wrap.type-b.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form button, #wrap.type-c.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form button {
  color: #3a3a3a !important;
  text-shadow: none !important;
}

#wrap.type-b.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form input, #wrap.type-c.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form input, #wrap.type-b.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form button, #wrap.type-c.search-type-1 header:not(.gnb-open):not(.scrolled) .inline-search-form button {
  color: #3a3a3a !important;
  text-shadow: none !important;
}

        /* --- 모바일 전용: 검색 Type 2 (모달 크기 조정) --- */
        #wrap.search-type-2 .inline-search-form input[type="text"] { font-size: 1.8rem; padding: 5px 40px 5px 10px; }
        #wrap.search-type-2 .inline-search-form .search-submit-btn { font-size: 1.8rem; top: 0; bottom: 15px; }
        #wrap.search-type-2 .inline-search-form .search-close-btn { top: -60px; font-size: 2.5rem; right: 0; }

        .full-menu-top { height: 70px; padding: 0 20px; }
        .full-menu-close { width: 36px; height: 36px; font-size: 1.2rem; }
        .full-util-btn { width: 36px; height: 36px; font-size: 1rem; }
        .full-menu-inner { padding: 80px 0 0; display: block; overflow-x: hidden; }
        
        .full-gnb { grid-template-columns: 1fr; gap: 0; padding: 0 20px; display: block; width: 100%; }
        /* [중요] 모바일에서는 transform 제거 */
        .full-gnb > li { margin-bottom: 0; padding: 0; border-bottom: 1px solid var(--border-color); transform: none !important; opacity: 1 !important; transition: none !important; }
        .full-gnb > li > a { font-size: 1rem; margin-bottom: 0; padding: 20px 0; display: flex; 
		justify-content: space-between; align-items: center; color: var(--text-primary) !important; }
        .full-gnb > li > a.has-sub::after { content: '\f105'; font-family: 'Font Awesome 6 Free'; font-weight: 900; width: auto; height: auto; background: transparent; border-radius: 0; margin: 0; font-size: 1.2rem; color: var(--text-secondary); opacity: 0.7; }
		
        /* 모바일 서브메뉴 (Slide-in) */
        .full-depth2 { position: fixed; top: 70px; left: 0; width: 100%; height: calc(100% - 70px); background: var(--bg-fullmenu); padding: 0; margin: 0; border: none; transform: translateX(100%); transition: transform 0.3s ease; z-index: 99999; overflow-y: auto; visibility: hidden; }
        .full-depth2.active { transform: translateX(0); visibility: visible; }

        .full-depth2 li a { font-size: 1.1rem; padding: 15px 20px; border-bottom: 1px solid rgba(128,128,128,0.1); opacity: 1; font-weight: 600; }
        .full-depth2 li a::before { display: none; }
        .mobile-back-btn { display: block; }
    }
    
    /* 테마 컨트롤러 UI (개발용) */
    .theme-controller { display:none !important;position: fixed; bottom: 30px; right: 30px; z-index: 9999; background: rgba(30, 30, 30, 0.95); padding: 20px; border-radius: 15px; width: 180px; }
    .theme-controller h4 { color: #fff; margin-bottom: 8px; font-size: 0.8rem; text-align: left; }
    .btn-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
    .theme-btn { padding: 8px 10px; border-radius: 6px; font-size: 0.8rem; background: #555; color: #fff; text-align: center; font-weight: bold; }
    .theme-btn.active { background: var(--point-color); color: #000; }
    .btn-full { grid-column: span 2; }


	/*서브메뉴*/

/*서브 이미지*/

  :root {

        --accent-color: #c5a059;
    }

    /* --- Sub Visual Section --- */
    .Sub_Visual_Section {
        position: relative;
        width: 100%;
        height: 450px;
        background-color: #111;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
		
    }

    /* 배경 이미지 블러 레이어 (자동 변경됨) */
    .Visual_Bg {
        position: absolute;
        top: 0; left: 0;
        width: 100%; height: 100%;
       
        background-size: cover;
        background-position: center;
        filter: blur(1px); /* 흐림 정도 (사용자 설정) */
        opacity: 0.6;
        transform: scale(1.1);
        z-index: 1;
        transition: background-image 0.5s ease; /* 이미지 바뀔 때 부드럽게 */
    }

    .Visual_Content {
        position: relative;
        z-index: 2;
        text-align: center;
        color: #fff;
        padding: 0 20px;
    }

    .Visual_Content .Sub_T {
        font-size: 15px;
        font-weight: 400;
        letter-spacing: 6px;
        text-transform: uppercase;
        color: var(--accent-color);
        margin-bottom: 10px;
        display: block;
        animation: fadeInDown 0.8s ease forwards;
    }

    .Visual_Content .Main_T {
        font-size: 56px;
        font-weight: 700;
        letter-spacing: -1px;
        line-height: 1.2;
        margin: 0;
        animation: fadeInUp 1s ease forwards;
    }

    .Visual_Content .Deco_Bar {
        width: 40px;
        height: 2px;
        background: rgba(255, 255, 255, 0.3);
        margin: 25px auto 0;
        animation: scaleIn 1s ease forwards;
    }

    @keyframes fadeInDown { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } }
    @keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
    @keyframes scaleIn { from { opacity: 0; transform: scaleX(0); } to { opacity: 1; transform: scaleX(1); } }

    @media (max-width: 800px) {
        .Sub_Visual_Section { height: 320px; }
        .Visual_Content .Main_T { font-size: 38px; }
    }

  /* 1. 기본 설정 (라이트 테마 기반) */
    .Location_Wrap {
        --theme-bg: #fdfdfd;
        --theme-text: #333;
        --theme-border: #f3f3f3;
        --theme-item-border: #f0f0f0;
        --theme-dropdown-bg: #ffffff;
        --theme-dropdown-border: #e1e1e1;
        --theme-hover-bg: #f9f9f9;
        --blur-val: 0px;
        --nav-height: 54px; position:relative;
    }

    /* 2. 다크 테마 */
    .Location_Wrap.theme-dark {
        --theme-bg: #1a1a1a;
        --theme-text: #eee;
        --theme-border: #333;
        --theme-item-border: #2a2a2a;
        --theme-dropdown-bg: #222;
        --theme-dropdown-border: #444;
        --theme-hover-bg: #2a2a2a;
    }

    /* 3. 글래스모피즘 라이트 */
    .Location_Wrap.theme-glass-light {
        --theme-bg: rgba(255, 255, 255, 0.6);
        --theme-text: #111;
        --theme-border: rgba(255, 255, 255, 0.4);
        --theme-item-border: rgba(255, 255, 255, 0.2);
        --theme-dropdown-bg: rgba(255, 255, 255, 0.85);
        --theme-dropdown-border: rgba(255, 255, 255, 0.4);
        --theme-hover-bg: rgba(255, 255, 255, 0.3);
        --blur-val: 15px;top: -56px;
    }

    /* 4. 글래스모피즘 다크 */
    .Location_Wrap.theme-glass-dark {
        --theme-bg: rgba(0, 0, 0, 0.5);
        --theme-text: #fff;
        --theme-border: rgba(255, 255, 255, 0.1);
        --theme-item-border: rgba(255, 255, 255, 0.05);
        --theme-dropdown-bg: rgba(20, 20, 20, 0.9);
        --theme-dropdown-border: rgba(255, 255, 255, 0.1);
        --theme-hover-bg: rgba(255, 255, 255, 0.1);
        --blur-val: 20px;top: -56px;
    }

    .Location_Wrap { 
        width:100%; 
        background: var(--theme-bg); 
        backdrop-filter: blur(var(--blur-val));
        -webkit-backdrop-filter: blur(var(--blur-val));
        border-bottom: 1px solid var(--theme-border); 
        z-index: 100;
        transition: all 0.4s ease;
    }

    .Location_Menu { width:1200px; margin:0 auto; }
    .Location_Menu ul { list-style:none; display:flex; width:100%; height: var(--nav-height); }
    
    /* 메뉴 리스트 아이템 기본 설정 */
    .Location_Menu ul li { 
        border-left: 1px solid var(--theme-item-border); 
        height: 100%; 
        position: relative; 
    }
    .Location_Menu ul li:last-child { border-right: 1px solid var(--theme-item-border); }

    /* ★ Home 버튼 정사각형 중앙 정렬 ★ */
    .Location_Menu ul li.Home_Box { 
        flex: none; 
        width: var(--nav-height); 
    }
    .Location_Menu ul li.Home_Box a { 
        padding: 0; 
        justify-content: center; 
    }

    /* ★ 서브메뉴 가로 사이즈 조정 및 텍스트(좌) / 애로우(우) 배치 ★ */
    .Location_Menu ul li.Sub_Gnb_Menu { flex: none; width: 280px; } /* 대메뉴 폭 */
    .Location_Menu ul li.Sub_Gnb_Menu + .Sub_Gnb_Menu { width: 320px; } /* 소메뉴 폭 */

    .Location_Menu ul li a { 
        display: flex;
        align-items: center;
        height: 100%;
        padding: 0 20px;
        text-decoration: none; 
        color: var(--theme-text); 
        font-size: 14px; 
        transition: background 0.3s;
        white-space: nowrap;
        width: 100%;
    }

    /* 서브메뉴 내부 요소 정렬 최적화 */
    .Location_Menu ul li.Sub_Gnb_Menu a { 
        justify-content: flex-start; /* 기본 왼쪽 정렬 후 span에 margin-left: auto 부여 */
    }

    .Location_Menu ul li a:hover { background: var(--theme-hover-bg); }
    .Location_Menu ul li a b { font-weight: 500; }

    /* ★ 화살표(ar)를 항상 오른쪽 끝으로 밀어내기 ★ */
    .Location_Menu ul li span.ar { 
        margin-left: auto; 
        font-size: 10px; 
        opacity: 0.6; 
        display: inline-flex;
        align-items: center;color:var(--theme-text); 
    }

    #Gnb_Wrap { 
        position: absolute; top: 100%; left: -1px; width: calc(100% + 2px); 
        background: var(--theme-dropdown-bg); 
        backdrop-filter: blur(var(--blur-val));
        border: 1px solid var(--theme-dropdown-border); 
        display: none; z-index: 1000; 
        box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    }
    
    #Gnb_Wrap ul { display: block; height: auto; }
    #Gnb_Wrap ul li { border: none; width: 100%; height: auto; }
    #Gnb_Wrap ul li a { padding: 12px 20px; font-size: 13px; color: var(--theme-text); opacity: 0.8; justify-content: flex-start; }
    #Gnb_Wrap ul li a:hover { background: var(--theme-hover-bg); opacity: 1; }
    
    .gnb_on h4 { color: #c5a059 !important; font-weight: 600; }

    @media (max-width: 800px) { 
        .Location_Menu { width: 100%; }
        /* 모바일에서는 메뉴 폭을 다시 유동적으로 (Home 제외 꽉 차게) */
        .Location_Menu ul li.Sub_Gnb_Menu { flex: 1; width: auto !important; }
        .Location_Menu ul li.Sub_Gnb_Menu:nth-child(2) { display: none; }
        .Location_Menu.no-sub ul li.Sub_Gnb_Menu:nth-child(2) { display: flex; }
        .Location_Menu.no-sub ul li.Sub_Gnb_Menu:nth-child(3) { display: none; }
        .Location_Menu ul li a b { font-size: 13px; }
    }


	/*서브 버티컬*/
		/* 메뉴 컨테이너 */
.menu-container {
    width: 100%;
    max-width: 320px; /* md:max-w-xs */
    background-color: #ffffff; /* bg-white */
    border-radius: 0.375rem; /* rounded-md */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* shadow-lg */
    overflow: hidden; /* 하위 요소의 radius 적용을 위해 */
}

/* 메뉴 타이틀 (어두운 배경 + 녹색 라인) */
.menu-title {
    font-size: 1.125rem; /* text-lg */
    font-weight: 600; /* font-semibold */
    color: #f9fafb; /* text-gray-50 */
    background-color: #374151; /* 차분한 차콜 */
    padding: 1rem; /* p-4 */
    border-bottom: 3px solid #297e9b; /* 활성 메뉴와 동일한 녹색 라인 */
}

/* 네비게이션 (메뉴 아이템 래퍼) */
.menu-nav {
    padding: 1rem; /* p-4 */
}

/* --- 아코디언 버튼 (대메뉴) --- */
.accordion-button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0.75rem 1rem; /* p-3 */
    font-size: 1rem; /* text-base */
    font-weight: 500; /* font-medium */
    color: #374151; /* text-gray-700 */
    text-align: left;
    background-color: transparent;
    border: none;
    border-radius: 0.375rem; /* rounded-md */
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
    position: relative; /* ::before 가상 요소를 위한 기준점 */
    
    /* [수정됨] a태그와 폰트/굵기가 달라 보이는 문제 해결 */
    font-family: inherit;
    line-height: inherit; /* 또는 1.5 등 주변 a태그와 동일하게 설정 */
}

.accordion-button:hover {
    background-color: #f5f5f5; /* hover:bg-green-50 */
    color: #297e9b; /* hover:text-green-700 */
}

/* 포커스 스타일 (테두리 제거) */
.accordion-button:focus,
.menu-item-link:focus {
    outline: none;
}

/* --- 활성 상태 스타일 (녹색 라인) --- */
.accordion-button.active {
    background-color: transparent; /* 활성 상태 배경색 없음 */
}

.accordion-button.active span {
    color: #297e9b; /* text-green-800 */
    font-weight: 600;
}

.accordion-button.active .icon-plus {
    color: #297e9b; /* text-green-800 */
}

/* 활성 상태일 때 왼쪽에 녹색 라인 추가 */
.accordion-button.active::before {
    content: '';
    position: absolute;
    left: -1rem; /* menu-nav의 padding-left 만큼 왼쪽으로 이동 */
    top: 0;
    height: 100%;
    width: 4px; /* 라인 두께 */
    background-color: #297e9b; /* border-green-800 */
    border-radius: 0 4px 4px 0; /* 오른쪽 모서리만 둥글게 */
}

/* 버튼 내부 텍스트 */
.accordion-button span {
    flex-grow: 1;
}

/* 아이콘 (플러스/마이너스) */
.icon-plus {
    width: 1.25rem; /* w-5 */
    height: 1.25rem; /* h-5 */
    stroke-width: 2.5;
    transition: transform 0.3s ease;
}

/* active 상태일 때 아이콘 회전 */
.accordion-button.active .icon-plus {
    transform: rotate(45deg);
}

/* --- 아코디언 패널 (서브메뉴 래퍼) --- */
.accordion-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
    /* 서브메뉴 좌측 회색 라인을 위한 스타일 */
    border-left: 2px solid #e5e7eb; /* border-gray-200 */
    margin-left: 1rem; /* ml-4 (대메뉴 텍스트와 정렬) */
    margin-top: 0;     /* 초기 마진 제거 (js로 제어 권장) */
    margin-bottom: 0;  /* 초기 마진 제거 */
    padding-left: 1rem; /* pl-4 */
}

/* 서브메뉴 리스트 */
.menu-item-list {
    list-style: none;
    padding: 0.25rem 0; /* py-1 */
    margin: 0;
}

/* 서브메뉴 아이템 (li) */
.menu-item {
    margin: 0;
}

/* 서브메뉴 링크 (a) */
.menu-item-link {
    display: block;
    padding: 0.5rem 0.75rem; /* py-2 px-3 */
    font-size: 0.95rem;
    color: #4b5563; /* text-gray-600 */
    text-decoration: none;
    border-radius: 0.375rem; /* rounded-md */
    transition: background-color 0.2s ease, color 0.2s ease;
}

.menu-item-link:hover {
    background-color: #f3f4f6; /* hover:bg-gray-100 */
    color: #1f2937; /* hover:text-gray-800 */
}

/* --- 일반 링크 (하위 메뉴가 없는 대메뉴) --- */
.menu-link {
    display: block;
    width: 100%;
    padding: 0.75rem 1rem; /* p-3 */
    font-size: 1rem; /* text-base */
    font-weight: 500; /* font-medium */
    color: #374151; /* text-gray-700 */
    text-decoration: none;
    text-align: left;
    border-radius: 0.375rem; /* rounded-md */
    transition: background-color 0.2s ease, color 0.2s ease;
    box-sizing: border-box; /* 패딩 포함하여 width 100% */
}

.menu-link:hover {
    background-color: #f5f5f5; /* hover:bg-green-50 */
    color: #297e9b; /* hover:text-green-700 */
}

/* [수정됨] 모바일/태블릿 화면에서 숨김 처리 */
@media all and (min-width: 1px) and (max-width: 800px) {
    .menu-container {
        display: none;
    }