@charset "UTF-8";

/* ========================================
   헤더 스타일
======================================== */
.header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 100px;
    background: #fff; /* 서브페이지 기본 배경: 흰색 배경 */
    z-index: var(--z-fixed);
    transition: background-color 0.3s ease-in-out,
    border-bottom-color 0.3s ease-in-out; /* 트랜지션 추가 */
    border-bottom: 1px solid #ccc; /* 서브페이지 기본 테두리 */
    box-sizing: border-box;
    -webkit-transform: translateZ(
            0
    ); /* iOS Safari fixed 위치 안정화를 위한 GPU 가속 */
    transform: translateZ(0);
}
/* 메인 페이지에서만 헤더 초기 상태를 투명하게 설정 */
.main-page .header:not(.is-scrolled) {
    background: transparent;
    border-bottom: 1px solid transparent;
}
/* 스크롤 시 헤더 스타일 변경 */
.header.is-scrolled {
    background: #fff;
    border-bottom: 1px solid #ccc;
}
/* GNB 메뉴 호버/활성 시 헤더 스타일 변경 (흰 배경, 검은 글씨) */
.header.is-menu-open {
    background: #fff !important;
    border-bottom: 1px solid #ccc !important;
}
.header-inner {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
    margin: 0 auto;
    padding: 0 var(--content-padding-x); /* 헤더/컨텐츠 좌우 패딩 변수 사용 */
    height: 100px;
}

/* ========================================
   검색 레이어 스타일
======================================== */
/* 검색 배경 딤 처리 레이어 - iOS Safari fixed 위치 안정화 */
.search-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh; /* dvh 미지원 브라우저 fallback */
    height: 100dvh; /* 사파리 주소창 높이 변화 대응: dvh 사용 */
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.3s ease, visibility 0.3s ease; /* 크로스 브라우징 */
    transition: opacity 0.3s ease, visibility 0.3s ease;
    -webkit-transform: translateZ(
            0
    ); /* iOS Safari fixed 위치 안정화를 위한 GPU 가속 */
    transform: translateZ(0);
}

.search-backdrop[aria-hidden="false"] {
    opacity: 1;
    visibility: visible;
}
.search-layer {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 100px;
    background: #fff;
    z-index: 1000;
    border-bottom: 1px solid #ccc;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(-100%) translateZ(0); /* iOS Safari fixed 위치 안정화를 위한 GPU 가속 추가 */
    transform: translateY(-100%) translateZ(0);
    transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
}
.search-layer[aria-hidden="false"] {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0) translateZ(0); /* iOS Safari fixed 위치 안정화 유지 */
    transform: translateY(0) translateZ(0);
}
.search-layer__inner {
    position: relative;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%;
    width: 100%;
    margin: 0 auto;
    padding: 0 calc(100vw / 1920 * 200);
}
.search-layer__close {
    position: absolute;
    right: calc(100vw / 1920 * 200);
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    background: transparent;
    border: none;
    cursor: pointer;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 50%;
    transition: background-color 0.3s ease;
}
/* 태블릿/모바일 반응형 - 1280px 이하 */
@media (max-width: 1280px) {
    .search-layer {
        top: 0;
        height: 71px;
    }
}

/* 모바일 반응형 - 767px 이하 */
@media (max-width: 767px) {
    .search-layer__inner {
        width: 100%;
        max-width: 100%;
        padding: 10px 52px 10px 20px;
    }
    .search-layer__close {
        right: 17px;
        width: 20px;
        height: 20px;
    }
}

/* ========================================
   메인 콘텐츠 스타일
======================================== */
#main-content { padding-top: 100px; }
@media (max-width: 1280px) {
    #main-content {
        padding-top: 72px;
    }
}

/* ========================================
   푸터 스타일
======================================== */
.footer {
    background-color: #121212;
    font-size: 16px;
    color: var(--text-white, #ffffff);
}
.footer__inner {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
    margin: 0 auto;
    padding: 24px calc(100vw / 1920 * 200);
}
.footer-info__item {
    margin-bottom: 12px;
    font-size: 16px;
    color: var(--GRAY_03);
}
.footer-info.list{
    display:flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 0 16px;
    margin-bottom: 20px;
}
.footer-info.list li{position:relative; margin-bottom:0;}
.footer-info.list li:not(:last-child)::after {
    content: "";
    position: absolute;
    right:-9px;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 12px;
    background-color: var(--GRAY_03);
    opacity: 0.5;
 }
/* 주소 아이콘 (지도 핀) */
.footer-info__item.icon-address {
    background: url("../images/common/ico_location_gray.svg") no-repeat left
    top / 24px 24px;
    padding-left: 36px;
}
/* 이메일 아이콘 */
.footer-info__item.icon-email {
    display: flex;
    flex-wrap: wrap;
    background: url("../images/common/ico_mail_gray.svg") no-repeat left center /
    24px 24px;
    padding-left: 36px;
}
.footer-info__item address {
    font-style: normal;
    word-break: keep-all;
}
/* 행사의견보내기 */
.footer-info__item .text-link {
    position: relative;
    margin-left: 12px;
    padding-left: 12px;
    text-decoration: underline;
}
.footer-info__item .text-link::before {
    content: "";
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 12px;
    background-color: #fff;
}
/* 소셜 미디어 */
.footer .social-media {
    margin-top: 20px;
    margin-bottom: 20px;
}
.footer .social-links {
    display: flex;
    gap: 20px;
}
.footer .social-links a {
    display: inline-block;
    width: 32px;
    height: 32px;
    transition: all 0.2s ease;
}
.footer .social-links a img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
/* 저작권 정보 */
.footer .copyright {
    margin-bottom: 8px;
    font-size: 14px;
    color: var(--GRAY_03);
}
.footer .powered-by {
    display: flex;
    align-items: center;
    font-size: 14px;
    font-weight: 500;
    color: var(--GRAY_03);
}
.powered-by img {
    display: block;
    width: 82px;
    margin-left: 16px;
}
/* 로고 영역 */
.footer__inner-logo {
    flex-shrink: 0;
}
.footer__inner-logo img {
    width: 104px;
    height: auto;
}
/* 푸터 링크 리스트 */
.footer-link-list {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 12px;
    margin-bottom: 20px;
}
.footer-link-list a {
    flex: 0 0 auto;
    font-size: 16px;
    font-weight: 400;
    position: relative;
    padding-right: 12px;
    word-break: keep-all;
}
.footer-link-list a strong {
    font-weight: 700;
}
.footer-link-list a:last-child {
    padding-right: 0;
}
.footer-link-list a:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 12px;
    background-color: var(--GRAY_03);
    opacity: 0.5;
}
/* 반응형 디자인 */
@media (max-width: 768px) {
    .footer__inner {
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        padding: 24px 30px;
    }
    .footer__inner-logo {
        margin-top: 8px;
    }
    .footer__inner-logo img {
        width: 58px;
    }
    .footer-info__item {
        margin-bottom: 10px;
        font-size: 13px;
    }
    .footer-info__item.icon-address,
    .footer-info__item.icon-email {
        padding-left: 28px;
        justify-content: flex-start;
        background-size: 16px 16px;
        background-position: left 2px;
    }
    .footer-info__item.icon-email {
        flex-direction: column;
    }
    .footer-info__item .text-link {
        margin-left: 0;
        padding-left: 0;
    }
    .footer-info__item .text-link::before {
        display: none;
    }
    .footer-link-list {
        flex-direction: column;
        gap: 8px;
    }
    .footer-link-list a {
        font-size: 14px;
    }
    .footer-link-list a:not(:last-child)::after {
        display: none;
    }
    .footer .copyright {
        font-size: 13px;
    }
    .powered-by img {
        width: 64px;
    }
}

/* ========================================
   플로팅 소셜 리스트 스타일
======================================== */
.floating-social {
    position: absolute;
    top: 40dvh; /* 뷰포트 높이의 40% 기준으로 초기 위치 설정 */
    right: calc(100vw / 1920 * 58);
    z-index: 1000;
}
.floating-social__list {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 24px 16px;
    border-radius: 40px;
    background: var(--GRAY_01, #f5f5f5);
    box-shadow: 4px 4px 16px rgba(0, 0, 0, 0.12);
	opacity: 0.8;
	border: 1px solid rgba(0, 0, 0, 0.1);
	transition:all 0.4s; 
}
.floating-social__list:hover { opacity:1; }
.floating-social__item {
    list-style: none;
}
.floating-social__link {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease;
	opacity: 0.7;
}
.floating-social__link:hover {
    transform: scale(1.1);
	opacity:1; 
}
.floating-social__link img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: invert(1);
}
@media screen and (max-width: 1280px) {
    .floating-social {
        display: none;
    }
}

/* ========================================
   네비게이션 스타일
======================================== */
.navigation {
    position: relative;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
    gap: 80px;
}

/* ========================================
   로고 스타일
======================================== */
.wyd-logo {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}
.wyd-logo a {
    display: block;
}
.wyd-logo__image {
    display: block;
    width: 74px; /* 로고 가로 크기 */
    height: 84px;
    min-width: 74px; /* 사파리에서 크기 고정을 위한 최소 크기 설정 */
    min-height: 84px; /* 사파리에서 크기 고정을 위한 최소 크기 설정 */
    background-image: url("../images/common/logo_wyd_seoul.png"); /* 서브페이지 기본: 일반 로고 */
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transition: background-image 0.3s ease-in-out; /* 트랜지션 추가 */
    /* 사파리에서 background-image 변경 시 리렌더링 최적화 */
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    will-change: background-image;
}

/* 메인 페이지에서만 로고 초기 상태를 흰색으로 설정 */
body:has(#main) .header:not(.is-scrolled) .wyd-logo__image {
    background-image: url("../images/common/logo_wyd_seoul_w.png"); /* 메인 페이지 초기 상태: 흰색 로고 */
}

/* 스크롤 시 로고 이미지 변경 */
.header.is-scrolled .wyd-logo__image {
    background-image: url("../images/common/logo_wyd_seoul.png"); /* 스크롤 시: 일반 로고 */
}

/* GNB 메뉴 호버/활성 시 로고 이미지 변경 */
.header.is-menu-open .wyd-logo__image {
    background-image: url("../images/common/logo_wyd_seoul.png") !important; /* 메뉴 열림 시: 일반 로고 */
}
:lang(es) {
    .wyd-logo__image {
        background-image: url("../images/common/logo_wyd_seoul_2027_es-20251224114753996.png"); /* 서브페이지 기본: 일반 로고 */
    }
    body:has(#main) .header:not(.is-scrolled) .wyd-logo__image {
      background-image: url("../images/common/logo_wyd_seoul_2027_w_es-20251224114815425.png"); /* 메인 페이지 초기 상태: 흰색 로고 */
    }
    /* 스크롤 시 로고 이미지 변경 */
    .header.is-scrolled .wyd-logo__image {
      background-image: url("../images/common/logo_wyd_seoul_2027_es-20251224114753996.png"); /* 스크롤 시: 일반 로고 */
    }

    /* GNB 메뉴 호버/활성 시 로고 이미지 변경 */
    .header.is-menu-open .wyd-logo__image {
      background-image: url("../images/common/logo_wyd_seoul_2027_es-20251224114753996.png") !important; /* 메뉴 열림 시: 일반 로고 */
    }
}
:lang(fr) {
    .wyd-logo__image {
        background-image: url("../images/common/logo_wyd_seoul_2027_fr-20251224114847762.png"); /* 서브페이지 기본: 일반 로고 */
    }
    body:has(#main) .header:not(.is-scrolled) .wyd-logo__image {
      background-image: url("../images/common/logo_wyd_seoul_2027_w_fr-20251224114907967.png"); /* 메인 페이지 초기 상태: 흰색 로고 */
    }
    /* 스크롤 시 로고 이미지 변경 */
    .header.is-scrolled .wyd-logo__image {
      background-image: url("../images/common/logo_wyd_seoul_2027_fr-20251224114847762.png"); /* 스크롤 시: 일반 로고 */
    }

    /* GNB 메뉴 호버/활성 시 로고 이미지 변경 */
    .header.is-menu-open .wyd-logo__image {
      background-image: url("../images/common/logo_wyd_seoul_2027_fr-20251224114847762.png") !important; /* 메뉴 열림 시: 일반 로고 */
    }
}
:lang(pt) {
    .wyd-logo__image {
        background-image: url("../images/common/logo_wyd_seoul_2027_pt-20251224115011607.png"); /* 서브페이지 기본: 일반 로고 */
    }
    body:has(#main) .header:not(.is-scrolled) .wyd-logo__image {
      background-image: url("../images/common/logo_wyd_seoul_2027_w_pt-20251224115027646.png"); /* 메인 페이지 초기 상태: 흰색 로고 */
    }
    /* 스크롤 시 로고 이미지 변경 */
    .header.is-scrolled .wyd-logo__image {
      background-image: url("../images/common/logo_wyd_seoul_2027_pt-20251224115011607.png"); /* 스크롤 시: 일반 로고 */
    }

    /* GNB 메뉴 호버/활성 시 로고 이미지 변경 */
    .header.is-menu-open .wyd-logo__image {
      background-image: url("../images/common/logo_wyd_seoul_2027_pt-20251224115011607.png") !important; /* 메뉴 열림 시: 일반 로고 */
    }
}
:lang(it) {
    .wyd-logo__image {
        background-image: url("../images/common/logo_wyd_seoul_2027_it-20251224114937705.png"); /* 서브페이지 기본: 일반 로고 */
    }
    body:has(#main) .header:not(.is-scrolled) .wyd-logo__image {
      background-image: url("../images/common/logo_wyd_seoul_2027_w_it-20251224114954754.png"); /* 메인 페이지 초기 상태: 흰색 로고 */
    }
    /* 스크롤 시 로고 이미지 변경 */
    .header.is-scrolled .wyd-logo__image {
      background-image: url("../images/common/logo_wyd_seoul_2027_it-20251224114937705.png"); /* 스크롤 시: 일반 로고 */
    }

    /* GNB 메뉴 호버/활성 시 로고 이미지 변경 */
    .header.is-menu-open .wyd-logo__image {
      background-image: url("../images/common/logo_wyd_seoul_2027_it-20251224114937705.png") !important; /* 메뉴 열림 시: 일반 로고 */
    }
}
@media (max-width: 1280px) {
    .wyd-logo__image {
        width: 50px; /* 로고 가로 크기 - 74:84 비율 유지하여 축소 */
        height: 57px; /* 로고 높이 크기 - 74:84 비율 유지하여 축소 (84 × 50 / 74 ≈ 56) */
        min-width: 50px; /* 사파리에서 크기 고정을 위한 최소 크기 설정 */
        min-height: 57px; /* 사파리에서 크기 고정을 위한 최소 크기 설정 */
    }
}
/* ========================================
   GNB 스타일
======================================== */
.gnb {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 40px;
}
.gnb__link {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100px;
    padding: 0 20px;
    color: var(--text-primary); /* 서브페이지 기본: 기본 텍스트 색상 (검은색) */
    font-size: var(--clamp-size-23); /*변경 260221*/
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.4px;
    transition: color 0.3s ease-in-out; /* 트랜지션 추가 */
    border-radius: 4px;
    cursor: pointer;
}

/* 메인 페이지에서만 GNB 링크 초기 상태를 흰색으로 설정 */
body:has(#main) .header:not(.is-scrolled) .gnb__link {
    color: #fff; /* 메인 페이지 초기 상태: 흰색 글씨 */
}

/* 스크롤 시 GNB 링크 색상 변경 */
.header.is-scrolled .gnb__link {
    color: var(--text-primary); /* 스크롤 시: 기본 텍스트 색상 */
}

/* GNB 메뉴 호버/활성 시 GNB 링크 색상 변경 */
.header.is-menu-open .gnb__link {
    color: var(
            --text-primary
    ) !important; /* 메뉴 열림 시: 기본 텍스트 색상 (검은색) */
}
/* 2025-11-21: 드롭다운 애니메이션과 동일한 타이밍으로 동기화 */
.gnb__link::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: var(--primary-color);
    opacity: 1;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    z-index: -1;
}
.gnb__link:hover::after {
    opacity: 1;
    visibility: visible;
}

/* ========================================
   GNB 드롭다운 스타일
======================================== */
/* 2025-11-21: display 대신 포인터 이벤트로 제어하여 트랜지션 활성화 */
.gnb__dropdown {
    position: absolute;
    top: 100%;
    right: 0;
    width: 855px;
    background: #fff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 1000;
    padding: 0;
    pointer-events: none;
}
.gnb__item.is-active .gnb__dropdown {
    pointer-events: auto;
    opacity: 1;
    visibility: visible;
}
.gnb__item.is-active .gnb__link {
    color: var(--primary-color);
}
.gnb__item.is-active .gnb__link::after {
    opacity: 1;
    visibility: visible;
}
.gnb__dropdown-list {
    width: 313px;
    min-height: 356px;
    /* padding: 20px 0; */
    border-right: 1px solid var(--GRAY_03);
}
.gnb__dropdown-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    height: 54px;
    border-bottom: 1px solid var(--GRAY_03);
}
.gnb__dropdown-header-title {
    font-size: 21px;
    font-weight: 600;
    color: var(--text-secondary);
    margin: 0;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    display: block;
}
.gnb__dropdown-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s ease;
    padding: 0;
}
.gnb__dropdown-close:hover {
    background: rgba(0, 0, 0, 0.05);
}
.gnb__dropdown-close img {
    width: 24px;
    height: 24px;
    object-fit: contain;
}
.gnb__dropdown-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--text-primary);
    /* margin-bottom: 28px; */
    transition: all 0.2s ease;
    position: relative;
    display: block;
    padding: 14px 50px 14px 20px;
    cursor: default;
    word-break: keep-all;
}
.gnb__dropdown-title::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 28px;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: url("../images/common/ico_arrow_r_silver.svg") no-repeat center
    center;
    background-size: contain;
    transition: transform 0.2s ease;
}
.gnb__dropdown-title:hover {
    color: var(--primary-color);
    background: var(--GRAY_01);
}
.gnb__submenu-wrap {
    position: absolute;
    top: 54px;
    left: 313px;
    width: calc(100% - 313px);
    height: 360px;
    background: transparent;
    list-style: none;
    margin: 0;
    padding: 0;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    transform: translateX(-10px);
    transition: all 0.3s ease;
    z-index: 1001;
}
.gnb__submenu-list {
    width: 100%;
    height: 324px;
    overflow-y: auto;
}
/* [개선] JavaScript에서 제어하는 경우를 위해 클래스 기반 숨김 처리 추가 */
.gnb__submenu-wrap.is-hidden {
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateX(-10px) !important;
    z-index: 1000 !important;
    transition: none !important;
}

.gnb__dropdown-item:hover .gnb__submenu-wrap:not(.is-hidden) {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

/* 변경사항: PC 모드에서 1뎁스 드롭다운이 열렸을 때, 2뎁스의 첫 번째 항목 서브메뉴를 기본 노출
   - 기본 노출: 첫 번째 .gnb__dropdown-item 의 .gnb__submenu-wrap 표시
   - 교체 동작: 다른 항목 호버 시 해당 서브메뉴가 위로 올라와 보이도록 z-index 조정 */
@media (hover: hover) and (pointer: fine) {
    .gnb__item.is-active
    .gnb__dropdown-list
    > .gnb__dropdown-item:first-child
    .gnb__submenu-wrap:not(.is-hidden) {
        opacity: 1;
        visibility: visible;
        transform: translateX(0);
        z-index: 1001; /* 기본 노출 레이어 */
    }
    .gnb__dropdown-item:hover .gnb__submenu-wrap:not(.is-hidden) {
        z-index: 1002; /* 호버된 항목을 상위로 */
    }
    /* 변경사항: 다른 항목을 호버하면 기본(첫 번째) 컨텐츠는 숨김 처리 */
    .gnb__item.is-active
    .gnb__dropdown-list:hover
    > .gnb__dropdown-item:first-child:not(:hover)
    .gnb__submenu-wrap:not(.is-hidden) {
        opacity: 0;
        visibility: hidden;
        transform: translateX(-10px);
        z-index: 1000;
    }
    /* 변경사항: 기본(첫 번째) 2뎁스 타이틀 컬러를 호버 상태처럼 표시 */
    .gnb__item.is-active
    .gnb__dropdown-list
    > .gnb__dropdown-item:first-child
    .gnb__dropdown-title {
        color: var(--primary-color);
    }
    /* 변경사항: 다른 아이템을 호버하면 첫 번째 타이틀 컬러를 원래대로 복원 */
    .gnb__item.is-active
    .gnb__dropdown-list:hover
    > .gnb__dropdown-item:first-child:not(:hover)
    .gnb__dropdown-title {
        color: var(--text-primary);
    }
}

/* 변경사항: 터치(디바이스) 모드에서도 동일 동작 적용 */
@media (hover: none) and (pointer: coarse) {
    /* 1) 기본: 첫 번째 2뎁스 서브메뉴 노출 (is-hidden 클래스가 없는 경우만) */
    .gnb__item.is-active
    .gnb__dropdown-list
    > .gnb__dropdown-item:first-child
    .gnb__submenu-wrap:not(.is-hidden) {
        opacity: 1;
        visibility: visible;
        transform: translateX(0);
        z-index: 1001;
    }
    /* 2) 탭/포커스된 항목 서브메뉴를 상위로 표시 (is-hidden 클래스가 없는 경우만) */
    .gnb__dropdown-item:focus-within .gnb__submenu-wrap:not(.is-hidden),
    .gnb__dropdown-item:active .gnb__submenu-wrap:not(.is-hidden) {
        opacity: 1;
        visibility: visible;
        transform: translateX(0);
        z-index: 1002;
    }
    /* 3) 다른 항목이 탭된 경우, 기본(첫 번째) 컨텐츠 숨김 */
    /* 첫 번째 항목이 아닌 다른 항목이 hover/active/focus-within일 때 첫 번째 항목 숨김 */
    .gnb__item.is-active
    .gnb__dropdown-list:has(
      > .gnb__dropdown-item:not(:first-child) .gnb__dropdown-title:hover
    )
    > .gnb__dropdown-item:first-child
    .gnb__submenu-wrap:not(.is-hidden),
    .gnb__item.is-active
    .gnb__dropdown-list:has(> .gnb__dropdown-item:not(:first-child):active)
    > .gnb__dropdown-item:first-child
    .gnb__submenu-wrap:not(.is-hidden),
    .gnb__item.is-active
    .gnb__dropdown-list:has(
      > .gnb__dropdown-item:not(:first-child):focus-within
    )
    > .gnb__dropdown-item:first-child
    .gnb__submenu-wrap:not(.is-hidden) {
        opacity: 0;
        visibility: hidden;
        transform: translateX(-10px);
        z-index: 1000;
    }
    /* 4) 타이틀 컬러 처리 (기본은 강조, 다른 항목 탭 시 해제) */
    .gnb__item.is-active
    .gnb__dropdown-list
    > .gnb__dropdown-item:first-child
    .gnb__dropdown-title {
        color: var(--primary-color);
    }
    /* 첫 번째 항목이 아닌 다른 항목이 hover/active/focus-within일 때 첫 번째 타이틀 컬러 복원 */
    .gnb__item.is-active
    .gnb__dropdown-list:has(
      > .gnb__dropdown-item:not(:first-child) .gnb__dropdown-title:hover
    )
    > .gnb__dropdown-item:first-child
    .gnb__dropdown-title,
    .gnb__item.is-active
    .gnb__dropdown-list:has(> .gnb__dropdown-item:not(:first-child):active)
    > .gnb__dropdown-item:first-child
    .gnb__dropdown-title,
    .gnb__item.is-active
    .gnb__dropdown-list:has(
      > .gnb__dropdown-item:not(:first-child):focus-within
    )
    > .gnb__dropdown-item:first-child
    .gnb__dropdown-title {
        color: var(--text-primary);
    }
}

.gnb__submenu-item:last-of-type .gnb__submenu-link {
    margin-bottom: 0;
}
.gnb__submenu-item {
    margin: 0;
}
.gnb__submenu-link {
    display: block;
    height: auto;
    font-size: 19px;
    font-weight: 400;
    color: var(--text-secondary);
    transition: all 0.2s ease;
    border-radius: 0;
    text-decoration: none;
    /* [변경내용] .gnb__dropdown-title과 여백 맞춤: 상하 패딩 추가 */
    padding: 14px 20px;
    margin-bottom: 0;
}
.gnb__submenu-link:hover {
    color: var(--primary-color);
    /* [변경내용] .gnb__dropdown-title 호버와 동일한 배경색 적용 */
    background: var(--GRAY_01);
}
.gnb__submenu-link[aria-current="page"] {
    color: var(--primary-color);
}
.gnb__submenu-link.is-active {
	color: var(--primary-color);
}
/* ========================================
   유틸리티 버튼 스타일
======================================== */
.util-list {
    display: flex;
    gap: 16px;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}
.util__item {
    display: flex;
    align-items: center;
}
.util__btn {
    display: block;
    width: 24px;
    height: 24px;
    font-size: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    border-radius: 4px;
}
.util__btn.type-lang {
    background: url('../images/common/ico_globe.svg') no-repeat center center /
    contain;
    filter: none; /* 서브페이지 기본: 원래 색상 (검은색) */
    transition: filter 0.3s ease-in-out; /* 트랜지션 추가 */
}
.util__btn.type-search {
    background: url('../images/common/ico_search.svg') no-repeat center center /
    contain;
    filter: none; /* 서브페이지 기본: 원래 색상 (검은색) */
    transition: filter 0.3s ease-in-out; /* 트랜지션 추가 */
}
.util__btn.type-menu {
    background: url('../images/common/ico_menu.svg') no-repeat center center /
    contain;
    filter: none; /* 서브페이지 기본: 원래 색상 (검은색) */
    transition: filter 0.3s ease-in-out; /* 트랜지션 추가 */
}

/* 메인 페이지에서만 유틸리티 버튼 초기 상태를 흰색으로 설정 */
body:has(#main) .header:not(.is-scrolled) .util__btn.type-lang,
body:has(#main) .header:not(.is-scrolled) .util__btn.type-search,
body:has(#main) .header:not(.is-scrolled) .util__btn.type-menu {
    filter: brightness(0) invert(1); /* 메인 페이지 초기 상태: 흰색 아이콘 */
}

/* 스크롤 시 유틸리티 버튼 아이콘 색상 변경 */
.header.is-scrolled .util__btn.type-lang,
.header.is-scrolled .util__btn.type-search,
.header.is-scrolled .util__btn.type-menu {
    filter: none; /* 스크롤 시: 원래 색상 (검은색) */
}

/* GNB 메뉴 호버/활성 시 유틸리티 버튼 아이콘 색상 변경 */
.header.is-menu-open .util__btn.type-lang,
.header.is-menu-open .util__btn.type-search,
.header.is-menu-open .util__btn.type-menu {
    filter: none !important; /* 메뉴 열림 시: 원래 색상 (검은색) */
}
/* [변경내용] 언어 드롭다운 UI 스타일 추가 */

.lang-dropdown {
    position: absolute;
    top: calc(100% - 1px);
    right: 0;
    width: 120px;
    background: #fff;
    border: 1px solid #ccc;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.3s ease;
    z-index: 1100;
}
.lang-dropdown[aria-hidden="false"] {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.lang-dropdown__list {
    list-style: none;
    margin: 0;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.lang-dropdown__list li {
    margin-bottom: 16px;
}
.lang-dropdown__list li:last-of-type {
    margin-bottom: 0;
}
.lang-dropdown__option {
    width: 100%;
    border: none;
    background: transparent;
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}
.lang-dropdown__option:hover {
    color: var(--primary-color);
}
.lang-dropdown__option.active,
.lang-dropdown__option[aria-pressed="true"] {
    color: var(--primary-color);
}
@media screen and (max-width: 768px) {
    .lang-dropdown {
        top: 46px;
    }
}
/* ========================================
   헤더 반응형 스타일
======================================== */
@media (max-width: 1280px) {
    .header {
        height: 72px;
    }
    .header-inner {
        height: 100%;
    }
    .wyd-logo img {
        height: 50px;
    }
    .gnb__link {
        height: 72px;
    }
    .gnb {
        display: none;
    }
}
@media (max-width: 767px) {
    .header-inner {
        padding: 0 20px; /* 모바일 패딩 */
    }

    /* 모바일에서 패딩 변수 재정의 */
    :root {
        --content-padding-x: 20px;
    }
    .gnb {
        display: none;
    }
}
@media (hover: none) and (pointer: coarse) {
    .gnb__link.gnb__link:hover::after {
        background: var(--primary-color);
    }
}

/* ========================================
   D-day 카운트다운 스타일
======================================== */
.d-day {
    position: absolute;
    top: 127px;
    right: 10vw;
    z-index: 10;
}
.d-day__inner {
    position: relative;
    width: 115px;
    height: 115px;
}
.d-day__circle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 76px;
    height: 76px;
    color: var(--text-primary);
    border-radius: 50%;
    background: linear-gradient(90deg, rgba(251, 225, 38, 0.3) 0%, #fbe126 100%),
    #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}
.d-day__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}
.d-day__label {
    font-size: 18px;
    font-weight: 700;
    line-height: normal;
    color: var(--text-primary);
}
.d-day__rotating-image {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    z-index: 1; /* 라벨 뒤에 위치 */
    animation: rotate 10s linear infinite;
}
.d-day__rotating-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
@keyframes rotate {
    from {
        transform: translate(-50%, -50%) rotate(0deg);
    }
    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}
@media screen and (max-width: 768px) {
    .d-day {
        top: 85px;
        right: 20px;
    }
    .d-day__inner {
        width: 96px;
        height: 95px;
    }
    .d-day__circle {
        width: 60px;
        height: 60px;
    }
    .d-day__label {
        font-size: 14px;
    }
}

/* ========================================
   히어로 섹션 스타일
======================================== */
.hero-swiper {
    position: relative;
    width: 100%;
}
.hero-swiper .swiper-slide {
    position: relative;
    width: 100%;
    height: 848px;
    background-image: url('../images/main/mainVisual01.jpg');
    background-size: 1920px 848px;
    background-position: center bottom;
    background-repeat: no-repeat;
}
.hero-swiper .swiper-slide.slide-1 {
    background-image: url('../images/main/mainVisual01.jpg');
}
.hero-swiper .swiper-slide.slide-2 {
    background-image: url('../images/main/mainVisual02.jpg');
}
.hero-swiper .swiper-slide .hero-slide__content {
    width: 100%;
    max-width: var(--container-2xl);
    padding: 236px var(--content-padding-x) 0; /* 헤더/컨텐츠 좌우 패딩 변수 사용 */
}
.hero-swiper .swiper-slide .hero-slide__title {
    font-size: var(--clamp-size-100);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -2px;
    color: #fff;
}
.hero-swiper .swiper-slide .hero-slide__subtitle {
    font-size: var(--clamp-size-32);
    font-weight: 300;
    color: #fff;
    line-height: 1.5;
    letter-spacing: -0.72px;
    word-break: keep-all;
}
@media screen and (min-width: 1920px) {
    .hero-swiper .swiper-slide {
        background-size: cover;
    }
}
@media screen and (max-width: 768px) {
    .hero-swiper .swiper-slide .hero-slide__content {
        padding-top: 203px;
    }
    .hero-swiper .swiper-slide .hero-slide__title {
        font-size: 44px;
    }
    .hero-swiper .swiper-slide .hero-slide__subtitle {
        margin-top: 8px;
        font-size: 24px;
    }
}
/* 히어로 스와이퍼 진행바 */
.hero-swiper-progress {
    position: absolute;
    bottom: 118px;
    left: var(--content-padding-x); /* 헤더/컨텐츠 좌우 패딩 변수 사용 */
    width: 200px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
    z-index: 10;
}
.hero-swiper-progress .progress-container {
    width: 140px;
    height: 4px;
    background-color: rgba(255, 255, 255, 0.2);
}
.hero-swiper-progress .progress {
    width: 100%;
    height: 100%;
    background: #fff;
    transition: width 0.1s linear;
}
.hero-swiper-progress .current-slide {
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.32px;
    color: #fff;
}
/* 히어로 스와이퍼 네비게이션 버튼 스타일 */
.hero-swiper-progress .swiper-nav-w--prev,
.hero-swiper-progress .swiper-nav-w--next {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    padding: 0;
}
.hero-swiper-progress .swiper-nav-w--prev:disabled,
.hero-swiper-progress .swiper-nav-w--next:disabled {
    opacity: 0.3;
    cursor: not-allowed;
    pointer-events: none;
}
.hero-swiper-progress .swiper-nav-w--prev-icon,
.hero-swiper-progress .swiper-nav-w--next-icon {
    display: block;
    width: 20px;
    height: 20px;
    background-image: url('../images/common/ico_arrow_r_w.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
.hero-swiper-progress .swiper-nav-w--prev-icon {
    transform: rotate(-180deg);
}
.hero-slide__btn {
    display: inline-flex;
    margin-top: 40px;
    min-width: 120px;
    padding: 10px 16px;
    justify-content: center;
    align-items: center;
    gap: 12px;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.32px;
    border-radius: 50px;
    border: 1px solid #fff;
	transition:all 0.4s; 
}
.hero-slide__btn:hover { background:#fff; } /*추가260306*/

@media screen and (max-width: 1024px) {
    .hero-swiper .swiper-slide {
        height: 653px;
        background-size: calc(1920px * 653 / 848) 653px;
    }
}
@media screen and (max-width: 768px) {
    .hero-swiper-progress {
        bottom: 52px;
    }
    /* .hero-swiper .swiper-slide {
    height: 653px;
    background-size: cover;
  } */
    .hero-slide__btn {
        margin-top: 52px;
    }
}
/* 메인 컨텐츠 섹션 */
.main-body {
    width: 100%;
    padding-bottom: 200px;
    /*백그라운드 이미지 위치 변경 260304*/
}
.main-section {
    width: 100%;
    margin-bottom: 160px;
}
.main-section:last-child {
    margin-bottom: 0;
}
.section-inner {
    width: 100%;
    margin: 0 auto;
    padding: 0 var(--content-padding-x);
}
@media screen and (max-width: 1280px) {
    .main-section {
        margin-bottom: 120px;
    }
}
@media screen and (max-width: 768px) {
    .main-body {
        padding-bottom: 80px;
        background: none;
    }
    .main-section {
        margin-bottom: 64px;
    }
}
/* section-intro 스타일 */
.main-section.section-intro {
    width: 100%;
    margin-top: 120px;
    margin-bottom: 200px;
}
@media screen and (max-width: 1024px) {
    .main-section.section-intro {
        margin-top: 92px;
        margin-bottom: 100px;
    }
}
@media screen and (max-width: 768px) {
    .main-section.section-intro {
        margin-top: 64px;
        margin-bottom: 80px;
    }
}
.intro-swiper {
    width: 100%;
    position: relative;
}
.intro-swiper .swiper {
    width: 100%;
    overflow: hidden;
}
.intro-swiper .swiper-wrapper {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 40px;
}

.intro-swiper .swiper-slide {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 260px;
    height: 100%;
    box-sizing: border-box;
    text-align: center;
}
.intro-swiper .swiper-slide::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -20px;
    transform: translateY(-50%) translateX(50%);
    width: 3px;
    height: 200px;
    background-color: var(--GRAY_02);
    display: block;
}
.intro-swiper .swiper-slide:last-child::after {
    display: none;
}
.intro-swiper .swiper-slide:last-child {
    border-right: none;
}
.intro-swiper .swiper-slide h3 {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.72px;
    color: var(--text-primary);
    word-break: keep-all;
}
.intro-swiper .swiper-slide p {
    max-width: 300px;
    /* margin-top: 20px; */
    margin: 20px auto 0;
    font-size: 20px;
    line-height: 1.6;
    letter-spacing: -0.32px;
    color: var(--text-primary);
    word-break: keep-all;
}
.intro-swiper .swiper-slide .intro-swiper__btn {
    min-width: 120px;
    background-color: #fff;
    border: 1px solid var(--text-primary);
    color: var(--text-primary);
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.32px;
    border-radius: 50px;
    padding: 10px 16px;
    margin-top: 20px;
    transition: all 0.3s ease;
}
.intro-swiper .swiper-slide .intro-swiper__btn:hover {
    background-color: var(--text-primary);
    color: #fff;
    border-color: var(--text-primary);
}
/* PC에서는 네비게이션 숨김 */
.intro-swiper__nav {
    display: none;
}

/* 1024px 이하: 2개 표시 및 스타일 조정 */
@media screen and (max-width: 1024px) {
    .intro-swiper .swiper-slide::after {
        display: none;
    }
}
/* 모바일: 스와이프 가능하도록 설정 */
@media (max-width: 768px) {
    .intro-swiper .swiper {
        overflow: hidden;
    }
    .intro-swiper .swiper-wrapper {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 0;
        justify-content: flex-start;
    }
    .intro-swiper .swiper-slide {
        width: 100%;
        flex-shrink: 0;
        border-right: none;
    }
    /* 모바일에서 디바이더 숨김 */
    .intro-swiper .swiper-slide::after {
        display: none;
    }
    .intro-swiper .swiper-slide:last-child {
        border-bottom: none;
    }
    /* 모바일에서만 네비게이션 표시 */
    .intro-swiper__nav {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 28px;
        gap: 20px;
        z-index: 10;
    }
    .intro-swiper__nav .slider-popup__btn {
        width: 42px;
        height: 42px;
        display: inline-block;
        cursor: pointer;
        border: none;
        background: transparent;
        padding: 0;
        position: relative;
    }
    .intro-swiper__nav .slider-popup__btn::after {
        content: "";
        display: inline-block;
        width: 100%;
        height: 100%;
        background: url('../images/common/ico_arrow_r_black.svg') no-repeat 60% 50% /
      26px 26px;
        border: 1px solid #222;
        border-radius: 50%;
    }
    .intro-swiper__nav .slider-popup__btn--prev::after {
        transform: rotate(-180deg);
    }
    .intro-swiper__nav .slider-popup__btn:disabled {
        opacity: 0.35;
        cursor: auto;
        pointer-events: none;
    }
    /* 네비게이션 카운터 스타일 */
    .intro-swiper__counter {
        display: flex;
        align-items: center;
        font-size: 16px;
        font-weight: 400;
        color: var(--text-primary, #222);
        letter-spacing: -0.32px;
    }
    .intro-swiper__current,
    .intro-swiper__total {
        min-width: 20px;
        text-align: center;
    }
    .intro-swiper__separator {
        color: var(--text-secondary, #666);
    }
}

/* 메인 - 참여하기 섹션 */
.main-section.section-cross {
    width: 100%;
    margin-bottom: 128px;
	/*background: #a3a3ff;*/
}
.main-section.section-cross .section-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 64px;
}

/*추가 260304*/
.main-section.section-cross .section-inner.bg-img1 { padding-bottom:35vw; position:relative; } /*background:rgba(0,0,0,0.1); background: #ff9595;*/

.main-section.section-cross .section-inner.bg-img1:before {content:'';width:80%; height:42vw; background:url("/images/main/main_pattern_bg_01.svg")no-repeat;  position:absolute; bottom:0px; z-index:1; 
/*
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-clip: padding-box;
    background-position: center 240px;
*/
} /* rgb(138 194 255 / 80%) */

.main-section.section-cross .left {
    max-width: 773px;
}
.main-section.section-cross .left__text p {
    margin-bottom: 8px;
    font-size: clamp(20px, calc(3vw + 10px), 48px);
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.48px;
    color: var(--text-primary);
}
.main-section.section-cross .left__text h3 {
    font-size: clamp(24px, calc(4vw + 20px), 76px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1.28px;
    color: var(--text-primary);
}
.main-section.section-cross .left .btn {
    margin-top: 64px;
}

.main-section.section-cross .left__text .small_txt { font-size:var(--font-size-small); }

.main-section.section-cross .cross-card-list {
    display: flex;
    flex-direction: column;
    gap: 28px;
}
.main-section.section-cross .cross-card-item {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    /* gap: 68px; */
    width: 488px;
    aspect-ratio: 488 / 266;
    height: auto;
    min-height: 266px;
    padding: 32px;
    color: #fff;
    background: url('../images/main/card_bg_01.png') no-repeat center center /
    cover;
    border-radius: 24px;
}
.main-section.section-cross .cross-card-item__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
.main-section.section-cross .cross-card-item__header h4 {
    padding-right: 10px;
    font-size: var(--font-size-xl);
    font-weight: 600;
    color: #fff;
    word-break: keep-all;
}
.main-section.section-cross .cross-card-item__header img {
    width: 54px;
    height: 54px;
	opacity: 0.2;
}
.main-section.section-cross .cross-card-item.item-02 {
    color: var(--text-primary);
    background: url('../images/main/card_bg_02.png') no-repeat center center /
    cover;
    border-radius: 24px;
}
.main-section.section-cross .cross-card-item.item-02 h4 {
    color: var(--text-primary);
}
.main-section.section-cross .cross-card-item__list li {
    margin-bottom: 8px;
}
.main-section.section-cross .cross-card-item__list li:last-child {
    margin-bottom: 0;
}
.main-section.section-cross .cross-card-item__list a {
    position: relative;
    display: inline-block;
    min-width: 269px;
    max-width: calc(100% - 24px);
    padding-right: 34px;
    font-size: var(--font-size-large);
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.48px;
}
.main-section.section-cross .cross-card-item__list a::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: url('../images/common/ico_tail_arrow_r_b.svg') no-repeat center
    center / 100% 100%;
    filter: none;
    transition: right 0.3s ease;
}

.main-section.section-cross .cross-card-item__list a:hover::after {
    right: -20px;
}
.main-section.section-cross
.cross-card-item.item-01
.cross-card-item__list
a::after {
    filter: invert(1);
}
.main-section.section-cross .btn--detail {
    margin-top: 64px;
}
@media screen and (max-width: 1670px) {
    .main-section.section-cross .right {width: 100%;}
    .main-section.section-cross .cross-card-list {display: flex;flex-direction: row;align-items: center;justify-content: center;gap: 28px;}
    .main-section.section-cross .cross-card-item {width: calc((100% - 40px) / 2);}
	/*추가 260305*/
	.main-section.section-cross .section-inner.bg-img1 { padding-bottom: 35vw; }
}
@media screen and (max-width: 1024px) {
    .main-section.section-cross .cross-card-list {flex-direction: column;align-items: flex-start;}
    .main-section.section-cross .cross-card-item { width:100%; } /*width: 488px;*/
	/*추가 260305*/
	.main-section.section-cross .section-inner.bg-img1:before { width:calc(100% - 20.8984vw); height: 38vw; }
}
@media screen and (max-width: 768px) {
    .main-section.section-cross {margin: 80px 0 64px;}
    .main-section.section-cross .right {width: 100%;}
    .main-section.section-cross .cross-card-item {width: 100%;padding: 32px 24px;}
    .main-section.section-cross .cross-card-item__list li a {min-width: 0;width: 100%;max-width: 100%;}
    .main-section.section-cross .btn--detail {min-width: 149px;height: 48px;}
}
/*추가 260305*/
@media(max-width:767px){
	.main-section.section-cross .section-inner.bg-img1 { padding-bottom: 46vw; }
	.main-section.section-cross .section-inner.bg-img1:before { width: calc(100% - 5.2151vw); height: 50vw; } /*left: 50%; transform: translateX(-50%);*/
	
}

/* 메인 - 이벤트 제목 */
.main-section .main-section__title {
    margin-bottom: 24px;
    font-size: var(--font-size-2xl);
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.72px;
    color: var(--text-primary);
}
/* 텍스트 끝에 화살표 아이콘 추가 */
.main-section .main-section__title a.link-title {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
}
.main-section .main-section__title a.link-title::after {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url('../images/common/ico_tail_arrow_r_b.svg') no-repeat center
    center / 24px 24px;
}
@media screen and (max-width: 768px) {
    .main-section .main-section__title {
        margin-bottom: 16px;
    }
}
/* 메인 - 이벤트 섹션 */
.main-section.section-event {
    width: 100%;
}
/* 메인 - 이벤트 스와이퍼 */
.main-section.section-event .slider-popup__nav {
    margin-bottom: 12px;
    padding: 0;
}
.event-swiper .swiper-slide {
    height: auto;
    width: auto; /* Swiper 인라인 width 계산과 충돌 방지를 위해 고정폭 제거 */
}
.event-swiper .swiper-slide .event-card-item {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    color: #fff;
}
.event-swiper .event-card-item__header {
    width: 100%;
    padding: 32px 32px 24px;
    background-color: var(--primary-color);
    border-radius: 24px 24px 24px 0;
}
.event-swiper .event-card-item .date {
    width: calc(100% - 64px);
    height: 64px;
    margin-top: -1px;
    margin-right: -1px;
    padding: 0 32px 40px;
    background-color: var(--primary-color);
    border-radius: 0 0 24px 24px;
}
.event-swiper .event-card-item .date .date-text {
    display: block;
    width: 100%;
    font-size: clamp(14px, calc(0.5vw + 14px), 24px);
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.48px;
    color: inherit;
    word-break: keep-all;
}
.event-swiper .event-card-item .tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 32px;
    padding: 8px 20px;
    color: inherit;
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.32px;
    border-radius: 8px;
    background-color: transparent;
    border: 1px solid #fff;
}
.event-swiper .event-card-item .title {
    width: 100%;
    height: 112px;
    font-size: clamp(20px, calc(0.5vw + 16px), 32px);
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.64px;
    color: inherit;
    word-break: keep-all;
}
.event-swiper .event-card-item .status {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 65px;
    height: 65px;
    overflow: hidden;
}
/* 24px 24px 영역에만 배경색 적용 */
.event-swiper .event-card-item .status::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 24px;
    height: 24px;
    background-color: var(--primary-color);
}
.event-swiper .event-card-item .status__inner {
    position: absolute;
    bottom: -1px;
    right: -1px;
    width: 65px;
    height: 65px;
    background-color: #fff;
    border-top-left-radius: 24px;
    overflow: hidden;
}
.event-swiper .event-card-item .status__label {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 1px;
    right: 1px;
    width: 52px;
    height: 52px;
    font-size: 12px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.2px;
    color: #fff;
    background-color: var(--text-primary);
    border-radius: 50%;
}
.event-swiper .event-card-item.bg-red .event-card-item__header {
    background-color: var(--accent-color);
}
.event-swiper .event-card-item.bg-red .date {
    background-color: var(--accent-color);
}
.event-swiper .event-card-item.bg-red .status::before {
    background-color: var(--accent-color);
}
.event-swiper .event-card-item.bg-gray {
    color: var(--text-primary);
}
.event-swiper .event-card-item.bg-gray .tag {
    border-color: var(--GRAY_04);
}
.event-swiper .event-card-item.bg-gray .event-card-item__header {
    background-color: var(--GRAY_01);
}
.event-swiper .event-card-item.bg-gray .date {
    background-color: var(--GRAY_01);
}
.event-swiper .event-card-item.bg-gray .status::before {
    background-color: var(--GRAY_01);
}
.event-swiper .event-card-item .status.ended .status__label {
    background-color: var(--GRAY_04);
}
@media screen and (max-width: 1024px) {
    .event-swiper .event-card-item__header {
        padding: 28px 24px;
    }
    .event-swiper .event-card-item .date {
        padding: 0 24px 28px;
    }
}
@media screen and (max-width: 768px) {
    .main-section.section-event .slider-popup__nav {
        display: flex;
    }
    .event-swiper .event-card-item .tag {
        margin-bottom: 16px;
        font-size: 14px;
    }
    .event-swiper .event-card-item .title {
        height: 60px;
        font-size: 20px;
    }
    .event-swiper .event-card-item .date {
        font-size: 14px;
    }
}
@media screen and (max-width: 480px) {
}
/* 메인 - 갤러리 */
.main-section.section-gallery .section-inner {    /*display: flex; align-items: flex-start; justify-content: space-between; gap: 28px;*/ }
/* video-wrap과 photo-wrap 비율: 640:852 (gap 28px 제외) */
.main-section.section-gallery .video-wrap { flex:unset; } /*width: calc((640 / 1520) * 100%);*/ /* width: calc((640 / 1520) * 100%)*/ /*flex: 0 0 calc((640 / 1520) * 100%); */ /*background: rgba(0, 0, 0, 0.1); */
.main-section.section-gallery .photo-wrap { flex: unset); } /*width: calc((852 / 1520) * 100%);*/
.main-section.section-gallery .video-box { width: 100%; height: 0; padding-bottom: 56.25%; /* 비디오 비율: 640 x 360 (구형 브라우저 폴백) */aspect-ratio: 640 / 360; /* 비디오 비율: 640 x 360 (최신 브라우저) */ position: relative; border-radius: 24px; overflow: hidden; }
.main-section.section-gallery .video-box__link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 24px;
    overflow: hidden;
}
.main-section.section-gallery .video-box__link:after {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    content: "";
    display: block;
    width: 64px;
    height: 64px;
    background: url('../images/common/ico_video_play_circle.svg') no-repeat;
}
.main-section.section-gallery .video-box__link img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
    will-change: transform;
    transform-origin: center center;
}
.main-section.section-gallery .photo-box {
    width: 100%;
    height: 0;
    padding-bottom: calc(
            (360 / 852) * 100%
    ); /* 포토 비율: 852 x 360 (구형 브라우저 폴백) */
    aspect-ratio: 852 / 360; /* 포토 비율: 852 x 360 (최신 브라우저) */
    position: relative;
    border-radius: 24px;
    overflow: hidden;
}
.main-section.section-gallery .photo-box img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
    will-change: transform;
    transform-origin: center center;
}
.main-section.section-gallery .photo-box__link:hover img {
    transform: scale(1.1);
}
.main-section.section-gallery .video-box__link:hover img {
    transform: scale(1.1);
}
@media screen and (max-width: 768px) {
    .main-section.section-gallery .section-inner {
        flex-wrap: wrap;
        gap: 64px;
    }
    .main-section.section-gallery .video-wrap {
        flex: 0 0 100%;
        width: 100%;
    }
    .main-section.section-gallery .photo-wrap {
        flex: 0 0 100%;
        width: 100%;
    }
}
/* 메인 - 게시판 섹션 */
.main-section.section-board .section-inner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}
.main-section.section-board .board-container {
    flex: 1;
    min-width: 0;
}
.main-section.section-board .section-board__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 74px;
    gap: 12px;
    transition: all 0.3s ease;
}
.main-section.section-board .section-board__title {
    min-width: 0;
    max-width: 100%;
    transition: all 0.3s ease;
}
.main-section.section-board .section-board__link:hover {
    background-color: var(--GRAY_01);
}
.main-section.section-board .section-board__link:hover .section-board__title {
    padding: 0 20px 0 20px;
}
.main-section.section-board .section-board__date {
    padding-right: 20px;
    flex: 0 0 auto;
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.28px;
    color: var(--text-secondary);
}
.main-section.section-board .section-board__title .title-text {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.45px;
    color: var(--text-primary);
}
.main-section.section-board .section-board__title .sub-text {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 4px;
    font-size: 14px;
    font-weight: 600;
    line-height: normal;
}
.main-section.section-board .section-board__arrow {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    background: url('../images/common/ico_tail_arrow_r_gray.svg') no-repeat;
    background-size: contain;
    background-position: center;
}
@media (max-width: 1560px) {
    .main-section.section-board .section-inner {
        align-items: flex-start;
        justify-content: space-between;
        gap: 40px;
    }
    .main-section.section-board .board-container {
        flex: 0 0 calc((100% - 40px) / 2);
    }
}
/* 반응형: 모바일에서는 세로로 배치 */
@media screen and (max-width: 768px) {
    .main-section.section-board .section-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 40px;
    }
    .main-section.section-board .board-container {
        flex: 1;
        width: 100%;
    }
    .main-section.section-board .section-board__arrow {
        display: none;
    }
    .main-section.section-board .section-board__link {
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 8px;
        height: auto;
    }
    .main-section.section-board .section-board__item {
        margin-bottom: 16px;
    }
    .main-section.section-board .section-board__item:last-child {
        margin-bottom: 0;
    }
}

/* 메인 - 게시판 */
/* ========================================
   전체 메뉴 레이어 (풀페이지 팝업)
======================================== */
.menu-layer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%; /* iOS Safari fixed 위치 안정화: right/bottom 대신 width/height 사용 */
    height: 100vh; /* dvh 미지원 브라우저 fallback */
    height: 100dvh; /* iOS Safari 주소창 높이 변화 대응: dvh 사용 */
    background-color: #fff; /* 흰색 배경 */
    z-index: var(--z-popover);
    overflow: hidden;
    display: none;
    -webkit-flex-direction: column; /* 크로스 브라우징: Safari 구버전 */
    -ms-flex-direction: column; /* 크로스 브라우징: IE10 */
    flex-direction: column;
    -webkit-transform: translateZ(
            0
    ); /* iOS Safari fixed 위치 안정화를 위한 GPU 가속 */
    transform: translateZ(0);
    /* 2025-12-03: 모바일 스크롤 체이닝 방지 - 메뉴 스크롤 시 배경페이지 스크롤 차단 */
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}
.menu-layer[aria-hidden="false"] {
    display: -webkit-flex; /* 크로스 브라우징: Safari 구버전 */
    display: -ms-flexbox; /* 크로스 브라우징: IE10 */
    display: flex;
}
/* 헤더 영역 - GNB header와 높이 및 보더 라인 위치 동일하게 맞춤 */
.menu-layer__header {
    position: sticky;
    top: 0;
    width: 100%;
    height: 100px; /* GNB header 높이와 동일 */
    background-color: #fff;
    z-index: 10;
    border-bottom: 1px solid #ccc;
    box-sizing: border-box; /* border 포함하여 총 120px 유지 */
}
.menu-layer__header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 auto;
    padding: 0 calc(100vw / 1920 * 200);
    height: 100%; /* 부모(.menu-layer__header) 높이에 맞춤 */
}
/* 로고 - GNB 로고 사이즈(74x83px)와 동일하게 맞춤 */
.menu-layer__logo {
    margin: 0;
    line-height: 1;
}
.menu-layer__logo a {
    display: block;
    line-height: 0;
}
.menu-layer__logo img {
    height: 84px; /* GNB 로고 높이와 동일하게 변경 (70px → 84px) */
    width: auto;
}
/* 닫기 버튼 */
.menu-layer__close {
    width: 48px;
    height: 48px;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.menu-layer__close img {
    width: 24px;
    height: 24px;
}
/* 메뉴 내용 영역 */
.menu-layer__inner {
    position: relative;
    width: 100%;
    overflow-y: auto;
    flex: 1;
    padding: 0 calc(100vw / 1920 * 200);
    margin: 0 auto;
    /* 2025-12-03: 모바일 스크롤 체이닝 방지 - 메뉴 내용 스크롤 시 배경페이지 스크롤 차단 */
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}
/* 전체 메뉴 네비게이션 */
.menu-nav {
    width: 100%;
	height:100%; /*라인 끝까지 260221*/
}
/* 컨텐츠 영역 wrapper  */
.menu-nav__sections-wrapper {
    display: flex;
    gap: calc(100vw / 1920 * 40);
    height: 100%;
    margin: 0 auto;
}
/* 탭 버튼 영역 (모바일용) */
.menu-nav__tabs {
    display: none; /* 데스크톱에서는 숨김 */
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
/* 탭 버튼 */
.menu-nav__tab {
    flex: 0 0 auto;
    margin-bottom: 88px;
    font-size: 16px;
    font-weight: 700;
    border: none;
    background: transparent;
    cursor: pointer;
    /* white-space: nowrap; */
    transition: all 0.2s ease;
    position: relative;
    text-align: left;
}
.menu-nav__tab:hover {
    color: var(--text-primary);
}
.menu-nav__tab.is-active {
    color: var(--primary-color);
}
.menu-nav__section {
    display: block; /* 데스크톱에서는 모두 표시 */
    width: 25%;
    padding: 40px calc(100vw / 1920 * 40) 40px 0;
    border-right: 1px solid var(--border-medium);
}
.menu-nav__section:first-child {
    padding-left: 0;
}
.menu-nav__title {
    margin-bottom: 24px;
    font-size: var(--clamp-size-24);
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.48px;
}
.menu-nav__title.is-active {
    color: var(--primary-color);
}
.menu-nav__category {
    margin-bottom: 40px;
}
.menu-nav__category:last-child {
    margin-bottom: 0;
}
/* 카테고리 타이틀 */
.menu-nav__category-title {
    margin-bottom: 8px;
    font-size: var(--clamp-size-18);
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.16px;
    color: var(--text-muted);
}
/* 메뉴 리스트 */
.menu-nav__list {
    list-style: none;
    padding: 0;
    margin: 0;
}
/* 메뉴 아이템 */
.menu-nav__item {
    margin-bottom: 8px;
}
.menu-nav__item:last-child {
    margin-bottom: 0;
}
/* 메뉴 링크 */
.menu-nav__link {
    display: block;
    font-size: var(--clamp-size-22);
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.32px;
    transition: opacity 0.3s ease;
    word-break: keep-all;
}
.menu-nav__link:hover {
    color: var(--primary-color);
}
.menu-nav__link.is-active {
    color: var(--primary-color);
}
@media (max-width: 1280px) {
    /* header 높이와 로고 사이즈 반응형 맞춤 */
    .menu-layer__header {
        height: 72px; /* GNB header 반응형 높이와 동일 */
    }
    .menu-layer__header-inner {
        height: 100%; /* 부모 높이에 맞춤 */
    }
    .menu-layer__logo img {
        height: 57px; /* GNB 로고 반응형 높이와 동일하게 변경 (50px → 57px) */
    }
}
@media (max-width: 1024px) {
    .menu-layer__header-inner {
        padding: 0 calc(100vw / 1920 * 200);
    }
    .menu-layer__inner {
        padding: 0 calc(100vw / 1920 * 200);
    }
}
@media (max-width: 768px) {
    .menu-layer__close {
        width: 40px;
        height: 40px;
    }
    .menu-layer__inner {
        padding: 0; /* 모바일에서는 내부 패딩 제거 */
        display: flex;
        flex-direction: column;
        height: 100%;
        max-width: 100%;
    }
    /* 모바일: 탭 메뉴 구조로 변경 - row 구조 */
    .menu-nav {
        display: flex;
        flex-direction: row;
        height: 100%;
        width: 100%;
        gap: 0;
        overflow: hidden;
    }
    /* 탭 버튼 영역 */
    .menu-nav__tabs {
        display: flex;
        flex-direction: column; /* 탭 버튼은 세로 배치 */
        flex-shrink: 0;
        width: calc(100vw / 375 * 132);
        height: 100%;
        min-width: 132px;
        padding: 24px 20px;
        border-right: 1px solid var(--border-medium, #ccc);
        background-color: #fff;
        overflow-y: auto;
        /* 2025-12-03: 모바일 스크롤 체이닝 방지 - 탭 영역 스크롤 시 배경페이지 스크롤 차단 */
        overscroll-behavior: contain;
    }
    .menu-nav__sections-wrapper {
        display: block;
        flex: 1;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding: 24px 20px 120px;
        /* 2025-12-03: 모바일 스크롤 체이닝 방지 - 내부 스크롤 시 배경페이지 스크롤 차단 */
        overscroll-behavior: contain;
    }
    .menu-nav__section {
        display: none;
        width: 100%;
        padding: 0;
        border-right: none;
    }
    .menu-nav__section.is-active {
        display: flex;
        flex-wrap: wrap;
        gap: 0 20px;
    }
    .menu-nav__category {
        width: 30%;
        min-width: 200px;
    }
    .menu-nav__title {
        display: none;
    }
    .menu-nav__category-title {
        margin-bottom: 20px;
        font-size: 14px;
    }
    .menu-nav__item {
        margin-bottom: 16px;
    }
    .menu-nav__link {
        font-size: 14px;
    }
}
@media screen and (max-width: 768px) {
    .menu-layer__header-inner {
        padding: 0 20px; /* header 와 동일한 좌우 패딩 */
    }
}
/* ========================================
   히어로 섹션 반응형 스타일
======================================== */
@media (min-width: 640px) {
    .hero-main-title {
        font-size: 36px;
    }
    .hero-title {
        font-size: var(--font-size-5xl);
    }
}
@media (min-width: 768px) {
    .hero-main-title {
        font-size: var(--font-size-5xl);
    }
    .hero-title {
        font-size: var(--font-size-6xl);
    }
}
@media (min-width: 1024px) {
    .hero-main-title {
        font-size: var(--font-size-6xl);
    }
}
@media (max-width: 767px) {
    .hero-title {
        font-size: var(--font-size-3xl);
    }
    .countdown {
        font-size: var(--font-size-2xl);
    }
}

/* ========================================
   기타 반응형 스타일
======================================== */
@media (min-width: 640px) {
    .events-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .participation-options {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (min-width: 768px) {
    .events-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .participation-options {
        grid-template-columns: repeat(3, 1fr);
    }
    .news-content {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (hover: none) and (pointer: coarse) {
    .event-card:hover,
    .participation-card:hover {
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo img {
        image-rendering: -webkit-optimize-contrast;
        image-rendering: crisp-edges;
    }
}
@media (prefers-reduced-motion: reduce) {
    * {
        -webkit-animation-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        -webkit-animation-iteration-count: 1 !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* ========================================
   서브페이지 레이아웃
======================================== */
.full-container {
    display: block;
    width: 100%;
    max-width: 100%;
}
.full-container .page-container {
    padding-top: 80px;
    padding-bottom: 120px;
}
.page-container {
    width: 100%;
    display: -webkit-flex; /* 크로스 브라우징: Safari 구버전 */
    display: -ms-flexbox; /* 크로스 브라우징: IE10 */
    display: flex;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    min-height: calc(100vh - 120px); /* dvh 미지원 브라우저 fallback */
    min-height: calc(100dvh - 120px); /* 사파리 주소창 높이 변화 대응: dvh 사용 */
    margin: 0 auto;
    padding: 0 calc(100vw / 1920 * 200);
    overflow: hidden;
}
@media (max-width: 1280px) {
    .page-container {
        min-height: calc(100vh - 72px); /* dvh 미지원 브라우저 fallback */
        min-height: calc(
                100dvh - 72px
        ); /* 사파리 주소창 높이 변화 대응: dvh 사용 */
        padding: 0 calc(100vw / 1920 * 200);
    }
}
@media (max-width: 768px) {
    .page-container {
        min-height: calc(100vh - 400px); /* dvh 미지원 브라우저 fallback */
        min-height: calc(
                100dvh - 400px
        ); /* 사파리 주소창 높이 변화 대응: dvh 사용 */
        padding: 0 20px;
    }
    .full-container .page-container {
        padding-top: 40px;
        padding-bottom: 80px;
    }
}

/* ========================================
   LNB 스타일
======================================== */
.lnb {
    position: relative;
    /* width: calc(100vw / 1920 * 296); */
    /* min-width: 240px; */
    width: 296px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}
.lnb__scroll-wrap {
    width: 100%;
    height: 100%;
    margin-left: -5px;
    padding: 36px 26px 87px 32px;
    overflow-y: auto;
}
.lnb__scroll-wrap::-webkit-scrollbar {
    width: 7px;
}
.lnb__scroll-wrap::-webkit-scrollbar-track {
    background-color: transparent;
}
.lnb__scroll-wrap::-webkit-scrollbar-thumb {
    background-color: #d9d9d9;
    border-radius: 8px;
}
.lnb::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
    background: #ccc;
    z-index: -1;
}
.lnb::after {
    content: "";
    position: absolute;
    top: 0;
    right: 3px;
    width: 1px;
    height: 100%;
    background: #ccc;
    z-index: -1;
}
.lnb__title {
    margin-top: 10px;
    margin-bottom: 44px;
    font-size: 24px;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: -0.48px;
    line-height: normal;
}
.lnb__nav {
    position: relative;
}
.lnb .accordion {
    border: none;
    border-radius: 0;
    background-color: transparent;
    box-shadow: none;
    overflow: visible;
}
.lnb .accordion__item {
    border-bottom: none;
}
.lnb__group {
    position: relative;
    margin-bottom: 80px;
}
.lnb__group:last-child {
    margin-bottom: 0;
}
.lnb .accordion__trigger.lnb__group-title {
    width: 100%;
    font-size: 20px;
    font-weight: 700;
    color: var(--text-primary);
    cursor: pointer;
    position: relative;
    transition: color 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: left;
    padding: 0;
    background: none;
    border: none;
}
.lnb .accordion__trigger.lnb__group-title:hover {
    background-color: transparent;
}
.lnb .accordion__trigger.lnb__group-title:focus {
    outline: none;
}
.lnb .accordion__trigger.lnb__group-title:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}
.lnb .accordion__trigger.lnb__group-title[aria-expanded="true"] {
    background-color: transparent;
}
.lnb .accordion__trigger.lnb__group-title::before {
    content: "";
    position: absolute;
    left: -32px;
    top: 50%;
    transform: translateY(-50%);
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background-color: #d1d5db;
    transition: background-color 0.3s ease, transform 0.3s ease;
    z-index: 1;
}
.lnb__group--active .accordion__title,
.lnb__group--active .lnb__group-title {
    color: var(--primary-color);
}
.lnb__group--active .accordion__trigger.lnb__group-title::before {
    background-color: var(--primary-color);
    transform: translateY(-50%);
}
.lnb .accordion__icon.lnb__group-icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    position: relative;
    transition: transform 0.3s ease;
    flex-shrink: 0;
}
.lnb .accordion__icon.lnb__group-icon::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    width: 6px;
    height: 6px;
    border-right: 2px solid var(--text-primary);
    border-bottom: 2px solid var(--text-primary);
}
.lnb
.accordion__trigger[aria-expanded="true"]
.accordion__icon.lnb__group-icon {
    transform: rotate(180deg);
}
.lnb .accordion__panel.lnb__panel {
    overflow: hidden;
    /* display: none 대신 높이 기반 애니메이션을 위해 block 유지 */
    display: block;
}
.lnb .accordion__trigger[aria-expanded="false"] + .accordion__panel {
    /* display: none 제거 - slideUp 애니메이션이 정상 작동하도록 높이만 0으로 설정 */
    height: 0;
    padding-top: 0;
    overflow: hidden;
}
.lnb__list {
    list-style: none;
    padding-top: 40px;
    margin: 0;
}
.lnb__item {
    margin-bottom: 24px;
}
.lnb__item:last-child {
    margin-bottom: 0;
}
.lnb__link {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: #6b7280;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.3s ease;
}
.lnb__link:hover {
    color: var(--primary-color);
}
.lnb__item--active .lnb__link {
    color: var(--primary-color);
    font-weight: 600;
}
@media (max-width: 1280px) {
    .lnb {
        display: none;
    }
}
@media (max-width: 767px) {
    .lnb {
        display: none;
    }
}

/* ========================================
   페이지 컨텐츠 레이아웃
======================================== */
.page-content {
    width: 100%;
    min-width: 0;
    min-height: 100%;
    flex: 1;
    padding: 36px 0 120px 44px;
    /* overflow: hidden; */ /* 2025-11-13: 향후 일정 슬라이드가 좌우로 확장되도록 overflow 허용 */
}
.page-body {
    width: 100%;
    min-width: 0;
    color: #333;
}
.page-header {
    width: 100%;
    margin-bottom: 44px;
}
.page-title {
    color: var(--text-primary);
    font-size: 36px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.64px;
    word-break: keep-all;
}
.page-subtitle {
    margin-top: 14px;
    color: var(--text-primary);
    font-size: var(--font-size-large);
    font-weight: 600;
    word-break: keep-all;
}
.page-description {
    margin-top: 44px;
    color: var(--text-primary);
    font-size: 20px;
    font-weight: 400;
    line-height: 1.56;
    letter-spacing: -0.4px;
    word-break: keep-all;
}
.page-content .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}
.page-notice {
    margin-top: 24px;
    color: var(--text-secondary);
    font-size: var(--font-size-base);
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.4px;
    word-break: keep-all;
}
.page-notice li {
    margin-bottom: 8px;
}
.page-notice li:last-child {
    margin-bottom: 0;
}
@media (max-width: 1280px) {
    .page-content {
        padding: 36px 0 80px;
    }
}
.page-section {
    display: block;
    width: 100%;
}
.page-section.divider-line {
    border-top: 1px solid var(--border-light);
    padding-top: 80px;
}
.page-section__title {
    font-size: 24px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 32px;
    letter-spacing: -0.64px;
    line-height: 1.5;
    word-break: keep-all;
}
.page-section__title.type-large {
    margin-bottom: 44px;
    font-size: 28px;
    font-weight: 600;
}
.page-section__text {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.4px;
    word-break: keep-all;
}
.page-section__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 32px;
}
.page-section__header .page-section__title {
    margin-bottom: 0;
}
.page-section__title.type-icon {
    display: flex;
    align-items: center;
    gap: 12px;
}
@media (max-width: 1280px) {
    .page-section.divider-line {
        padding-top: 60px;
    }
}
@media (max-width: 1024px) {
    .page-section.divider-line {
        padding-top: 32px;
    }
}
@media (max-width: 768px) {
    .page-header {
        margin-bottom: 24px;
    }
    .page-title {
        font-size: 24px;
    }
    .page-subtitle {
        margin-top: 20px;
    }
    .page-description {
        margin-top: 24px;
        font-size: 16px;
    }
    .page-section__title {
        margin-bottom: 20px;
        font-size: 20px;
    }
    .page-section__text {
        font-size: 16px;
    }
    .page-section.divider-line {
        padding-top: 40px;
    }
    .page-section__title.type-large {
        margin-bottom: 40px;
        font-size: 24px;
    }
    .page-section__header {
        margin-bottom: 20px;
    }
}

/* ========================================
   게시판 리스트
======================================== */
.board-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.board-item {
    border-top: 1px solid var(--border-light);
}
.board-item:last-child {
    border-bottom: 1px solid var(--border-light);
}
.board-item__link { display: flex; align-items: center;
    justify-content: space-between;
    padding: 32px 40px;
	transition:all 0.3s;
}
.board-item__link:hover { color:var(--text-highlight); background:var(--GRAY_05); } /*추가 260112*/
.board-item__link:hover .board-item__number { color:var(--text-heighlight-gray); } /*추가 260112*/
.board-item__left {
    display: flex;
    align-items: center;
    gap: 40px;
}
.board-item__number { display: flex;
    align-items: center;
    justify-content: center;
    min-width: 60px;
    flex: 0 0 auto;
    font-size: var(--font-size-base);
    font-weight: 700;
    color: var(--text-primary);
	transition:all 0.4s;
}
.board-item__number.type-pin {
    background: url("../images/common/ico_pin_blue.svg") no-repeat center
    center / 28px 28px;
    text-indent: -9999px;
}
.board-item__info {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-right: 40px;
}
.board-item__title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--font-size-base);
    font-weight: 700;
    letter-spacing: -0.8px;
    line-height: 1.5;
    /* margin-bottom: 8px; */
}
.board-item__title-text {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}
.board-item__date {
    font-size: 16px;
    color: var(--text-secondary);
    line-height: 1.5;
    word-break: keep-all;
}
.board-item .icon-badge {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* 언론보도 게시판  */
.board-item.type--image .board-item__link { padding-right: 0; }


.board-item.type--image .board-item__date {
    margin-top: 28px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: wrap;
}
.board-item.type--image .board-item.type--image .board-item__left {
    max-width: 60%;
}
.board-item.type--image .board-item__right {
    max-width: 284px;
    flex: 0 0 auto;
    overflow: hidden;
}
.board-item.type--image .board-item__right img { display: block; width: 100%; height: 100%; aspect-ratio: 71/40; object-fit: cover;	transition:all 0.3s ease; }
.board-item.type--image .board-item__link:hover .board-item__right img{ transform: scale(1.1); }

@media screen and (max-width: 1536px) {
    .board-item.type--image .board-item__right {
        width: 35%;
    }
}
@media screen and (max-width: 1280px) {
    .board-item__link {
        padding: 24px 20px;
    }
    .board-item.type--image .board-item__date {
        margin-top: 20px;
    }
    .board-item.type--image .board-item__left {
        max-width: 100%;
    }
    .board-item.type--image .board-item__right {
        display: none;
    }
}
@media screen and (max-width: 1023px) {
    .board-item__info {
        padding-right: 20px;
    }
    .board-item__left {
        gap: 20px;
    }
    .board-item .icon-badge {
        width: 24px;
        height: 24px;
    }
    .board-item.type--image .board-item__date {
        margin-top: 12px;
    }
    .board-item.type--image .board-item__right {
        display: none;
    }
}
@media screen and (max-width: 767px) {
    .board-item__left {
        gap: 12px;
    }
    .board-item__link {
        padding: 12px;
    }
    .board-item__info {
        padding-right: 0;
        gap: 6px;
    }
    .board-item__number {
        width: 30px;
        min-width: 30px;
    }
    .board-item__date {
        font-size: 14px;
    }
    .board-item.type--image .board-item__date {
        margin-top: 0;
    }
    .board-item.type--image .board-item__right {
        display: none;
    }
}
/* ========================================
   게시글 상세 (Board Detail)
======================================== */
.board-detail {
    border-radius: 8px;
    overflow: hidden;
}
/* 게시글 헤더 */
.board-detail__header {
    margin-bottom: 36px;
    padding-bottom: 36px;
    border-bottom: 1px solid #ccc;
}
.board-detail__title {
    font-size: 24px;
    font-weight: 600;
    letter-spacing: -0.48px;
    margin-bottom: 32px;
    word-break: keep-all;
}
.board-detail__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.board-detail__meta-item {
    display: flex;
    gap: 24px;
    align-items: center;
    font-size: 16px;
}
.board-detail__meta-label {
    font-size: 20px;
    font-weight: 600;
    color: var(--text-highlight);
}
.board-detail__meta-value {
    font-size: 16px;
    font-weight: 500;
    color: var(--text-secondary);
}
.board-detail__meta-value .meta-time {
    position: relative;
    padding-left: 16px;
}
.board-detail__meta-value .meta-time::before {
    content: "";
    position: absolute;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 8px;
    background-color: var(--border-light);
    z-index: 1;
}
.board-detail__btn-wrap {
    display: flex;
    align-items: center;
    gap: 16px;
}
/* 게시글 본문 요약 영역 */
.board-detail__summary {
    margin-bottom: 36px;
}
.board-detail__summary p {
    font-size: var(--font-size-base);
    font-weight: 600;
    line-height: 150%;
    letter-spacing: -0.48px;
    word-break: keep-all;
}
/* 게시글 이미지 영역 */
.board-detail__image {
    margin-bottom: 40px;
}
.board-detail__image img {
    display: block;
   margin: 0 auto;
}
/* 게시글 본문 (cms 에디터 영역)*/
.board-detail__content {
    /* min-height: 350px; */
    margin-bottom: 64px;
}
.board-detail__content h1,
.board-detail__content h2,
.board-detail__content h3,
.board-detail__content h4,
.board-detail__content h5,
.board-detail__content h6 {
    font-weight: 700;
    color: var(--text-primary);
    margin-top: 32px;
    margin-bottom: 16px;
}
.board-detail__content h1 {
    font-size: 2em;
}
.board-detail__content h2 {
    font-size: 1.5em;
}
.board-detail__content h3 {
    font-size: 1.25em;
}
.board-detail__content h4 {
    font-size: 1.1em;
}
.board-detail__content h5 {
    font-size: 1em;
}
.board-detail__content h6 {
    font-size: 0.9em;
}
.board-detail__content p {
    margin-bottom: 8px;
    line-height: 1.8;
}
.board-detail__content ul,
.board-detail__content ol {
    padding-left: 20px;
    margin-bottom: 16px;
    list-style-position: outside;
}
.board-detail__content ul {
    list-style-type: disc;
}
.board-detail__content ol {
    list-style-type: decimal;
}
.board-detail__content ul li,
.board-detail__content ol li {
    margin-bottom: 8px;
    line-height: 1.8;
    display: list-item;
}
.board-detail__content blockquote {
    border-left: 4px solid var(--primary);
    padding-left: 16px;
    margin: 24px 0;
    font-style: italic;
    color: var(--text-secondary);
}
/* 이전글/다음글 네비게이션 */
.board-detail__navigation {
    margin-top: 64px;
    border-top: 1px solid var(--black-11);
}
.board-detail__nav-item {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 20px 40px;
    border-bottom: 1px solid var(--GRAY_03);
    /*transition: background-color 0.2s ease;*/
    transition: all 0.2s ease-in;
}
.board-detail__nav-item:hover {
    background-color: var(--GRAY_05);
}
.board-detail__nav-label {
    font-size: 20px;
    font-weight: 400;
    min-width: 176px;
    text-align: center;
}
.board-detail__nav-link {
    flex: 1;
    font-size: 20px;
    color: var(--text-primary);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}
.board-detail__nav-link:hover {
    color: var(--primary-color);
}
/* 하단 액션 버튼 */
.board-detail__actions {
    display: flex;
    justify-content: center;
    gap: 12px;
    padding: 40px;
}
/* 반응형 - 게시글 상세 */
@media (max-width: 768px) {
    .board-detail__header {
        margin-bottom: 32px;
        padding-bottom: 0;
        border-bottom: none;
    }
    .board-detail__title {
        margin-bottom: 20px;
    }
    .board-detail__meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
    .board-detail__meta-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    .board-detail__meta-value {
        margin-left: 0;
    }
    .board-detail__nav-item {
        gap: 8px;
        padding: 12px 20px;
    }
    .board-detail__nav-label {
        min-width: 60px;
        font-size: 16px;
    }
    .board-detail__nav-link {
        font-size: 16px;
    }
    .board-detail__actions {
        padding: 40px 0;
    }
    .board-detail__content {
        margin-bottom: 40px;
        font-size: 16px;
    }
    .board-detail__navigation {
        /* display: none; */
    }
    .board-detail .btn-wrap {
        margin-top: 16px;
    }
}
@media (max-width: 768px) {
    .board-detail__summary {
        margin-bottom: 24px;
    }
}
/* 컬럼영역 */
.board-column-area {
    margin-bottom: 80px;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: -0.4px;
}
.board-column-item {
    margin-bottom: 16px;
    line-height: 1.5;
}
.board-column-item strong {
    margin-right: 8px;
    font-weight: 600;
}
.board-column-item:last-of-type {
    margin-bottom: 0;
}
@media (max-width: 768px) {
    .board-column-area {
        margin-bottom: 40px;
    }
}
/* ========================================
   퀵 링크 스타일
======================================== */
.quick-links__title {
    margin-bottom: 32px;
    font-size: var(--font-size-large);
    font-weight: 600;
    line-height: 1.5;
    word-break: keep-all;
}
.quick-links__list {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 36px;
    width: 100%;
}
.quick-links__item {
    width: calc((100% - 72px) / 3);
    height: 160px;
}
.quick-links__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    /* 변경사항: 패딩 최소화 */
    padding: 16px;
    border-radius: 8px;
    border: 1px solid #eee;
}
/* 변경사항: 이미지 가로 사이즈 기준 고정 */
.quick-links__link img {
    width: 200px;
    height: auto;
    object-fit: contain;
}
@media (max-width: 1280px) {
    .quick-links__list {
        gap: 20px;
    }
    .quick-links__link img {
        width: 200px;
    }
}
@media (max-width: 768px) {
    .quick-links__title {
        margin-bottom: 20px;
    }
    .quick-links__list {
        gap: 20px;
    }
    .quick-links__item {
        width: 100%;
        height: 120px;
    }
    .quick-links__link {
        width: 100%;
        height: 100%;
        padding: 12px;
    }
    .quick-links__link img {
        width: 200px;
    }
}
.quick-links.type-with-button .quick-links__list {
    align-items: center;
    gap: 24px;
    /* flex-wrap: wrap; */
}
.quick-links.type-with-button .quick-links__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    width: calc(50% - 12px);
    min-width: 350px;
    height: 400px;
    padding: 46px;
    margin: 0 auto;
    border: 1px solid #eee;
    border-radius: 8px;
}
.quick-links.type-with-button .quick-links__item p {
    margin-bottom: 24px;
    font-size: 20px;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: -0.4px;
}
.quick-links.type-with-button .quick-links__item .logo {
    height: 143px;
    flex: 0 0 auto;
}
.quick-links.type-with-button .quick-links__item .logo img {
    max-width: 100%;
    height: 100%;
    object-fit: contain;
}
.quick-links.type-with-button .quick-links__item .btn {
    width: 160px;
    margin-top: 40px;
}
@media (max-width: 768px) {
    .quick-links.type-with-button .quick-links__item {
        min-width: 100%;
    }
}
/* 퀵 링크 토글 버튼 */
.quick-links.type-toggle-button .quick-links__list {
    position: relative;
    margin-bottom: 32px;
}
.quick-links.type-toggle-button .quick-links__list.active {
    margin-bottom: 232px;
}
.quick-links.type-toggle-button .quick-links__item {
    position: static;
}
.quick-links.type-toggle-button .quick-links__trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: calc(100vw / 1920 * 47) calc(100vw / 1920 * 30);
    border-radius: 8px;
    border: 1px solid #eee;
    transition: all 0.3s ease;
}
.quick-links.type-toggle-button .quick-links__trigger img {
    max-width: 100%;
    height: 100%;
    object-fit: contain;
}
.quick-links.type-toggle-button .quick-links__toggle-content {
    display: none;
    position: absolute;
    top: calc(100% + 32px);
    left: 0;
    right: 0;
    width: auto;
    padding: 0;
    border: none;
    background: white;
    z-index: 10;
}
.quick-links.type-toggle-button .quick-links__toggle-content .content-info a {
    color: var(--primary-color);
    text-decoration: underline;
}
.quick-links.type-toggle-button
.quick-links__toggle-content
.content-info
a:visited {
    color: #551a8b;
}
@keyframes slideDownFadeIn {
    0% {
        height: 0;
        opacity: 0;
        border: none;
        visibility: hidden;
    }
    60% {
        height: auto;
        opacity: 0;
        border: none;
        visibility: visible;
    }
    100% {
        height: auto;
        opacity: 1;
        border: 1px solid var(--primary-color);
        visibility: visible;
    }
}

@keyframes slideUpFadeOut {
    0% {
        display: block;
        opacity: 1;
        border: 1px solid var(--primary-color);
    }
    100% {
        display: none;
        opacity: 0;
        border: none;
    }
}
.quick-links.type-toggle-button
.quick-links__item.active
.quick-links__trigger {
    border: 1px solid var(--primary-color);
    background: #eef3ff;
}
.quick-links.type-toggle-button
.quick-links__item.active
.quick-links__toggle-content {
    display: block;
    padding: 40px;
    border: 1px solid var(--primary-color);
    animation: slideDownFadeIn 0.3s ease forwards;
}
.quick-links__toggle-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.quick-links__toggle-header .content-name {
    font-size: 24px;
    font-weight: 600;
    color: var(--text-primary);
}
.quick-links__toggle-body .content-info {
    font-size: 20px;
    line-height: 1.5;
}
@media (max-width: 768px) {
    .quick-links.type-toggle-button .quick-links__list {
        margin-bottom: 24px;
    }
    .quick-links.type-toggle-button .quick-links__list.active {
        margin-bottom: 24px;
    }
    .quick-links.type-toggle-button .quick-links__item {
        height: auto;
    }
    .quick-links.type-toggle-button .quick-links__item.active {
        position: relative;
        margin-bottom: 208px;
    }
    .quick-links.type-toggle-button .quick-links__trigger {
        padding: 47px 27px;
    }
    .quick-links.type-toggle-button
    .quick-links__item.active
    .quick-links__toggle-content {
        min-height: 160px;
    }
    .quick-links.type-toggle-button
    .quick-links__item.active
    .quick-links__toggle-content {
        padding: 33px 20px;
    }
    .quick-links__toggle-header .content-name {
        font-size: 20px;
    }
    .quick-links__toggle-body .content-info {
        font-size: 16px;
    }
}
/* 유투브 영상 영역 */
.page-moment-youtube{
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}
.youtube-title {
    margin-bottom: 24px;
    font-size: 28px;
    font-weight: 600;
    color: var(--text-secondary);
    line-height: 1.5;
    letter-spacing: -0.56px;
    text-align: center;
}
.youtube-subtitle {
    margin-top: 44px;
    font-size: 32px;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.5;
    letter-spacing: -0.64px;
    text-align: center;
}
.page-detail-youtube {
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    margin-bottom: 64px;
}
@media (max-width: 768px) {
    .page-detail-youtube {
        margin-bottom: 40px;
    }
}
/* ========================================
   검색 페이지 스타일
======================================== */
.search-header {
    padding: 80px 0;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background: #efefef;
    border-bottom: 1px solid var(--border-medium);
}
.search-header .search-form {
    width: 100%;
    max-width: 702px;
}
.search-results {
    width: 100%;
}
.search-list__title {
    margin-bottom: 32px;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.48px;
    color: var(--text-primary);
}
.search-list__list {
    border-top: 1px solid var(--border-light);
}
.search-list__item {
    padding: 52px 40px;
    border-bottom: 1px solid var(--border-light);
}
.search-item__link {
    display: block;
    width: 100%;
}
.search-item__title {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.4px;
    color: var(--text-primary);
    margin-bottom: 37px;
}
.search-item__title-text {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.search-item__text {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.32px;
    color: var(--text-secondary);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.search-list__empty {
    margin-top: 20px;
}
.search-list__empty-text {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.5;
    color: var(--text-secondary);
}
@media (max-width: 768px) {
    .search-header {
        padding: 28px 20px;
    }
    .search-list__title {
        margin-bottom: 20px;
        font-size: 20px;
    }
    .search-list__item {
        padding: 20px 12px;
    }
    .search-item__title {
        margin-bottom: 8px;
    }
    .search-item__title-text {
        font-size: 16px;
    }
    .search-item__text {
        font-size: 14px;
        line-clamp: 1;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
    }
    .search-list__empty {
        margin-top: 16px;
    }
    .search-list__empty-text {
        font-size: 16px;
    }
}
/* ========================================
   대회 일정 스타일
======================================== */
.wyd-schedule__image {
    width: 100%;
    height: 100%;
    overflow-x: auto;
}
.wyd-schedule__image img {
    display: block;
    width: 100%;
    min-width: 805px;
}
.schedule-list-group {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    /* gap: 24px; */
    width: 100%;
}
.wyd-schedule__download {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: 40px;
}
.schedule-list-group .schedule-date {
    flex: 0 0 auto;
}
.schedule-list-group .schedule-date p {
    font-size: 32px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.64px;
    color: var(--text-primary);
}
.schedule-list {
    flex: 1;
}
.schedule-list .schedule-item {
    position: relative;
    /* width: 100%; */
    margin-left: calc(100vw / 1920 * 112);
    padding-left: calc(100vw / 1920 * 112);
    padding-bottom: 120px;
}
/* 스크롤 애니메이션 초기 상태 클래스 */
.scroll-animate {
    opacity: 0;
    transform: translateX(50px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out; /* translateX 애니메이션을 위한 transition 추가 */
}
/* 애니메이션 활성화 클래스 */
.scroll-animate.animate-in {
    opacity: 1;
    transform: translateX(0);
}
.schedule-list .schedule-item::before {
    content: "";
    position: absolute;
    top: 18px;
    left: 0;
    width: 1px;
    height: calc(100% + 15px);
    background-color: #000;
}
.schedule-list .schedule-item:first-of-type:after {
    content: "";
    position: absolute;
    top: 18px;
    left: -7px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: var(--primary-color);
}
.schedule-list-group.current .schedule-list .schedule-item:first-of-type:after {
    top: 15px;
    left: -12px;
    width: 25px;
    height: 25px;
    background: url("../images/common/ico_d_dots_blue.svg") no-repeat center
    center / 100% 100%;
}
.schedule-list-group.last-group .schedule-item::before {
    display: none;
}
.schedule-item__date {
    display: none;
}
.schedule-item__title {
    margin-bottom: 16px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.48px;
    color: var(--text-primary);
    word-break: keep-all;
}
.schedule-item__title .sub{
    display: block;
    font-size: 20px;
    font-weight:500;
}
.schedule-item__text {
    margin-bottom: 16px;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.4px;
    word-break: keep-all;
}
.schedule-item__image {
    display: block;
    width: 100%;
    max-width: 420px;
    height: 100%;
    aspect-ratio: 420 / 260;
    object-fit: cover;
    border-radius: 14px;
    overflow: hidden;
}
.section--schedule .schedule-date {
    width: 102px;
}
@media screen and (max-width: 768px) {
    .section--schedule {
        padding-left: 7px;
    }
    .schedule-list-group .schedule-date {
        display: none;
    }
    .schedule-list .schedule-item {
        margin-left: 0;
        padding-left: 28px;
        padding-bottom: 40px;
    }
    .schedule-list .schedule-item:first-of-type:after {
        top: 10px;
        left: -5px;
        width: 11px;
        height: 11px;
    }
    .schedule-list-group.current
    .schedule-list
    .schedule-item:first-of-type:after {
        left: -7px;
        width: 15px;
        height: 15px;
    }
    .schedule-item__date {
        display: block;
        margin-bottom: 16px;
        font-size: 24px;
        font-weight: 600;
        line-height: 1.5;
        letter-spacing: -0.48px;
        color: var(--text-primary);
    }
    .schedule-item__title {
        margin-bottom: 8px;
        font-size: 20px;
    }
    .schedule-item__text {
        margin-bottom: 12px;
        font-size: 16px;
    }
    .schedule-list .schedule-item::before {
        height: calc(100% + 9px);
    }
}
/* ========================================
   역대 대회 주제 스타일
======================================== */
.themes-swiper {
    position: relative;
    height: auto;
    padding: 0 60px;
    overflow: hidden;
}
.themes-swiper .swiper-slide {
    /* width: 180px; */
    height: auto;
}
.themes-swiper .swiper-slide__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.themes-swiper .swiper-slide__image {
    margin-bottom: 24px;
}
.themes-swiper .swiper-slide__image img {
    display: block;
    width: 120px;
    height: 120px;
    object-fit: contain;
}
.themes-swiper .swiper-slide__title {
    margin-bottom: 16px;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.4px;
    color: var(--text-primary);
}
.themes-swiper .swiper-slide__description {
    font-size: 20px;
    font-weight: 400;
    text-align: center;
    word-break: keep-all;
}
.themes-swiper .swiper-nav--prev {
    left: 0;
}
.themes-swiper .swiper-nav--next {
    right: 0;
}
@media (max-width: 1280px) {
    .themes-swiper {
        padding: 0 40px;
    }
    .themes-swiper .swiper-slide__title {
        font-size: 20px;
    }
    .themes-swiper .swiper-slide__description {
        font-size: 16px;
    }
}
@media (max-width: 768px) {
    .themes-swiper {
        padding: 0 10px;
    }
    .themes-swiper .swiper-slide__image img {
        width: 80px;
        height: 80px;
    }
    .themes-swiper .swiper-slide__title {
        font-size: 20px;
    }
    .themes-swiper .swiper-slide__description {
        font-size: 16px;
    }
    .themes-swiper .swiper-nav--prev {
        left: -5px;
    }
    .themes-swiper .swiper-nav--next {
        right: -5px;
    }
}
/* ========================================
   박스 리스트 스타일
======================================== */
.box-list {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    margin-top: 80px;
}
.box-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 40px;
    border-radius: 16px;
    background: #f0f3f8;
}
.box-item__content {
    display: block;
    width: 100%;
}
.box-item__title {
    margin-bottom: 12px;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.4px;
    color: var(--text-primary);
    word-break: keep-all;
}
.box-item__description {
    margin-bottom: 32px;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.36px;
    color: var(--text-primary);
    word-break: keep-all;
}
.box-item__image {
    max-width: 145px;
}
@media screen and (max-width: 768px) {
    .box-list {
        margin-top: 40px;
        gap: 40px;
    }
    .box-item {
        flex-direction: column-reverse;
        padding: 40px 16px;
    }
    .box-item__image {
        width: 119px;
        height: 119px;
        margin-bottom: 40px;
        object-fit: contain;
        border-radius: 0;
        overflow: hidden;
    }
    .box-item__image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
    .box-item__title {
        margin-bottom: 20px;
        font-size: 18px;
    }
    .box-item__description {
        margin-bottom: 24px;
        font-size: 16px;
    }
    .box-item .btn {
        width: 100%;
    }
}
/* ========================================
   로고 페이지
======================================== */
.logo-box {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 320px;
    margin-top: 32px;
    margin-bottom: 80px;
    border-radius: 20px;
    background: url("../images/sub/bg_logo_box.jpg") no-repeat
    center center / 1180px 320px;
    font-size: 0;
    text-indent: -9999px;
}
.logo-box.france {
    background: url("../images/sub/bg_logo_box_fr.jpg")
    no-repeat center center / 1180px 320px;
}
.logo-box.portugal {
    background: url("../images/sub/bg_logo_box_pt.jpg")
    no-repeat center center / 1180px 320px;
}
.logo-box.italy {
    background: url("../images/sub/bg_logo_box_it.jpg")
    no-repeat center center / 1180px 320px;
}
.logo-box.spain {
    background: url("../images/sub/bg_logo_box_es.jpg")
    no-repeat center center / 1180px 320px;
}
/* ========================================
   섹션 콘텐츠 영역 (범용 레이아웃)
   왼쪽에 제목, 오른쪽에 콘텐츠를 배치하는 레이아웃
   오디오북, 워크북 등 다양한 페이지에서 재사용 가능
======================================== */
.logo-area,
.content-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    height: 100%;
    margin-bottom: 80px;
}
.logo-area:last-of-type,
.content-row:last-of-type {
    margin-bottom: 0;
}
.logo-area__title,
.content-row__title {
    min-width: 360px;
    max-width: 360px;
    /* margin-bottom: 24px; */
    padding-right: 40px;
}
.content-row__title:last-of-type {
    margin-bottom: 0;
}
.logo-area__title h5,
.content-row__title h5 {
    font-size: 24px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.48px;
    color: var(--text-primary);
    word-break: keep-all;
}
.logo-area__content,
.content-row__content {
    width: 776px;
    max-width: 100%;
    min-width: 0;
}
.logo-area__text {
    margin-bottom: 20px;
}
.logo-area__text h4 {
    font-size: var(--font-size-base);
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.4px;
    color: var(--text-primary);
    word-break: keep-all;
}
.logo-area__text p {
    font-size: var(--font-size-base);
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.32px;
    word-break: keep-all;
}
/* 로고 상하구조*/
.logo-area.no-flex {
    display:block;
}
.logo-area.no-flex .logo-area__title {
    min-width:100%;
    max-width:100%;
    margin-bottom: 20px;
}
.logo-area.no-flex .logo-area__content {
    width:100%;
}
.content-row__text {
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.4px;
    word-break: keep-all;
}
.content-row__text:last-of-type {
    margin-bottom: 0;
}
.content-row__sub-text {
    margin-top: 16px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.32px;
    word-break: keep-all;
}
.content-row__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
    overflow: hidden;
}
.logo-list {
    display: flex;
    flex-wrap: wrap;
    gap: 28px;
    width: 100%;
}
.logo-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    width: calc((100% - 56px) / 3);
    padding: 30px;
    border: 1px solid var(--border-medium);
    border-radius: 20px;
}
.logo-item__title {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.4px;
    color: var(--primary-color);
}
.logo-download-list {
    margin-bottom: 40px;
}
.logo-download-list .logo-item {
    width: 100%;
    min-height: 284px;
}
.logo-download-list:last-of-type {
    margin-bottom: 0;
}
/* 로고 다운로드 리스트의 이미지 프레임: 높이 120px 고정, 모든 프레임 동일하게 맞춤 */
.logo-download-list .logo-list .logo-item .logo-item__img-frame {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 120px;
    margin-bottom: 0;
}
.logo-download-list .logo-list .logo-item .logo-item__img-frame img {
    width: auto;
    max-width: 100%;
    max-height: 100%;
    height: auto;
    object-fit: contain;
}
.logo-download-list .logo-list.type-half .logo-item {
    width: calc((100% - 28px) / 2);
}
.logo-download-list .logo-list.type-lang {
    flex-wrap: wrap;
}
.logo-item .btn {
    margin-top: 28px;
}
.logo-list-title {
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.4px;
}
.logo-item img {
    display: block;
    width: 50%;
    object-fit: cover;
}
.logo-item__text {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.32px;
    text-align: center;
}
.logo-list-wrap .logo-item img {
    width: 80%;
}
.logo-area .block-wrap {
    margin-bottom: 40px;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.logo-area .block-wrap:last-of-type {
    margin-bottom: 0;
}
.logo-area .block-wrap .block {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    height: 232px;
    padding: 24px 32px;
    color: #fff;
    background-color: var(--text-primary);
}
.logo-area .block-wrap .block__text {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.32px;
}
.logo-area .block-wrap .block__title {
    margin-bottom: 8px;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.32px;
}
.logo-area .block-wrap .block__sub-title {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.32px;
}
/* span 사이 디바이더 스타일: 1px 너비, 14px 높이, 좌우 8px 여백 */
.logo-area .block-wrap .divider {
    display: inline-block;
    width: 1px;
    height: 14px;
    margin: -2px 8px 0;
    background-color: currentColor;
    vertical-align: middle;
}
.logo-area .block-wrap .block.bg-white {
    background-color: #fff;
    border: 1px solid var(--border-medium);
    color: var(--text-primary);
}
.logo-area .block-wrap .block.bg-red {
    background-color: var(--accent-color);
}
.logo-area .block-wrap .block.bg-blue {
    background-color: var(--primary-color);
}
.logo-area .block-wrap .block.bg-yellow {
    color: var(--text-primary);
    background: linear-gradient(90deg, rgba(251, 225, 38, 0.3) 0%, #fbe126 100%),
    #fff;
}

@media screen and (max-width: 1580px) {
    .logo-area {
        flex-direction: column;
        gap: 20px;
    }
    .logo-area__content {
        width: 100%;
    }
    .content-row__title {
        min-width: 180px;
        max-width: 180px;
    }
}
@media screen and (max-width: 1024px) {
    .logo-area,
    .content-row {
        flex-direction: column;
    }
    .logo-area__content,
    .content-row__content {
        width: 100%;
    }
    .logo-list {
        gap: 20px;
    }
}
@media screen and (max-width: 1024px) {
    .logo-download-list .logo-item {
        min-height: 0;
        justify-content: space-between;
        padding: 24px 34px;
        gap: 0;
    }
    .logo-area__title,
    .content-row__title {
        margin-bottom: 20px;
        min-width: 100%;
    }
    .logo-download-list .logo-item .btn {
        margin-top: 24px;
    }
}
@media screen and (max-width: 768px) {
    .logo-box {
        margin-bottom: 40px;
        padding: 35px 48px;
    }
    .logo-box__img {
        width: 50%;
    }
    .logo-area,
    .content-row {
        gap: 0;
        margin-bottom: 40px;
    }
    .logo-area .block-wrap .block.bg-red,
    .logo-area .block-wrap .block.bg-blue {
        flex: 0 0 auto;
        width: 100%;
    }
    .logo-area .block-wrap .block.bg-red {
        margin-bottom: 20px;
    }
    .logo-identity-list .logo-list {
        gap: 16px;
    }
    .logo-identity-list .logo-item {
        width: calc((100% - 32px) / 3);
        padding: 16px 8px;
    }
    .logo-identity-list .logo-item__text {
        font-size: 12px;
    }
    .logo-identity-list .logo-item img {
        width: 53px;
    }
    .logo-area .block-wrap {
        margin-bottom: 20px;
    }
    .logo-area .block-wrap .block {
        height: 184px;
        padding: 16px;
    }
    .logo-area .block-wrap .block__title {
        font-size: 16px;
    }
    .logo-area .block-wrap .block__sub-title {
        font-size: 14px;
    }
    .logo-area .block-wrap .block__text {
        font-size: 14px;
    }
    .content-row__sub-text {
        font-size: 14px;
    }
    .logo-area__title,
    .content-row__title {
        margin-bottom: 24px;
    }
    .logo-area__title h5,
    .content-row__title h5 {
        font-size: 20px;
    }
    .content-row__text {
        font-size: 16px;
    }
    .logo-list-title {
        margin-bottom: 16px;
    }
    .logo-download-list {
        margin-bottom: 20px;
    }
    .logo-download-list .logo-list.type-lang .logo-item {
        width: 100%;
    }
    .logo-download-list .logo-list.type-half .logo-item {
        width: 100%;
    }
    .logo-area .block-wrap .divider {
        height: 8px;
    }
}
@media screen and (max-width: 480px) {
    .logo-box__img {
        width: 100%;
    }
}
/*  */
.box-notice {
    width: 100%;
    padding: 40px;
    font-size: 18px;
    line-height: 1.5;
    letter-spacing: -0.36px;
    color: var(--text-primary);
    background-color: #f5f5f5;
    border-radius: 20px;
}
.box-notice__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 13px;
    margin-bottom: 32px;
}
.box-notice__content:last-of-type {
    margin-bottom: 0;
}
.box-notice__content h6 {
    margin-bottom: 11px;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.36px;
}
.box-notice__content p {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.36px;
}
.box-notice__footer {
    margin-top: 32px;
    padding-top: 32px;
    border-top: 1px solid var(--border-medium);
}
.box-notice__footer p {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.36px;
}
.box-notice .bullet-list li {
    margin-bottom: 4px;
}
.box-notice .bullet-list li:last-child {
    margin-bottom: 0;
}
@media screen and (max-width: 768px) {
    .box-notice {
        padding: 32px 16px;
    }
    .box-notice__content h6 {
        font-size: 16px;
    }
    .box-notice__content p {
        font-size: 14px;
    }
    .box-notice__footer {
        margin-top: 24px;
        padding-top: 24px;
    }
    .box-notice__footer p {
        font-size: 14px;
    }
}

/* ========================================
   오디오북 스타일
======================================== */
.audiobook {
    width: 100%;
}
.audiobook audio {
    display: none;
}
.audiobook .player {
    width: 100%;
    margin-bottom: 24px;
}
.audiobook .player-container {
    position: relative;
    width: 100%;
    padding: 66px 40px 24px;
    background-color: #fff;
    border-radius: 16px;
    border: 1px solid var(--border-medium);
}
.audiobook .player-header {
    text-align: center;
    margin-bottom: 24px;
}
.audiobook .player-title {
    font-size: 28px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
}
.audiobook .loading {
    position: absolute;
    display: none;
    align-items: center;
    justify-content: center;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 10;
    border-radius: 16px;
    background: rgba(34, 34, 34, 0.8);
    backdrop-filter: blur(4px);
}
.audiobook .loading.show {
    display: flex;
}
.audiobook .loading svg {
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
}
@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
.audiobook .progress-container {
    margin-bottom: 24px;
}
.audiobook .progress-wrapper {
    position: relative;
    width: 100%;
    height: 6px;
    background-color: #e5e7eb;
    border-radius: 4px;
    cursor: pointer;
    margin-bottom: 12px;
}
.audiobook .progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 0%;
    background-color: var(--primary-color);
    border-radius: 4px;
    transition: width 0.1s ease;
}
.audiobook .progress-handle {
    position: absolute;
    top: 50%;
    left: 0%;
    width: 16px;
    height: 16px;
    margin-left: -8px;
    margin-top: -8px;
    background-color: var(--primary-color);
    border-radius: 50%;
    cursor: grab;
    transition: left 0.1s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.audiobook .progress-handle:hover {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}
.audiobook .progress-handle:active {
    cursor: grabbing;
}
.audiobook .time-display {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: -0.32px;
}
.audiobook .controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 64px;
    margin-bottom: 40px;
}
.audiobook .control-button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 68px;
    height: 68px;
    cursor: pointer;
    transition: all 0.3s ease;
    padding: 0;
}
.audiobook .control-button:disabled {
    opacity: 0.3;
    cursor: not-allowed;
    pointer-events: none;
}
.audiobook .control-button.play-pause-button {
    width: 64px;
    height: 64px;
}
.audiobook .control-button svg {
    display: block;
    width: auto;
    height: auto;
}
.audiobook .player .info {
    position: relative;
    margin-top: 28px;
    padding-left: 20px;
    font-size: 14px;
    line-height: 1.5;
    color: var(--text-secondary);
}
.audiobook .player .info::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 0;
    width: 16px;
    height: 16px;
    background: url('../images/common/ico_info_gray.svg') no-repeat center center /
    contain;
}
.audiobook .audiobook__chapters {
    margin-bottom: 40px;
}
/* audioButton 클래스를 audio-button으로 변경 (카멜케이스 -> kebab-case) */
.audiobook .audio-button {
    position: relative;
    width: 100%;
    padding: 17px 20px 17px 10px;
    font-size: 18px;
    font-weight: 500;
    color: var(--text-primary);
    background-color: #fff;
    border: 1px solid var(--border-medium);
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: center;
}
.audio-button[aria-expanded="true"] {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
.audio-button__trigger {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.audio-button__text {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: block;
    font-size: 20px;
    font-weight: 600;
    color: var(--primary-color);
    transition: color 0.3s ease;
}
.audio-button__text--placeholder {
    color: var(--text-muted);
}
.audio-button__icon {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    transform-origin: center center;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    transition: -webkit-transform 0.3s ease;
    -webkit-transition: -webkit-transform 0.3s ease;
    -ms-transition: transform 0.3s ease;
    transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.audio-button[aria-expanded="true"] .audio-button__icon {
    -webkit-transform: translateY(-50%) rotate(180deg);
    -ms-transform: translateY(-50%) rotate(180deg);
    transform: translateY(-50%) rotate(180deg);
}
.audio-button__list {
    position: absolute;
    top: calc(100% + 1px);
    left: -1px;
    right: -1px;
    width: calc(100% + 2px);
    max-height: 300px;
    overflow-y: auto;
    background-color: #fff;
    border: 1px solid var(--border-medium);
    border-top: none;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
    transition: all 0.3s ease;
    z-index: 100;
    list-style: none;
    margin: 0;
}
.audio-button[aria-expanded="true"] .audio-button__list {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}
.audio-button__item {
    padding: 14px 20px;
    font-size: 20px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}
.audio-button__item:hover {
    background-color: #f9fafb;
    color: var(--primary-color);
}
.audio-button__item:focus {
    outline: none;
    background-color: #f9fafb;
    color: var(--primary-color);
}
.audio-button__item--selected {
    background-color: #f7f7f7;
    color: var(--primary-color);
    font-weight: 600;
}
.audiobook__notice {
    margin-top: 16px;
    font-size: 14px;
    line-height: 1.5;
    color: var(--text-secondary);
}
.audiobook .go_link {
    margin-top: 48px;
}
.audiobook .go_link > div {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: flex-start;
    justify-content: flex-start;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 5px;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
}
.audiobook .go_link > div .btn {
    flex: 0 0 auto;
    scroll-snap-align: start;
}
.audiobook-image-wrap {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 32px;
}
.audiobook-image-wrap img {
    width: calc((100% - 32px * 2) / 3);
    min-width: 300px;
}
.audiobook__more {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 24px;
    font-size: var(--font-size-base);
}
/* 반응형 */
@media screen and (max-width: 1280px) {
    .audiobook-image-wrap img {
        width: calc((100% - 32px) / 2);
    }
}
@media screen and (max-width: 768px) {
    .audiobook .player {
        margin-bottom: 20px;
    }
    .audiobook .controls {
        justify-content: space-between;
    }
    /* audioButton 클래스를 audio-button으로 변경 (카멜케이스 -> kebab-case) */
    .audio-button__icon {
        width: 24px;
        height: 24px;
    }
    .audiobook .audio-button {
        padding: 7px 20px 7px 10px;
        border-radius: 16px;
    }
    .audio-button__item {
        padding: 7px 10px;
    }
    .audio-button[aria-expanded="true"] {
        border-radius: 16px 16px 0 0;
    }
    .audiobook-image-wrap {
        gap: 20px;
    }
    .audiobook-image-wrap img {
        width: 100%;
        min-width: auto;
    }
    .audiobook .go_link {
        width: calc(100% + 20px);
        margin-right: -20px;
        margin-top: 32px;
    }
    .audiobook .go_link div {
        padding-right: 20px;
    }
}

/* ========================================
   대회발자취 스타일
======================================== */
.accordion--history {
    border: none;
}
.accordion--history .accordion__title {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.72px;
    color: var(--primary-color);
}
.audiobook .player .info {
    font-size: 10px;
}
.accordion--history .accordion__trigger {
    padding: 0;
}
.accordion--history .accordion__item {
    /* border: none; */
    margin-bottom: 64px;
    padding-bottom: 64px;
}
.accordion--history .accordion__content {
    padding: 40px 0 0;
    background-color: transparent;
}
.accordion--history .accordion__trigger:hover {
    background-color: transparent;
}
.accordion--history .schedule-list-group {
    gap: 0;
}
.accordion--history .schedule-list-group .schedule-date {
    min-width: 300px;
}
.accordion--history .schedule-list .schedule-item {
    min-height: 260px;
    margin-left: calc(100vw / 1920 * 80);
    padding-left: calc(100vw / 1920 * 80);
    padding-bottom: 40px;
}
.accordion--history .schedule-date .schedule-item__image {
    width: 300px;
    aspect-ratio: 300 / 220;
    object-fit: cover;
}
.accordion--history .schedule-item .schedule-item__image {
    display: none;
}
.accordion--history .schedule-item__text {
    font-size: var(--font-size-base);
}
.accordion--history .schedule-list .schedule-item:after {
    content: "";
    position: absolute;
    top: 18px;
    left: -7px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: var(--primary-color);
}
.accordion--history .schedule-list .schedule-item.no-line {
    min-height: auto;
    /* padding-bottom: 0; */
}
.accordion--history .schedule-list .schedule-item.no-line::before {
    content: none;
}
@media screen and (max-width: 1023px) {
    .accordion--history .schedule-list-group .schedule-date {
        min-width: 200px;
    }
    .accordion--history
    .schedule-list-group
    .schedule-date
    .schedule-item__image {
        width: 200px;
    }
    .accordion--history .schedule-list .schedule-item {
        min-height: 187px;
    }
}
@media screen and (max-width: 768px) {
    .accordion--history .accordion__item {
        margin-bottom: 20px;
        padding-bottom: 20px;
    }
    .accordion--history .accordion__title {
        font-size: 24px;
    }
    .accordion--history .accordion__content {
        padding-top: 24px;
    }
    .accordion--history .schedule-list .schedule-item {
        min-height: auto;
        margin-left: 7px;
        padding-left: 27px;
        padding-bottom: 40px;
    }
    .accordion--history .accordion__content .schedule-item__title {
        margin-bottom: 12px;
        font-size: 24px;
    }
    .accordion--history .accordion__content .schedule-item__text {
        margin-bottom: 12px;
        font-size: 16px;
    }
    .accordion--history .schedule-list .schedule-item .schedule-item__image {
        display: block;
        width: auto;
        max-width: 100%;
    }
    .accordion--history .schedule-item__contents .btn--link {
        margin-top: 12px;
    }
    .accordion--history .schedule-list .schedule-item:after {
        left: -5px;
        width: 11px;
        height: 11px;
    }
}
/* ========================================
   워크북 내려받기 스타일
======================================== */
.workbook-download .tabs {
    margin-bottom: 44px;
}
.workbook-download .workbook-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 20px;
}
.workbook-download .workbook-links:first-of-type {
    margin-bottom: 20px;
}
.workbook-download .workbook-links a {
    aspect-ratio: 220 / 187;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: calc((100% - 20px * 5) / 6);
    min-width: 157px;
    padding: 20px;
    position: relative;
    color: var(--text-primary);
    text-align: center;
    font-weight: 600;
    line-height: normal;
    background: #f0f3f8;
    border-radius: 20px;
    overflow: hidden;
}
.workbook-download .workbook-links a.chapter-all {
    background-color: #fff;
    border: 1px solid var(--border-light);
}
.workbook-download .workbook-links.type-text a {
    aspect-ratio: 220 / 112;
}
.workbook-download .workbook-links a p {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.5;
}
.workbook-download .workbook-links a::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0);
    z-index: 1;
    transform: translateY(0%);
    transition: transform 0.1s ease;
}
.workbook-download .workbook-links a:hover::before {
    background: rgba(17, 17, 17, 0.4)
    url("../images/common/ico_downloand_type_2_w.svg") 50% no-repeat;
    background-size: 41px;
    transform: translateY(0);
}
/* 다운로드 중 로딩 오버레이 - 배경은 고정, 스피너만 회전 */
.workbook-download .workbook-links a .loading-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    border-radius: 20px;
    background: rgba(17, 17, 17, 0.4);
    backdrop-filter: blur(4px);
}
/* 로딩 스피너 아이콘 - 스피너만 회전 */
.workbook-download .workbook-links a .loading-overlay .spinner {
    width: 41px;
    height: 41px;
    background-image: url("../images/common/download_rotation_spiner.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
}
.workbook-download .workbook-links a.chapter span {
    position: absolute;
    top: 0;
    left: 0;
    padding: 10px 20px;
    color: #fff;
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.4px;
    background: var(--text-primary);
    border-radius: 0 0 20px 0;
}
.workbook-download .workbook-links a.chapter1 {
    background: url("../images/sub/workbook_01.png") 50% no-repeat;
    background-size: 100%;
}
.workbook-download .workbook-links a.chapter2 {
    background: url("../images/sub/workbook_02.png") 50% no-repeat;
    background-size: 100%;
}
.workbook-download .workbook-links a.chapter3 {
    background: url("../images/sub/workbook_03.png") 50% no-repeat;
    background-size: 100%;
}
.workbook-download .workbook-links a.chapter4 {
    background: url("../images/sub/workbook_04.png") 50% no-repeat;
    background-size: 100%;
}
.workbook-download .workbook-links a.chapter5 {
    background: url("../images/sub/workbook_05.png") 50% no-repeat;
    background-size: 100%;
}
.workbook-download .workbook-links a.chapter6 {
    background: url("../images/sub/workbook_06.png") 50% no-repeat;
    background-size: 100%;
}
.workbook-download .workbook-links a.chapter7 {
    background: url("../images/sub/workbook_07.png") 50% no-repeat;
    background-size: 100%;
}
.workbook-download .workbook-links a.chapter8 {
    background: url("../images/sub/workbook_08.png") 50% no-repeat;
    background-size: 100%;
}
.workbook-download .workbook-links a.chapter9 {
    background: #d2d5da url("../images/sub/workbook_09.png") 50%
    no-repeat;
    background-size: 100%;
}
@media (max-width: 768px) {
    .workbook-download .workbook-links:first-of-type {
        margin-bottom: 24px;
    }
    .workbook-download .workbook-links {
        gap: 24px 20px;
    }
    .workbook-download .workbook-links a {
        width: calc((100% - 20px) / 2);
        min-width: auto;
        max-width: 260px;
    }
    .workbook-download .workbook-links a p {
        font-size: 14px;
    }
    .workbook-download .workbook-links a.chapter span {
        font-size: 14px;
    }
}
/* ========================================
   준비기도문 스타일
======================================== */
.prayer-text-wrap .schedule-list .schedule-item:after {
    content: "";
    position: absolute;
    top: 7px;
    left: -7px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: var(--primary-color);
}
.prayer-text-wrap .schedule-list .schedule-item {
    margin-left: 10px;
    padding-bottom: 64px;
}
.prayer-text-wrap .schedule-list .schedule-item::before {
    top: 7px;
    background-color: var(--border-medium);
}
.prayer-text-wrap .schedule-item.current:after {
    top: 5px;
    left: -12px;
    width: 25px;
    height: 25px;
    background: url('../images/common/ico_d_dots_blue.svg') no-repeat center
    center / 100% 100%;
}
.prayer-text-wrap .schedule-item.cross:after {
    top: 3px;
    left: -13px;
    width: 27px;
    height: 27px;
    background: url('../images/common/ico_blue_cross.svg') no-repeat center
    center / 100% 100%;
}
.prayer-text-wrap .schedule-item:last-of-type::before {
    height: 250%;
}
.prayer-text-wrap .schedule-item__text {
    font-weight: 400;
    word-break: break-all;
    letter-spacing: normal;
}
.prayer-text-wrap .schedule-item.border-icon::after {
    background-color: #fff;
    border: 2px solid var(--primary-color);
    border-radius: 50%;
}
.prayer-text-wrap .schedule-item.double-border-icon::after {
    background: url('../images/common/ico_double_border_circle_blue.svg')
    no-repeat center center / 100% 100%;
    border: none;
}
.prayer-text-wrap .schedule-item:last-child::before {
    display: none;
}
.prayer-info-wrap {
    margin-top: 17px;
}
.prayer-info-text {
    margin-bottom: 24px;
    font-size: var(--font-size-base);
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.4px;
}
.prayer-info-text:last-of-type {
    margin-bottom: 0;
}
@media screen and (max-width: 1023px) {
    .prayer-text-wrap .schedule-list .schedule-item {
        margin-left: 15px;
    }
}
@media screen and (max-width: 768px) {
    .prayer-text-wrap .schedule-list .schedule-item::after {
        left: -5px;
        width: 11px;
        height: 11px;
    }
    .prayer-text-wrap .schedule-list .schedule-item.current:after {
        left: -7px;
        width: 15px;
        height: 15px;
    }
    .prayer-text-wrap .schedule-list .schedule-item.cross:after {
        top: 0;
        left: -11px;
        width: 23px;
        height: 23px;
    }
    .prayer-text-wrap .schedule-list .schedule-item {
        padding-bottom: 28px;
    }
    .prayer-info-wrap {
        margin-top: 12px;
    }
}
/* ========================================
   steps 스타일
======================================== */
.steps {
    display: flex;
    justify-content: space-between;
    gap: 33px;
    width: 100%;
}
.steps__item {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    min-height: 208px;
    padding: 20px;
    border-radius: 16px;
    border: 1px solid var(--border-light);
}
.steps__item::after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -25px;
    width: 15px;
    height: 15px;
    background: url('../images/common/ico_steps_arrow_r.svg') no-repeat center
    center / 100% 100%;
}
.steps__item:last-of-type::after {
    display: none;
}
.steps__number {
    margin-bottom: 4px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.48px;
    color: var(--text-primary);
}
.steps__title {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.32px;
    color: var(--text-primary);
}
.steps__title span {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.28px;
    color: var(--text-secondary);
}
.steps__icon {
    width: 52px;
    margin-left: auto;
    aspect-ratio: 1 / 1;
    object-fit: contain;
}
@media screen and (max-width: 768px) {
    .steps {
        flex-direction: column;
        gap: 64px;
    }
    .steps__item {
        flex-direction: row;
        align-items: center;
        width: 100%;
        min-height: 130px;
        gap: 20px;
    }
    .steps__item::after {
        top: auto;
        right: auto;
        left: 50%;
        bottom: -45px;
        width: 24px;
        height: 24px;
        transform: translateX(-50%) rotate(90deg);
    }
    /* .steps__icon {
    width: 82px;
    height: 82px;
  } */
}
/* ========================================
   method-list 스타일
======================================== */
.method-list {
    width: 100%;
    margin-top: 24px;
}
.method-list__item {
    margin-bottom: 80px;
}
.method-list__item:last-of-type {
    margin-bottom: 0;
}
.method-list__title {
    margin-bottom: 24px;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.48px;
    color: var(--text-primary);
}
.method-list__text {
    margin-bottom: 16px;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.4px;
    color: var(--text-primary);
}
.method-list__sub-text {
    margin-bottom: 8px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.32px;
    color: var(--text-secondary);
}
.method-list__sub-text:last-of-type {
    margin-bottom: 0;
}
.method-list__box {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    width: 100%;
    margin-top: 64px;
}
.method-list__box::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 70%;
    min-height: 182px;
    border-radius: 16px;
    background-color: #f2f2f2;
    z-index: -1;
}
.method-list__box .box-left {
    width: calc(100% / 672 * 209);
    margin-left: calc(100% / 672 * 52);
}
.method-list__box .box-right {
    padding-right: calc(100% / 672 * 72);
    padding-bottom: 12px;
}
.method-list__box .box-right p {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.4px;
    color: var(--text-primary);
}
.method-list__box .box-right .qr-list {
    margin-top: 16px;
    display: flex;
    gap: 12px;
}

.method-list__box .box-right .qr-list li img {
    width: 74px;
    height: 73px;
    object-fit: contain;
}
.method-list__box .box-right .qr-list li p {
    margin-top: 4px;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
}
@media screen and (max-width: 768px) {
    .method-list__item {
        margin-bottom: 40px;
    }
    .method-list__title {
        margin-bottom: 20px;
        font-size: 20px;
    }
    .method-list__text {
        margin-bottom: 14px;
        font-size: 16px;
    }
    .method-list__sub-text {
        margin-bottom: 8px;
        font-size: 14px;
    }
}
@media screen and (max-width: 480px) {
    .method-list__box {
        flex-direction: column;
        align-items: center;
        margin-top: 40px;
        padding: 0 65px 20px;
    }
    .method-list__box::before {
        height: 83%;
    }
    .method-list__box .box-left {
        width: 100%;
        margin: 0 auto 40px;
    }
    .method-list__box .box-right {
        padding: 0;
    }
    .method-list__box .box-right p {
        text-align: center;
    }
}

/* ========================================
   이미지 오류 스타일
======================================== */
.swiper-slide img.onerror,
.board-list .board-item.type--image img.onerror,
.card__image img.onerror {
    content: url("../images/sub/img_wyd_default_01.png");
}
.main-section.section-gallery .video-box img.onerror {
    content: url("../images/sub/img_wyd_default_01.png");
}
.main-section.section-gallery .photo-box img.onerror {
    content: url("../images/sub/img_wyd_default_01.png");
}
.cards-flex.type-newsletter .card__image img.onerror {
    content: url("../images/sub/img_wyd_default_02.png");
}
/* ========================================
   봉헌현황 페이지
======================================== */
.status-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: calc(100% / 1180 * 148);
}
/* 게이지 스타일 */
.gauge-wrap {
    position: relative;
    min-width: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.gauge {
    flex: 0 0 auto;
    width: 100%;
    height: 100%;
}
.gauge__bg {
    stroke: #eee;
}
.gauge__progress {
    transition: stroke-dashoffset 2s ease-out;
    stroke: var(--primary-color);
    /*stroke-dasharray: 534.07;*/
    /*stroke-dashoffset: 534.07;*/
}
.gauge__content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.gauge__title {
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
}
.gauge__content-number {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 4px;
}
.gauge__number {
    font-size: 28px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.56px;
}
.gauge__unit {
    font-size: 28px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.56px;
}

/* 봉헌 현황 리스트 스타일 */
.status-list {
    width: 100%;
    max-width: 548px;
}
.status-list li {
    flex: 1;
    /* display: flex;
  align-items: center;
  justify-content: space-between; */
}
.status-list li:last-of-type {
    margin-top: 40px;
    padding-top: 40px;
    border-top: 1px solid var(--border-medium);
}
.status-list .list-item__text {
    margin-right: 16px;
    font-size: 28px;
    font-weight: 700;
}
.status-list .list-item__text small {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.32px;
}
.status-list .list-item__value {
    margin-top: 20px;
    font-size: 28px;
    font-weight: 700;
    text-align: right;
}
.status-list .list-item__value .value-num {
    margin-right: 20px;
    color: var(--primary-color);
}

@media screen and (max-width: 1280px) {
    .status-list li {
        flex-wrap: wrap;
    }
    .status-list .list-item__text {
        font-size: 24px;
    }
    .status-list .list-item__value {
        font-size: 24px;
    }
    .status-list .list-item__value .value-num {
        margin-right: 16px;
    }
}
@media screen and (max-width: 768px) {
    .gauge__bg,
    .gauge__progress {
        stroke-width: 30;
    }
    .gauge__title {
        font-size: 16px;
        /* font-weight: 400; */
    }
    .gauge__number {
        font-size: 20px;
        /* font-weight: 400; */
    }
    .gauge__unit {
        font-size: 20px;
        /* font-weight: 400; */
    }
    .status-list .list-item__text {
        font-size: 20px;
    }
    .status-list .list-item__value {
        margin-top: 12px;
        font-size: 20px;
    }
    .status-list .list-item__value .value-num {
        margin-right: 12px;
    }
}
@media (max-width: 480px) {
    .status-wrap {
        flex-wrap: wrap;
        justify-content: center;
        gap: 40px;
    }
    .gauge-wrap {
        margin-top: 4px;
    }
    .gauge {
        width: 200px;
    }
    .gauge__bg,
    .gauge__progress {
        stroke-width: 30;
    }
}
/* 봉헌 현황 테이블 스타일 */
#tab-panel-diocese table th,
#tab-panel-organization table th {
    width: 50%;
}
/* ========================================
   봉헌하기 페이지 스타일
======================================== */

.section-rosary .rosary-container h4 {
    margin-bottom: 44px;
    text-align: center;
}
.section-rosary .rosary-title {
    font-size: var(--font-size-large);
    font-weight: 600;
    text-align: center;
}
.section-rosary .rosary-text {
    font-size: var(--font-size-base);
}
.section-rosary .rosary-form {
    margin-top: 40px;
}
.section-rosary .rosary-form__name {
    margin-bottom: 8px;
    color: var(--primary-color);
    font-size: 20px;
    font-weight: 700;
}
.section-rosary .rosary-form__status {
    width: 100%;
    padding: 49px 0;
    background: #f2f2f2;
    border-radius: 20px;
}
.section-rosary .rosary-form__status p {
    font-size: 28px;
    font-weight: 700;
}
.section-rosary .rosary-form__time {
    margin-top: 12px;
    margin-bottom: 64px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.32px;
    color: var(--text-secondary);
}
/* 묵주알 버튼 리스트 */
.section-rosary .bead-wrap {
    margin-top: 64px;
}
.section-rosary .bead-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
}
.section-rosary .bead-list li {
    flex: 0 0 auto;
}
.section-rosary .bead-btn {
    width: 77px;
    height: 77px;
    border-radius: 50%;
    border: none;
    background-color: #fff;
    background-image: url("../images/sub/img_rosary_bead.png");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.3;
    pointer-events: auto; /* disabled 상태여도 클릭 가능하도록 */
}
.section-rosary .bead-btn.active {
    opacity: 1;
}
.section-rosary .bead-btn:disabled {
    opacity: 0.3;
    cursor: pointer; /* disabled 상태여도 커서는 pointer 유지 */
}
.section-rosary .bead-btn span {
    display: block;
    text-indent: -9999px;
}
/* .section-rosary .input-wrap {
  margin-top: 64px;
} */
/* .section-rosary .btn--form {
  margin-top: 32px;
} */
.section-rosary .rosary-form__logout {
    display: inline-block;
    margin-top: 20px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.32px;
    text-align: center;
}
@media (max-width: 768px) {
    .section-rosary .bead-wrap {
        margin-top: 40px;
    }
    .section-rosary .bead-btn {
        width: 60px;
        height: 60px;
    }
    .section-rosary .rosary-form__current {
        margin-top: 24px;
    }
    .section-rosary .rosary-form__time {
        margin-bottom: 40px;
    }
    .section-rosary .btn--form {
        margin-top: 20px;
    }
}
@media (max-width: 480px) {
    .section-rosary .bead-btn {
        width: 45px;
        height: 45px;
    }
}
/* 묵주기도 참여 이메일 인증 로그인 */
.section-rosary .rosary-container .auth-form {
    margin-top: 40px;
}
/* ========================================
   폼 컨테이너 스타일
======================================== */
.form-page {
    border-bottom: 1px solid var(--border-light);
    background: #efefef;
}
.form-page-content {
    width: 100%;
}
.form-container {
    max-width: 590px;
    margin: 0 auto;
}
.content-row .form-container {
    margin: 0;
}
/* ========================================
   폼 페이지 스타일
======================================== */
.form-page .page-header {
    text-align: center;
}
.auth-info-box {
    display: none; /* 초기 숨김 - 인증번호 받기 버튼 클릭 시 표시 */
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 64px;
    margin-top: 20px;
    padding: 20px 24px;
    background-color: #fff;
    border-radius: 8px;
    border: 1px solid #666;
}
.auth-info-box.is-visible {
    display: flex; /* 표시될 때 flex로 변경 */
}
.auth-info-box > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.auth-info-box p {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: -0.32px;
    color: var(--text-primary);
}
.auth-info-box .auth-timer {
    color: var(--primary-color);
}
.auth-info-box .btn--link {
    padding: 0;
    text-decoration: underline;
}
.auth-info-text {
    margin-top: 20px;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: -0.32px;
    color: var(--text-primary);
}
@media (max-width: 768px) {
    .auth-info-box {
        flex-direction: column;
        flex-wrap: wrap;
        height: auto;
    }
    .auth-info-box > div {
        flex-direction: column;
        align-items: center;
        gap: 0px;
    }
    .auth-info-box .btn--link {
        margin-top: 20px;
    }
}
/* ========================================
   섹션 헤더 스타일
======================================== */
.header-section {
    text-align: center;
}
.header-section__title {
    margin-bottom: 24px;
    font-size: 36px;
    font-weight: 600;
}
.header-section__title span {
    font-size: var(--font-size-large);
}
.header-section__text {
    font-size: var(--font-size-base);
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.4px;
}
.header-section__image {
    margin-top: 40px;
}
.header-section__image img {
    min-width: 100%;
    width: 100%;
    height: auto;
    object-fit: cover;
}
/* ========================================
   콘텐츠 행 스타일
======================================== */
.content-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    gap: calc(100% / 1180 * 40);
}
.content-row__title {
    flex: 0 0 auto;
}
/* 연수 신청 현황 스타일 */
/* 연수 신청 테이블 반응형 스타일 */
.table-apply-list .table-wrap {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}
.table-apply-list .table {
    min-width: 100%;
}
.table-apply-list .table thead th {
    font-size: 17px;
}
.table-apply-list .table tbody td {
    padding: 17px 5px;
    word-break: keep-all;
}
.table-apply-list .table tbody .status-cell {
    white-space: nowrap;
}

@media (max-width: 1680px) {
    /* 태블릿 뷰에서 테이블 가로 스크롤 허용 */
    .table-apply-list .table-wrap {
        overflow-x: auto;
    }
    .table-apply-list .table {
        min-width: 1180px;
        padding-bottom: 20px;
    }
}
@media (max-width: 768px) {
    /* 모바일 뷰에서 카드형 테이블 구현 */
    .table-apply-list .table {
        min-width: 100%;
        border-collapse: separate;
        border-spacing: 0;
    }
    .table-apply-list .table thead {
        display: none;
    }
    .table-apply-list .table tbody {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
    .table-apply-list .table tbody tr {
        display: grid;
        grid-template-columns: 1fr;
    }
    .table-apply-list .table tbody tr.no-data {
        display: table-row;
        padding: 0;
        border: 0;
        border-radius: 0;
    }
    .table-apply-list .table tbody tr.no-data td {
        display: block;
        width: 100%;
        padding: 24px 16px;
        text-align: center;
        border-bottom: none;
    }
    .table-apply-list .table tbody td {
        position: relative;
        /* display: flex;
    gap: 16px;
    align-items: center;
    justify-content: flex-start; */
        width: 100%;
        height: 100%;
        min-height: auto;
        /* padding: 0; */
        padding: 17px 17px 17px 144px;
        border: 0;
        font-size: 14px;
        line-height: 1.6;
        text-align: left;
        border-bottom: 1px solid #cdcdcd;
    }
    .table-apply-list .table tbody td:first-child {
        border-top: 1px solid #cdcdcd;
    }
    .table-apply-list .table tbody td::before {
        position: absolute;
        top: 0;
        left: 0;
        content: attr(data-label);
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 128px;
        height: 100%;
        background-color: var(--text-primary);
        color: #fff;
        text-align: center;
    }
    .table-apply-list .table tbody tr.no-data td::before {
        display: none;
    }
    .table-apply-list .table tbody td.status-cell {
        align-items: center;
    }
}
/* ========================================
   연수 신청 상세 스타일
======================================== */
.table-apply-detail {
    max-width: 590px;
}

/*나무심기*/
.ico {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.ico::before {
    content: "";
    display: inline-block;
}
.ico.calendar::before {
    width: 24px;
    height: 24px;
    background: url("../images/common/ico_calendar.svg") no-repeat left center /
    24px 24px;
}
.ico.place::before {
    width: 18px;
    height: 26px;
    background: url("../images/common/ico_place.svg") no-repeat left center /
    18px 26px;
}
.page-section .registration-closed {
    text-align: center;
    color: #666;
}
/* ========================================
   수퍼클래스 스타일
======================================== */
.superclass-list-wrap {
    margin-top: 64px;
}
.superclass-list-title {
    margin-bottom: 24px;
    font-size: var(--font-size-large);
    font-weight: 600;
}
.superclass-list {
    display: flex;
    justify-content: space-between;
    gap: 38px;
    flex-wrap: wrap;
}
.superclass-item {
    width: calc((100% - 76px) / 3);
    text-align: center;
}
.superclass-item img {
    width: 100%;
    height: auto;
    aspect-ratio: 368/521;
    object-fit: cover;
}
.superclass-item .btn {
    margin-top: 30px;
}
@media screen and (max-width: 768px) {
    .superclass-list {
        justify-content: center;
    }
    .superclass-item {
        width: 100%;
        max-width: 368px;
    }
    .superclass-item:not(:last-child) {
        display: none;
    }
    .superclass-list {
        gap: 24px;
    }
    .superclass-item .btn {
        margin-top: 24px;
    }
}
/* ========================================
   주제가 공모 페이지 스타일
======================================== */
.page-youtube .page-section__title {
    font-weight: 700;
    letter-spacing: -0.48px;
    margin-bottom: 24px;
    position: relative;
}
.page-youtube .page-section__title::before {
    content: "";
    display: inline-block;
    position: relative;
    top: 10px;
    left: 0;
    margin-right: 8px;
    width: 36px;
    height: 36px;
    background: url("../images/common/ico_play_circle.svg") no-repeat 50% /
    36px 36px;
}
.page-youtube .page-section__text {
    font-weight: 400;
    margin-bottom: 40px;
}
.page-section__title .reference {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.32px;
    position: relative;
    top: -3px;
}
/* ========================================
   십자가 순례 스타일
======================================== */
.section-cross-current .current {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 145px;
    padding: 0 51px;
    background: url('../images/main/cross_current_bg.png') no-repeat;
    border-radius: 16px;
    background-size: 1180px 145px;
    background-position: center center;
}
.section-cross-current .current p {
    font-size: 20px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.4px;
    text-align: center;
}
.section-cross-current strong {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.56px;
    color: var(--primary-color);
}
@media screen and (max-width: 768px) {
    .section-cross-current .current {
        padding:30px 51px;
        background: none;
        background-color: #f5f5f5;
    }
}
.section-cross-future .cross-future {
    position: relative;
    width: calc(100% + 10vw);
}
.cross-future-swiper {
    align-items: stretch;
    margin-top: 12px;
}
.cross-future-swiper .swiper-slide {
    width: 271px;
    height: 301px;
    margin-right: 32px;
}
.cross-future-swiper .bx {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    height: 100%;
    padding: 36px 52px 0;
    background: url('../images/main/cross_slider_item.png') no-repeat
    center center / 100% 100%;
    border-radius: 16px;
    overflow: hidden;
}
.cross-future-swiper .bx.today {
    color: #fff;
    background: url('../images/main/cross_slider_item_today.png') no-repeat
	center center / 100% 100%;
}
.cross-future-swiper .bx .icon-location {
    width: 40px;
    height: 40px;
    margin-bottom: 20px;
    background: url('../images/common//ico_location_b.svg') no-repeat center
    center / 100% 100%;
}
.cross-future-swiper .bx.bx.today .icon-location {
    background: url('../images/common/ico_location_w.svg') no-repeat center
    center / 100% 100%;
}
.cross-future-swiper .bx .location {
    margin-bottom: 16px;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.32px;
    text-align: center;
}
.cross-future-swiper .bx .date {
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: -0.32px;
    text-align: center;
}
.cross-future-swiper .bx .date p {
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: -0.32px;
}
.cross-future-swiper .bx .btn {
    margin-top: 16px;
}
.cross-future .slider-popup__nav {
    padding: 0;
}
@media screen and (max-width: 768px) {
    .cross-future .slider-popup__nav {
        display: flex;
    }
}
.section-cross-past .cross-past {
    width: 100%;
}
.section-cross-past .cross-past-list {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.section-cross-past .cross-past-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 40px;
    background-color: #f5f5f5;
    border-radius: 16px;
}
.section-cross-past .cross-past-item .location {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.4px;
}
.section-cross-past .cross-past-item .location::before {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    background: url('../images/common/ico_location_b.svg') no-repeat center
    center / 100% 100%;
}
.section-cross-past .cross-past-item .date {
    margin-top: 12px;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.36px;
}
.section-cross-past .cross-past-item .btn {
    margin-top: auto;
}
.section-cross-past .btn-wrap {
    margin-top: 40px;
}
.section-cross-future .slider-refresh {
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url('../images/common/ico_refresh.svg') no-repeat center center /
    100% 100%;
    text-indent: -9999px;
    overflow: hidden;
}
@media screen and (max-width: 768px) {
    .section-cross-past .cross-past-list {
        gap: 20px;
    }
    .section-cross-past .cross-past-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        padding: 40px 24px;
    }
}

/* ========================================
   개인정보처리방침 및 쿠키 정책 페이지 스타일
======================================== */
.privacy-policy-page .page-container {
    flex-direction: column;
    align-items: flex-start;
}

/* 정책 콘텐츠 영역 */
.policy-content {
    width: 100%;
    padding-top: 40px;
}

.policy-section {
    margin-bottom: 60px;
}

.policy-section:last-child {
    margin-bottom: 0;
}

.policy-section__title {
    font-size: 24px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.48px;
    color: var(--text-primary);
    margin-bottom: 24px;
    word-break: keep-all;
}

.policy-section__content {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.75;
    letter-spacing: -0.32px;
    color: var(--text-primary);
    word-break: keep-all;
}

.policy-section__content p {
    margin-bottom: 16px;
}

.policy-section__content p:last-child {
    margin-bottom: 0;
}

.policy-section__content ol,
.policy-section__content ul {
    margin: 16px 0;
    padding-left: 24px;
}

.policy-section__content li {
    margin-bottom: 12px;
    line-height: 1.75;
}

.policy-section__content li:last-child {
    margin-bottom: 0;
}

/* 반응형 스타일 */
@media (max-width: 768px) {
    .policy-content {
        padding-top: 24px;
    }

    .policy-section {
        margin-bottom: 40px;
    }

    .policy-section__title {
        font-size: 20px;
        margin-bottom: 16px;
    }

    .policy-section__content {
        font-size: 14px;
    }

    .policy-section__content ol,
    .policy-section__content ul {
        padding-left: 20px;
    }

    .policy-section__content li {
        margin-bottom: 8px;
    }
}

/* ========================================
   개인정보처리방침 및 쿠키 정책 페이지 스타일
======================================== */
.policy-content {
    width: 100%;
    padding: 65px 24px;
    background-color: #fff;
    border-radius: 8px;
    border: 1px solid var(--border-medium);
}
.policy-content .policy-section {
    margin-bottom: 40px;
}
.policy-content .policy-section:last-child {
    margin-bottom: 0;
}
@media screen and (max-width: 768px) {
    .policy-content {
        padding: 20px;
    }
    .policy-content .policy-section {
        margin-bottom: 20px;
    }
}
/* ========================================
   쿠키 설정 모달 스타일
======================================== */
.cookie-modal .modal__body {
    height: 382px;
    overflow-y: auto;
}
@media screen and (max-width: 768px) {
    .cookie-modal .modal__body {
        height: auto;
    }
}
/* ========================================
   쿠키 사용 모달 스타일
======================================== */
.cookie-info-modal .modal__content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}
.cookie-info-modal .modal__content p {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.36px;
}
.cookie-info-modal .modal__content .btn-wrap {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}
.cookie-info-modal .modal__content .btn-wrap .btn {
    min-width: auto;
}
@media screen and (max-width: 768px) {
    .cookie-info-modal .modal__content {
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
    }
    .cookie-info-modal .modal__content .btn-wrap {
        width: 100%;
    }
}

/* ========================================
   연수 신청 현황 스타일
======================================== */
.td-flex {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

/* ========================================
   길잡이 스타일
======================================== */
.guide-box {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
}
.guide-box > div {
    flex: 1;
}
.guide-box__left {
    padding: 20px 0;
    background-color: var(--GRAY_01);
    text-align: center;
}
.guide-box__left-image {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.guide-box__left-image img {
    width: 144px;
    height: 213px;
    border: 1px solid var(--border-medium);
}
.guide-box__left-image .btn {
    margin-top: 24px;
}
.guide-box__right-text {
    font-size: var(--font-size-base);
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.4px;
    word-break: keep-all;
}
.guide-box__right .btn-wrap {
    display: flex;
    align-items: flex-end;
    margin-top: 24px;
    gap: 24px;
}
.guide-box__right .qr-code {
    width: 95px;
    height: 94px;
}
.guide-box__right .qr-code img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
@media screen and (max-width: 768px) {
    .guide-box {
        flex-direction: column;
        align-items: center;
    }
    .guide-box__left {
        width: 100%;
    }
    .guide-box__right .btn-wrap {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* ========================================
   주제성구 스타일
======================================== */
.theme-visual {
    position: relative;
    margin-bottom: 40px;
}
.theme-visual picture {
    display: block;
    width: 100%;
    height: auto;
}
.theme-visual img {
    width: 100%;
    height: auto;
    object-fit: contain;
}
.theme-bg-pattern {
    width: 100%;
    height: calc(100vw / 1920 * 470);
    margin-bottom: -100px;
    background-image: url("../images/sub/page_theme_bg01.png");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% auto;
}
@media screen and (max-width: 1280px) {
    .theme-bg-pattern {
        display: none;
    }
}

/* ========================================
   9월愛동행 갤러리 스와이퍼 스타일
======================================== */
/* 갤러리 컨테이너 */
.gallery {
    position: relative;
    max-width: 1189px;
    margin: 0 auto;
    text-align: center;
}

/* 메인 스와이퍼 컨테이너 */
.gallery-swiper-container {
    position: relative;
    padding: 0 50px 30px;
}

/* 메인 스와이퍼 (큰 이미지) */
.gallery-swiper-main .swiper-wrapper {
    position: relative;
}
.gallery-swiper-main .swiper-slide {
    width: 100%;
    height: auto;
    margin: 0 auto;
    text-align: center;
}
.gallery-swiper-main .swiper-slide img {
    display: block;
    max-width: 100%;
    margin: 0 auto;
}

/* 네비게이션 버튼 */
.gallery .swiper-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 40px;
    height: 40px;
    background-color: transparent;
    box-shadow: none;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.gallery .swiper-nav--prev {
    left: 0;
}
.gallery .swiper-nav--next {
    right: 0;
}
.gallery .swiper-nav-icon {
    width: 20px;
    height: 20px;
    border: 2px solid var(--black);
    border-bottom: none;
    border-right: none;
    display: block;
}
.gallery .swiper-nav--prev .swiper-nav-icon {
    transform: rotate(-45deg);
}
.gallery .swiper-nav--next .swiper-nav-icon {
    transform: rotate(135deg);
}
.gallery .swiper-nav:hover {
    transform: translateY(-50%);
}
.gallery .swiper-nav:disabled:hover {
    transform: translateY(-50%);
}
/* components.css의 기본 ::after 아이콘 숨김 (swiper-nav-icon 사용) */
.gallery .swiper-nav::after {
    display: none !important;
    content: "" !important;
    border: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* 썸네일 스와이퍼 */
.gallery-swiper-thumbs {
    height: calc(100% / 7);
    box-sizing: border-box;
    padding-top: 20px;
    overflow: hidden;
}
.gallery-swiper-thumbs .swiper-wrapper {
    align-items: center;
}
.gallery-swiper-thumbs .swiper-slide {
    width: auto;
    height: 100%;
    aspect-ratio: 997 / 665;
    box-sizing: border-box;
    overflow: hidden;
    flex-shrink: 0;
}
.gallery-swiper-thumbs .swiper-slide-thumb-active {
    border: 6px solid var(--primary-color);
}
.gallery-swiper-thumbs .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 반응형: 태블릿 */
@media (max-width: 1350px) {
    .gallery {
        max-width: 100%;
    }
    .gallery-swiper-thumbs {
        padding: 1.563rem 0;
    }
}

/* 반응형: 모바일 */
@media (max-width: 820px) {
    .gallery {
        margin: 2.188rem auto 0;
    }
    .gallery-swiper-container {
        padding: 0 40px 20px;
    }
    .gallery .swiper-nav-icon {
        width: 16px;
        height: 16px;
    }
}

/* 반응형: 작은 모바일 */
@media (max-width: 768px) {
    .gallery .swiper-nav-icon {
        width: 16px;
        height: 16px;
    }
}

/* ========================================
   뉴스레터 구독 모달 스타일
======================================== */
.newsletter-modal-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 20px;
    margin-bottom: 64px;
}

.newsletter-modal-content .input-wrap input[type="email"] {
    width: 100%;
    height: 40px;
    padding: 8px 16px;
    border: 1px solid var(--border-medium);
    border-radius: 8px;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: -0.32px;
    color: var(--text-primary);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    background-color: white;
}

.newsletter-modal-content .input-wrap input[type="email"]::placeholder {
    color: #666;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: -0.32px;
}

.newsletter-modal-content .input-wrap input[type="email"]:focus {
    outline: none;
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.05);
}

@media (max-width: 768px) {
    .newsletter-modal-content {
        margin-bottom: 16px;
    }
}
/* ========================================
   피드백 페이지 스타일
======================================== */
#feedback-form .char-counter {
    top: -36px;
    bottom: auto;
    right: 0;
}


/*추가 260305*/
/*테이블스타일(창진센➜보완)*/
.jm_table_17 { font-size:17px !important; }
.jm_table_17 table { width:calc(100% - 1px); }
.jm_table_17 th, .jm_table_17 td { text-align:center; vertical-align:middle !important; padding: 18px 16px !important; font-size: var(--font-size-base); }
.jm_table_17 table th { font-weight:400; }
.jm_table_17 table thead th { background:var(--primary-color); color:#fff; border:1px solid var(--primary-color); border-right:1px solid rgba(255,255,255,0.2); }
.jm_table_17 table thead th:last-child { border-right:1px solid var(--primary-color); }
.jm_table_17 table tbody th { background:rgba(0,0,0,0.03); color:var(--primary-color); }
.jm_table_17 table a { color:#005bb4; position:relative; }
.jm_table_17 table a::before { content:''; height:1px; width:0%; position:absolute; bottom:-1px; background:#005bb4; transition:width 0.3s ease-out; }
.jm_table_17 table a:hover::before { content:''; width:101%; }
.jm_table_17 .table-sub-tit-txt { background:#fff8f8; color:#333; }
.jm_table_17 .table-sub-tit-txt td {  }
.jm_table_17 .table-sub-tit-txt td.important { color: var(--accent-color); font-weight:600;  }
.jm_table_17 .diagonal { background-image: linear-gradient(to left bottom, transparent calc(50% - 1px), #ddd, transparent calc(50% + 1px)); background-size: 120% 120%; background-position: center; }  /*사선*/

/*추가 260306*/
/*5분할형 텍스트 박스*/
.five-divde-content1 {  }
.five-divde-content1 .center-box { display:flex; justify-content: center; }
.five-divde-content1 ul { display:flex; gap:40px; }
.five-divde-content1 li { width:150px; height:150px; background:#fff; display:flex; align-items: center; justify-content: center; flex-direction: column; font-size:20px; border-radius: 50%; box-shadow: 0 0 10px rgba(0, 0, 0, .1); }
.five-divde-content1 li span { font-size: var(--font-size-small); color: var(--GRAY_04); }

@media(max-width:1670px){
	.five-divde-content1 ul { gap:20px; }
	.five-divde-content1 li { width:140px; height:140px; box-shadow: 0 0 5px rgba(0, 0, 0, .1); }
}
@media(max-width:1460px){
	.five-divde-content1 li { width:130px; height:130px; }
	.five-divde-content1 ul { gap: 10px; }
	
}
@media(max-width:1320px){
	.five-divde-content1 li { width:120px; height:120px; }
	/*.five-divde-content1 ul { gap:5px; }*/
}

@media(max-width:1280px){
	
}
@media(max-width:1024px){
	.five-divde-content1 ul { flex-wrap: wrap; justify-content: center; width:80%; gap:20px; }
    .five-divde-content1 li { width: 15.1094vw; height: 15.1094vw; }
}
@media(max-width:768px){
	.five-divde-content1 ul { width: 70%; gap: 15px; }
	.five-divde-content1 li { width: 17.1094vw; height: 17.1094vw; }
}
@media(max-width:640px){
	.five-divde-content1 ul { width: 90%; gap: 15px; }
	.five-divde-content1 li { width: 110px; height: 110px; }
}
@media(max-width:530px){
	.five-divde-content1 ul { width:100%; gap:10px; }
}
@media(max-width:360px){
	.five-divde-content1 li { width: 30vw; height: 30vw; }
}