@charset "utf-8";

/* 강원교육체 */
/*@font-face {
    font-family: 'GangwonEduPower'; !* 폰트의 이름을 지정합니다. CSS에서 이 이름을 사용합니다. *!
    src: url('../font/GangwonEduPower.ttf') format('truetype'); !* WOFF2 형식 우선 로드 *!
}*/

@font-face {
    font-family: 'GangwonEduPower';
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    src: url('https://cdn.jsdelivr.net/gh/fonts-archive/GangwonEduPower/GangwonEduPower.woff2') format('woff2'),
         url('https://cdn.jsdelivr.net/gh/fonts-archive/GangwonEduPower/GangwonEduPower.woff') format('woff'),
         url('https://cdn.jsdelivr.net/gh/fonts-archive/GangwonEduPower/GangwonEduPower.otf') format('opentype'),
         url('https://cdn.jsdelivr.net/gh/fonts-archive/GangwonEduPower/GangwonEduPower.ttf') format('truetype');
}

/* Pretendard 폰트를 font-weight 별로 정의 */
@font-face {
    font-family: 'Pretendard'; /* 대표 폰트 패밀리 이름 통일 */
    src: url('../font/Pretendard-Light.woff2') format('ont-woff2'); /* 필요한 다른 포맷이 있다면 추가 */
    font-weight: 100; /* Light */
    font-style: normal;
}

@font-face {
    font-family: 'Pretendard';
    src: url('../font/Pretendard-Regular.woff2') format('ont-woff2');
    font-weight: 300; /* Regular */
    font-style: normal;
}

@font-face {
    font-family: 'Pretendard';
    src: url('../font/Pretendard-SemiBold.woff2') format('ont-woff2');
    font-weight: 600; /* SemiBold */
    font-style: normal;
}

@font-face {
    font-family: 'Pretendard';
    src: url('../font/Pretendard-Bold.woff2') format('ont-woff2');
    font-weight: 700; /* Bold */
    font-style: normal;
}

@font-face {
    font-family: 'Pretendard';
    src: url('../font/Pretendard-ExtraBold.woff2') format('ont-woff2');
    font-weight: 800; /* ExtraBold */
    font-style: normal;
}



/* 로딩 오버레이 스타일 */
.loading-overlay {
    position: fixed; /* 화면 전체에 고정 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3); /* 반투명한 흰색 배경 */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999; /* 다른 요소들 위에 표시 */
}

/* 로딩 오버레이를 숨기는 클래스 */
.loading-overlay.hidden {
    display: none;
}




.container {
    width: 100%;
    /*min-height: 100vh;*/
    max-width: 1200px; /* 데스크탑 기준 최대 너비 (하이브리드 앱에서는 다를 수 있음) */
    margin-left: auto;
    margin-right: auto;
    background: #181818;
    /*overflow: hidden;*/
    /*padding-left: calc(var(--spacing-unit) * 3);  !* 1.5rem or 24px *!
    padding-right: calc(var(--spacing-unit) * 3);*/
}

.page-container { display: flex; flex-direction: column; height: 100dvh; /* 기존 padding-top: 5rem; 을 아래와 같이 수정 */ padding-top: calc(5rem + env(safe-area-inset-top)) !important; padding-bottom: 4rem; }
.page-container--noNav { padding-bottom: 0; }


/* 공통 */
.common-footer__btn { margin-top: auto; padding: 0 30px; margin-bottom: 2.5rem; }
.common-footer__btn button { width: 100%; background: #2D2D35 !important; border: 0; border-radius: 27px; padding: 1rem 0; color: #939393; font-family: 'Pretendard', sans-serif; font-size: 0.8rem; font-weight: 600; }
.common-footer__btn button.on { background: #D9FC4C !important; color: #181818; }


/* 메인 헤더 */
.main-header {display: flex; justify-content: space-between; align-items: center; padding: 0 1.9rem; background: #181818; position: fixed; top: 0; z-index: 100; width: 100%; height: calc(5rem + env(safe-area-inset-top)); /* safe-area-inset-top 만큼 상단에 padding을 추가합니다. */ padding-top: constant(safe-area-inset-top); /* iOS 11.0~11.2를 위한 호환성 코드 */ padding-top: env(safe-area-inset-top); /* 표준 구문 */ }
.main-header__logo { }
.main-header__logo-img { width: 7rem; }
.main-header__nav ul { display:flex; gap:1.2rem; }
.main-header__nav ul li { list-style:none; font-size:0.95rem; }
.main-header__nav ul li a:hover { color:#005f2a; }

/* 서브 헤더 */
.sub-header { display: flex; align-items: center; justify-content: space-between; padding: 0 1.9rem; position: fixed; top: 0; width: 100%; height: calc(5rem + env(safe-area-inset-top)); z-index: 100;  /* safe-area-inset-top 만큼 상단에 padding을 추가합니다. */ padding-top: constant(safe-area-inset-top); /* iOS 11.0~11.2를 위한 호환성 코드 */ padding-top: env(safe-area-inset-top); /* 표준 구문 */ }
.sub-header-noBg { background: transparent }
.sub-header__back { border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.sub-header__back-icon { width: 1.45rem; }
.sub-header__back-title { font-size: 0.8rem; color: #939393; }
.sub-header-white .sub-header__back-title { color: #fff; }
.sub-header__back-inquiry { font-size: 3.3vw; color: #68687D; }
.sub-header__back-inquiry-icon { width: 16px; height: auto; }

/* 메인 관련 */
.main-container { padding-bottom: 7vh; overflow-y: scroll; }


/* 인트로 */
.intro-container { position: relative; height: 100dvh; }
.intro-img { height: 55vh; position: relative; }
.intro-img > div { position: absolute; }
.intro-img__01 { top: 0; right: 0; }
.intro-img__02 { top: 10rem; left: 0; }
.intro-img__03 { bottom: 0; right: 0; }
.intro-img__01 img { width: 14rem; height: auto; }
.intro-img__02 img { width: 10rem; height: auto; }
.intro-img__03 img { width: 12rem; height: auto; }
.intro-content { position: absolute; bottom: 0; width: 100%; height: 52vh; display: flex; flex-direction: column; }
.intro-slide { background: #2D2D35; margin: 0 2rem; border-radius: 30px; padding: 4vh 0 3vh 0; position: relative; overflow: hidden; }
.intro-slide .swiper-slide { text-align: center; }
.intro-slide .swiper-wrapper { margin-bottom: 8%; }
.intro-slide__title-main { font-family: 'GangwonEduPower', sans-serif; color: #fff; font-size: 1.15rem; font-style: italic; margin-bottom: 1.3rem; }
.intro-slide__title-sub { font-family: 'Pretendard', sans-serif; font-size: 0.6rem; font-weight: 400; color: #939393; line-height: 1.5; }
.intro-silde__pagination { text-align: center; }
.intro-silde__pagination .swiper-pagination-bullet { background: #9898b3; }
.intro-silde__pagination .swiper-pagination-bullet-active { background: #D9FC4C; }
.intro-btn { padding: 0 9vw; margin-top: 2vh; }
.intro-btn a { width: 100%; height: 3rem; display: flex; justify-content: center; align-items: center; margin-bottom: 1rem; border-radius: 27px; font-family: 'Pretendard', sans-serif; font-size: 0.8rem; font-weight: 600; color: #181818; }
.intro-btn__join {  background: #D9FC4C;  }
.intro-btn__login { background: #fff; }
.intro-container__terms {  }


/* 로그인 */
/*.login-container { width: 100%; height: 100vh; display: flex; flex-direction: column; padding: 0 30px; }*/
.login-container { width: 100%; height: 100dvh; padding: 0 30px; display: flex; flex-direction: column; padding-bottom: env(safe-area-inset-bottom); overflow-y: auto; box-sizing: border-box; }

.login-container__logo { display: flex; flex-direction: column; align-items: center; margin-top: 8vh; }
.login-container__logo img { width: 4rem; height: auto; }
.login-container__title { align-items: center; justify-content: center; display: flex; margin-top: 4vh; }
.login-container__title img { width: 14rem; }
.login-container__title p { font-family: 'GangwonEduPower', sans-serif; font-size: 22px; color: #D9FC4C; text-align: center; line-height:1.4; font-weight: bold; }
.login-container__form { margin-top: 18vh; margin-bottom: 3vh; }
.login-container__input { position: relative; margin-bottom: 3vh; }
.login-container__input input { width: 100%; border: none; border-bottom: 1px solid #ccc; font-family: 'Pretendard', sans-serif; font-size: 0.8rem; padding: 0.8rem 0; background: none; color: #fff; }
.login-container__search { display: flex; justify-content: space-between; align-items: center; padding: 0 6vw; }
.login-container__search-btn { width: 100%; text-align: center; }
.login-container__search-btn a { font-family: 'Pretendard', sans-serif; font-weight: 400; color: #545454; font-size: 0.65rem; }
.login-container__search-line { width: 1px; height: 13px; background: #545454; margin-top: 0.5vh; }
.login-container__button { position: relative; margin-top: 3vh; margin-bottom: 3vh; }
.login-container__button button { width: 100%; padding: 1rem 0; border: none; border-radius: 27px; font-family: 'Pretendard', sans-serif; font-size: 0.8rem; font-weight: 600; }
.login-container__button-base { background: #D9FC4C !important; color: #181818; margin-bottom: 15px; }
.login-container__button-sns { background: #2D2D35 !important; color: #939393; }
.login-container__terms { display: flex; justify-content: center; margin-top: auto; margin-bottom: 2rem; flex-shrink: 0; }
.login-container__terms a { font-family: 'Pretendard', sans-serif; font-weight: 400; color: #545454; font-size: 0.65rem; margin: 0 0.8rem; }
.login-container__msg { position: absolute; left: 0; bottom: -22px; font-family: 'Pretendard', sans-serif; font-size: 0.65rem; color: #dd2a2a; }
.login-container__secret { position: absolute; top: 0.8rem; right: 0; display: flex; justify-content: flex-end; user-select: none; /* 텍스트 선택 방지 */ }
.login-container__secret img { width: 1.4rem; height: auto; }


/* 회원가입 */
.join-container { padding: 0 30px; overflow-y: scroll; }
.join-container__title { }
.join-container__title-main { font-family: 'GangwonEduPower', sans-serif; font-size: 1.15rem; font-weight: 500; color: #fff; font-style: italic; line-height: 1.3; }
.join-container__title-sub { font-size: 0.65rem; margin-top: 1rem; font-family: 'Pretendard', sans-serif; font-weight: 400; color: #939393; line-height: 1.5; }
.join-container__content { }
.join-container__next-btn { margin-top: auto; padding: 0 30px; margin-bottom: 2.5rem; }
.join-container__next-btn button { width: 100%; background: #2D2D35 !important; border: 0; border-radius: 27px; padding: 1rem 0; color: #939393; font-family: 'Pretendard', sans-serif; font-size: 0.8rem; font-weight: 600; }
.join-container__next-btn button.on { background: #D9FC4C !important; color: #181818; }

.join-container__input { padding-top: 5vh; }
.join-container__input label { font-size: 13px; }
.join-container__input input { width: 100%; border: 0; border-bottom: 1px solid #fff; text-align: left; margin-top: 1vh; padding-bottom: 5px; font-size: 13px; background: transparent; color: #fff; }
.join-container__input input::placeholder { color: #6f6f6f; }

.join-container__type { display: flex; justify-content: space-between; margin-top: 4vh; }
.join-type__item { display: flex; flex-direction: column; align-items: center; cursor: pointer; }
.join-type__input { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; white-space: nowrap; /* 선택 사항 */ }
.join-type__item:has(input:checked) .join-type__label { color: #D9FC4C; }
/*.join-type__input:checked { border: 2px solid #000; background: #005f2a; }*/
.join-type__img { width: 91%; height: auto; }
.join-type__label { font-size: 0.8rem; font-family: 'Pretendard', sans-serif; font-weight: 300; color: #fff; margin-top: 9px; }

.join-terms__item { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.join-terms__btn { font-family: 'Pretendard', sans-serif; font-weight: 400; font-size: 0.65rem; color: #939393 !important; }
.join-terms__title { font-family: 'Pretendard', sans-serif; font-weight: 300; color: #fff; font-size: 0.8rem;}
.join-terms__check { display: flex; align-items: center; justify-content: flex-start; width: 65vw; }
.join-terms__check-icon { border: 2.3px solid #2D2D35; border-radius: 20px; width: 4vw; height: 4vw; align-content: center; justify-items: center; margin-right: 2vw; }
.join-terms__check-icon img { width: 2vw; height: auto; }
.join-terms__item.on .join-terms__check-icon { border: 2.7px solid #D9FC4C; background: #D9FC4C; }

.join-check__item { padding: 0.9rem 0; border-bottom: 1px solid #939393; display: flex; justify-content: flex-start; align-items: center; margin-bottom: 1.5rem; }
.join-check__item .label { font-size: 0.8rem; font-family: 'Pretendard', sans-serif; font-weight: 400; color: #939393; width: 20vw; }
.join-check__item input { width: 13vh; border: 0; font-size: 0.8rem; background: transparent; color: #fff; }

.join-id__input { width: 100%; border: 0; border-bottom: 1px solid #939393; font-family: 'Pretendard', sans-serif; font-weight: 400; font-size: 0.8rem; background: transparent; color: #fff; padding: 0.9rem 0; }
.join-id__input:focus { border-bottom: 1px solid #fff; }
.join-id__msg { font-family: 'Pretendard', sans-serif; font-weight: 400; font-size: 0.65rem; color: #E22929; margin-top: 8px; }

.join-password__item { position: relative; }
.join-password__input { width: 100%; border: 0; border-bottom: 1px solid #939393; font-family: 'Pretendard', sans-serif; font-weight: 400; font-size: 0.8rem; background: transparent; color: #fff; padding: 0.9rem 0; }
.join-password__msg { font-family: 'Pretendard', sans-serif; font-weight: 400; font-size: 0.65rem; color: #E22929; margin-top: 8px; }
.join-password__input:focus { border-bottom: 1px solid #fff; }

.join-businessNumber { display: flex; justify-content: space-between; -moz-column-count: 3; -webkit-column-count: 3; column-count: 3; }
.join-businessNumber__item { display: flex; flex-direction: column; align-items: center; width: 26vw; }
.join-businessNumber__item input { width: 100%; background: transparent; font-family: 'Pretendard', sans-serif; font-weight: 400; font-size: 0.8rem; color: #fff; border: 0; border-bottom: 1px solid #939393; padding: 0.9rem 0; text-align: center; }


/* 에러 */
.error-container { height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 0 1.9rem; }
.error-container__code { font-size: 5rem; color: #4A90E2; }
.error-container__title { font-size: 1.15rem; color: #484848; }
.error-container__message { font-size: 0.9rem; color: #666; }
.error-container__suggestion { font-size: 0.9rem; color: #777; }
.error-container__home-button { display: inline-block;
    padding: 12px 30px;
    background-color: #4A90E2; /* 파란색 버튼 */
    color: #fff;
    text-decoration: none;
    border-radius: 8px; /* 좀 더 부드러운 모서리 */
    font-size: 0.8rem; }


/* 바텀 네비게이션 레이아웃 */
.bottom-nav { display: flex; justify-content: space-around; align-items: center; background: #111111; position: fixed; bottom: 0; width: 100%; z-index: 100; justify-items: center; height: 4.4rem; }
.bottom-nav__item { text-align: center; justify-items: center; display: flex; width: 50%; line-height: 1; flex-direction: column; align-items: center; }
.bottom-nav__item img { width :1.3rem; }
.bottom-nav__item span { font-family: 'Pretendard', sans-serif; font-weight: 300; color: #939393; font-size: 0.6rem; margin-top: 0.4rem; }
.bottom-nav__item.on span { color: #D9FC4C; }



/* 아이디, 비밀번호 찾기 */
.find-container { padding: 0 30px; }
.find-container__title { }
.find-container__title-main { font-family: 'GangwonEduPower', sans-serif; font-size: 1.15rem; font-weight: 500; color: #fff; font-style: italic; line-height: 1.3; }
.find-container__title-sub { font-size: 0.65rem; margin-top: 1.3rem; font-family: 'Pretendard', sans-serif; font-weight: 400; color: #939393; line-height: 1.5; }
.find-container__content {}
.find-container__box { width: 100%; position: relative; margin-bottom: 2rem; border-bottom: 1px solid #939393; padding: 0.9rem 0; display: flex; justify-content: space-between; align-items: center; }
.find-container__box-02 { width: 100%; position: relative; margin-bottom: 2rem; border-bottom: 1px solid #939393; padding: 0.9rem 0; display: flex; justify-content: flex-start; align-items: center; border-bottom: 1px solid #fff; }
.find-container__box input { width: 54vw; background: transparent; font-family: 'Pretendard', sans-serif; font-weight: 400; font-size: 0.8rem; color: #fff; border: 0; text-align: left; }
.find-container__box:focus-within { border-bottom: 1px solid #fff; }
.find-container__input-etc { width: 33vw; display: flex; justify-content: flex-end; align-items: center; }
.find-container__input-btn { user-select: none; /* 텍스트 선택 방지 */ border: 1px solid #939393; border-radius: 20px; font-family: 'Pretendard', sans-serif; font-weight: 400; font-size: 0.65rem; color: #939393 !important; padding: 5px 0px; width: 21vw; text-align: center; background: transparent !important; }
.find-container__box-02 .label { font-size: 0.8rem; font-family: 'Pretendard', sans-serif; font-weight: 400; color: #fff; width: 5rem; margin-right: 0.7rem; }
.find-container__box-02 input { width: 16rem; font-family: 'Pretendard', sans-serif; font-weight: 400; font-size: 0.8rem; background: transparent; color: #D9FC4C; border: 0; text-align: left; }
.find-container__box-02:focus-within { border-bottom: 1px solid #D9FC4C; }
.find-container__cert-count { font-family: 'Pretendard', sans-serif; font-weight: 400; font-size: 0.65rem; color: #D9FC4C; margin-right: 2vw; }



/* 마이페이지 */
.mypage-container { padding: 0 30px; overflow-y: scroll; }

.mypage-main__info { display: flex; justify-content: center; align-items: center; flex-direction: column; }
.mypage-main__thumnail { width: 6rem; height: 6rem; /*width: 100%;*/ border-radius: 25px; border: 3px solid #D9FC4C; position: relative; }
.mypage-main__thumnail-img { width: 100%; height: 100%; border-radius: 20px; }
.mypage-main__thumnail-modfy { position: absolute; bottom: -18px; left: 0; right: 0; display: flex; justify-content: center; }
.mypage-main__thumnail-modfy img { width: 2rem; height: auto; }
.mypage-main__nickname { width: 100%; border-bottom: 1px solid #939393; padding: 1vh 0; display: flex; justify-content: space-between; align-items: end; }
.mypage-main__nickname-input { font-size: 1.15rem; font-weight: 500; color: #fff; font-style: italic; width: 85%; }
.mypage-main__nickname-input::placeholder { font-size: 1rem; }
.mypage-main__nickname-pen { display: inline-block; margin-bottom: 2px; }
.mypage-main__nickname-pen img { width: 12px; height: auto; }
.mypage-main__nickname-btn-save { display: inline-block; font-size: 0.65rem; color: #939393; padding: 0.2rem 0; border-radius: 10px; border: 1px solid #939393; width: 5rem; text-align: center; }
.mypage-main__banner { position: relative; }
.mypage-main__banner-img { width: 100%; height: auto; }
.mypage-main__banner-title { position: absolute; top: 11%; left: 6%; }
.mypage-main__banner-title p { font-size: 0.8rem; color: #fff; }
.mypage-main__banner-btn { position: absolute; bottom: 15%; right: 6%; }
.mypage-main__banner-btn { display: flex; justify-content: center; align-items: center; }
.mypage-main__banner-btn span { font-size: 0.8rem; color: #fff; margin-right: 9px; }
.mypage-main__banner-btn img { width: 1.4rem; }
.mypage-main__box { }
.mypage-main__button-item {width: 100%; border-radius: 10px; overflow: hidden; margin-bottom: 10px; align-content: center; }
.mypage-main__button-item-title { display: flex; align-items: center; justify-content: space-between;  background: #2D2D35; padding: 0 1rem; height: 3rem; }
.mypage-main__button-item-inner { display: flex; align-items: center; }
.mypage-main__button-item-content { display: none; background: #24242B; padding: 0.8rem 1rem; border-top: 1px solid #454553; }
.mypage-main__button-item-content.on { display: block; }
.mypage-main__button-item-content p { font-size: 0.8rem; color: #939393; line-height: 1.5; }
.mypage-main__button-text { font-size: 0.8rem; color: #939393; }
.mypage-main__button-icon { width: 1rem; height: auto; display: inline-flex; margin-right: 19px; }
.mypage-main__button-arrow { width: 0.5rem; height: auto; display: inline-flex; }
.mypage-main__button-arrow-down { width: 0.7rem; }
.mypage-main__children {  }
.mypage-main__children-title-area { display: flex; justify-content: space-between; align-items: center; }
.mypage-main__children-title { font-size: 0.8rem; color: #fff; }
.mypage-main__children-title-img { width: 0.8rem; height: auto; }
.mypage-main__children-item { position: relative; margin-bottom: 12px; }
.mypage-main__children-bg { width: 100%; height: auto; }
.mypage-main__children-info { position: absolute; top: 0; bottom: 0; left: 6%; right: 0; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.mypage-main__children-academy { margin-bottom: 0.5rem; }
.mypage-main__children-academy li { background: #fff; border-radius: 27px; padding: 0.3rem 1rem; display: inline-block; font-size: 0.65rem; color: #181818; margin-right: 0.3rem; }
.mypage-main__children-name { font-family: 'GangwonEduPower', sans-serif; font-size: 1.15rem; font-weight: 500; color: #181818; font-style: italic; }
.mypage-main__children-empty { text-align: center; padding: 4vh 0; background: #2D2D35; border-radius: 10px; }
.mypage-main__children-empty-title { font-size: 2.8vw; color: #fff; font-weight: 100; }
.mypage-main__children-reg-btn { font-size: 3.4vw; color: #181818; background: #D9FC4C; padding: 12px 28px; border-radius: 27px; display: inline-block; }
.mypage-main__setting {  }
.mypage-main__setting-title { font-size: 14px; color: #fff; }
.mypage-main__setting-item { display: flex; justify-content: space-between; align-items: center; background: #3f3f3f; padding: 10px; border-radius: 10px; margin-bottom: 10px; }
.mypage-main__setting-text { font-size: 3.5vw; color: #fff; }

.mypage-info__item { padding: 15px 0; margin-bottom: 3vh; position: relative; display: flex; justify-content: flex-start; align-items: flex-start; border-bottom: 1px solid #939393; }
.mypage-info__title { font-size: 0.8rem; color: #939393; width: 5rem; }
.mypage-info__content { font-size: 0.8rem; color: #fff; }
.mypage-info__mod-btn { font-size: 2.5vw; color: #939393 !important; padding: 3px 20px; border-radius: 10px; border: 1px solid #939393; margin-top: 15px; display: inline-block; background: transparent !important; }
.mypage-info__content-addr {  }

.mypage-academy { position: relative; }
.mypage-academy__bg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
.mypage-academy__tab { display: flex; justify-content: center; margin-bottom: 25vh; }
.mypage-academy__tab li { font-family: 'Pretendard', sans-serif; font-weight: 600; font-size: 2.5vw; color: #181818; background: #fff; padding: 4px 0; border-radius: 27px; margin-right: 9px; width: 17vw; text-align: center; }
.mypage-academy__tab li.on { background: #D9FC4C; }
.mypage-academy__content {  }
.mypage-academy__name { text-align: center; }
.mypage-academy__name-text { font-family: 'GangwonEduPower', sans-serif; font-size: 4.5vw; font-weight: 900; font-style: italic; color: #fff; }
.mypage-academy__intro p { font-size: 3vw; color: #939393; line-height: 1.3; }
.mypage-academy__comment { margin-bottom: 1rem; }
.mypage-academy__desc.truncated { display: -webkit-box; -webkit-line-clamp: 3; /* 텍스트를 3줄로 제한합니다. */ -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.mypage-academy__desc-more { display: block; text-align: right; font-family: 'Pretendard', sans-serif; font-size: 0.8rem; font-weight: 300; color: #D9FC4C; margin-top: 0.4rem; }
.mypage-academy__class-item { border-radius: 15px; overflow: hidden; margin-bottom: 4vw; }
.mypage-academy__class-info { position: relative; }
.mypage-academy__class-info-bg { width: 100%; }
.mypage-academy__class-info-content { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; padding: 5vw; }
.mypage-academy__class-name { font-size: 3.8vw; color: #fff; }
.mypage-academy__class-etc { display: flex; }
.mypage-academy__class-etc li { font-family: 'Pretendard', sans-serif; font-weight: 400; font-size: 2.3vw; color: #fff; margin-right: 6px; padding: 2px 11px; border-radius: 10px; border: 1px solid #fff; }
.mypage-academy__class-intro { background: #2D2D35; padding: 4vw 5vw; }
.mypage-academy__class-intro p { font-size: 2.6vw; color: #939393; line-height: 1.6; }
.mypage-academy__class-parent { display: flex; width: 100%; align-items: center; }
.mypage-academy__class-parent-info { display: flex; align-items: center; }
.mypage-academy__class-parent-name { font-size: 3.7vw; color: #D9FC4C; margin-right: 8px; }
.mypage-academy__class-parent-gender { font-size: 2.5vw; color: #D9FC4C; }
.mypage-payment { }
.mypage-payment__tab { display: flex; }
.mypage-payment__tab li { font-family: 'Pretendard', sans-serif; font-size: 3vw; font-weight: 300; color: #939393; padding-bottom: 2.5vw; width: 50%; text-align: center; border-bottom: 1px solid #939393; }
.mypage-payment__tab li.on { border-bottom: 1px solid #fff; color: #fff; }
.mypage-payment__method-list { overflow-x: hidden; }
.mypage-payment__method-item { }
.mypage-payment__method-list .mypage-payment__method-item.on .mypage-payment__method-item-img { border: 3px solid #D9FC4C; border-radius: 12px; }
.mypage-payment__method-item-img { position: relative; }
.mypage-payment__method-item-img img { width: 100%; }
.mypage-payment__method-item-use { position: absolute; top: 0; left: 0; right: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.mypage-payment__method-item-use p { font-size: 0.65rem; color: #181818; background: #D9FC4C; padding: 0.2rem 1.6rem; border-bottom-left-radius: 25px; border-bottom-right-radius: 25px; }
.mypage-payment__method-name-wrap { display: flex; justify-content: space-between; align-items: center; }
.mypage-payment__method-name { font-size: 0.8rem; color: #939393; }
.mypage-payment__method-del {  }
.mypage-payment__method-del img { width: 0.8rem; height: auto;  }
.mypage-payment__method-member { font-size: 0.65rem; color: #939393; margin: 0.3rem 0; }
.mypage-payment__method-number { font-size: 0.65rem; color: #939393; }
.mypage-payment__method-pagination { text-align: center; }
.mypage-payment__method-pagination .swiper-pagination-bullet { background: #454553; opacity: 1; }
.mypage-payment__method-pagination .swiper-pagination-bullet-active { background: #D9FC4C; }

.mypage-payment__method-empty { padding: 0 17vw; }
.mypage-payment__method-empty-btn { width: 100%; border: 1px solid #939393; border-radius: 10px; padding: 5vw 0; text-align: center; justify-items: center; display: flex; flex-direction: column; align-items: center; }
.mypage-payment__method-empty-title { font-size: 2.6vw; color: #fff; }
.mypage-payment__method-empty-text { font-size: 2.6vw; color: #939393; }
.mypage-payment__method-empty-btn img { width: 1rem; height: auto; margin: 3rem 0 2rem 0; }
.mypage-payment-reg { margin-top: 2.7rem; }
.mypage-payment-reg__top { display: flex; justify-content: space-between; align-items: center; }
.mypage-payment-reg__title { font-size: 1.15rem; color: #fff; }
.mypage-payment-reg__scan { font-size: 0.65rem; color: #939393; padding: 2px 1rem; border-radius: 10px; border: 1px solid #939393; }
.mypage-payment-reg__desc { font-size: 0.65rem; color: #939393; line-height: 1.6; }
.mypage-payment-reg__item { }
.mypage-payment-reg__item-title { font-size: 0.65rem; color: #fff; }
.mypage-payment-reg__item input { background: transparent; border: 0; font-family: 'Pretendard', sans-serif; font-weight: 300; font-size: 0.8rem; color: #fff; text-align: center; border-bottom: 1px solid #939393; padding-bottom: 0.8rem; }
.mypage-payment-reg__number-input { display: flex; justify-content: space-between; -moz-column-count: 4; -webkit-column-count: 4; column-count: 4; }
.mypage-payment-reg__number-input input { width: 23%; }
.mypage-payment-reg__expire-input { display: flex; justify-content: space-between; -moz-column-count: 2; -webkit-column-count: 2; column-count: 2; }
.mypage-payment-reg__expire-input input { width: 45%; }
.mypage-payment-reg__item-gubun { font-size: 0.8rem; color: #939393; padding-top: 2px; }
.mypage-payment-reg__cvc-input { }
.mypage-payment-reg__cvc-input input { width: 100%; }
.mypage-payment-reg__agree-box { display: flex; justify-content: space-between; align-items: center; }
.mypage-payment-reg__agree-title { font-size: 0.65rem; color: #939393; }
.mypage-payment-reg__agree-label { display: flex; align-items: center; }
.mypage-payment-reg__agree-chk { width: 9%; height: auto; margin-right: 4%; }
.mypage-payment-reg__agree-label span { font-size: 0.8rem; color: #fff; }
.mypage-payment-reg__agree-link { font-size: 0.65rem; color: #939393; }
.mypage-payment-reg__btn { display: inline-block; width: 100%; background: #D9FC4C; font-size: 0.8rem; color: #181818; padding: 1rem 0; border-radius: 27px; margin-top: 10px; text-align: center; }
.mypage-payment__history { padding: 0 30px; }
.mypage-payment__history-list { }
.mypage-payment__history-item { background: #2D2D35; border-radius: 10px; padding: 1.1rem; margin-bottom: 0.7rem; }
.mypage-payment__history-name { font-size: 0.8rem; color: #939393; }
.mypage-payment__history-desc { font-size: 0.8rem; color: #939393; margin-top: 0.8rem; }
.mypage-payment__history-number { font-size: 0.8rem; color: #939393; margin-top: 0.3rem; }
.mypage-payment__history-item-info { display: flex; justify-content: space-between; align-items: center; margin-top: 1.5rem; }
.mypage-payment__history-date { font-size: 0.8rem; color: #fff; }
.mypage-payment__history-price { font-size: 0.8rem; color: #fff; }
.mypage-payment__history-empty {  }
.mypage-payment__history-empty-title-main { font-size: 1.15rem; font-weight: 500; color: #fff; margin-bottom: 1.5rem; }
.mypage-payment__history-empty-title-sub { font-size: 0.65rem; color: #939393; line-height: 1.5; }
.mypage-payment__history-empty-search { text-align: center; margin-top: 9rem;}
.mypage-payment__history-empty-img { margin: 0 7.8rem; border: 3px solid #D9FC4C; border-radius: 20px; }
.mypage-payment__history-empty-img img { width: 100%; }
.mypage-payment__history-empty-btn { display: inline-block; background: #D9FC4C; font-size: 0.8rem; color: #181818; padding: 1rem 0; border-radius: 27px; text-align: center; margin-top: 1.5rem; width: 13rem; }

.mypage-children__bg { position: absolute; top: 0; left: 0; right: 0; }
.mypage-children { position: relative; }
.mypage-children__header { padding-bottom: 2rem; }
.mypage-children__list { display: flex; align-items: center; padding: 0 30px; overflow-x: scroll; }
.mypage-children__list ul { display: flex; }
.mypage-children__list ul li { font-family: 'Pretendard', sans-serif; font-weight: 600; font-size: 0.65rem; color: #181818; background: #fff; padding: 6px 8px; border-radius: 20px; margin-right: 0.6rem; width: 4.7rem; text-align: center; }
.mypage-children__list ul li.on { background: #D9FC4C; }
.mypage-children__list-add { background: transparent !important; padding: 0 !important; flex: none; }
.mypage-children__list-add-img { width: 1.5rem; height: auto;  }
.mypage-children__info { display: flex; align-items: center; padding: 0 30px; }
.mypage-children__thumnail { width: 6rem; height: 6rem; border-radius: 25px; border: 3px solid #D9FC4C; position: relative; }
.mypage-children__thumnail-img { width: 100%; height: 100%; border-radius: 20px; }
.mypage-children__thumnail-edit { position: absolute; left: 0; right: 0; bottom: -15px; display: flex; justify-content: center; align-items: center; }
.mypage-children__thumnail-edit-img { width: 1.8rem; }
.mypage-children__name { font-size: 1rem; color: #fff; margin-right: 0.6rem; }
.mypage-children__age { font-size: 0.8rem; color: #fff; }
.mypage-children__member { width: 64%; margin-left: 1.5rem; }
.mypage-children__member-info { display: flex; justify-content: space-between; align-items: center; }
.mypage-children__team { background: #2D2D35; border-radius: 10px; padding: 0.6rem; margin-top: 0.5rem; }
.mypage-children__team-title { font-size: 0.65rem; color: #fff; margin-bottom: 0.3rem; }
.mypage-children__team-value { font-size: 0.65rem; color: #939393; }
.mypage-children__btns { display: flex; justify-content: flex-end; width: 35%; }
.mypage-children__btns a { width: 1.3rem; margin-left: 0.4rem; }

.mypage-children__invite { font-size: 0.65rem; color: #fff; background: #454553; padding: 0.3rem 1rem; border-radius: 10px; }
.mypage-children__tab {  }
.mypage-children__tab ul { display: flex; justify-content: space-between;}
.mypage-children__tab li { width: 50%; text-align: center; padding: 10px 0; border-bottom: 2px solid #939393; }
.mypage-children__tab li.on { border-bottom: 2px solid #fff; }
.mypage-children__tab-text { font-size: 0.8rem; color: #939393; }
.mypage-children__tab li.on .mypage-children__tab-text { color: #fff; }

.mypage-children__content { }
.mypage-children__stats { padding: 15px 30px; border-top-left-radius: 30px; border-top-right-radius: 30px; }
.mypage-children__stats-header { display: flex; justify-content: space-between; align-items: center; }
.mypage-children__stats-title { font-size: 1.15rem; font-weight: 500; color: #fff; }
.mypage-children__stats-btn { font-size: 4vw; color: #fff; padding: 2px 7px; border-radius: 5px; display: flex; align-items: center; }
.mypage-children__stats-btn-text { font-size: 0.8rem; color: #fff; margin-right: 0.5rem; }
.mypage-children__stats-btn-img { width: 1.3rem; }
.mypage-children__stats-score { padding: 2rem 0; text-align: center; display: flex; align-items: center; justify-content: center; }
.mypage-children__stats-score img { width: 1.4rem; margin: 0 0.1rem; }
.mypage-children__stats-list {  }
.mypage-children__stats-item { display: flex; justify-content: flex-start; align-items: center; padding: 0.8rem 1rem; border-radius: 10px; margin-bottom: 15px; background: #2D2D35; }
.mypage-children__stats-badge { }
.mypage-children__stats-badge img { width: 3.59rem; }
.mypage-children__stats-item-score { margin-left: 1.5rem; }
.mypage-children__stats-item-title { font-size: 0.8rem; color: #939393; }
.mypage-children__stats-item-score-bar { display: flex; align-items: center; margin-top: 0.3rem;  }
.mypage-children__stats-item-score-bar img { width: 0.9rem; margin-right: 0.2rem; }

.mypage-children-reg { }
.mypage-children-reg__title-main { font-size: 1.15rem; color: #fff; font-weight: 500; margin-bottom: 1.4rem; }
.mypage-children-reg__title-sub { font-size: 0.65rem; color: #939393; line-height: 1.5; }
.mypage-children-reg__content { text-align: center; margin-top: 7rem; }
.mypage-children-reg__content-img { margin: 0 7.8rem; border: 3px solid #D9FC4C; border-radius: 20px; }
.mypage-children-reg__content-img img { width: 100%; }
.mypage-children-reg__content-btn { display: inline-block; background: #D9FC4C; font-size: 0.8rem; color: #181818; padding: 1rem 0; border-radius: 27px; text-align: center; margin-top: 1.5rem; width: 13rem; }
.mypage-children-reg__btn { display: inline-block; width: 100%; background: #2D2D35; font-size: 0.8rem; color: #939393; padding: 1rem 0; border-radius: 27px; text-align: center; }
.mypage-children-intro__item { margin-bottom: 0.8rem; position: relative; }
.mypage-children-intro__item-content { position: absolute; top: 0; left: 0; right: 0; bottom: 0; text-align: left; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding-left: 1.5rem; }
.mypage-children-intro__item-content-main { font-size: 1.15rem; font-weight: 500; margin-bottom: 0.7rem; }
.mypage-children-intro__item-content-sub { font-size: 0.65rem; line-height: 1.5; }

.mypage-children-reg__item { margin-bottom: 5vh; position: relative; }
.mypage-children-reg__item-title { font-size: 0.65rem; color: #fff; margin-bottom: 1.3rem; }
.mypage-children-reg__item-input { border-bottom: 1px solid gray; font-size: 0.8rem; color: #fff; width: 100%; padding-bottom: 1rem; }
.mypage-children-reg__item-birth { display: flex; justify-content: space-between; -moz-column-count: 3; -webkit-column-count: 3; column-count: 3; }
.mypage-children-reg__item-birth input { width: 31%; text-align: center; font-size: 0.8rem; color: #fff; padding-bottom: 1rem; border-bottom: 1px solid gray; }
.mypage-children-reg__item-gender { display: flex; justify-content: space-between; -moz-column-count: 2; -webkit-column-count: 2; column-count: 2; }
.mypage-children-reg__item-gender label { width: 48%; background: #454553; padding: 1rem 0; text-align: center; border-radius: 27px; }
.mypage-children-reg__item-gender input { display: none; }
.mypage-children-reg__item-gender p { font-size: 0.8rem; color: #939393; }
.mypage-children-reg__item-gender label:has(input:checked) { background: #D9FC4C; }
.mypage-children-reg__item-gender input:checked + p { color: #181818; }

.mypage-children-reg__confirm { height: 80vh; align-content: center; text-align: center; position: relative; }
.mypage-children-reg__confirm-btn { position: absolute; bottom: 0; left: 0; right: 0; }
.mypage-children-reg__btn-yellow { background: #D9FC4C; color: #181818; }
.mypage-children-reg__btn-white { background: #fff; color: #181818; }

.mypage-children-reg__item-pin { display: flex; justify-content: space-between; -moz-column-count: 4; -webkit-column-count: 4; column-count: 4; }
.mypage-children-reg__item-pin input { width: 23%; text-align: center; font-size: 0.8rem; color: #fff; padding-bottom: 0.8rem; border-bottom: 1px solid gray; }


/* 아카데미 찾기 */
.academy-container { padding: 0 30px; overflow-y: scroll; }

.academy-search {  }
.academy-search__input { display: flex; align-items: center; border-bottom: 1px solid #939393; padding-bottom: 0.9rem; }
.academy-search__icon { width: 4%; }
.academy-search__input input { font-size: 0.8rem; color: #939393; padding: 0.2rem 1rem 0 1rem; width: 100%; }
.academy-search__distance { display: flex; align-items: center; margin-top: 1.3rem; }
.academy-search__distance input { display: none; }
.academy-search__distance-icon { width: 1rem; }
.academy-search__icon-wrap { display: inline-block; width: 1rem; }
.academy-search__distance-check { width: 1.1rem; }
.academy-search__distance-text { font-size: 0.8rem; color: #939393; margin: 0 0.8rem 0 0.3rem; padding-top: 2px; }
.academy-search__list {  }
.academy-search__item { position: relative; border-radius: 15px; overflow: hidden; margin-bottom: 0.8rem; display: inline-block; }
.academy-search__item-thumnail { width: 100%; }
.academy-search__item-info { display: flex; justify-content: space-between; align-items: center; padding: 0.5rem 1.2rem; background: #D9FC4C; }
.academy-search__item-info span { font-size: 0.65rem; color: #181818; }
.academy-search__item-name { margin-right: 0.9rem; }
.academy-search__item-info-text { display: flex; align-items: center; }
.academy-search__item-detail { display: flex; justify-content: flex-end; align-items: center; }
.academy-search__item-detail img { width: 7%; margin-left: 0.6rem; }
.academy-search__item-content { background: #2D2D35; padding: 0.8rem 1.2rem; }
.academy-search__item-content p { font-size: 0.65rem; color: #939393; line-height: 1.6; }

.academy-search__bottom {  }
.academy-search__title { font-size: 0.8rem; color: #fff; margin-bottom: 0.3rem; }
.academy-search__detail-btn {  }

.academy-detail { padding-bottom: 4rem; position: relative; margin-top: 15rem; }
.academy-detail__thumnail { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
.academy-detail__info { text-align: center; }
.academy-detail__distance { font-size: 0.65rem; color: #D9FC4C; margin-bottom: 0.3rem; }
.academy-detail__name { font-size: 1.15rem; color: #fff; font-weight: 500; }

.academy-detail__btn { padding: 0 1.9rem; }
.academy-detail__btn a { padding: 0.5rem 0; border-radius: 27px; display: inline-block; text-align: center; }
.academy-detail__btn-basic { background: #D9FC4C; width: 8rem; color: #181818; font-size: 0.8rem; margin-right: 0.2rem; }
.academy-detail__favorites { width: 2.3rem; background: #2D2D35; color: #939393; font-size: 0.9rem; }
.academy-detail__content { padding: 0 1.9rem; }
.academy-detail__content p { font-size: 0.8rem; color: #939393; line-height: 1.3; }
.academy-detail__comment { margin-bottom: 1rem; }
.academy-detail__desc.truncated { display: -webkit-box; -webkit-line-clamp: 3; /* 텍스트를 3줄로 제한합니다. */ -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.academy-detail__desc-more { display: block; text-align: right; font-family: 'Pretendard', sans-serif; font-size: 0.8rem; font-weight: 300; color: #D9FC4C; margin-top: 0.4rem; }
.academy-detail__tab { display: flex; width: 100%; position: -webkit-sticky; position: sticky; top: 0; z-index: 10; transition: background-color 0.2s ease-in-out; }
.academy-detail__tab.is-stuck { background-color: rgba(24,24,24,0.9); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); }
.academy-detail__tab.fixed { position: fixed; top: 2rem; left: 0; right: 0; z-index: 10; }
.academy-detail__tab li { font-family: 'Pretendard', sans-serif; font-size: 0.8rem; font-weight: 300; color: #939393; padding-top: 2.5vw; padding-bottom: 2.5vw; width: 50%; text-align: center; border-bottom: 1px solid #939393; }
.academy-detail__tab li.on { border-bottom: 1px solid #fff; color: #fff; }
.academy-detail__class { padding: 0 1.9rem; }
.academy-detail__class-title { font-size: 0.65rem; color: #fff; margin-bottom: 0.3rem; }
.academy-detail__class-filter { display: flex; width: 100%; }
.academy-detail__class-filter-item { background: #2D2D35; display: flex; justify-content: space-between; align-items: center; padding: 0.5rem 0.7rem; border-radius: 10px; margin-right: 0.4rem; }
.academy-detail__class-filter-title { font-size: 0.58rem; color: #fff; margin-right: 1rem; }
.academy-detail__class-filter-icon { width: 0.5rem; }
.academy-detail__class-list {  }
.academy-detail__class-item { position: relative; border-radius: 10px; overflow: hidden; margin-bottom: 0.8rem; display: inline-block; }
.academy-detail__class-thumnail { width: 100%; position: relative; }
.academy-detail__class-info { position: absolute; top: 0; bottom: 0; left: 0; right: 0; display: flex; flex-direction: column; justify-content: flex-start; padding: 1.7rem 1.7rem; }
.academy-detail__class-name { font-size: 0.95rem; color: #fff; margin-bottom: 0.5rem; }
.academy-detail__class-etc { display: flex; }
.academy-detail__class-etc li { font-family: 'Pretendard', sans-serif; font-weight: 300; font-size: 0.57rem; color: #fff; padding: 0 0.6rem; border-radius: 10px; margin-right: 0.4rem; border: 1px solid #fff; height: 1rem; align-content: center; }
.academy-detail__class-intro { background: #2D2D35; padding: 1.2rem 1.7rem; }
.academy-detail__class-intro p { font-size: 0.65rem; color: #939393; line-height: 1.6; }

.academy-detail__coach { padding: 0 1.9rem; }
.academy-detail__coach-list {  }
.academy-detail__coach-item { position: relative; border-radius: 10px; overflow: hidden; margin-bottom: 0.8rem; display: inline-block; }
.academy-detail__coach-thumnail { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; }
.academy-detail__coach-thumnail img { height: 100%; }
.academy-detail__coach-info { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 2; display: flex; flex-direction: column; justify-content: center; padding: 0 1.7rem; }
.academy-detail__coach-type { font-size: 0.65rem; color: #181818; padding: 0.2rem 0.6rem; border-radius: 10px; background: #fff; width: 4rem; text-align: center; margin-bottom: 0.5rem; }
.academy-detail__coach-name { font-size: 1.15rem; color: #fff; font-weight: 500; margin-bottom: 0.7rem; }
.academy-detail__coach-intro { font-size: 0.65rem; color: #939393; line-height: 1.6; }

.class-detail__thumnail { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
.class-detail__thumnail img { width: 100%; height: 30vh; }
.class-detail { position: relative; z-index: 1; }
.class-detail__info { padding: 0 1.9rem; }
.class-detail__name { font-size: 0.95rem; color: #fff; }
.class-detail__desc { font-size: 0.8rem; color: #939393; margin-top: 0.6rem; line-height: 1.3; }
.class-detail__button { display: flex; flex-direction: column; width: 100%; background: #D9FC4C; padding: 0 1rem; border-radius: 27px; text-align: center; height: 3rem; justify-content: center; }
.class-detail__button-text { font-size: 0.65rem; color: #181818; }
.class-detail__button-price { font-size: 0.9rem; color: #181818; }
.class-detail__button a { font-size: 0.8rem; color: #fff; }
.class-detail__etc { display: flex; align-items: center; }
.class-detail__etc li { font-family: 'Pretendard', sans-serif; font-weight: 300; font-size: 0.57rem; color: #fff; padding: 0 0.6rem; border-radius: 10px; margin-right: 0.4rem; border: 1px solid #fff; height: 1rem; align-content: center; }
.class-detail__intro p { font-size: 0.8rem; color: #939393; }
.class-detail__tab { display: flex; }
.class-detail__tab li { font-family: 'Pretendard', sans-serif; font-size: 0.8rem; font-weight: 300; color: #939393; padding-bottom: 2.5vw; width: 50%; text-align: center; border-bottom: 1px solid #939393; }
.class-detail__tab li.on { border-bottom: 1px solid #fff; color: #fff; }
.class-detail__media {  }
.class-detail__media-list { padding: 0 1.9rem; display: flex; justify-content: space-between; }
.class-detail__media-item { background: #2D2D35; border-radius: 10px; width: 48%; height: 10rem; }

.class-detail__info {  }
.class-detail__info-item { margin-bottom: 2.5rem; }
.class-detail__session-title { font-size: 0.8rem; color: #fff; }
.class-detail__session-list {  }
.class-detail__session-empty { color: #777777; font-size: 0.8rem; }
.class-detail__session-item { margin-bottom: 0.8rem; }
.class-detail__session-item-title { display: flex; justify-content: space-between; align-items: center; background: #2D2D35; padding: 0.8rem 1.5rem 0.8rem 1.2rem; border-radius: 10px; }
.class-detail__session-item-title-01 { display: flex; align-items: center; }
.class-detail__session-item-title-01 img { width: 2.5rem; }
.class-detail__session-item-title-text { font-size: 0.8rem; color: #fff; margin-left: 1.5rem; }
.class-detail__session-item-title-text span { color: #D9FC4C; margin-left: 0.3rem; }
.class-detail__session-item-title-02 { display: flex; justify-content: flex-end; }
.class-detail__session-item-title-02 img { width: 37%; }
.class-detail__session-item-content { display: none; background: #24242B; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 0.7rem 1.2rem 0.7rem 5.2rem; border-top: 1px solid #454553; }
.class-detail__session-item-content p { font-family: 'Pretendard', sans-serif; font-size: 0.8rem; font-weight: 300; color: #939393; margin: 0.4rem 0; }
.class-detail__session-item-content p span { color: #D9FC4C; margin-left: 0.3rem; }
.class-detail__session-item.on .class-detail__session-item-content { display: block; }
.class-detail__session-item.on .class-detail__session-item-title { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }

.payment-detail {  }
.payment-detail__header { padding: 0 1.9rem; }
.payment-detail__title { font-size: 1.15rem; color: #fff; font-weight: 500; padding: 0 1.9rem; }
.payment-detail__name { font-size: 0.95rem; color: #fff; margin-bottom: 0.5rem; }
.payment-detail__etc { display: flex; align-items: center; margin-bottom: 1.2rem; }
.payment-detail__etc li { font-family: 'Pretendard', sans-serif; font-weight: 300; font-size: 0.57rem; color: #fff; padding: 0 0.6rem; border-radius: 10px; margin-right: 0.4rem; border: 1px solid #fff; height: 1rem; align-content: center; }
.payment-detail__desc { font-size: 0.8rem; color: #939393; line-height: 1.3; }
.payment-detail__children { }
.payment-detail__children-title { font-size: 0.8rem; color: #fff; margin-bottom: 0.5rem; padding: 0 1.9rem; }
.payment-detail__children-desc { font-size: 0.65rem; color: #939393; padding: 0 1.9rem; }
.payment-detail__children-list { margin-top: 1.5rem; overflow: hidden; padding: 0 1.9rem; }
.payment-detail__children-list .swiper-slide { }
.payment-detail__children-thumnail { border-radius: 50px; overflow: hidden; border: 3px solid #545454; width: 6rem; height: 6rem; }
.payment-detail__children-list .swiper-slide.on .payment-detail__children-thumnail { border: 3px solid #D9FC4C; }
.payment-detail__children-thumnail img { width: 100%; height: 100%; filter: grayscale(100%); transition: filter 0.3s ease-in-out; /* 부드러운 색상 전환 효과 */ }
.payment-detail__children-list .swiper-slide.on .payment-detail__children-thumnail img { filter: grayscale(0%); }
.payment-detail__children-name { font-family: 'Pretendard', sans-serif; font-weight: 300; font-size: 0.8rem; color: #939393; text-align: center; margin-top: 0.5rem; }
.payment-detail__children-list .swiper-slide.on .payment-detail__children-name { color: #fff; }
.payment-detail__method {  }
.payment-detail__method-title { font-size: 0.8rem; color: #fff; margin-bottom: 0.5rem; padding: 0 1.9rem; }
.payment-detail__method-list { margin-top: 1.5rem; overflow: hidden; padding: 0 1.9rem; }
.payment-detail__method-item-img { position: relative; }
.payment-detail__method-item-img img { width: 100%; }
.payment-detail__method-item-use { position: absolute; top: 0; left: 0; right: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.payment-detail__method-item-use p { font-size: 0.65rem; color: #181818; background: #D9FC4C; padding: 0.2rem 1.6rem; border-bottom-left-radius: 25px; border-bottom-right-radius: 25px; }
.payment-detail__method-item-info { }
.payment-detail__method-item-card { font-size: 0.8rem; color: #939393; margin-bottom: 0.3rem; }
.payment-detail__method-item-name { font-size: 0.65rem; color: #939393; margin-bottom: 0.3rem; }
.payment-detail__method-item-num { font-size: 0.65rem; color: #939393; }
.payment-detail__amount { padding: 0 1.9rem; }
.payment-detail__amount-title { font-size: 0.8rem; color: #fff; margin-bottom: 0.8rem; }
.payment-detail__amount-content { background: #2D2D35; padding: 0.7rem 1.3rem; border-radius: 10px; }
.payment-detail__amount-item { display: flex; justify-content: space-between; align-items: center; margin: 0.5rem 0; }
.payment-detail__amount-item p { font-size: 0.8rem; color: #fff; }
.payment-detail__amount-item-total { }
.payment-detail__amount-item-total p { color: #D9FC4C; }
.payment-detail__amount-children { margin-top: 1rem; }
.payment-detail__button { padding: 0 1.9rem; }
.payment-detail__button a { display: flex; flex-direction: column; width: 100%; background: #D9FC4C; padding: 0 1rem; border-radius: 27px; text-align: center; height: 3rem; justify-content: center; }
.payment-detail__button-text { font-size: 0.65rem; color: #181818; }
.payment-detail__button-price { font-size: 0.9rem; color: #181818; }

.coach-detail { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
.coach-detail__effect-top { position: absolute; top: 0; left: 0; right: 0; }
.coach-detail__effect-top img { width: 100%; height: 20vh; }
.coach-detail__effect-bottom { position: absolute; bottom: 0; left: 0; right: 0; }
.coach-detail__effect-bottom img { width: 100%; height: 53vh; }
.coach-detail__info { position: absolute; bottom: 5%; left: 0; right: 0; padding: 0 1.9rem; }
.coach-detail__name { font-size: 1.5rem; color: #fff; font-weight: 500; margin-bottom: 1.2rem; }
.coach-detail__desc { font-size: 0.8rem; color: #fff; line-height: 1.3; font-weight: 200; }
.coach-detail__class-list { margin-top: 1.5rem; }
.coach-detail__class-name { font-size: 0.65rem; color: #181818; background: #fff; padding: 0.2rem 1.2rem; border-radius: 10px; text-align: center; }

.coach-detail__career { position: absolute; bottom: 0; left: 0; right: 0; }
.coach-detail__career-top { display: flex; padding: 0 1.9rem; height: 15vh; }
.coach-detail__career-thumnail { margin-right: 1.4rem; }
.coach-detail__career-thumnail img { width: 6.5rem; height: 6.5rem; border-radius: 30px; overflow: hidden; border: 3px solid #D9FC4C; }
.coach-detail__career-top-info { width: 60%; padding-top: 1.5rem; }
.coach-detail__career-name { font-size: 1.15rem; color: #fff; font-weight: 500; margin-bottom: 0.5rem; }
.coach-detail__career-desc { font-size: 0.65rem; color: #939393; line-height: 1.3; }
.coach-detail__career-bottom { background: #2D2D35; border-top-left-radius: 38px; border-top-right-radius: 38px; padding: 0.8rem 1.9rem 10vh 1.9rem; height: 70vh;}
.coach-detail__career-bottom-bar { background: #454553; width: 37%; height: 0.25rem; margin: 0 auto; border-radius: 27px; }
.coach-detail__career-title { font-size: 1.5rem; color: #fff; font-weight: 500; margin-bottom: 1.2rem; }
.coach-detail__career-list {  }
.coach-detail__career-item { display: flex; align-items: center; margin-bottom: 1.1rem; }
.coach-detail__career-item-num { font-size: 0.8rem; color: #181818; background: #fff; border-radius: 50px; text-align: center; display: inline-block; width: 1.5rem; height: 1.5rem; align-content: center; position: relative; }
.coach-detail__career-item-num::before { position: absolute; left: 0.74rem; right: 0; bottom: -1.3rem; content: ''; background: #fff; width: 0.08rem; height: 1.3rem; }
.coach-detail__career-item-num-line { position: absolute; bottom: 0; left: 0; right: 0; background: #fff; width: 1px; height: 0.5rem; }
.coach-detail__career-item-value { font-size: 0.8rem; color: #fff; margin-left: 1.5rem; }

.coach-detail__career-list .coach-detail__career-item:last-child .coach-detail__career-item-num::before { display: none; }




















