/* ==================================================================
       [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: #ea4335;     
        --point-color: #ea4335;
        --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: #ea4335;
        --point-color: #ea4335;
        --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:320px; padding:40px}
	.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: 1 0 auto; display: flex; justify-content: flex-end; z-index: 1002; }

    .logo {  }

    .gnb { display: flex; height: 100%; }
    .gnb > li { height: 100%; display: flex; align-items: center; position: relative; padding:0 20px}
    .gnb > li > a {transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1); /* 부드럽고 쫀득한 애니메이션 */ display: block; padding: 0 40px; 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 40px }
    .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; }
    
    /* 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; padding:0 20px} 
    #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: 250px; }
    #wrap.menu-full header.gnb-open .depth2 { opacity: 1; visibility: visible; }

    /* --- 햄버거 버튼 & 풀스크린 메뉴 --- */
   

		/* 기존 .hamburger-btn 스타일을 .all-menu-btn으로 변경 */
       /* ---------------------------------
           [햄버거 메뉴 버튼 스타일 추가]
           --------------------------------- */
        .all-menu-btn {
            width: 40px;
            height: 24px;
            position: fixed; /* 우측 상단 고정 */
            top: 40px;
            right: 40px;
            cursor: pointer;
            display: block;
            background: transparent;
            border: none;
            z-index: 100;
        }

        /* 햄버거 막대기 공통 스타일 */
        .all-menu-btn span {
            display: block;
            position: absolute;
            height: 3px;
            background: #fff;
            border-radius: 3px;
            transition: all 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);
        }

        /* 막대기 길이 및 정렬 (가운데 100%, 위 좌측정렬, 아래 우측정렬) */
          .all-menu-btn span:nth-child(1) { top: 0px; width: 60%; left: 0; right: auto; }
        .all-menu-btn span:nth-child(2) { top: 10px; width: 100%; left: 0; right: auto; }
        .all-menu-btn span:nth-child(3) { top: 20px; width: 60%; right: 0; left: auto; }

        /* 마우스 호버 시 막대기 길이가 모두 동일해지는 애니메이션 */
        .all-menu-btn:hover span {
            width: 100%;
        }

        /* [활성화 상태] X자로 변신하는 애니메이션 */
        .all-menu-btn.active span:nth-child(1) {
            top: 10px;
            transform: rotate(45deg);
            width: 100%; /* X자일때는 모두 100% 길이 */
            background: #D42A41; /* 클릭 시 포인트 컬러로 변경 */
        }

        .all-menu-btn.active span:nth-child(2) {
            opacity: 0;
            left: -30px; /* 좌측으로 빠지면서 사라짐 */
        }

        .all-menu-btn.active span:nth-child(3) {
            top: 10px;
            transform: rotate(-45deg);
            width: 100%; /* X자일때는 모두 100% 길이 */
            background: #D42A41; /* 클릭 시 포인트 컬러로 변경 */
        }

    .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}
		
@media all and (min-width:900px) and (max-width:1485px) {

.gnb > li > a {

  padding: 0 20px;

}

.gnb > li:hover > a, .gnb > li.active > a { ;padding:0 25px }



		 }



    /* [중요] 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; }

    /* --- 모바일 반응형 (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 10px; }
        .header-center, .gnb-bg { display: none !important; }
        .header-left {
  flex: 0 0 auto;
  z-index: 1002;
  width: 230px;padding:10px
}
        .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; }
		header#header {

  padding: 0 15px;
 
}



.all-menu-btn {
  width: 40px;
  height: 24px;
  position: fixed;
  top: 35px;
  right: 20px;
  cursor: pointer;
  display: block;
  background: transparent;
  border: none;
  z-index: 100;
}
    }
    
    /* 테마 컨트롤러 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; }


@media all and (min-width:900px) and (max-width:1450px) {


header#header {

  padding: 0 0px;

}

.header-left {
  flex: 0 0 auto;
  z-index: 1002;
  width: 250px;
  padding: 40px;
}

  .gnb > li > a {
    padding: 0 15px;
  }



.gnb > li:hover > a, .gnb > li.active > a { ;padding:0 25px }
		 }

}


	/*서브메뉴*/

/*서브 이미지*/

  :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(0px); /* 흐림 정도 (사용자 설정) */
        opacity: 0.85;
        transform: scale(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;
    }