/* 기본 스타일 */
body { font-family: "Gowun Dodum", sans-serif; margin: 0; background-color: #111111; color: #444; }
/* body 전체 스크롤바 (기존 요청 스타일) */
body::-webkit-scrollbar { width: 10px; }
body::-webkit-scrollbar-track { background: #fff5f0; }
body::-webkit-scrollbar-thumb { background: #fdac7a; border-radius: 5px; }
body::-webkit-scrollbar-thumb:hover { background: #fd7e14; }
/* Firefox body 전체 스크롤바 (선택적) */
body {
    scrollbar-width: auto; /* 또는 thin */
    scrollbar-color: #fdac7a #fff5f0;
}


.touristDestination_wrapper {
    max-width: 1200px; margin: 0 auto; padding: 20px; margin-top: 70px;
    padding-bottom: 60px;
}
/* ... (기존 헤더, 카테고리 네비게이션, 맵 컨테이너 등 스타일 유지) ... */
#touristDestination-headerSection {
    margin-top: 0px;
    background-color: white;
    color: #fd7e14;
    padding:  20px;
    text-align: center;
    margin-bottom: 5px;
    border-radius: 8px;
    position: relative;
    z-index: 10;

}
#touristDestination-headerSection h1 {
    font-family: "Gowun Dodum", sans-serif;
    margin: 0;
    font-size: 35px;
    font-weight: 700;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.2);
}
#touristDestination-headerSection p {
    margin-top: 4px;
    font-size: 15px;
    opacity: 0.9;
    margin-bottom: 4px;

}
/* --- 섹션 1: 카테고리 네비게이션 --- */
.touristDestination_category_nav { margin-top: 60px; margin-bottom: 20px; padding: 15px; background-color: #fff; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.touristDestination_category_nav_btn {
    padding: 8px 15px;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 14px;
    text-decoration: none;
    color: #495057;
    display: inline-block;
    font-weight: 600;;
}
.touristDestination_category_nav_btn:hover {
    background-color: #fff0e6;
    border-color: #fdac7a;
    box-shadow: 0 2px 5px rgba(253, 126, 20, 0.1);
}

/* --- 섹션 2: 마이맵 --- */
.touristDestination_map_container { position: relative; width: 100%; height: 500px; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 10px rgba(0,0,0,0.1); margin-bottom: 30px; }
.touristDestination_map_iframe { width: 100%; height: 100%; border: none; }

/* --- 섹션 3: 카테고리별 상세 정보 (아코디언) --- */
.touristDestination_categories { margin-top: 20px; }
.touristDestination_category_section { margin-bottom: 15px; border-radius: 8px; overflow: hidden; background-color: #fff; box-shadow: 0 2px 5px rgba(0,0,0,0.05); }
.touristDestination_category_toggle { display: block; width: 100%; padding: 15px 20px; background-color: #fd7e14; color: white; border: none; font-size: 18px; font-weight: 600; text-align: left; cursor: pointer; position: relative; transition: background-color 0.3s ease; font-family: "Gowun Dodum", sans-serif; }
.touristDestination_category_toggle:hover { background-color: #e8700f; }
.touristDestination_category_toggle .arrow { position: absolute; right: 20px; top: 50%; transform: translateY(-50%) rotate(0deg); transition: transform 0.4s ease; font-size: 16px; display: inline-block; animation: arrow-down-bounce 0.5s forwards; opacity: 0; }
@keyframes arrow-down-bounce { 0% { transform: translateY(-80%) rotate(0deg); opacity: 0; } 60% { transform: translateY(-45%) rotate(0deg); opacity: 1; } 100% { transform: translateY(-50%) rotate(0deg); opacity: 1; } }
.touristDestination_category_toggle.active .arrow { transform: translateY(-50%) rotate(180deg); animation: none; opacity: 1; }

/* 펼쳐지는 내용 영역 */
.touristDestination_category_content { max-height: 0; overflow: hidden; transition: max-height 0.5s ease-out, padding 0.3s ease; background-color: #fff; padding: 0 20px; display: flex; }
.touristDestination_category_content.active { max-height: 750px; padding: 20px; }

/* --- 카테고리 내부 좌우 분할 --- */
.touristDestination_detail_panel { flex: 7; padding-right: 20px; border-right: 1px solid #e9ecef; display: flex; flex-direction: column; height: calc(750px - 40px); overflow-y: auto; overflow-x: hidden;}
.touristDestination_item_list { flex: 2; padding-left: 20px; background-color: #f8f9fa; height: calc(750px - 40px); overflow-y: auto; overflow-x: hidden;}

/* --- 오른쪽 리스트 아이템 --- */
.touristDestination_item { display: flex; align-items: center; padding: 5px; margin-bottom: 5px; background-color: white; border-radius: 5px; cursor: pointer; transition: all 0.3s ease; border-left: 5px solid transparent; font-size: 14px; }
.touristDestination_item_thumb { width: 80px; height: 80px; object-fit: cover; border-radius: 4px; margin-right: 10px; flex-shrink: 0; }
.touristDestination_item_title { font-weight: bold; flex-grow: 1; }
.touristDestination_item:hover { background-color: #e9ecef; transform: translateX(3px); }
.touristDestination_item.active { background-color: #fff; border-left: 10px solid #fd7e14; font-weight: 600; color: #fd7e14; }

/* --- 왼쪽 상세 정보 패널 내부 --- */
.touristDestination_detail_content { display: flex; flex-direction: column; height: 100%; }
.touristDestination_detail_placeholder { display: flex; justify-content: center; align-items: center; height: 100%; color: #adb5bd; text-align: center; font-size: 16px; flex-grow: 1; }
.touristDestination_detail_top_section { display: flex; margin-bottom: 1px; flex-shrink: 0; }
.touristDestination_detail_main_image { width: 40%; max-width: 220px; height: auto; object-fit: cover; border-radius: 8px; margin-right: 20px; flex-shrink: 0; }
.touristDestination_detail_text_content { flex: 1; display: flex; flex-direction: column; }
.touristDestination_detail_title { font-size: 22px; font-weight: 700; margin: 0 0 15px 0; color: #fd7e14; }
.touristDestination_detail_info { overflow-y: auto; line-height: 1.7; font-size: 14px; margin-bottom: 15px; flex-grow: 1; min-height: 100px;     overflow-x: hidden;
    /* 텍스트 영역 최소 높이 */}
.touristDestination_detail_info p { margin: 0 0 10px 0; }
.touristDestination_detail_info strong { display: inline-block; min-width: 70px; font-weight: 600; color: #495057; }
.touristDestination_detail_info > p:first-of-type {
    margin: 0 0 15px 0; /* 설명과 다음 항목 간격 조정 */
}
.touristDestination_detail_info .info_item {
    display: flex;          /* Flexbox 사용 */
    margin-bottom: 8px;     /* 항목 간 간격 */
    line-height: 1.6;       /* 줄 높이 */
}
.touristDestination_detail_info .info_label {
    flex: 0 0 80px;        /* 너비 고정 (필요에 따라 조절), 늘어나거나 줄어들지 않음 */
    font-weight: 600;
    color: #495057;
    margin-right: 8px;     /* 레이블과 내용 사이 간격 */
    display: inline-block; /* 혹시 모를 대비 */
    vertical-align: top;   /* 상단 정렬 */
}
.touristDestination_detail_info .info_value {
    flex: 1;               /* 남은 공간 모두 차지 */
    min-width: 0;          /* 내용이 넘칠 때 줄바꿈을 위해 필요 */
    vertical-align: top;   /* 상단 정렬 */
}

/* --- 유튜브 영역 (레이아웃 수정) --- */
.touristDestination_youtube_section {
    display: flex; /* 플레이어와 리스트 가로 배치 */
    gap: 15px; /* 플레이어와 리스트 사이 간격 */
    margin-top: 10px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
    flex-shrink: 0;
    min-height: 320px; /* 높이 조절 */
    max-height: 350px; /* 높이 조절 */
}
/* 유튜브 플레이어 영역 (왼쪽) */
.touristDestination_youtube_player_wrapper {
    flex: 1; /* 남는 공간 차지 */
    position: relative;
    min-width: 0; /* 축소 가능 */
}
.touristDestination_youtube_embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    overflow: hidden;
}
.touristDestination_youtube_embed iframe { width: 100%; height: 100%; border: 0; }

/* 유튜브 썸네일 리스트 영역 (오른쪽) */
.touristDestination_youtube_thumbnail_list_wrapper {
    width: 200px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    background-color: #f8f9fa;
    padding: 5px;
    border-radius: 5px;
    border: 3px solid #fd7e14;
    overflow: hidden; /* 내부 리스트가 넘칠 경우 숨김 */
}
.touristDestination_youtube_links_title {
    font-weight: 200;
    margin-bottom: 8px;
    font-size: 13px;
    text-align: center;
    flex-shrink: 0;
    padding: 5px 0; /* 상하 패딩 조절 */
    padding-bottom: 5px;
    border-bottom: 1px solid #e0e0e0;
    background-color: #fd7e14;
    color: white !important;
}
.touristDestination_youtube_thumbnail_list {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    gap: 5px; /* 아이템 간 간격 */
    overflow-y: auto; /* 세로 스크롤 활성화 */
    overflow-x: hidden;
    /* height: 0; */ /* flex-grow와 함께 높이 자동 계산, 문제 시 100% 테스트 */
    /* scrollbar-width 와 scrollbar-color 는 아래 공통 스타일에서 처리 */
}
/* 개별 유튜브 썸네일 (세로 목록용) */
.touristDestination_youtube_thumbnail {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    cursor: pointer;
    border-radius: 4px;
    overflow: hidden;
    transition: background-color 0.2s ease;
    padding: 8px 5px;
    background-color: white;
    border: 1px solid #d0d0d0;
    flex-shrink: 0;
}
.info_value_href{
    color:#fd7e14;
    font-weight: bold;
    font-size: 18px;
    cursor: pointer;
}

.touristDestination_youtube_thumbnail:hover { background-color: #eee; }
.touristDestination_youtube_thumbnail img {
    width: calc(100% - 10px);
    aspect-ratio: 16 / 9;
    object-fit: cover;
    margin-bottom: 5px;
    flex-shrink: 0;
    border-radius: 3px;
}
.touristDestination_youtube_thumbnail span {
    width: calc(100% - 10px);
    font-size: 12px;
    line-height: 1.3;
    color: #555;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* 최대 2줄 */
    -webkit-box-orient: vertical;
    text-align: center;
    padding: 0;
}

/* --- 모든 내부 스크롤바 공통 스타일 --- */
/* WebKit 기반 브라우저 */
.touristDestination_detail_panel::-webkit-scrollbar,
.touristDestination_item_list::-webkit-scrollbar,
.touristDestination_detail_info::-webkit-scrollbar,
.touristDestination_youtube_thumbnail_list::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.touristDestination_detail_panel::-webkit-scrollbar-track,
.touristDestination_item_list::-webkit-scrollbar-track,
.touristDestination_detail_info::-webkit-scrollbar-track,
.touristDestination_youtube_thumbnail_list::-webkit-scrollbar-track {
    background: #fff5f0; /* 연한 주황 배경 */
    border-radius: 4px;
}

.touristDestination_detail_panel::-webkit-scrollbar-thumb,
.touristDestination_item_list::-webkit-scrollbar-thumb,
.touristDestination_detail_info::-webkit-scrollbar-thumb,
.touristDestination_youtube_thumbnail_list::-webkit-scrollbar-thumb {
    background: #fdac7a; /* 주황색 스크롤 막대 */
    border-radius: 4px;
}

.touristDestination_detail_panel::-webkit-scrollbar-thumb:hover,
.touristDestination_item_list::-webkit-scrollbar-thumb:hover,
.touristDestination_detail_info::-webkit-scrollbar-thumb:hover,
.touristDestination_youtube_thumbnail_list::-webkit-scrollbar-thumb:hover {
    background: #fd7e14; /* 진한 주황색 스크롤 막대 (호버) */
}

/* Firefox 스크롤바 스타일 */
.touristDestination_detail_panel,
.touristDestination_item_list,
.touristDestination_detail_info,
.touristDestination_youtube_thumbnail_list {
    scrollbar-width: thin;
    scrollbar-color: #fdac7a #fff5f0; /* thumb색상 track색상 */
}
/* --- 모든 내부 스크롤바 공통 스타일 끝 --- */


/* --- 스크롤바 숨기기 (제거 또는 주석 처리됨) --- */
/*
.touristDestination_detail_panel::-webkit-scrollbar,
.touristDestination_item_list::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

.touristDestination_detail_panel,
.touristDestination_item_list {
    scrollbar-width: none;
}
*/


/* --- 퀵 메뉴 스타일 --- */
.quick_menu {
    position: fixed;
    right: 20px;
    bottom: 20px;
    display: none;
    flex-direction: column;
    gap: 10px;
    z-index: 1000;
}

.quick_menu button {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: none;
    background-color: rgba(253, 126, 20, 0.9);
    color: white;
    font-size: 18px;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0,0,0,0.3);
    transition: background-color 0.3s ease, transform 0.2s ease;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
}

.quick_menu button:hover {
    background-color: rgba(232, 112, 15, 0.95);
    transform: scale(1.05);
}

/* 반응형 */
@media (max-width: 992px) {
    /* ... (기존 992px 미디어쿼리 스타일 유지) ... */
    .touristDestination_wrapper{
        margin-top: 0px;
    }
    .touristDestination_youtube_section { flex-direction: column; max-height: none; }
    .touristDestination_youtube_player_wrapper { height: 300px; /* 모바일 플레이어 높이 고정 */ position: relative; /* absolute iframe 기준 */ }
    .touristDestination_youtube_embed { position: static; padding-bottom: 0; height: 100%; } /* 모바일 플레이어 크기 조정 */

    .touristDestination_youtube_thumbnail_list_wrapper { width: 100%; margin-top: 15px; height: auto; border: none; padding: 0; background: none; }
    .touristDestination_youtube_links_title { text-align: left; padding-bottom: 0; border-bottom: none; }
    .touristDestination_youtube_thumbnail_list { flex-direction: row; overflow-x: auto; overflow-y: hidden; height: auto; flex-grow: 0; padding-bottom: 5px; }
    .touristDestination_youtube_thumbnail { width: 120px; flex-direction: column; align-items: flex-start; padding: 0; border: none; background: none; }
    .touristDestination_youtube_thumbnail img { width: 100%; height: 67px; margin-right: 0; margin-bottom: 5px; }
    .touristDestination_youtube_thumbnail span { padding: 0 3px; -webkit-line-clamp: 1; }
}
@media (max-width: 768px) {
    /* ... (기존 768px 미디어쿼리 스타일 유지, 내부 스크롤바 스타일은 위의 공통 스타일이 적용됨) ... */
    .touristDestination_wrapper{
        margin-top: 0px;
        padding: 10px;
    }
    #touristDestination-headerSection {
        margin-top: 0px;
        background-color: white;
        color: #fd7e14;
        padding:  10px;
        text-align: center;
        margin-bottom: 5px;
        border-radius: 8px;
        position: relative;
        z-index: 10;
    }
    #touristDestination-headerSection h1 {
        font-family: "Gowun Dodum", sans-serif;
        margin: 0;
        font-size: 24px;
        font-weight: 600;
        text-shadow: 1px 1px 3px rgba(0,0,0,0.2);
    }
    .touristDestination_map_container { height: 350px; }
    .touristDestination_category_content.active { height: auto; max-height: 80vh !important; padding: 8px!important; }
    .touristDestination_category_content { flex-direction: column; height: auto; }
    .touristDestination_detail_panel { border-right: none; border-bottom: 10px solid #fd7e14; padding-right: 0; padding-bottom: 10px; margin-bottom: 10px; height: auto; max-height: 70vh; }
    .touristDestination_item_list { padding-left: 0; height: 30vh; }
    .touristDestination_detail_top_section { flex-direction: column; }
    .touristDestination_detail_main_image { width: 100%; max-width: none; max-height: 160px !important; margin-right: 0; margin-bottom: 15px; }
    .touristDestination_detail_title { font-size: 20px; }
    .touristDestination_detail_info { font-size: 13px; min-height: auto; margin-bottom: 5px;}
    .touristDestination_item{
        display: flex;
        align-items: center;
        padding: 5px;
        margin-bottom: 2px;
        background-color: white;
        border-radius: 5px;
        cursor: pointer;
        transition: all 0.3s ease;
        border-left: 5px solid transparent;
        font-size: 12px;
    }
    .touristDestination_item_thumb{
        width: 60px;
        height: 60px;
        object-fit: cover;
        border-radius: 4px;
        margin-right: 8px;
        flex-shrink: 0;
    }
    .touristDestination_detail_title{
        font-size: 16px;
    }
    .touristDestination_detail_info > p:first-of-type{
        margin: 0 0 10px 0;
        font-size: 12px;
    }
    .touristDestination_detail_info .info_value{
        font-size: 12px;
    }
    .touristDestination_detail_info .info_item{
        display: flex;
        margin-bottom: 4px;
        line-height: 1.2;
        align-items: center;
        justify-content: center;
    }
    .touristDestination_youtube_links_title{
        text-align: center;
    }
    .touristDestination_youtube_section{
        gap: 5px;
        margin-top: 5px;
        padding-top: 5px;
        border-top: 1px solid #e9ecef;

    }
    .touristDestination_category_toggle{
        padding: 10px 10px;

    }

    .quick_menu {
        display: flex;
        right: 1px;
        bottom: 10px;
        gap: 8px;
    }
    .quick_menu button {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }
}
.touristDestination_category_nav{ /* 이 스타일은 이미 위쪽에 정의되어 있음, 중복 시 하나로 합치기 */
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    gap: 5px;
}