/*------------------------------------------------------------------------------*/
/* GNB(상단메뉴) 새창 링크 아이콘 — sub.css 동등 (메인페이지는 sub.css 미로드 → 여기 중복 정의)
   1뎁스 gnb_link, 2뎁스 gnb_dep2_box(name 내부), 3뎁스 gnb_depth3_link */
.gnb_link.link_go::after,
.gnb_dep2_box.link_go .gnb_dep2_name::after,
.gnb_depth3_link.link_go::after { content:""; display:inline-block; width:14px; height:13px; background:url(../images/common/icon_link.png) no-repeat; vertical-align:middle; margin-left:6px; opacity:.9; }

/*------------------------------------------------------------------------------*/
/* 메인페이지 */
/*------------------------------------------------------------------------------*/
.top_banner{ background: #0180f5; overflow: hidden; }
.top_banner_inner{ display: flex; align-items: center; justify-content: space-between; position: relative; height: 120px; max-width: 1300px; margin: 0 auto; padding: 0 30px; overflow: hidden; }
.top_banner_swiper{ flex: 1; width: 0; overflow: hidden; height: 120px; }
.top_banner_swiper .swiper-wrapper{ height: 120px; align-items: center; }
.top_banner_swiper .swiper-slide{ height: 120px; display: flex; align-items: center; justify-content: center; }
.top_banner_item{ display: flex; align-items: center; justify-content: flex-start; height: 100%; }
.top_banner_item img{ width: 600px; height: 100px; object-fit: contain; flex-shrink: 0; }
.top_banner_right{ display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 8px; position: absolute; right: 30px; top: 50%; transform: translateY(-50%); z-index: 2; background: #0180f5; }
.top_banner_controls{ display: flex; align-items: center; gap: 6px; }
.top_banner_pager{ display: flex; align-items: center; font-size: 1.8rem; margin-right: 4px; line-height: 1; }
.top_banner_pager_cur{ font-weight: 700; color: #fff; }
.top_banner_pager_sep{ font-weight: 500; color: #fff; margin: 0 2px; }
.top_banner_pager_tot{ font-weight: 500; color: #b8c5fb; }
.top_banner_btn{ display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: transparent; border: 1px solid rgba(255, 255, 255, 0.5); cursor: pointer; padding: 0; flex-shrink: 0; transition: background 0.2s; }
.top_banner_btn:hover,
.top_banner_btn:focus-visible{ background: rgba(255, 255, 255, 0.15); outline: none; }
.top_banner_btn:focus-visible{ outline: 2px dotted #fff; outline-offset: 2px; }
.top_banner_btn .ico_play{ display: none; }
.top_banner_btn.is_stopped .ico_stop{ display: none; }
.top_banner_btn.is_stopped .ico_play{ display: inline; }
.top_banner_dismiss{ display: flex; align-items: center; gap: 6px; flex-shrink: 0; margin-top: 20px; }
.top_banner_dismiss_label{ font-family: 'Pretendard-Light', sans-serif; font-size: 1.4rem; font-weight: 200; color: #fff; cursor: pointer; background: none; letter-spacing: -0.3px; }
.top_banner_dismiss_chk{ appearance: none; -webkit-appearance: none; width: 18px; height: 18px; border-radius: 5px; border: 1px solid rgba(255, 255, 255, 0.7); background: #fff; cursor: pointer; flex-shrink: 0; position: relative; vertical-align: middle; }
.top_banner_dismiss_chk:checked{ background: #fff; border-color: #fff; }
.top_banner_dismiss_chk:checked::after{ content: ''; position: absolute; top: 1px; left: 5px; width: 5px; height: 9px; border-right: 2px solid #1060d0; border-bottom: 2px solid #1060d0; transform: rotate(45deg); }
.top_banner_dismiss_chk:focus-visible{ outline: 2px dotted #fff; outline-offset: 2px; }
/* -------------------------------------------------------*/
/* 메인 섹션2: 바로가기/즐겨찾기                             */
/* -------------------------------------------------------*/
.main_session2{ background: #f8faff; position: relative; }
/* 닫기 버튼 wrap: 가운데 정렬 */
.s2_close_wrap{ display: flex; justify-content: center; }
/* 닫기 버튼: session2_close_btn.png 이미지 활용 */
.s2_close_btn{ display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 275px; height: 35px; background: url(../images/main/session2_close_btn.png) no-repeat center / 100% 100%; text-decoration: none; }
.s2_close_text{ font-size: 1.5rem; color: #333333; font-family: 'Pretendard-Regular', sans-serif; letter-spacing: -0.3px; line-height: 1; }
.s2_close_ico{ width: 16px; height: 16px; object-fit: contain; display: block; transition: transform 0.3s ease; }
.main_session2.is_closed .s2_inner{ display: none; }
.main_session2.is_closed .s2_close_ico{ transform: rotate(180deg); }
/* inner */
.s2_inner{ padding: 40px 0 60px; }
/* ── 탭 헤더 ── */
.s2_tab_wrap{ display: flex; align-items: center; justify-content: center; position: relative; margin-bottom: 36px; }
.s2_tab_list{ display: flex; align-items: center; gap: 20px; }
/* 설명 텍스트는 absolute로 오른쪽 고정 */
.s2_tab_desc{ position: absolute; right: 0; }
.s2_tab_btn{ font-family: 'YeogiOttaeJalnanGothic', sans-serif; font-size: 3.6rem; font-weight: normal; color: #b2b2b2; background: none; border: none; cursor: pointer; padding: 0; line-height: 1; transition: color 0.2s; }
.s2_tab_btn.is_active{ color: #222222; }
.s2_tab_btn:focus-visible{ outline: 2px solid #3f5bb5; outline-offset: 4px; border-radius: 2px; }
.s2_tab_divider{ font-size: 3.6rem; color: #d2d2d2; line-height: 1; font-weight: 300; user-select: none; }
/* 오른쪽 설명 텍스트 */
.s2_tab_desc{ display: flex; align-items: center; gap: 6px; font-size: 1.7rem; color: #555; font-family: 'Pretendard-Regular', sans-serif; top: 50%; transform: translateY(-50%); }
.s2_star_ico{ width: 20px; height: 20px; object-fit: contain; flex-shrink: 0; }
.s2_desc_em{ font-weight: 500; text-decoration: underline; font-style: normal; }
/* ── 카드 리스트 ── */
.s2_card_list{ display: flex; align-items: flex-start; gap: 0; }
/* 신청현황 영역 */
.s2_status_wrap{ display: flex; flex-direction: column; align-items: center; flex-shrink: 0; width: 120px; }
.s2_status_card{ width: 120px; height: 120px; border-radius: 30px; background: #2b6beb; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 24px rgba(63, 91, 181, 0.35); flex-shrink: 0; }
/* 숫자+단위 묶음: 아래 베이스라인 정렬 → "0"은 위로 크게, "건"은 아래에 위치 */
.s2_status_count{ display: inline-flex; align-items: flex-end; gap: 2px; line-height: 1; }
.s2_status_num{ font-size: 5rem; font-weight: 700; color: #fff; line-height: 1; font-family: 'Pretendard-Regular', sans-serif; }
.s2_status_unit{ font-size: 2.3rem; font-weight: 400; color: #fff; line-height: 1; font-family: 'Pretendard-Regular', sans-serif; padding-bottom: 4px; }
.s2_status_label{ margin-top: 20px; font-size: 1.7rem; color: #555; text-align: center; font-family: 'Pretendard-Regular', sans-serif; white-space: nowrap; }
.s2_status_label strong{ font-weight: 700; }
/* 메뉴 목록 */
.s2_menu_list{ display: flex; align-items: flex-start; gap: 40px; margin-left: 75px; flex-wrap: wrap; }
.s2_menu_item{ display: flex; flex-direction: column; align-items: center; position: relative; }
.fav_slot_kebab{ position: absolute; top: 6px; right: 6px; z-index: 2; display: inline-flex; flex-direction: column; justify-content: center; align-items: center; gap: 3px; width: 26px; height: 26px; padding: 0; border: 0; background: transparent; border-radius: 50%; cursor: pointer; opacity: 1; transition: opacity 0.15s, background 0.15s; }
.fav_slot_kebab:hover{ background: rgba(63, 91, 181, 0.1); }
.fav_slot_kebab:focus-visible{ outline: 2px solid #3f5bb5; outline-offset: 2px; opacity: 1; }
.fav_slot_kebab[hidden]{ display: none; }
@media (hover: hover) and (pointer: fine) {
    .fav_slot_kebab{ opacity: 0; }
    .s2_menu_item:hover .fav_slot_kebab,
    .s2_menu_item:focus-within .fav_slot_kebab,
    .fav_slot_kebab[aria-expanded="true"]{ opacity: 1; }
}
.fav_slot_kebab_dot{ width: 4px; height: 4px; border-radius: 50%; background: #6d7a94; }
.fav_slot_pop{ position: absolute; top: 34px; right: 6px; z-index: 5; min-width: 96px; padding: 4px 0; background: #fff; border: 1px solid #d4dbe8; border-radius: 8px; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12); }
.fav_slot_pop[hidden]{ display: none; }
.fav_slot_pop_item{ display: block; width: 100%; padding: 8px 14px; border: 0; background: transparent; text-align: left; font-size: 1.4rem; color: #333; cursor: pointer; font-family: 'Pretendard-Regular', sans-serif; }
.fav_slot_pop_item:hover{ background: #f2f5fb; color: #1045b0; }
.fav_slot_pop_item:focus-visible{ outline: 2px solid #3f5bb5; outline-offset: -2px; }
.s2_menu_card{ display: flex; align-items: center; justify-content: center; width: 120px; height: 120px; border-radius: 30px; border: 1px solid #a9bfda; background: #fff; text-decoration: none; transition: border-color 0.2s, box-shadow 0.2s; flex-shrink: 0; }
.s2_menu_card:hover{ border-color: #3f5bb5; box-shadow: 0 4px 16px rgba(63, 91, 181, 0.15); }
.s2_menu_card:focus-visible{ outline: 2px solid #3f5bb5; outline-offset: 3px; border-radius: 30px; }
.s2_menu_ico{ width: 36px; height: 36px; object-fit: contain; display: block; }
.s2_menu_ico[hidden]{ display: none; }
.s2_menu_label{ margin-top: 20px; font-size: 1.7rem; color: #1045b0; text-align: center; font-family: 'Pretendard-Regular', sans-serif; white-space: nowrap; }
/* ── 즐겨찾기 메뉴 선택 모달 ── */
.fav_modal{ position: fixed; inset: 0; z-index: 9000; display: flex; align-items: center; justify-content: center; }
.fav_modal[hidden]{ display: none; }
.fav_modal_dim{ position: absolute; inset: 0; background: rgba(17, 27, 60, 0.55); }
.fav_modal_box{ position: relative; z-index: 1; width: min(600px, calc(100vw - 32px)); height: min(720px, calc(100vh - 64px)); display: flex; flex-direction: column; background: #fff; border-radius: 14px; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); overflow: hidden; }
.fav_modal_head{ display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; border-bottom: 1px solid #e6ebf3; }
.fav_modal_tit{ font-size: 1.8rem; font-weight: 700; color: #1f2b54; font-family: 'Pretendard-Regular', sans-serif; }
.fav_modal_close{ width: 32px; height: 32px; padding: 0; border: 0; background: transparent; font-size: 2.4rem; line-height: 1; color: #555; cursor: pointer; border-radius: 50%; transition: background 0.15s; }
.fav_modal_close:hover{ background: #f2f5fb; color: #1f2b54; }
.fav_modal_search{ padding: 14px 22px; border-bottom: 1px solid #e6ebf3; }
.fav_modal_input{ width: 100%; height: 40px; padding: 0 14px; border: 1px solid #c9d2e3; border-radius: 8px; font-size: 1.4rem; color: #333; font-family: 'Pretendard-Regular', sans-serif; background: #fff; }
.fav_modal_input:focus{ outline: none; border-color: #3f5bb5; box-shadow: 0 0 0 3px rgba(63, 91, 181, 0.15); }
.fav_modal_tabs{ display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 22px; border-bottom: 1px solid #e6ebf3; background: #f8faff; }
.fav_modal_tab{ padding: 6px 12px; border: 1px solid #c9d2e3; border-radius: 999px; background: #fff; font-size: 1.3rem; color: #555; cursor: pointer; font-family: 'Pretendard-Regular', sans-serif; transition: border-color 0.15s, background 0.15s, color 0.15s; }
.fav_modal_tab:hover{ border-color: #3f5bb5; color: #1045b0; }
.fav_modal_tab.is_active{ border-color: #3f5bb5; background: #3f5bb5; color: #fff; }
.fav_modal_body{ flex: 1; min-height: 0; overflow-y: auto; padding: 14px 22px; overscroll-behavior: contain; }
.fav_modal_empty{ padding: 40px 0; text-align: center; color: #888; font-size: 1.4rem; }
.fav_group{ margin-bottom: 18px; }
.fav_group:last-child{ margin-bottom: 0; }
.fav_group_tit{ margin-bottom: 8px; font-size: 1.4rem; font-weight: 700; color: #1045b0; font-family: 'Pretendard-Regular', sans-serif; }
.fav_link_list{ list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 2px; }
.fav_link_item{ margin: 0; }
.fav_link{ display: block; width: 100%; padding: 8px 12px; border: 0; background: transparent; text-align: left; font-size: 1.4rem; color: #333; cursor: pointer; border-radius: 6px; font-family: 'Pretendard-Regular', sans-serif; transition: background 0.15s, color 0.15s; }
.fav_link:hover{ background: #f2f5fb; color: #1045b0; }
.fav_link.is_dup{ color: #aaa; cursor: not-allowed; position: relative; padding-right: 68px; }
.fav_link.is_dup::after{ content: '등록됨'; position: absolute; top: 50%; right: 12px; transform: translateY(-50%); font-size: 1.1rem; color: #888; background: #eef1f7; border-radius: 999px; padding: 2px 8px; }
.fav_link.is_dup:hover{ background: transparent; color: #aaa; }
.fav_modal_actions{ padding: 12px 22px; border-top: 1px solid #e6ebf3; display: flex; justify-content: flex-end; gap: 8px; }
.fav_modal_btn{ padding: 8px 16px; border: 1px solid #c9d2e3; border-radius: 8px; background: #fff; font-size: 1.4rem; color: #555; cursor: pointer; font-family: 'Pretendard-Regular', sans-serif; }
.fav_modal_btn:hover{ border-color: #3f5bb5; color: #1045b0; }
/* ── 탭 패널 ── */
.s2_panel{ display: block; }
.s2_panel[hidden]{ display: none; }
/* 로그인 전 바로가기 리스트 */
.s2_before_list{ display: flex; align-items: flex-start; gap: 45px; list-style: none; flex-wrap: wrap; }
.s2_before_item{  }
.s2_before_link{ display: flex; flex-direction: column; align-items: center; text-decoration: none; }
.s2_before_card{ display: flex; align-items: center; justify-content: center; width: 120px; height: 120px; border-radius: 30px; border: 1px solid #d4e4f8; background: #e6f1fe; box-shadow: 0 4px 14px rgba(0,100,200,0.09); transition: box-shadow 0.2s, transform 0.2s; flex-shrink: 0; }
.s2_before_link:hover .s2_before_card{ box-shadow: 0 8px 24px rgba(0,100,200,0.16); transform: translateY(-3px); }
.s2_before_link:focus-visible .s2_before_card{ outline: 2px solid #0180f5; outline-offset: 3px; border-radius: 30px; }
.s2_before_ico{ display: block; object-fit: contain; }
.s2_before_label{ display: block; margin-top: 20px; font-size: 1.7rem; color: #333333; text-align: center; line-height: 1.3; word-break: keep-all; }
/* -------------------------------------------------------*/
/* SESSION 3                                              */
/* -------------------------------------------------------*/
.main_session3{ background: #fff; padding: 80px 0; }
.sec3_inner{ display: flex; align-items: flex-start; gap: 70px; }
/* ── 왼쪽 영역 ── */
.sec3_left{ width: 730px; flex-shrink: 0; }
/* 탭 헤더 */
.sec3_tab_wrap{ display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; row-gap: 12px; }
.sec3_tab_list{ display: flex; align-items: center; gap: 6px; }
.sec3_tab_btn{ font-size: 2.2rem; color: #666666; background: none; border: none; cursor: pointer; padding: 8px 15px; border-radius: 25px; font-family: 'Pretendard-Regular', sans-serif; transition: background 0.2s, color 0.2s; }
.sec3_tab_btn.is_active{ background: #004dc0; color: #fff; }
.sec3_tab_btn:focus-visible{ outline: 2px solid #004dc0; outline-offset: 2px; }
/* 컨트롤 버튼 */
.sec3_controls{ display: flex; align-items: center; gap: 8px; }
.sec3_ctrl_btn{ width: 40px; height: 40px; border-radius: 50%; background: #f1f1f1; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background 0.2s; }
.sec3_ctrl_btn:hover{ background: #e0e0e0; }
.sec3_prev_ico,
.sec3_next_ico{ width: 9px; height: 14px; display: block; object-fit: contain; }
.sec3_plus_ico{ width: 12px; height: 12px; display: block; object-fit: contain; }
/* 탭 패널 */
.sec3_panel[hidden]{ display: none; }
.sec3_panel_wrap{ margin-top: 40px; }
/* 카드 그리드 (슬라이드 1장 = 4개 카드) */
.sec3_card_grid{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.sec3_card{ height: 250px; background: #fff; border: 1px solid #dfdfdf; border-radius: 20px; padding: 35px 30px; box-sizing: border-box; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06); display: flex; flex-direction: column; }
.sec3_card_title{ font-size: 2rem; font-weight: 700; color: #333333; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sec3_card_desc{ font-size: 1.7rem; font-weight: 200; color: #444444; line-height: 1.5; margin-top: 20px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.sec3_card_date{ display: flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 20px; font-size: 1.5rem; color: #777777; }
.sec3_date_ico{ width: 15px; height: 15px; display: block; object-fit: contain; flex-shrink: 0; }
/* 페이지네이션 */
.sec3_pagination{ display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 40px; }
.sec3_pagination .swiper-pagination-bullet{ width: 11px; height: 11px; border-radius: 50%; background: #dbdbdb; opacity: 1; margin: 0 !important; cursor: pointer; }
.sec3_pagination .swiper-pagination-bullet-active{ background: #004dc0; }
/* ── 오른쪽: 알림존 ── */
.sec3_right{ flex: 1; min-width: 0; }
.sec3_alarm_title{ font-family: 'YeogiOttaeJalnanGothic', sans-serif; font-size: 3.6rem; font-weight: normal; color: #222; line-height: 1; }
.alarm_swiper_wrap{ margin-top: 40px; }
.alarm_swiper{ width: 500px; aspect-ratio: 500 / 520; border-radius: 25px; overflow: hidden; }
.alarm_thumb{ width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
/* -------------------------------------------------------*/
/* SESSION 4                                              */
/* -------------------------------------------------------*/
.main_session4{ position: relative; background: #e8f1fa; overflow: hidden; padding: 80px 0; }
.main_session4::before,
.main_session4::after{ content: ''; position: absolute; background-repeat: no-repeat; background-position: bottom; background-size: contain; pointer-events: none; z-index: 0; }
.main_session4::before{ left: -300px; bottom:-450px; background-image: url('../images/main/session04_bg01.png'); width: 50%; height: 100%; }
.main_session4::after{ right: 0; top:-300px; background-image: url('../images/main/session04_bg02.png'); width: 50%; height: 100%; }
/* ── sec4 월 바 ── */
.sec4_month_bar{ position: relative; z-index: 1; margin-top: 30px; background: #fff; border-radius: 25px; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.07); }
.sec4_month_list{ display: flex; align-items: center; justify-content: space-between; }
.sec4_month_btn{ display: inline-flex; align-items: flex-end; gap: 4px; padding: 9px 18px; border-radius: 50px; color: #727272; text-decoration: none; white-space: nowrap; }
.sec4_month_num{ font-size: 2.4rem; font-weight: 700; line-height: 1; }
.sec4_month_name{ font-size: 1.6rem; font-weight: 300; line-height: 1; }
.sec4_month_item.is_active .sec4_month_btn{ background: #f5462e; color: #fff; }
/* ── sec4 본문 ── */
.sec4_body{ display: flex; gap: 30px; margin-top: 40px; position: relative; z-index: 1; }
.sec4_left{ flex-shrink: 0; width: 440px; }
/* ── sec4 오른쪽 일정 목록 ── */
.sec4_right{ flex: 1; min-width: 0; background: #fff; border-radius: 25px; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.07); padding: 30px; box-sizing: border-box; align-self: flex-start; margin-top: 33px; }
.sec4_list{ max-height: 340px; overflow-y: auto; padding-right: 10px; }
.sec4_list::-webkit-scrollbar{ width: 4px; }
.sec4_list::-webkit-scrollbar-track{ background: transparent; }
.sec4_list::-webkit-scrollbar-thumb{ background: #d2d2d2; border-radius: 4px; }
.sec4_list_item{ display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 0; border-bottom: 1px solid #dfdfdf; }
.sec4_list_item:first-child{ padding-top: 0; }
.sec4_list_empty{ display: flex; align-items: center; justify-content: center; padding: 40px 0; font-size: 1.5rem; color: #aaa; }
.sec4_list_item:last-child{ border-bottom: none; padding-bottom: 0; }
.sec4_item_main{ display: flex; align-items: flex-start; gap: 10px; flex: 1; min-width: 0; }
.sec4_badge{ display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; padding: 2px 10px; border-radius: 13px; font-size: 1.4rem; border: 1px solid; white-space: nowrap; }
.sec4_badge_edu{ color: #0069e0; border-color: #0069e0; }
.sec4_badge_conf{ color: #8a41d6; border-color: #8a41d6; }
.sec4_item_info{ flex: 1; min-width: 0; }
.sec4_item_title{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sec4_item_org{ font-size: 1.6rem; color: #222; }
.sec4_item_name{ font-size: 1.8rem; font-weight: 600; color: #111; margin-left: 4px; }
.sec4_item_meta{ display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.sec4_meta_icon{ width: 13px; height: 13px; flex-shrink: 0; }
.sec4_meta_text{ font-size: 1.5rem; font-weight: 200; color: #555; }
.sec4_meta_sep{ font-size: 1.5rem; color: #d2d2d2; }
.sec4_item_right{ display: flex; flex-direction: column; align-items: center; gap: 8px; flex-shrink: 0; }
.sec4_item_type{ font-size: 1.4rem; font-weight:500; white-space: nowrap; }
.sec4_type_off{ color: #f16000; }
.sec4_type_on{ color: #068100; }
.sec4_status{ display: inline-flex; align-items: center; justify-content: center; width: 55px; padding: 5px 0; border-radius: 13px; font-size: 1.3rem; color: #fff; white-space: nowrap; }
.sec4_status_open{ background: #ef4054; }
.sec4_status_close{ background: #8e8e8e; }
/* ── 범례 ── */
.sec4_legend{ display: flex; align-items: center; justify-content: flex-end; gap: 16px; margin-bottom: 15px; }
.sec4_legend_item{ display: flex; align-items: center; gap: 6px; font-size: 1.4rem; }
.sec4_legend_item.is_off{ color: #f06000; }
.sec4_legend_item.is_on{ color: #068100; }
.sec4_dot{ display: inline-block; width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.sec4_dot_off{ background: #f06000; }
.sec4_dot_on{ background: #068100; }
/* ── 달력 카드 ── */
.sec4_calendar{ width: 440px; min-height: 430px; background: #fff; border-radius: 20px; padding: 50px 30px 40px; box-sizing: border-box; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06); }
/* 요일 헤더 바 */
.sec4_cal_days{ display: grid; grid-template-columns: repeat(7, 1fr); width: 380px; height: 40px; background: #003568; border-radius: 25px; align-items: center; list-style: none; }
.sec4_cal_days li{ font-family: 'Escoredream', sans-serif; font-size: 1.7rem; color: #fff; text-align: center; }
.sec4_cal_days li.is_sun{ color: #f96d6d; }
.sec4_cal_days li.is_sat{ color: #1aa3ff; }
/* 날짜 그리드 */
.sec4_cal_body{ display: grid; grid-template-columns: repeat(7, 1fr); margin-top: 8px; }
.sec4_cal_cell{ display: flex; flex-direction: column; align-items: center; padding: 4px 0; cursor: pointer; }
.sec4_cal_cell.is_empty{ pointer-events: none; }
.sec4_cal_date{ display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; font-size: 1.7rem; border-radius: 50%; color: #333; }
.sec4_cal_cell.is_sun .sec4_cal_date{ color: #ff3f3f; }
.sec4_cal_cell.is_sat .sec4_cal_date{ color: #057ac4; }
.sec4_cal_cell.is_active .sec4_cal_date{ background: #f5462e; color: #fff !important; }
.sec4_cal_dots{ display: flex; gap: 3px; margin-top: 3px; min-height: 10px; }
/* ── sec4 상단 헤더 ── */
.sec4_top{ position: relative; display: flex; align-items: center; justify-content: space-between; }
.sec4_title{ font-family: 'YeogiOttaeJalnanGothic', sans-serif; font-size: 3.6rem; font-weight: normal; color: #111; }
.sec4_nav{ position: absolute; left: 50%; transform: translateX(-50%); display: flex; gap: 40px; }
.sec4_nav_btn{ display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(0, 0, 0, 0.1); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); background: #fff; flex-shrink: 0; }
.sec4_nav_date{ font-family: 'NexonFootballGothic', sans-serif; font-size: 4rem; font-weight: 300; color: #111; }
.sec4_btn_group{ display: flex; align-items: center; gap: 8px; }
.sec4_btn{ display: inline-flex; align-items: center; gap: 6px; padding: 9px 18px; border-radius: 17px; color: #fff; font-size: 1.4rem; font-weight: 500; text-decoration: none; }
.sec4_btn_schedule{ background: #0278fe; }
.sec4_btn_annual{ background: #0b856f; }
.sec4_btn_icon{ width: 18px; height: 18px; }
.sec4_btn_icon_sm{ width: 16px; height: 16px; }
.sec4_mob_toggle{ display: none; }
.sec4_tog_btn{ flex: 1; padding: 10px 0; font-size: 1.5rem; font-weight: 600; color: #445c6e; background: transparent; border: none; cursor: pointer; text-align: center; transition: all 0.2s; }
.sec4_tog_btn.is_active{ background: #fff; color: #111; border-radius: 25px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }
/* -------------------------------------------------------*/
/* SESSION 5                                              */
/* -------------------------------------------------------*/
.main_session5{ padding: 80px 0; background: #fff; }
.sec5_inner{ display: flex; align-items: flex-start; justify-content: space-between; }
/* ── 왼쪽 카드 그룹 ── */
.sec5_left{ flex-shrink: 0; }
.sec5_card_list{ display: grid; grid-template-columns: repeat(2, 170px); gap: 20px; list-style: none; }
.sec5_card_item{  }
.sec5_card_link{ display: flex; flex-direction: column; align-items: center; justify-content: center; width: 170px; height: 140px; background: #fff; border: 1px solid #e6e6e6; border-radius: 20px; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); text-decoration: none; transition: box-shadow 0.2s ease, transform 0.2s ease; }
.sec5_card_link:hover{ box-shadow: 0 8px 30px rgba(0, 0, 0, 0.14); transform: translateY(-3px); }
.sec5_card_ico{ display: block; }
.sec5_card_text{ display: block; margin-top: 14px; font-size: 1.6rem; font-weight: 500; color: #222; text-align: center; line-height: 1.3; word-break: keep-all; }
/* ── 유튜브 영상 영역 ── */
.sec5_video{ flex-shrink: 0; align-self: center; }
.sec5_video_link{ display: block; position: relative; width: 520px; height: 300px; border-radius: 20px; overflow: hidden; text-decoration: none; }
/* 썸네일 이미지 */
.sec5_video_thum{ display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.35s ease; }
/* 호버 시 어두운 오버레이 */
.sec5_video_link::after{ content: ''; position: absolute; inset: 0; background: rgba(0, 0, 0, 0); border-radius: 20px; transition: background 0.35s ease; pointer-events: none; }
.sec5_video_link:hover::after{ background: rgba(0, 0, 0, 0.18); }
.sec5_video_link:hover .sec5_video_thum{ transform: scale(1.04); }
/* 플레이 버튼 */
.sec5_video_play{ position: absolute; top: 50%; left: 50%; width: 71px; height: 71px; transform: translate(-50%, -50%); transition: transform 0.3s ease, opacity 0.3s ease; pointer-events: none; z-index: 1; }
.sec5_video_link:hover .sec5_video_play{ transform: translate(-50%, -50%) scale(1.12); opacity: 0.88; }
/* ── 오른쪽 사무국 카드 ── */
.sec5_right{ flex-shrink: 0; align-self: center; }
.sec5_office_card{ position: relative; display: flex; flex-direction: column; width: 350px; height: 300px; border-radius: 20px; overflow: hidden; background-color: #e8eff9; }
/* 배경 아이콘 — opacity 40% 워터마크 */
.sec5_office_card::before{ content: ''; position: absolute; inset: 0; background-image: url('../images/main/icon_bg_book.png'); background-repeat: no-repeat; background-position:right 20px bottom -30px; background-size: auto; opacity: 0.1; pointer-events: none; z-index: 0; }
/* 상단 본문 영역 */
.sec5_office_body{ flex: 1; position: relative; z-index: 1; padding: 30px 40px 0 40px; }
/* 사무국 타이틀 */
.sec5_office_title{ display: block; font-size: 2.2rem; font-weight: 600; color: #222; line-height: 1.3; }
/* 구분선 */
.sec5_office_line{ margin: 15px 0 0; border: none; border-top: 1px solid rgba(0, 0, 0, 0.3); }
/* 연락처 리스트 */
.sec5_contact_list{ margin: 15px auto 0; list-style: none; display: inline-flex; flex-direction: column; gap: 5px; left: 50%; position: relative; transform: translateX(-50%); }
.sec5_contact_item{ display: flex; align-items: center; gap: 10px; }
/* 아이콘 원형 배경 */
.sec5_contact_ico{ display: flex; align-items: center; justify-content: center; width: 25px; height: 25px; border-radius: 50%; background: #fff; flex-shrink: 0; }
/* 아이콘 사이즈 개별 지정 */
.sec5_ico_call img{ width: 13px; height: 13px; }
.sec5_ico_fax img{ width: 14px; height: 13px; }
.sec5_ico_mail img{ width: 13px; height: 10px; }
/* 연락처 텍스트 */
.sec5_contact_text{ font-size: 1.6rem; color: #333; line-height: 1; }
/* 협회 SNS */
.sec5_sns_wrap{ display: flex; align-items: center; justify-content: space-between; margin-top: 10px; padding:0 10px; }
.sec5_sns_title{ font-size: 1.6rem; font-weight: 600; color: #333; }
.sec5_sns_list{ display: flex; align-items: center; gap: 8px; list-style: none; padding: 0; margin: 0; }
.sec5_sns_list li a{ display: block; line-height: 1; }
.sec5_sns_list li a img{ width: 35px; height: 35px; display: block; }
/* 하단 블루 바 */
.sec5_office_footer{ flex-shrink: 0; height: 55px; background: #598cd5; position: relative; z-index: 1; display: flex; align-items: center; padding: 0 15px; gap: 8px; }
/* 협회 로고송 라벨 */
.sec5_player_label{ font-size: 1.3rem; color: #fff; white-space: nowrap; flex-shrink: 0; }
/* 플레이어 전체 감싸기 */
.sec5_player_wrap{ flex: 1; display: flex; align-items: center; background: #29499a; border-radius: 16.5px; padding: 0 15px; height: 33px; gap: 12px; position: relative; overflow: visible; }
/* 공통 버튼 */
.sec5_player_btn{ background: none; border: none; padding: 0; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; line-height: 1; }
.sec5_player_btn img{ display: block; }
/* 진행바 영역 */
.sec5_player_progress{ flex: 0 1 90px; display: flex; align-items: center; }
.sec5_seek_bar{ width: 100%; height: 3px; -webkit-appearance: none; appearance: none; background: rgba(255,255,255,0.35); border-radius: 2px; outline: none; cursor: pointer; }
.sec5_seek_bar::-webkit-slider-thumb{ -webkit-appearance: none; appearance: none; width: 12px; height: 12px; border-radius: 0; background: url('../images/main/player_togo.png') no-repeat center / 12px 12px; cursor: pointer; box-shadow: none; }
.sec5_seek_bar::-moz-range-thumb{ width: 12px; height: 12px; border-radius: 0; background: url('../images/main/player_togo.png') no-repeat center / 12px 12px; cursor: pointer; border: none; box-shadow: none; }
/* 시간 텍스트 */
.sec5_player_time{ font-size: 1.1rem; color: #fff; white-space: nowrap; flex-shrink: 0; }
/* 볼륨 패널 */
.sec5_player_vol_wrap{ position: relative; display: flex; align-items: center; flex-shrink: 0; }
.sec5_vol_panel{ display: none; position: absolute; bottom: calc(100% + 10px); left: 50%; transform: translateX(-50%); background: #29499a; border: 1px solid rgba(255,255,255,0.2); border-radius: 10px; padding: 10px 8px; z-index: 20; align-items: center; justify-content: center; }
.sec5_vol_panel.is_open{ display: flex; }
.sec5_vol_bar{ writing-mode: vertical-lr; direction: rtl; width: 4px; height: 65px; -webkit-appearance: none; appearance: none; background: rgba(255,255,255,0.35); border-radius: 2px; outline: none; cursor: pointer; }
.sec5_vol_bar::-webkit-slider-thumb{ -webkit-appearance: none; appearance: none; width: 11px; height: 11px; border-radius: 50%; background: #fff; cursor: pointer; }
.sec5_vol_bar::-moz-range-thumb{ width: 11px; height: 11px; border-radius: 50%; background: #fff; cursor: pointer; border: none; }
/* 배속 패널 */
.sec5_player_rate_wrap{ position: relative; display: flex; align-items: center; flex-shrink: 0; }
.sec5_rate_panel{ display: none; position: absolute; bottom: calc(100% + 10px); left: 50%; transform: translateX(-50%); background: #29499a; border: 1px solid rgba(255,255,255,0.2); border-radius: 10px; padding: 5px 0; list-style: none; z-index: 20; min-width: 58px; }
.sec5_rate_panel.is_open{ display: block; }
.sec5_rate_panel li{ padding: 5px 14px; font-size: 1.2rem; color: rgba(255,255,255,0.6); cursor: pointer; text-align: center; white-space: nowrap; transition: color 0.15s; }
.sec5_rate_panel li:hover,
.sec5_rate_panel li.is_active{ color: #fff; }
/* -------------------------------------------------------*/
/* 메인 KV (히어로)                                        */
/* -------------------------------------------------------*/
/*
 * .main_kv 배경 (2026-06-10) — mp4 로드 전에도 어두운 그라데이션이 깔려있어
 * 흰 화면이 잠깐 보이는 깜빡임 제거. 로그인 오버레이와 자연스럽게 합쳐짐.
 */
.main_kv{ margin-top: -143px; height: 100vh; position: relative; z-index: 0; overflow: hidden;
          background: linear-gradient(135deg, #0b2552 0%, #1b3a78 50%, #2a4ea4 100%); }
/* 배경 스와이퍼 */
.kv_swiper{ position: absolute; inset: 0; z-index: 1; height: 100% !important;
            background: transparent; }
.kv_swiper .swiper-wrapper,
.kv_swiper .swiper-slide{ height: 100% !important; }
.kv_slide_img{ width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }
/* 콘텐츠 오버레이 */
.kv_overlay{ position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; }
.kv_inner{ height: 100%; display: flex; flex-direction: column; justify-content: center; padding-top: 143px; }
.kv_text_wrap{ max-width: 700px; }
/* 타이틀 */
.kv_title{ font-family: 'YeogiOttaeJalnanGothic', sans-serif; font-size: 6rem; font-weight: normal; color: #fff; line-height: 1.2; letter-spacing: -1px; }
/* 설명 텍스트 */
.kv_desc{ margin-top: 50px; font-size: 2rem; color: rgba(255, 255, 255, 0.9); line-height: 1.8; letter-spacing: -0.5px; word-break: keep-all; }
/* 컨트롤 영역 */
.kv_controls{ margin-top: 100px; }
/* 페이지네이션 */
.kv_pager{ display: flex; align-items: center; gap: 14px; }
.kv_btn{ background: none; border: none; cursor: pointer; padding: 0; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.kv_btn:focus-visible{ outline: 2px solid rgba(255, 255, 255, 0.8); outline-offset: 3px; border-radius: 3px; }
.kv_prev_ico,
.kv_next_ico{ width: 19px; height: 33px; display: block; }
/* 정지/재생 버튼 원형 */
.kv_toggle{ width: 30px; height: 30px; border-radius: 50%; border: 1px solid #fff; }
.kv_ico_stop{ width: 8px; height: 12px; display: block; }
.kv_ico_play{ width: 7px; height: 10px; display: none; }
.kv_toggle.is_stopped .kv_ico_stop{ display: none; }
.kv_toggle.is_stopped .kv_ico_play{ display: block; }
/* 슬라이드 카운트 */
.kv_count{ display: flex; align-items: center; gap: 4px; font-size: 1.8rem; color: #fff; font-family: 'Pretendard-Regular', sans-serif; letter-spacing: 0; line-height: 1; }
.kv_cur{ color:#fff; font-weight: 700; font-style: normal; }
.kv_sep{ color: rgba(255, 255, 255, 0.5); }
.kv_tot{ color: rgba(255, 255, 255, 0.6); }
/* 스크롤 다운 */
.kv_scroll_down{ position: absolute; left: 50%; bottom: 24px; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 4px; cursor: pointer; z-index: 10; animation: kv_bounce 2s infinite; text-decoration: none; }
.kv_scroll_down img{ display: block; }
.kv_scroll_down_txt{ font-size: 1.1rem; color:#fff; }
.kv_scroll_down:hover .kv_scroll_down_txt{ color: rgba(255, 255, 255, 0.6); }
@keyframes kv_bounce{ 0%,100%{ transform: translateX(-50%) translateY(0); } 50%{ transform: translateX(-50%) translateY(8px); } }
/* 로그인 패널 */
.kv_login_panel{ position: absolute; bottom: 0; right: 0; width: 830px; height: 270px; padding: 50px; background: rgba(29, 54, 154, 0.85); border-top-left-radius: 30px; z-index: 3; display: flex; align-items: center; gap: 30px; }
/* 왼쪽 흰색 카드 */
.lp_card{ flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 10px; width: 138px; height: 167px; box-sizing: border-box; background: #fff; padding: 15px; border-radius: 10px; }
.lp_logo{ width: 73px; height: 38px; object-fit: contain; }
.lp_badge_wrap{ position: relative; width: 89px; height: 89px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.lp_badge{ width: 110px; height: 110px; object-fit: contain; display: block; }
.lp_grade{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 1.5rem; font-weight: 700; color: #333333; pointer-events: none; }
/* 가운데 회원 정보 */
.lp_info{ flex: 0 0 auto; color: #fff; }
.lp_name_wrap{ display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.lp_user_icon{ width: 35px; height: 35px; object-fit: contain; }
.lp_name{ display: inline-flex; align-items: baseline; color: #fff; line-height: 1; }
.lp_name_bold{ font-size: 2.4rem; font-weight: 700; font-style: normal; }
.lp_name_suffix{ font-size: 2rem; font-weight: 400; vertical-align: baseline; }
.lp_list{ list-style: none; display: flex; flex-direction: column; gap: 4px; }
.lp_list_item{ font-size: 1.5rem; color: rgba(255, 255, 255, 0.9); display: flex; align-items: center; gap: 6px; }
.lp_list_item::before{ content: '·'; font-size: 1.6rem; line-height: 1; color: rgba(255, 255, 255, 0.9); }
.lp_list_item:nth-child(3){ margin-top: 10px; }
/* 미납 뱃지 */
.lp_badge_unpaid{ display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 20px; background: #ff0000; border-radius: 10.5px; font-size: 1.3rem; font-weight: 700; color: #fff; }
/* 오른쪽 버튼 */
.lp_btns{ flex-shrink: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; align-self: flex-end; }
.lp_btn{ display: inline-flex; align-items: center; justify-content: center; width: 100px; height: 30px; border-radius: 5px; font-size: 1.5rem; color: #fff; font-weight: 500; text-decoration: none; }
.lp_btn_mypage{ background: #009488; }
.lp_btn_mypage:hover{ background: #007a70; }
.lp_btn_logout{ background: #0180f5; }
.lp_btn_logout:hover{ background: #0166c4; }
/* 로그인 전 패널 */
.lp_before{ width: fit-content; }
.lp_before_title{ display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.lp_before_title strong{ font-size: 2rem; font-weight: 700; color: #fff; line-height: 1; }
.lp_before_title i{ font-size: 2rem; color: #fff; line-height: 1; }
.lp_before_row{ display: flex; align-items: center; gap: 8px; }
.lp_before_input{ height: 40px; border: none; border-radius: 5px; background: #fff; padding: 0 12px; font-size: 1.5rem; color: #333; box-sizing: border-box; outline: none; }
.lp_before_input::placeholder{ font-size: 1.5rem; color: #555555; }
.lp_before_input:focus-visible{ outline: 2px solid rgba(255,255,255,0.8); outline-offset: 2px; }
.lp_before_input_id{ width: 190px; }
.lp_before_input_pw{ width: 140px; }
.lp_before_btn{ display: inline-flex; align-items: center; justify-content: center; width: 90px; height: 40px; background: #0180f5; border-radius: 5px; color: #fff; font-size: 1.6rem; font-weight: 500; text-decoration: none; flex-shrink: 0; transition: background 0.2s; }
.lp_before_btn:hover{ background: #0166c4; }
.lp_before_btn:focus-visible{ outline: 2px solid rgba(255,255,255,0.8); outline-offset: 2px; border-radius: 5px; }
.lp_before_bottom{ display: flex; align-items: center; justify-content: space-between; margin-top: 35px; }
.lp_before_remember{ display: flex; align-items: center; gap: 6px; cursor: pointer; }
.lp_before_chk{ appearance: none; -webkit-appearance: none; width: 22px; height: 22px; border-radius: 3px; border: 1px solid rgba(255,255,255,0.7); background: transparent; cursor: pointer; flex-shrink: 0; position: relative; }
.lp_before_chk:checked{ background: #fff; border-color: #fff; }
.lp_before_chk:checked::after{ content: ''; position: absolute; top: 2px; left: 6px; width: 6px; height: 11px; border-right: 2px solid #0180f5; border-bottom: 2px solid #0180f5; transform: rotate(45deg); }
.lp_before_chk:focus-visible{ outline: 2px solid rgba(255,255,255,0.8); outline-offset: 2px; }
.lp_before_remember_text{ font-size: 1.4rem; color: #fff; line-height: 1; }
.lp_before_find{ font-size: 1.4rem; color: #fff; text-decoration: none; }
.lp_before_find:hover{ text-decoration: underline; }
.lp_before_find:focus-visible{ outline: 2px solid rgba(255,255,255,0.8); outline-offset: 2px; border-radius: 2px; }
/* -------------------------------------------------------*/
/* SESSION 6 — 협력기관 로고 슬라이더                       */
/* -------------------------------------------------------*/
.main_session6{ padding: 40px 0; background: #f1f1f1; }
.sec6_inner{ display: flex; flex-direction: column; gap: 14px; }
.sec6_row_wrap{ display: flex; align-items: center; gap: 14px; width: 100%; flex-wrap: nowrap; }
.sec6_nav_left{ flex: 0 0 auto; display: flex; }
.sec6_nav_right{ flex: 0 0 auto; display: flex; flex-direction: column; gap: 6px; }
.sec6_swiper_top .swiper-slide{ width: 252px; margin-right: 12px; }
.sec6_swiper_bottom .swiper-slide{ width: 648px; margin-right: 12px; }
/* 스와이퍼 */
.sec6_swiper{ flex: 1; min-width: 0; overflow: hidden; }
.sec6_logo_grid{ display: flex; flex-direction: column; gap: 10px; }
.sec6_row_top,
.sec6_row_bottom{ display: flex; gap: 15px; }
/* 슬라이드 양 끝 정렬 — swiper 가 할당한 폭에 카드를 꽉 채워 좌우 끝선을 인접 행과 맞춤 (2026-06-16) */
.sec6_swiper .swiper-slide{ display: flex; align-items: center; justify-content: center; height: auto; }
/* 소형 카드 (PC 권장 업로드 비율 기준: 430 × 150) — width:100% 로 슬라이드 폭 가득 채워 행 간 좌우 끝 정렬 */
.sec6_logo_card{ display: flex; align-items: center; justify-content: center; width: 100%; height: 75px; background: #fff; border-radius: 10px; overflow: hidden; flex-shrink: 1; transition: box-shadow 0.2s; }
.sec6_logo_card:hover{ box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.sec6_logo_card img{ max-width: 80%; max-height: 65%; object-fit: contain; display: block; }
/* 와이드 카드 (PC 권장 업로드 비율 기준: 1120 × 180) — width:100% 로 슬라이드 폭 가득 채워 행 간 좌우 끝 정렬 */
.sec6_logo_card_wide{ display: flex; align-items: center; justify-content: center; width: 100%; height: 90px; background: #fff; border-radius: 10px; overflow: hidden; flex-shrink: 1; transition: box-shadow 0.2s; }
.sec6_logo_card_wide:hover{ box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.sec6_logo_card_wide img{ max-width: 80%; max-height: 70%; object-fit: contain; display: block; }
/* 네비게이션 — 버튼 사이즈 축소 + 그림자/배경 강조 (2026-06-16) */
.sec6_nav{ display: flex; gap: 6px; flex-shrink: 0; }
.sec6_nav_btn{ display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: #fff; border: 1px solid rgba(0,0,0,0.08); box-shadow: 0 2px 6px rgba(0,0,0,0.15); opacity: 0.3; transition: opacity 0.2s, box-shadow 0.2s, background 0.2s; }
.sec6_nav_btn:hover,
.sec6_nav_btn:focus-visible{ opacity: 1; background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,0.25); outline: none; }
.sec6_nav_btn:focus-visible{ outline: 2px solid #2a4ea4; outline-offset: 2px; }
.sec6_nav_btn img{ display: block; width: 8px; height: 12px; }
/* -------------------------------------------------------*/
/* 퀵메뉴                                                  */
/* -------------------------------------------------------*/
.quick_wrap{ position: fixed; right: 20px; top: 60%; transform: translateY(-50%); z-index: 150; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.quick_chatbot{ display: block; line-height: 1; text-decoration: none; }
.quick_chatbot_ico{ display: block; object-fit: contain; }
.quick_chatbot:focus-visible{ outline: 2px solid #003a89; outline-offset: 3px; border-radius: 4px; }
.quick_menu{ width: 90px; height: 520px; border-radius: 15px; border: 1px solid #e9e9e9; background: #fff; box-shadow: 0 4px 20px rgba(0,0,0,0.12); display: flex; flex-direction: column; overflow: hidden; }
.quick_menu_title{ display: flex; align-items: center; justify-content: center; height: 30px; background: #eeeeee; border-radius: 15px 15px 0 0; font-size: 1.1rem; color: #003a89; letter-spacing: -0.4px; font-weight: 600; flex-shrink: 0; white-space: nowrap; }
.quick_menu_list{ display: flex; flex-direction: column; align-items: center; justify-content: space-evenly; list-style: none; flex: 1; padding: 0; margin: 0; }
.quick_menu_link{ display: flex; flex-direction: column; align-items: center; text-decoration: none; padding: 0 6px; }
.quick_menu_link:hover .quick_menu_ico{ opacity: 0.75; }
.quick_menu_link:focus-visible{ outline: 2px solid #003a89; outline-offset: 3px; border-radius: 4px; }
.quick_menu_ico{ display: block; object-fit: contain; }
.quick_menu_text{ display: block; margin-top: 10px; font-size: 1.4rem; color: #222222; font-weight: 600; text-align: center; line-height: 1.3; word-break: keep-all; }
.quick_top{ display: flex; flex-direction: column; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 50%; background: #333333; box-shadow: 0 4px 14px rgba(0,0,0,0.1); text-decoration: none; transition: box-shadow 0.2s, transform 0.2s; }
.quick_top:hover{ box-shadow: 0 6px 20px rgba(0,0,0,0.18); transform: translateY(-2px); }
.quick_top:focus-visible{ outline: 2px solid #003a89; outline-offset: 3px; border-radius: 50%; }
.quick_top_ico{ display: block; object-fit: contain; }
.quick_top_text{ display: block; margin-top: 7px; font-size: 1.3rem; font-weight: 600; color: #fff; line-height: 1; }
/* -------------------------------------------------------*/
/* KV 반응형                                               */
/* -------------------------------------------------------*/

/* -------------------------------------------------------*/
/* 헤더 sticky 고정                                        */
/* -------------------------------------------------------*/
.site_header{ position: sticky; top: 0; z-index: 200; }
/* -------------------------------------------------------*/
/* 투명 헤더 (메인 히어로 영역 스크롤 전)                   */
/* -------------------------------------------------------*/
/* 트랜지션 - 색 전환 부드럽게 */
.header_util,
.header_gnb{ transition: background 0.3s ease, border-color 0.3s ease; }
.header_util_link,
.header_member_link,
.gnb_link{ transition: color 0.3s ease; }
/* is_hero 상태 */
body.is_hero .header_util{ background: rgba(0, 0, 0, 0.15); border-bottom-color: transparent; }
body.is_hero .header_gnb{ background: transparent; border-bottom-color: transparent; }
/* 링크 흰색 */
body.is_hero .header_util_link,
body.is_hero .header_member_link{ color: #fff; }
body.is_hero .gnb_link{ color: #fff; }
/* util 구분선 흰색 */
body.is_hero .header_util_link + .header_util_link::before{ background: rgba(255, 255, 255, 0.35); }
/* =============================================
   반응형
   ============================================= */

@media (max-width: 1200px) {
    .kv_login_panel{ padding: 40px 36px; gap: 20px; }
    /* session3 */
    .sec3_left{ width: 600px; }
    .alarm_swiper{ width: 100%; }
    /* session2 */
    .s2_status_card,
    .s2_menu_card{ width: 100px; height: 100px; border-radius: 24px; }
    .s2_menu_list{ gap: 20px; margin-left: 40px; }
    /* session4 */
    .sec4_title{ font-size: 3rem; }
    .sec4_nav_date{ font-size: 3.5rem; }
    .sec4_btn{ padding: 8px 14px; font-size: 1.3rem; }
    .sec4_month_num{ font-size: 2rem; }
    .sec4_month_name{ font-size: 1.4rem; }
    .sec4_month_btn{ padding: 7px 12px; }
    /* session5 */
    .sec5_card_list{ grid-template-columns: repeat(2, 150px); }
    .sec5_card_link{ width: 150px; height: 125px; }
    .sec5_video_link{ width: 460px; height: 268px; }
    .sec5_office_card{ width: 300px; height: 268px; }
    .sec5_office_footer{ height: 54px; }
    .sec5_office_body{ padding: 22px 26px 0; }
    .sec5_office_title{ font-size: 2rem; }
    .sec5_player_label{ font-size: 1.2rem; }
    /* session6 */
    .sec6_logo_card{ width: 195px; height: 65px; }
    .sec6_logo_card_wide{ width: 505px; height: 78px; }
}

@media (max-width: 1024px) {
    .main_kv{ margin-top: 0; height: 660px; }
    .kv_inner{ padding-top: 40px; padding-bottom: 210px; }
    .lp_before_input_id{ width: 160px; }
    .lp_before_input_pw{ width: 120px; }
    .s2_before_list{ gap: 28px; justify-content: center; }
    .s2_before_card{ width: 100px; height: 100px; border-radius: 24px; }
    .s2_before_ico{ width: 50px; height: 50px; }
    /* 퀵메뉴: 메뉴 패널 숨김 + 챗봇도 숨김 (2026-06-18) — 모바일에서 mob_bottom_nav 사용으로 챗봇 불필요 */
    .quick_wrap{ top: auto; transform: none; bottom: 20px; right: 16px; gap: 8px; }
    .quick_menu{ display: none; }
    .quick_chatbot{ display: none; }
    .kv_title{ font-size: 4.2rem; }
    .kv_desc{ font-size: 1.6rem; margin-top: 28px; }
    .kv_controls{ margin-top: 40px; }
    .kv_scroll_down{ display: none; }
    .kv_login_panel{ width: 100%; height: auto; padding: 24px 30px; border-radius: 0; gap: 20px; background: #1d369a; }
    .lp_card{ width: 110px; height: auto; padding: 12px; }
    .lp_logo{ width: 60px; height: 31px; }
    .lp_badge_wrap,
    .lp_badge{ width: 76px; height: 76px; }
    .lp_info{ flex: 1; min-width: 0; }
    .lp_btns{ align-self: center; }
    .lp_name_bold{ font-size: 2rem; }
    .lp_name_suffix{ font-size: 1.7rem; }
    .lp_list_item{ font-size: 1.3rem; }
    .lp_list_item:nth-child(3){ margin-top: 6px; }
    /* session3 */
    .main_session3{ padding: 60px 0; }
    .sec3_inner{ flex-direction: column; gap: 48px; }
    .sec3_left{ width: 100%; }
    .sec3_right{ width: 100%; }
    .alarm_swiper{ width: 100%; }
    /* session2 */
    .s2_inner{ padding: 32px 16px 48px; }
    .s2_tab_wrap{ flex-direction: column; align-items: flex-start; gap: 12px; margin-bottom: 28px; }
    .s2_tab_desc{ position: static; transform: none; }
    .s2_tab_btn,
    .s2_tab_divider{ font-size: 2.8rem; }
    /* 모바일 — 탭별로 분리 (바로가기 vs 즐겨찾기 마크업 다름, 2026-07-01) */

    /* [즐겨찾기 탭] 0시간 카드 + 메뉴 7개 통합 4x2 grid — display:contents 로 menu_item 들을 grid 셀에 직접 배치 */
    #s2PanelFavorite .s2_card_list{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 10px; align-items: start; }
    #s2PanelFavorite .s2_status_wrap{ flex-direction: column; gap: 8px; align-items: center; width: 100%; min-width: 0; }
    #s2PanelFavorite .s2_status_label{ margin-top: 0; font-size: 1.2rem; text-align: center; line-height: 1.3; word-break: keep-all; }
    #s2PanelFavorite .s2_menu_list{ display: contents; margin-left: 0; }
    .s2_menu_item{ width: 100%; min-width: 0; }
    .s2_menu_card{ width: 100%; max-width: 100%; box-sizing: border-box; }
    .s2_menu_label{
        width: 100%;
        word-break: keep-all;
        overflow-wrap: anywhere;
        white-space: normal;
        line-height: 1.3;
        text-align: center;
        margin-top: 8px;
        min-height: 2.6em;
        font-size: 1.2rem;
    }

    /* [바로가기 탭] 8개 아이콘 4x2 grid (s2_before_list 자체가 grid 컨테이너) */
    #s2PanelShortcut .s2_card_list{ display: block; }
    .s2_before_list{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 10px; padding: 0; margin: 0; list-style: none; }
    .s2_before_item{ width: 100%; min-width: 0; }
    .s2_before_link{ display: flex; flex-direction: column; align-items: center; width: 100%; }
    .s2_before_card{ width: 100%; max-width: 100%; box-sizing: border-box; }
    .s2_before_label{
        width: 100%;
        word-break: keep-all;
        overflow-wrap: anywhere;
        white-space: normal;
        line-height: 1.3;
        text-align: center;
        margin-top: 8px;
        min-height: 2.6em;
        font-size: 1.2rem;
    }
    /* session4 */
    .main_session4{ padding: 60px 0; }
    .sec4_top{ flex-wrap: wrap; gap: 16px; }
    .sec4_title{ font-size: 2.8rem; }
    .sec4_nav{ position: static; transform: none; order: 3; width: 100%; justify-content: center; gap: 30px; }
    .sec4_nav_date{ font-size: 3rem; }
    .sec4_btn_group{ margin-left: auto; }
    .sec4_month_bar{ overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; padding: 0 10px; }
    .sec4_month_list{ width: max-content; justify-content: flex-start; height: 60px; }
    .sec4_body{ flex-direction: column; }
    .sec4_left{ width: 100%; }
    .sec4_calendar{ width: 100%; }
    .sec4_cal_days{ width: 100%; }
    .sec4_right{ width: 100%; height: auto !important; margin-top: 20px; align-self: auto; }
    .sec4_list{ max-height: 360px !important; }
    .sec4_legend{ margin-bottom: 12px; }
    /* 모바일 일정 목록 카드 — 교육사이트 동등 (2026-07-01)
       기존: 가로 [배지 | 제목 | 우측 상태]
       변경: 세로 [상단 배지/상태 한 줄] → [기관명] → [제목] → [날짜/장소] */
    .sec4_list_item{ flex-direction: column; align-items: stretch; gap: 6px; padding: 14px 12px; background:#fff; border:1px solid #e5e7eb; border-radius: 10px; margin-bottom: 10px; position: relative; }
    .sec4_list_item:last-child{ border:1px solid #e5e7eb; padding-bottom: 14px; }
    .sec4_item_main{ flex-direction: column; align-items: stretch; gap: 6px; width: 100%; }
    .sec4_item_right{ position: absolute; top: 14px; right: 14px; flex-direction: row; gap: 6px; align-items: center; }
    .sec4_item_type{ display: none; }
    .sec4_item_info{ width: 100%; }
    .sec4_item_title{ white-space: normal; overflow: visible; text-overflow: initial; }
    .sec4_item_org{ display: block; font-size: 1.3rem; color: #6b7280; margin-bottom: 4px; line-height: 1.3; }
    .sec4_item_name{ display: block; margin-left: 0; font-size: 1.5rem; font-weight: 600; line-height: 1.4; color: #1a202c; word-break: keep-all; }
    .sec4_item_meta{ font-size: 1.3rem; color: #6b7280; margin-top: 4px; }
    .sec4_badge{ align-self: flex-start; }
    /* session5 */
    .main_session5{ padding: 60px 0; }
    .sec5_inner{ flex-wrap: wrap; gap: 30px; }
    .sec5_left{ width: 100%; }
    .sec5_card_list{ grid-template-columns: repeat(4, 1fr); gap: 16px; }
    .sec5_card_link{ width: 100%; height: 130px; }
    .sec5_video{ margin-left: 0; width: 100%; }
    .sec5_video_link{ width: 100%; height: 300px; }
    .sec5_right{ margin-left: 0; width: 100%; }
    .sec5_office_card{ width: 100%; height: auto; }
    .sec5_office_body{ padding: 24px 32px 0; }
    .sec5_office_title{ font-size: 2.2rem; }
    .sec5_office_footer{ height: 52px; }
    .sec5_player_wrap{ flex: 1; }
    .sec5_player_progress{ flex: 1; }
    .sec6_inner{ flex-direction: column; gap: 20px; }
    .sec6_swiper{ width: 100%; }
    .sec6_row_wrap{ gap: 10px; }
    .sec6_logo_card{ flex: 1; width: auto; height: 60px; }
    .sec6_logo_card_wide{ flex: 1; width: auto; height: 75px; }
    /* favorite modal */
    .fav_modal_box{ width: min(560px, calc(100vw - 24px)); height: min(640px, calc(100vh - 48px)); }
}

@media (max-width: 768px) {
    .main_kv{ height: 580px; }
    .kv_inner{ padding-top: 30px; padding-bottom: 195px; }
    .kv_title{ font-size: 3.2rem; }
    .kv_desc{ margin-top: 20px; font-size: 1.5rem; }
    .kv_controls{ margin-top: 30px; }
    /* SCROLL DOWN: 768px부터 숨김 */
    .kv_scroll_down{ display: none; }
    .kv_login_panel{ position: absolute; bottom: 0; width: 100%; height: auto; padding: 20px 24px; border-radius: 0; gap: 16px; background: #1d369a; }
    .lp_card{ display: none; }
    .lp_info{ flex: 1; min-width: 0; }
    .lp_btns{ flex-direction: column; align-self: center; gap: 8px; }
    .lp_name_bold{ font-size: 1.9rem; }
    .lp_name_suffix{ font-size: 1.6rem; }
    .lp_list_item{ font-size: 1.3rem; }
    /* session3 */
    .main_session3{ padding: 48px 0; }
    .sec3_tab_btn{ font-size: 1.9rem; padding: 7px 12px; }
    .sec3_alarm_title{ font-size: 2.8rem; }
    .sec3_card{ height: 230px; padding: 26px 22px; }
    .sec3_card_title{ font-size: 1.8rem; }
    .sec3_card_desc{ font-size: 1.5rem; margin-top: 14px; }
    .sec3_card_date{ font-size: 1.3rem; padding-top: 14px; }
    /* session2 */
    .s2_inner{ padding: 28px 16px 40px; }
    .s2_tab_btn,
    .s2_tab_divider{ font-size: 2rem; }
    .s2_tab_desc{ font-size: 1.3rem; }
    .s2_status_card,
    .s2_menu_card{ width: 72px; height: 72px; border-radius: 18px; }
    .s2_status_num{ font-size: 3.2rem; }
    .s2_status_unit{ font-size: 1.5rem; }
    .s2_menu_ico{ width: 24px; height: 24px; }
    .s2_menu_label{ font-size: 1.3rem; margin-top: 10px; }
    .s2_status_label{ font-size: 1.4rem; }
    .s2_close_btn{ width: 200px; height: 32px; }
    .s2_close_text{ font-size: 1.3rem; }
    /* 2026-06-30: 모바일 바로가기 아이콘 4열 × 2행 그리드 (여백 축소) */
    .s2_before_list{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px 4px; justify-content: stretch; justify-items: center; }
    .s2_before_item{ width: 100%; display: flex; justify-content: center; }
    /* session4 */
    .main_session4{ padding: 48px 0; }
    .sec4_top{ display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0; row-gap: 14px; }
    .sec4_top > .sec4_title{ text-align: left; flex: 1; order: 1; font-size: 2.4rem; }
    .sec4_nav{ position: relative; left: auto; transform: none; order: 4; gap: 16px; flex: none; justify-content: center; width: 100%; }
    .sec4_nav_date{ font-size: 2.6rem; }
    .sec4_nav_btn{ width: 34px; height: 34px; }
    .sec4_btn_group{ order: 2; display: flex; gap: 6px; width: 100%; justify-content: flex-end; margin-left: 0; }
    .sec4_btn{ padding: 7px 12px; font-size: 1.2rem; }
    .sec4_mob_toggle{ display: flex; order: 3; width: 100%; background: #bed2e3; border-radius: 25px; overflow: hidden; }
    .sec4_month_bar{ display: none; }
    .sec4_legend{ display: none; }
    .sec4_body{ flex-direction: column; gap: 0; margin-top: 20px; }
    .sec4_left{ width: 100%; display: none; }
    .sec4_left.is_show{ display: block; }
    .sec4_right{ width: 100%; margin-top: 0; box-shadow: none; padding: 0; background: transparent; }
    .sec4_right.is_hide{ display: none; }
    .sec4_list{ max-height: none; padding-right: 0; }
    .sec4_calendar{ width: 100%; box-sizing: border-box; padding: 20px; }
    .sec4_cal_days{ width: 100%; }
    .sec4_list_item{ gap: 12px; padding: 16px !important; align-items: flex-start; background: #fff; border: 1px solid #e8e8e8 !important; border-radius: 12px; margin-bottom: 10px; }
    .sec4_list_item:last-child{ margin-bottom: 0; }
    .sec4_item_main{ display: block; }
    .sec4_badge{ display: inline-flex; padding: 2px 8px; font-size: 1.3rem; margin-bottom: 6px; }
    .sec4_item_title{ white-space: normal; }
    .sec4_item_org{ display: block; font-size: 1.4rem; color: #888; }
    .sec4_item_name{ display: -webkit-box; font-size: 1.6rem; margin-left: 0; margin-top: 2px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
    .sec4_item_meta{ gap: 5px; margin-top: 6px; flex-wrap: wrap; }
    .sec4_meta_text{ font-size: 1.3rem; }
    .sec4_item_right{ gap: 5px; }
    .sec4_item_type{ font-size: 1.2rem; }
    .sec4_status{ width: 46px; font-size: 1.2rem; padding: 4px 0; }
    /* session5 */
    .main_session5{ padding: 48px 0; }
    .sec5_card_list{ grid-template-columns: repeat(4, 1fr); gap: 14px; }
    .sec5_card_link{ height: 120px; }
    .sec5_card_text{ font-size: 1.5rem; margin-top: 12px; }
    .sec5_video_link{ height: 260px; }
    .sec5_office_body{ padding: 20px 24px 0; }
    .sec5_office_title{ font-size: 2rem; }
    .sec5_contact_text{ font-size: 1.5rem; }
    .sec5_sns_title{ font-size: 1.5rem; }
    .sec5_sns_list li a img{ width: 30px; height: 30px; }
    .sec5_office_footer{ height: 48px; padding: 0 12px; gap: 6px; }
    .sec5_player_label{ font-size: 1.2rem; }
    .sec5_player_wrap{ flex: 1; height: 30px; padding: 0 8px; gap: 4px; }
    .sec5_player_time{ font-size: 1rem; }
    .sec5_player_progress{ flex: 1; }
    /* session6 */
    .main_session6{ padding: 30px 0; }
    .sec6_logo_card{ height: 50px; }
    .sec6_logo_card_wide{ height: 65px; }
    .sec6_row_wrap{ gap: 8px; }
    .sec6_nav{ gap: 6px; }
    .sec6_nav_btn{ width: 32px; height: 32px; }
    .sec6_nav_btn img{/* width: 14px; *//* height: auto; */}
    /* favorite modal */
    .fav_modal_box{ width: calc(100vw - 16px); height: calc(100vh - 32px); border-radius: 12px; }
    .fav_modal_head{ padding: 14px 16px; }
    .fav_modal_tit{ font-size: 1.6rem; }
    .fav_modal_search,
    .fav_modal_tabs,
    .fav_modal_body,
    .fav_modal_actions{ padding-left: 16px; padding-right: 16px; }
}

@media (max-width: 480px) {
    .main_kv{ height: 560px; }
    .kv_inner{ padding-top: 20px; padding-bottom: 260px; }
    .lp_before_row{ flex-wrap: wrap; gap: 6px; }
    .lp_before_input_id{ width: calc(100% - 98px); flex: 1; }
    .lp_before_input_pw{ width: 100%; flex: none; }
    .lp_before_btn{ width: 90px; flex-shrink: 0; }
    /* 2026-06-30: 작은 모바일도 4열 그리드 유지 + 카드/아이콘 축소 (여백 축소) */
    .s2_before_list{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px 2px; }
    .s2_before_card{ width: 64px; height: 64px; border-radius: 16px; }
    .s2_before_ico{ width: 32px; height: 32px; }
    .s2_before_label{ font-size: 1.2rem; margin-top: 8px; text-align: center; word-break: keep-all; line-height: 1.3; }
    .kv_title{ font-size: 2.6rem; line-height: 1.3; }
    .kv_desc{ font-size: 1.4rem; margin-top: 16px; }
    .kv_controls{ margin-top: 24px; }
    .kv_pager{ gap: 8px; }
    .kv_count{ font-size: 1.5rem; }
    .kv_login_panel{ flex-direction: column; align-items: flex-start; padding: 16px; gap: 12px; }
    .lp_name_wrap{ margin-bottom: 6px; }
    .lp_name_bold{ font-size: 1.8rem; }
    .lp_name_suffix{ font-size: 1.5rem; }
    .lp_list_item{ font-size: 1.2rem; }
    .lp_list_item:nth-child(3){ margin-top: 4px; }
    .lp_btns{ flex-direction: row; align-self: stretch; width: 100%; gap: 8px; }
    .lp_btn{ flex: 1; }
    /* session3 */
    .main_session3{ padding: 40px 0; }
    .sec3_tab_btn{ font-size: 1.7rem; padding: 6px 10px; }
    .sec3_alarm_title{ font-size: 2.4rem; }
    .sec3_card_grid{ grid-template-columns: 1fr; }
    .sec3_card{ height: auto; padding: 22px 18px; }
    .sec3_card_desc{ margin-top: 12px; }
    .sec3_card_date{ padding-top: 12px; }
    /* session2 */
    .s2_inner{ padding: 24px 16px 36px; }
    .s2_tab_btn,
    .s2_tab_divider{ font-size: 2rem; }
    .s2_status_card,
    .s2_menu_card{ width: 70px; height: 70px; border-radius: 16px; }
    .s2_status_num{ font-size: 3rem; }
    .s2_status_unit{ font-size: 1.5rem; }
    .s2_menu_ico{ width: 24px; height: 24px; }
    .s2_menu_label{ font-size: 1.3rem; margin-top: 10px; }
    .s2_menu_list{ gap: 10px; }
    .s2_close_btn{ width: 180px; height: 32px; }
    .s2_close_text{ font-size: 1.3rem; }
    /* session4 */
    .main_session4{ padding: 40px 0; }
    .sec4_title{ font-size: 2rem; }
    .sec4_nav{ gap: 16px; }
    .sec4_nav_date{ font-size: 2.2rem; }
    .sec4_nav_btn{ width: 32px; height: 32px; }
    .sec4_btn{ flex: 1; justify-content: center; font-size: 1.2rem; padding: 8px 10px; }
    .sec4_calendar{ padding: 15px; min-height: inherit; }
    .sec4_cal_date{ width: 32px; height: 32px; font-size: 1.4rem; }
    .sec4_cal_days li{ font-size: 1.4rem; }
    .sec4_item_name{ font-size: 1.5rem; }
    .sec4_item_org{ font-size: 1.3rem; }
    /* session5 */
    .main_session5{ padding: 40px 0; }
    .sec5_card_list{ grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .sec5_card_link{ height: 120px; }
    .sec5_card_text{ font-size: 1.4rem; margin-top: 12px; }
    .sec5_video_link{ height: 220px; }
    .sec5_video_play{ width: 56px; height: 56px; }
    .sec5_office_body{ padding: 16px 18px 0; }
    .sec5_office_title{ font-size: 1.8rem; }
    .sec5_contact_text{ font-size: 1.4rem; }
    .sec5_sns_wrap{ padding:10px; margin-top: 12px; }
    .sec5_sns_title{ font-size: 1.4rem; }
    .sec5_sns_list{ gap: 6px; }
    .sec5_sns_list li a img{ width: 28px; height: 28px; }
    .sec5_office_footer{ height: 46px; padding: 0 10px; gap: 5px; }
    .sec5_player_label{ font-size: 1.1rem; }
    .sec5_player_wrap{ flex: 1; height: 28px; padding: 0 10px; gap: 10px; border-radius: 14px; }
    .sec5_player_time{ font-size: 0.9rem; }
    .sec5_player_progress{ flex: 1; }
    /* session6 */
    .main_session6{ padding: 24px 0; }
    .sec6_logo_card{ flex: 1; width: auto; height: 46px; }
    .sec6_logo_card_wide{ flex: 1; width: auto; height: 52px; }
    .sec6_row_wrap{ gap: 6px; }
    .sec6_nav{ gap: 4px; }
    .sec6_nav_btn{ width: 28px; height: 28px; }
    .sec6_nav_btn img{/* width: 12px; *//* height: auto; */}
    /* favorite modal */
    .fav_modal_box{ width: calc(100vw - 12px); height: calc(100vh - 24px); border-radius: 10px; }
    .fav_modal_head{ padding: 12px 14px; }
    .fav_modal_tit{ font-size: 1.5rem; }
    .fav_modal_input{ height: 36px; font-size: 1.3rem; }
    .fav_modal_tab{ font-size: 1.2rem; padding: 5px 10px; }
    .fav_link{ font-size: 1.3rem; padding: 7px 10px; }
    .fav_modal_btn{ font-size: 1.3rem; padding: 7px 12px; }
}

@media (max-width: 1024px) {
    .header_mem_ico{ background-image: url(../images/common/header_member_blk_icon.png); }
    body.is_hero .header_util{ background: #f9f9f9; border-bottom-color: #e6e9ef; }
    body.is_hero .header_gnb{ background: #fff; border-bottom-color: #e6e6e6; }
    body.is_hero .header_util_link,
    body.is_hero .header_member_link{ color: #333; }
    body.is_hero .gnb_link{ color: #333; }
    body.is_hero .header_util_link + .header_util_link::before{ background: #d9dce3; }
    .top_banner_title{ font-size: 2.2rem; }
    .top_banner_desc{ font-size: 1.4rem; }
    .top_banner_badge{ font-size: 1.4rem; width: 58px; height: 30px; }
    .top_banner_img{ display: none; }
}

@media (max-width: 768px) {
    .top_banner_inner{ height: auto; min-height: 80px; padding: 10px 16px; flex-wrap: wrap; gap: 6px; justify-content: space-between; }
    .top_banner_swiper{ width: 100%; height: auto; flex: none; order: 1; }
    .top_banner_swiper .swiper-wrapper,
    .top_banner_swiper .swiper-slide{ height: auto; }
    .top_banner_item{ justify-content: flex-start; gap: 10px; }
    .top_banner_title{ font-size: 1.8rem; }
    .top_banner_desc{ font-size: 1.3rem; }
    /* 모바일에서 right 영역 flex 흐름으로 복귀 */
    .top_banner_right{ position: static; transform: none; flex-direction: row; align-items: center; width: 100%; order: 2; justify-content: space-between; background: transparent; }
    .top_banner_dismiss{ margin-top: 0; }
}

@media (max-width: 480px) {
    .top_banner_badge{ display: none; }
    .top_banner_title{ font-size: 1.6rem; }
    .top_banner_desc{ font-size: 1.2rem; }
    .top_banner_dismiss_label{ font-size: 1.2rem; }
}

/* ================================
   회원가입 반려 팝업 (jtm_popup)
================================ */
.jtm_popup_dim{ position:fixed; inset:0; background:rgba(0,0,0,0.6); z-index:9000; }
.jtm_popup_wrap{ position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); width:600px; max-width:calc(100vw - 32px); background:#fff; border-radius:20px; padding:40px; box-sizing:border-box; z-index:9001; }
.jtm_popup_close{ position:absolute; top:-60px; right:0; width:50px; height:50px; background:rgba(0,0,0,0.7); border:1px solid #000; border-radius:50%; cursor:pointer; box-sizing:border-box; }
.jtm_popup_close::before,
.jtm_popup_close::after{ content:""; position:absolute; top:50%; left:50%; width:20px; height:2px; background:#fff; border-radius:1px; }
.jtm_popup_close::before{ transform:translate(-50%,-50%) rotate(45deg); }
.jtm_popup_close::after{ transform:translate(-50%,-50%) rotate(-45deg); }
.jtm_popup_inner{ display:flex; flex-direction:column; align-items:center; }
.jtm_popup_icon{ display:block; }
.jtm_popup_icon img{ display:block; }
.jtm_popup_tit{ margin-top:10px; font-size:3rem; font-weight:700; color:#222222; text-align:center; }
.jtm_popup_desc{ margin-top:15px; font-size:1.8rem; color:#444444; text-align:center; }
.jtm_popup_box{ margin-top:30px; width:100%; background:#f3f3f3; border-radius:15px; padding:30px; box-sizing:border-box; }
.jtm_popup_dl{ display:flex; flex-direction:column; gap:16px; }
.jtm_popup_row{ display:flex; align-items:center; gap:10px; font-size:1.7rem; }
.jtm_popup_dt{ position:relative; padding-left:10px; font-size:1.7rem; color:#222; white-space:nowrap; flex-shrink:0; }
.jtm_popup_dt::before{ content:""; position:absolute; left:0; top:50%; width:3px; height:3px; background:#222222; border-radius:50%; transform:translateY(-50%); }
.jtm_popup_dd{ font-size:1.7rem; }
.jtm_popup_dd_blue{ color:#2a4ea4; }
.jtm_popup_row_file{ align-items:flex-start; }
.jtm_popup_row_file .jtm_popup_dd{ flex:1; min-width:0; }
.jtm_file_wrap{ display:flex; flex-direction:column; gap:10px; }
.jtm_file_input_group{ display:flex; align-items:center; gap:5px; }
.jtm_file_text{ width:270px; height:38px; border:1px solid #cdcdcd; border-radius:5px; padding:0 12px; font-size:1.5rem; font-weight:200; color:#666666; box-sizing:border-box; background:#fff; outline:none; }
.jtm_file_btn{ display:inline-flex; align-items:center; justify-content:center; width:94px; height:38px; border:1px solid #3b5cab; border-radius:5px; font-size:1.6rem; color:#3b5cab; cursor:pointer; box-sizing:border-box; white-space:nowrap; flex-shrink:0; }
.jtm_file_btn:hover{ background:#3b5cab; color:#fff; }
.jtm_file_hidden{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.jtm_file_name{ font-size:1.5rem; font-weight:200; color:#444; }
.jtm_popup_submit{ display:flex; align-items:center; justify-content:center; margin-top:30px; width:150px; height:50px; background:#2a4ea4; border-radius:7px; font-size:1.8rem; color:#fff; text-decoration:none; }
.jtm_popup_submit:hover{ background:#1f3d8a; }
.jtm_popup_notice{ display:flex; align-items:center; gap:6px; margin-top:30px; font-size:1.6rem; font-weight:200; color:#444444; text-align:center; }
.jtm_popup_notice_ico{ display:block; flex-shrink:0; }
@media (max-width:640px){
    .jtm_popup_wrap{ padding:30px 20px; }
    .jtm_popup_close{ top:-54px; width:44px; height:44px; }
    .jtm_popup_tit{ font-size:2.4rem; }
    .jtm_popup_desc{ font-size:1.6rem; }
    .jtm_popup_box{ padding:20px; }
    .jtm_popup_row{ flex-direction:column; align-items:flex-start; gap:8px; }
    .jtm_popup_row_file{ flex-direction:column; }
    .jtm_file_input_group{ flex-wrap:wrap; width:100%; }
    .jtm_file_text{ width:calc(100% - 99px); }
    .jtm_popup_notice{ font-size:1.4rem; flex-wrap:wrap; }
}
@media (max-width:400px){
    .jtm_file_text{ width:100%; }
    .jtm_file_btn{ width:100%; }
    .jtm_file_input_group{ gap:8px; }
}

/* 모바일 하단 네비게이션 (앱 스타일) — 교육사이트 mob_bottom_nav 이식 (2026-06-18) */
.mob_bottom_nav{ display:none; }
@media (max-width: 480px){
    .mob_bottom_nav{ display:flex; position:fixed; bottom:0; left:0; right:0; height:70px; background:radial-gradient(circle 36px at 50% 0%, transparent 36px, #fff 37px); filter:drop-shadow(0 -3px 8px rgba(0,0,0,0.12)); z-index:602; align-items:center; }
    /* 2026-06-30: 라벨 위치 baseline 통일 — 모든 항목 라벨을 nav 하단 동일 위치에 고정 */
    .mob_nav_item{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; text-decoration:none; height:100%; position:relative; }
    .mob_nav_ico{ object-fit:contain; }
    .mob_nav_txt{ font-size:1.4rem; color:#6c6e77; line-height:1; position:absolute; bottom:10px; left:0; right:0; text-align:center; }
    .site_footer { padding-bottom: 100px; }

    /* 가운데 강조 아이템 — QR 라벨도 동일 baseline 자동 적용 (margin-top 제거) */
    .mob_nav_qr_item{ position:relative; }
    .mob_nav_qr_item .mob_nav_txt{ margin-top:0; }

    /* 강조 원 버튼 — nav 위로 솟아오름 */
    .mob_qr_btn{ width:60px; height:60px; border-radius:50%; display:flex; align-items:center; justify-content:center; position:absolute; top:-20px; left:50%; transform:translateX(-50%); background:#003fbc; box-shadow:0 4px 16px rgba(0,63,188,0.4); overflow:hidden; }
    .mob_qr_btn::after{ content:''; position:absolute; inset:0; border-radius:50%; background:linear-gradient(-54deg, rgba(0,131,255,0.45) 0%, transparent 100%); }
    .mob_qr_btn img{ width:28px; height:28px; object-fit:contain; position:relative; z-index:1; filter:brightness(0) invert(1); }

    /* 본문 하단 여백 — 메인페이지 컨텐츠 가림 방지 */
    body.is_main .main_content{ padding-bottom:70px; }
}

/* 모바일 QR 모달 — 교육사이트 동일 구조 (2026-06-30 재구성) */
.mob_qr_overlay{ display:none; position:fixed; inset:0; background:rgba(0,0,0,0.2); z-index:600; }
.mob_qr_overlay.is_open{ display:block; }
.mob_qr_modal{ position:fixed; bottom:0; left:0; right:0; background:#daebff; border-radius:30px 30px 0 0; z-index:1100; padding:0 20px 30px; transform:translateY(100%); transition:transform 0.35s cubic-bezier(0.4,0,0.2,1); }
.mob_qr_modal.is_open{ transform:translateY(0); }
/* 하단 토스트 네비(70px)에 가려지지 않도록 모달 하단 여백 추가 — 교육사이트 동등 (2026-07-02) */
@media (max-width: 480px){
    .mob_qr_modal{ padding-bottom:calc(30px + 70px); }
}

/* 닫기 버튼 */
.mob_qr_close_btn{ display:flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:50%; background:#fff; box-shadow:0 4px 12px rgba(0,0,0,0.15); position:absolute; top:-20px; left:50%; transform:translateX(-50%); text-decoration:none; opacity:0; pointer-events:none; transition:opacity 0.2s; }
.mob_qr_modal.is_open .mob_qr_close_btn{ opacity:1; pointer-events:auto; }
.mob_qr_close_btn img{ width:16px; height:16px; object-fit:contain; }

/* QR 코드 영역 (1순위 — 모달 상단) — 교육사이트 크기 동등 (2026-07-02) */
.mob_qr_code_wrap{ width:340px; max-width:100%; height:257px; margin:30px auto 0; background:#fff; border-radius:20px; box-shadow:0 4px 16px rgba(0,0,0,0.08); box-sizing:border-box; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.mob_qr_code_wrap img{ display:block; }
.mob_qr_code_img{ width:100%; max-width:200px; height:auto; }
.mob_qr_code_info{ display:flex; align-items:center; justify-content:center; gap:6px; margin-top:10px; }
.mob_qr_code_label{ font-size:1.5rem; color:#333; }
.mob_qr_timer{ font-size:1.6rem; color:#ff0000; font-weight:600; font-variant-numeric:tabular-nums; }

/* 프로필 영역 (2순위) — QR ↔ 이름 간격 최소화 (2026-07-02) */
.mob_qr_profile{ display:flex; flex-direction:column; align-items:center; margin-top:0; }
.mob_qr_profile_top{ display:flex; align-items:center; gap:8px; }
.mob_qr_profile_top img{ width:40px; height:40px; object-fit:contain; }
.mob_qr_name{ font-size:2.2rem; color:#111; font-weight:700; }
/* 소속/면허번호 — 배지+값 좌측 정렬 (2026-07-02 교육사이트 동기화)
   배지 배경 투명 → 모달 하늘색(#daebff) 노출, 텍스트/테두리 파란색 */
.mob_qr_belong{ display:flex; align-items:center; gap:8px; margin-top:10px; width:100%; padding:0 10px; box-sizing:border-box; }
.mob_qr_license{ display:flex; align-items:center; gap:8px; margin-top:6px; width:100%; padding:0 10px; box-sizing:border-box; }
.mob_qr_info_badge{ display:inline-flex; align-items:center; justify-content:center; font-size:1.4rem; min-width:70px; color:#022d84; background:transparent; border-radius:11px; border:1px solid #4a68a5; padding:2px 8px; flex-shrink:0; }
.mob_qr_info_val{ font-size:1.5rem; color:#333; font-weight:500; word-break:break-all; }

/* 출결 상태 영역 (3순위 — 입실완료 헤더 + 신청평점 + 남은이수시간) — 교육사이트 크기 동등 (2026-07-02) */
.mob_qr_status{ width:340px; max-width:100%; margin:20px auto 0; border-radius:15px; overflow:hidden; border:1px solid #bfd6f2; }
.mob_qr_status_header{ background:#f0f7ff; border-top-left-radius:15px; border-top-right-radius:15px; padding:12px 0; text-align:center; }
.mob_qr_status_title{ font-size:2rem; color:#171f49; font-weight:700; }
.mob_qr_status_body{ background:#fff; padding:13px 0; display:flex; flex-direction:column; align-items:center; }
.mob_qr_badge{ display:flex; align-items:center; gap:8px; background:#fcefdf; border-radius:15px; padding:6px 16px; }
.mob_qr_badge_label{ font-size:1.6rem; color:#333; }
.mob_qr_badge_score{ font-size:1.6rem; color:#222; font-weight:700; }
.mob_qr_remain{ display:flex; align-items:center; gap:6px; margin-top:10px; }
.mob_qr_remain img{ width:18px; height:18px; object-fit:contain; }
.mob_qr_remain_txt{ font-size:1.5rem; color:#1f274f; }
.mob_qr_remain_time{ font-size:2.2rem; color:#ff0000; font-weight:700; }

/* ============================================================
   퀵메뉴 (2026-06-27 교육사이트 quick_wrap_before 구조 이식)
   ============================================================ */
.quick_wrap_before{ position: fixed; right: 20px; top: 60%; transform: translateY(-50%); z-index: 150; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.quick_menu_before{ display: flex; flex-direction: column; gap: 10px; }
.qb_item{ display: flex; flex-direction: row-reverse; align-items: center; height: 60px; cursor: pointer; text-decoration: none; position: relative; width: 60px; }
.qb_icon_wrap{ width: 60px; height: 60px; border-radius: 50%; background: #fff; box-shadow: 0 4px 14px rgba(0,0,0,0.15); display: flex; align-items: center; justify-content: center; flex-shrink: 0; position: relative; z-index: 1; transition: background 0.2s, box-shadow 0.2s; text-decoration: none; }
.qb_icon_wrap img{ width: 26px; height: 26px; filter: brightness(0) saturate(100%) invert(38%) sepia(13%) saturate(532%) hue-rotate(182deg) brightness(97%) contrast(89%); transition: filter 0.2s; display: block; }
.qb_label{ position: absolute; right: 30px; top: 0; width: 0; height: 60px; overflow: hidden; background: #f4f4f4; display: flex; align-items: center; justify-content: center; white-space: nowrap; border-radius: 30px 0 0 30px; z-index: 0; transition: width 0.28s cubic-bezier(0.4,0,0.2,1), background 0.2s; }
.qb_label span{ font-size: 1.4rem; color: #111; font-weight: 600; padding: 0 22px 0 16px; transition: color 0.2s; white-space: nowrap; }
.qb_item:hover .qb_label, .qb_item.is_active .qb_label{ width: 160px; background: #183879; }
.qb_item:hover .qb_label span, .qb_item.is_active .qb_label span{ color: #fff; }
.qb_item:hover .qb_icon_wrap, .qb_item.is_active .qb_icon_wrap{ background: #003fbc; box-shadow: 0 4px 14px rgba(0,63,188,0.3); }
.qb_item:hover .qb_icon_wrap img, .qb_item.is_active .qb_icon_wrap img{ filter: brightness(0) invert(1); }
.qb_top_btn{ width: 60px; height: 60px; border-radius: 50%; background: #fff; box-shadow: 0 4px 14px rgba(0,0,0,0.15); display: flex; flex-direction: column; align-items: center; justify-content: center; text-decoration: none; transition: background 0.2s, box-shadow 0.2s, transform 0.2s; gap: 3px; flex-shrink: 0; }
.qb_top_btn svg{ width: 20px; height: 20px; stroke: #555f72; fill: none; transition: stroke 0.2s; }
.qb_top_btn span{ font-size: 1.1rem; font-weight: 700; color: #555f72; line-height: 1; transition: color 0.2s; }
.qb_top_btn:hover{ background: #003fbc; box-shadow: 0 6px 20px rgba(0,63,188,0.3); transform: translateY(-2px); }
.qb_top_btn:hover svg{ stroke: #fff; }
.qb_top_btn:hover span{ color: #fff; }
/* 모바일에서는 퀵메뉴 숨김 */
@media (max-width: 1024px) {
    .quick_wrap_before{ display: none !important; }
}