@charset "UTF-8";

html {
  scroll-behavior: smooth; /* 부드러운 스크롤 적용 */
}
/* 메인 */
#main-section .wrap {
  width: 100%;
  max-width: 1612px;
  padding: 0 20px;
  margin: 0 auto;
}

.animated-title {
  font-size: 60px;
  font-weight: 300;
  position: relative;
  width: 100%;
  max-width: 100%;
  height: auto;
  padding: 100px 0;
  overflow-x: hidden;
  overflow-y: hidden;
}
.animated-title .track {
  position: absolute;
  display: flex; /* 플렉스박스 사용 */
  white-space: nowrap; /* 줄 바꿈 방지 */
  color: #fff; /* 텍스트 색상 */
  -webkit-text-stroke-width: 2px; /* 테두리 두께 */
  -webkit-text-stroke-color: #bb9753; /* 테두리 색상 */
  font-size: 173px; /* 텍스트 크기 */
  font-weight: 900; /* 폰트 두께 */
  letter-spacing: -8.65px; /* 문자 간격 */
  text-transform: uppercase; /* 대문자로 변환 */
  animation: marquee 85s linear infinite;
  top: 0;
}
@keyframes marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}
.main-section0 {
  position: relative;
}
.main-section0 .m_br {
  display: none;
}
.main-section01 {
  background: url(../img/bg01_3840.jpg) no-repeat top center / cover;
  padding-top: 28px;
  padding-bottom: 130px;
}
.main-section01 .txt {
  display: block;
  text-align: center;
  color: var(--gray-color-5);
  font-size: 26px;
  font-weight: 400;
  margin-bottom: 214px;
}
.main-section01 .object {
  width: 1328px;
  display: block;
  width: 100%;
}
.main-section01 .object.m_img {
  display: none;
}
.main-section01 .move {
  display: flex;
  align-items: center;
  margin: 0 auto;
  width: 772px; /* 초기 너비 */
  border-radius: 60px; /* 초기 border-radius */
  overflow: hidden; /* 자식 요소가 넘칠 경우 숨김 처리 */
  transition: width 0.5s, border-radius 0.5s; /* 부드러운 변화 */
}
.main-section01 .move img {
  display: block;
  width: 100%;
}
.main-section01_cont {
  position: relative;
}
.scroll-arrow {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -10px;
  animation-name: arrow;
  animation-duration: 1s;
  animation-delay: 0.5s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-out;
  animation-direction: alternate;
}
.scroll-arrow img {
  width: 63px;
  display: block;
}
.scroll-arrow img.pc_img {
  display: block;
}
.scroll-arrow img.m_img {
  display: none;
}
.scroll-arrow span {
  color: #fff;
  font-size: 14px;
  font-weight: 600;
}

@keyframes arrow {
  0% {
    transform: translate(-50%, 0);
  }
  100% {
    transform: translate(-50%, 20px);
  }
}
.main-section02 {
  background: url(../img/bg02_3840.jpg) no-repeat top center / cover;
  padding-top: 139px;
  padding-bottom: 147px;
}
.main-title {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  opacity: 0; /* 초기 상태: 불투명도 0 */
  transform: translateY(50px); /* 초기 상태: 아래에서 위로 올라오는 효과 */
  transition: opacity 0.5s ease, transform 0.1s ease; /* 부드러운 변화 설정 */
}
.main-title h2 {
  font-size: 50px;
  color: #fff;
  font-weight: 600;
  letter-spacing: -2.5px;
  margin-bottom: 30px;
  text-align: center;
}
.main-title p {
  text-align: center;
  color: #fff;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.6;
}
.main-section02 .main-title {
  margin-bottom: 100px;
}
.main-section02 .main-title h2 {
  position: relative;
}
.main-section02 .main-title h2::after {
  content: "";
  display: block;
  width: 48px;
  height: 65px;
  background: url(../img/soft_star.svg) no-repeat center;
  background-size: auto;
  position: absolute;
  left: -44px;
  top: -56px;
}
.main-section02 .main-title h2::before {
  content: "";
  display: block;
  width: 59px;
  height: 52px;
  background: url(../img/smile.svg) no-repeat center;
  background-size: auto;
  position: absolute;
  right: -11px;
  bottom: 35px;
  transform: translateX(100%);
}
.main-section02 .main-title h2 span {
  position: relative;
}
.main-section02 .main-title h2 span::after {
  content: "";
  display: block;
  width: 56px;
  height: 65px;
  background: url(../img/waterscape.svg) no-repeat center;
  background-size: 100% auto;
  position: absolute;
  left: 45%;
  bottom: 31px;
  transform: translateX(-50%);
}
.main-section02 .program_box {
  border-radius: 40px;
  overflow: hidden;
  max-width: 1572px;
  width: 100%;
}
.main-section02 .program_box ul {
  display: flex;
  flex: 1 0;
  transition: all 0.3s ease-out;
  gap: 1px;
}
.main-section02 .program_box .program_item.is_active {
  flex: 966px 0;
}
.main-section02 .program_box .program_item {
  flex: 1;
  height: 540px;
}
.main-section02 .program_box ul li.program_item {
  background: #fff url(../img/main_program01.jpg) no-repeat center bottom /
    cover;
  transition: 0.3s ease-in-out;
}
.main-section02 .program_box ul li.program_item:nth-child(2) {
  background: #fff url(../img/main_program02.jpg) no-repeat center bottom /
    cover;
}
.main-section02 .program_box ul li.program_item:nth-child(3) {
  background: #fff url(../img/main_program03.jpg) no-repeat center bottom /
    cover;
}
.main-section02 .program_box ul li.program_item:nth-child(4) {
  background: #fff url(../img/main_program04.jpg) no-repeat center bottom /
    cover;
}
.main-section02 .program_box ul li.program_item.is_active {
  background: #fff url(../img/main_program_bg01.jpg) no-repeat center top /
    cover;
  color: #fff;
}
.main-section02 .program_box ul li.program_item:nth-child(2).is_active {
  background: #fff url(../img/main_program_bg02.jpg) no-repeat center top /
    cover;
}
.main-section02 .program_box ul li.program_item:nth-child(3).is_active {
  background: #fff url(../img/main_program_bg03.jpg) no-repeat center top /
    cover;
}
.main-section02 .program_box ul li.program_item:nth-child(4).is_active {
  background: #fff url(../img/main_program_bg04.jpg) no-repeat center top /
    cover;
}
.main-section02 .program_box ul li.program_item.is_active a {
  color: #fff;
}
.main-section02 .program_box ul .program_item a {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 34px 0;
}
.main-section02 .program_box ul .program_item .name {
  display: block;
  width: fit-content;
  height: fit-content;
  padding: 10px 16px;
  border-radius: 8px;
  border: 2px solid var(--deep-blue);
  color: var(--deep-blue);
  font-size: 22px;
  font-weight: 800;
  line-height: 32px;
}
.main-section02 .program_box ul .program_item p {
  margin-top: 10px;
  color: #fff;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.41;
  margin-bottom: 30px;
}
.main-section02 .program_box ul .program_item button {
  display: flex;
  padding: 8px 16px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  color: #fff;
  border-radius: 20px;
  border: 1px solid #fff;
  font-size: 13px;
  font-weight: 400;
  padding: 8px 16px;
}
.main-section02 .program_box ul .program_item button img {
  display: block;
  width: 8px;
}
.main-section02 .program_box ul .program_item button,
.main-section02 .program_box ul .program_item p {
  display: none;
  opacity: 0;
}
.main-section02 .program_box ul li.program_item.is_active a {
  align-items: flex-start;
  padding: 40px 52px;
}
.main-section02 .program_box ul li.program_item.is_active .name {
  color: #fff;
  font-size: 30px;
  font-weight: 600;
  border: none;
  padding: 0;
}
.main-section02 .program_box ul li.program_item.is_active button {
  display: flex;
  opacity: 1;
}
.main-section02 .program_box ul li.program_item.is_active p {
  display: block;
  opacity: 1;
}
.main-section02 .program_box_option {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 16px;
}
.main-section02 .swiper-pagination {
  width: fit-content;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: 0;
}
.main-section02 .swiper-pagination-bullet {
  margin: 0 !important;
}
.main-section02 .program_box_option .btn_stop {
  width: 10px;
  height: 10px;
  background: url(../img/ic_10_main_stop.png) no-repeat center / cover;
}
.main-section02 .program_box_option .btn_stop.stop {
  background: url(../img/ic_10_main_play.png) no-repeat center / cover;
}
.main-section03 {
  background: url(../img/bg03_3840.jpg) no-repeat center bottom / cover;
  padding-top: 140px;
  padding-bottom: 140px;
  position: relative;
  margin: auto;
  overflow: visible;
}
.main-section03::after {
  content: "";
  display: block;
  width: 779px;
  height: 338px;
  background: url(../img/03_left_ston.png) no-repeat left top;
  background-size: 100% auto;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 0;
}
.main-section03::before {
  content: "";
  display: block;
  width: 166px;
  height: 772px;
  background: url(../img/03_right_ston.png) no-repeat right center;
  background-size: 100% auto;
  position: absolute;
  right: 0;
  top: 15%;
  z-index: 0;
}
#main-section .main-section03 .main-title {
  margin-bottom: 80px;
}
#main-section .main-section03 .wrap {
  width: 100%;
  max-width: 1804px;
  padding: 0 20px;
  margin: 0 auto;
}
.main-section03 .card_list_wrapper {
  position: relative;
  z-index: 10;
}
.main-section03 .cards .card_wrapper {
  width: 100%;
  display: flex;
  justify-content: space-between;
  border-radius: 20px;
  height: 340px;
  background: #252a3d;
  position: sticky;
  top: 80px;
}
.main-section03 .cards .card_wrapper.card1 {
  overflow: hidden;
}
.main-section03 .cards .card_wrapper.card2 {
  transform: translateY(4rem);
}
.main-section03 .cards .card_wrapper.card3 {
  transform: translateY(8rem);
}

.main-section03 .cards .card_wrapper .card_right .pc_img {
  display: block;
}
.main-section03 .cards .card_wrapper .card_right .m_img {
  display: none;
}
.main-section03 .cards .card_wrapper .card_right {
  width: 800px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 340px;
  padding: 50px;
}
.main-section03 .card_wrapper .item_list .item span {
  display: block;
  font-size: 18px;
  color: #fff;
}
.main-section03 .card_wrapper .item_list .item {
  display: flex;
  align-items: center;
  font-size: 18px;
  gap: 10px;
  color: #fff;
}
.main-section03 .card_wrapper .item_list .item img {
  width: 24px;
}
.main-section03 .card_wrapper .item_list .item + .item {
  margin-top: 6px;
}
.main-section03 .cards .card_wrapper h2 {
  font-size: 40px;
  font-weight: bold;
  margin-bottom: 40px;
  color: #fff;
}
.main-section03 .cards .card_wrapper .card_right img,
.main-section03 .cards .card_wrapper .card_right {
  width: fit-content;
  max-width: 800px;
}
.main-section03 .cards .legt_group {
  padding-left: 80px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  max-width: calc(100% - 800px);
}
.main-section03 .cards .card_wrapper.card1 .card_right img {
  height: 100%;
  width: auto;
}
.main-section03 .cards .card_wrapper.card3 .card_right img {
  width: fit-content;
}

.main-section03 .btn-more {
  display: flex;
  justify-content: center;
  margin-top: 105px;
}
.main-section03 .btn-more a {
  display: flex;
  padding: 8px 45px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border-radius: 20px;
  border: 1px solid var(--basics-color-1);
  color: #fff;
  font-weight: 600;
  font-size: 18px;
}
.main-section03 .btn-more img {
  width: 14px;
  display: block;
}
.main-section04 {
  background: url(../img/bg04_3840.jpg) no-repeat center bottom / cover;
  padding: 142px 0 103px;
  overflow: hidden;
  position: relative;
}
.main-section04::after {
  content: "";
  display: block;
  width: 369px;
  height: 332px;
  background: url(../img/04_left_ston.png) no-repeat left top;
  background-size: 100% auto;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 0;
}
.main-section04::before {
  content: "";
  display: block;
  width: 831px;
  height: 403px;
  background: url(../img/04_right_ston.png) no-repeat right top;
  background-size: 100% auto;
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 0;
}
.main-section04 .wrap {
  position: relative;
  z-index: 10;
}
.main-section04 .main-title {
  margin-bottom: 6px;
}
.main-section04 .btn-more {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 30px;
}
.main-section04 .btn-more a {
  display: flex;
  padding: 8px 45px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 20px;
  border: 1px solid var(--basics-color-1);
  color: #fff;
  font-weight: 600;
  font-size: 18px;
}
.main-section04 .btn-more img {
  width: 8px;
  display: block;
}
.main-section04 .lesson_slide {
  width: 100%;
}
.main-section04 .lesson_slide .item {
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
}
.main-section04 .lesson_slide .swiper-slide {
  width: 350px;
  transition: 0.1s;
  margin: 0 28px;
}
.main-section04 .item a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  height: 515px;
}
.main-section04 .item .thumbnail {
  aspect-ratio: 1 / 1;
  width: 200px;
  height: 200px;
  border-radius: 200px;
  overflow: hidden;
  margin-bottom: 40px;
}
.main-section04 .item .thumbnail img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center;
}
.main-section04 .item .name {
  font-size: 24px;
  font-weight: 600;
  text-align: center;
}
.main-section04 .item p {
  line-height: 1.5;
  font-size: 16px;
  font-weight: 400;
  color: var(--gray-color-3);
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  width: 100%;
  margin-top: 20px;
  margin-bottom: 20px;
}
.main-section04 .item button {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: center;
  padding: 8px 16px;
  border-radius: 20px;
  border: 1px solid var(--gray-color-6);
  font-size: 12px;
  font-weight: 400;
  color: var(--primary-color-1);
}
.main-section04 .item button img {
  width: 8px;
}
.main-section04
  .swiper-horizontal
  > .swiper-pagination-bullets
  .swiper-pagination-bullet,
.main-section04
  .swiper-pagination-horizontal.swiper-pagination-bullets
  .swiper-pagination-bullet {
  margin: 0;
}
.main-section04 .swiper-pagination-bullet {
  flex: 1;
  border-radius: 0;
  height: 6px;
  transition: 0.15s ease-in-out;
  background: #fff;
  opacity: 1;
}
.main-section04 .swiper-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 80px auto 0;
  width: 500px;
  height: 6px;
  position: relative;
  bottom: initial;
  left: initial;
  opacity: 1;
  border-radius: 60px;
  overflow: hidden;
}
.main-section04 .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: var(--orange-color);
  border-radius: 3px;
}
.main-section04 .lesson_slide {
  position: relative;
  height: 515px;
}
.main-section04 .lesson_slide_box {
  width: 100vw;
  position: absolute;
  left: 0;
  top: 0;
}
.main-section05 {
  background: url(../img/bg05_3840.jpg) no-repeat center top / cover;

  padding: 160px 0;
}
.main-section05 .wrap {
  display: flex;
  justify-content: space-between;
  gap: 50px;
}
.main-section05 .sub_box {
  padding: 40px 40px;
  border-radius: 8px;
  background: #fff;
  opacity: 0;
}
.main-section05 .instagram_wrap {
  width: 866px;
}
.main-section05 .main_notice {
  width: 656px;
}
.main-section05 .top_group {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 30px;
}
.main-section05 .top_group h3 {
  font-size: 24px;
  font-weight: 600;
}
.main-section05 .top_group .btn-more a {
  display: flex;
  padding: 4px 16px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border-radius: 20px;
  border: 1px solid var(--gray-color-1);
  font-size: 14px;
  font-weight: 400;
}
.main-section05 .top_group .btn-more img {
  width: 10px;
  display: block;
}
.main-section05 .instagram_wrap .swiper {
  width: 100%;
}
.main-section05 .instagram_wrap .swiper-slide a {
  display: block;
}
.main-section05 .instagram_wrap .swiper-slide a img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center;
  width: 100%;
  display: block;
}

.main-section05
  .swiper-horizontal
  > .swiper-pagination-bullets
  .swiper-pagination-bullet,
.main-section05
  .swiper-pagination-horizontal.swiper-pagination-bullets
  .swiper-pagination-bullet {
  margin: 0;
}
.main-section05 .swiper-pagination-bullet {
  flex: 1;
  border-radius: 0;
  height: 6px;
  transition: 0.15s ease-in-out;
  background: #d9d9d9;
  opacity: 1;
}
.main-section05 .pagination {
  display: none;
  padding-right: 20px;
  margin: 20px auto 0;
}
.main-section05 .swiper-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 6px;
  position: relative;
  bottom: initial;
  left: initial;
  background: #d9d9d9;
  opacity: 1;
}
.main-section05 .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: var(--orange-color);
  border-radius: 3px;
}
.main_notice .notice_item {
  border-top: 1px solid var(--gray-color-6);
}
.main_notice .notice_item li {
  border-bottom: 1px solid var(--gray-color-6);
}
.main_notice .notice_item a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  height: 60px;
}
.main_notice .notice_item a p {
  width: calc(100% - 145px);
  line-height: 1.55;
  font-weight: 600;
  font-size: 18px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-all;
}
.main_notice .notice_item a .day {
  font-size: 18px;
  font-weight: 400;
}
.right_nav {
  position: fixed;
  right: 30px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 100;
  width: 70px;
}

.right_nav .progress_bar .now {
  width: 15px;
  background-color: #264286;
  position: absolute;
  top: 7px;
  left: 0;
  z-index: 10;
  max-height: 223px;
}
.right_nav .progress_bar .bar {
  position: relative;
  margin: 0 auto;
  width: 37px;
  background: url(../img/gr_progressbar.svg) no-repeat center / cover;

  display: block;
  height: 229px;
}
.right_nav .progress_bar .bar::after {
  content: "";
  display: block;
  width: 15px;
  height: 222px;
  background: url(../img/gradation.svg) no-repeat right top;
  background-size: 100%;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 20;
}
.right_nav .progress_bar .now img {
  position: absolute;
  bottom: -30px;
  left: 0;
  transform: translateX(-100%);
  max-width: none;
  animation-name: now;
  -webkit-animation-name: now;
  animation-duration: 1s;
  -webkit-animation-duration: 1s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  animation-fill-mode: both;
}
.right_nav .btn_reserve {
  width: 73px;
  margin-top: 16px;
}
.right_nav .btn_reserve a {
  display: block;
}
.right_nav .btn_reserve a img {
  width: 100%;
  display: block;
}
/* 메인 */
/* 파라다이브 소개  */
.company_intro {
  width: 100%;
  margin-bottom: 120px;
}
.company_intro img {
  display: block;
  width: 100%;
}
.company_intro img.m_img {
  display: none;
}
.company_intro p {
  display: none;
  opacity: 0;
}
.company_intro02 {
  margin-bottom: 60px;
}
.company_intro02 .text {
  margin-bottom: 100px;
  text-align: center;
}
.company_intro03 .text p,
.company_intro02 .text p {
  color: var(--gray-color-1);
  text-align: center;
  font-size: 32px;
  font-weight: 400;
  line-height: 1.37;
}
.company_intro03 .text p span,
.company_intro02 .text p span {
  font-weight: 600;
  position: relative;
  z-index: 1;
}
.company_intro03 .text p span.line_m,
.company_intro02 .text p span.line_m {
  display: none;
}
.company_intro03 .text p span::after,
.company_intro02 .text p span::after {
  content: "";
  display: block;
  width: 100%;
  height: 12px;
  background: #33d0ff;
  position: absolute;
  left: 0;
  bottom: 1px;
  z-index: -1;
}
.company_intro02 .img_group ul {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  justify-content: center;
}
.company_intro02 .img_group ul li:first-child {
  width: 200px;
}
.company_intro02 .img_group ul li img {
  width: 100%;
  display: block;
}
.company_intro02 .img_group ul li:first-child img {
  padding-left: 23px;
}
.company_intro02 .img_group ul li p {
  text-align: right;
  font-size: 24px;
  font-weight: 600;
  margin-top: 30px;
}
.company_intro02 .img_group ul li:nth-child(2) {
  width: 640px;
}
.company_intro02 .img_group ul li span {
  display: block;
  font-size: 16px;
  font-weight: 400;
  margin-top: 16px;
}
.company_intro03 .text {
  margin-bottom: 110px;
}
.company_intro03 .img_group ul {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.company_intro03 .img_group ul li {
  flex: 1;
}
.company_intro03 .img_group ul li .img_box {
  display: block;
  margin-bottom: 22px;
}
.company_intro03 .img_group ul li img {
  width: 100%;
  display: block;
}
.company_intro03 .img_group img.m_img {
  display: none;
}
.company_intro03 .img_group ul li .title {
  color: #000;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  margin-bottom: 16px;
}
.company_intro03 .img_group ul li .title strong {
  color: #000;
  font-size: 18px;
  font-weight: 600;
}
.company_intro03 .img_group ul li p {
  color: #000;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.62;
}
.company_intro02 .m_br,
.company_intro03 .m_br {
  display: none;
}
/* 파라다이브 소개  */
/* CI/BI */
.ci-title {
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 30px;
  border-bottom: 1px solid var(--gray-color-6);
  padding-bottom: 40px;
}

.ci_box {
  display: flex;
  align-items: flex-start;
}
.ci_box + .ci_box {
  margin-top: 140px;
}
.ci_box .title {
  width: 200px;
  color: var(--gray-color-3);
  font-size: 20px;
  font-weight: 600;
}
.ci_box .contents {
  width: calc(100% - 200px);
}
.ci_box .contents p {
  color: var(--gray-color-3);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
  margin-bottom: 40px;
  word-break: keep-all;
}

.ci_box01 .img_box {
  max-width: 559px;
  width: 100%;
}
.ci_box02 .img_box {
  max-width: 686px;
  width: 100%;
}
.ci_box03 .img_box {
  max-width: 778px;
  width: 100%;
}
.ci_box04 .img_box {
  max-width: 608px;
  width: 100%;
}
.ci_box04 {
  margin-bottom: 100px;
}

.ci_box05 .img_box01 {
  max-width: 973px;
  width: 100%;
  margin-bottom: 100px;
}
.ci_box05 .img_box01 .m_img {
  display: none;
}
.ci_box05 .img_box02 {
  max-width: 973px;
  width: 100%;
}

/* CI/BI */
/* 찾아오시는 길 */
.map_box {
  margin-bottom: 60px;
  width: 100%;
}
.root_daum_roughmap {
  width: 100% !important;
}
.map_text h3 {
  font-size: 30px;
  color: #000;
  font-weight: 600;
  padding-bottom: 30px;
  margin-bottom: 40px;
  border-bottom: 1px solid var(--gray-color-6);
}
.map_text .item_box {
  display: flex;
  align-items: flex-start;
}
.map_text .item_box .title {
  width: 200px;
  font-size: 20px;
  color: var(--gray-color-3);
  font-weight: 600;
  line-height: 28px;
}
.map_text .item_box .item {
  width: calc(100% - 200px);
  color: var(--gray-color-3);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
  word-break: keep-all;
}
.map_text .item_box + .item_box {
  margin-top: 12px;
}
/* 찾아오시는 길 */
/* 시설 및 요금안내 */
.program_slideBox .wrap {
  position: relative;
}
.program_slideBox .wrap .btn {
  position: absolute;
  display: block;
  z-index: 5;
  width: 38px;
  top: 50%;
}
.program_slideBox .wrap .btn_left {
  left: 10px;
  transform: translate(-100%, -50%);
}
.program_slideBox .wrap .btn_right {
  right: 10px;
  transform: translate(100%, -50%);
}
.program_slideBox .wrap .btn img {
  display: block;
  width: 100%;
}
.program_slideBox .swiper {
  width: 100%;
}
.program_slideBox .swiper-wrapper {
  margin-bottom: 20px;
}
.program_slideBox .swiper-slide a {
  height: 330px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 40px 18px 10px;
  border-radius: 8px;
  border: 1px solid var(--gray-color-6);
  background: #fff;
}
.program_slideBox .swiper-slide a .img_box {
  width: 140px;
  height: 140px;
  border-radius: 140px;
  overflow: hidden;
  margin-bottom: 40px;
}
.program_slideBox .swiper-slide a p {
  font-size: 20px;
  font-weight: 600;
  line-height: 1;
  margin-bottom: 20px;
  word-break: keep-all;
}
.program_slideBox .swiper-slide button {
  display: flex;
  padding: 8px 16px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border-radius: 20px;
  border: 1px solid var(--gray-color-6);
}
.program_slideBox .swiper-slide button span {
  font-size: 12px;
  font-weight: 400;
  color: var(--primary-color-1);
}
.program_slideBox .swiper-slide button img {
  width: 8px;
  display: block;
}
.program_slideBox .swiper-pagination {
  display: none;
  position: initial;
  text-align: center;
  transition: 0.3s opacity;
  transform: translate3d(0, 0, 0);
  z-index: 10;
  height: 4px;
  border-radius: 60px;
  overflow: hidden;
}
.program_slideBox .swiper-pagination-bullet {
  flex: 1;
  border-radius: 0;
  margin: 0 !important;
  height: 4px;
}
.program_slideBox .swiper-pagination-bullet-active {
  background: var(--point-color-5);
}
.program_slideBox .swiper-slide.swiper-slide-active a {
  border: 1px solid var(--primary-color-1);
}
.program_tab {
  margin-top: 60px;
}
.program_top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 60px;
}
.program_top .left_group {
  width: calc(100% - 620px);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.program_top .left_group .logo {
  width: 200px;
  height: 80px;
  border-radius: 8px;
  border: 1px solid var(--gray-color-6);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  margin-bottom: 40px;
}
.program_top .left_group .logo img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.program_top .left_group .list_item {
  margin-bottom: 40px;
}
.program_top .left_group .list_item ul {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}
.program_top .left_group .list_item ul li {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 120px;
  height: 120px;
  padding: 10px;
  border-radius: 200px;
  border: 1px solid var(--primary-color-1);
  text-align: center;
  font-size: 18px;
  color: var(--primary-color-1);
  font-weight: 600;
  line-height: 1.33;
}
.program_top .left_group p {
  width: 100%;
  color: #000;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
  word-break: keep-all;
}
.program_top .img_slide {
  width: 570px;
  padding: 40px;
  border-radius: 8px;
  border: 1px solid var(--gray-color-6);
}
.program_top .img_slide .swiper-slide img {
  width: 100%;
  display: block;
}
.program_top .img_slide .option {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}
.program_top .img_slide .swiper-wrapper {
  margin-bottom: 30px;
}
.program_top .img_slide .swiper-pagination-clickable .swiper-pagination-bullet {
  margin: 0 !important;
}
.program_top .img_slide .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  border-radius: 12px;
  background: #8f9191;
  opacity: 1;
}
.program_top
  .img_slide
  .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: var(--primary-color-1);
}
.program_top .img_slide .swiper-pagination {
  position: inherit;
  width: fit-content;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
}
.program_top .img_slide .btn_play {
  width: 16px;
  height: 16px;
  display: block;
  background: url(../img/ic_16_main_stop.png) no-repeat center / cover;
}
.program_top .img_slide .btn_play.stop {
  width: 16px;
  height: 16px;
  display: block;
  background: url(../img/ic_16_main_play.png) no-repeat center / cover;
}

.tab_menu li {
  max-width: 200px;
}
.tab_menu {
  padding-top: 40px;
  padding-bottom: 40px;
  margin-bottom: 6px;
}
.tab_menu ul {
  border-bottom: 1px solid var(--primary-color-1);
}
.tab_menu ul li {
  border-bottom: none;
  position: relative;
}
.tab_menu ul li.on::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background: #fff;
  position: absolute;
  left: 0;
  bottom: -1px;
  z-index: 10;
}
.program_tab .tab_title {
  line-height: 28px;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 20px;
}
.program_tab .grid_2box {
  border-top: 1px solid #000;
}
.program_tab .grid_2box ul li {
  display: flex;
  width: 100%;
  border-bottom: 1px solid var(--gray-color-6);
}
.program_tab .grid_2box ul li span {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  color: #313131;
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  padding: 9px;
}
.program_tab .grid_2box li.th span {
  font-weight: 600;
  font-size: 12px;
}
.program_tab .tab_sub .item_box + .item_box {
  margin-top: 60px;
}
.program_tab .tab_sub .sub_list p {
  color: var(--primary-color-1);
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px;
}
.program_tab .tab_sub .sub_list > ul > li {
  padding-left: 16px;
  position: relative;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
}
.program_tab .tab_sub .sub_list h3 {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 20px;
}
.program_tab .tab_sub .sub_list > ul > li::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background: var(--gray-color-1);
  position: absolute;
  left: 0;
  top: 11px;
  border-radius: 50px;
}
.program_tab .tab_sub .sub_list .sub li {
  position: relative;
  padding-left: 16px;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
}
.program_tab .tab_sub .sub_list .sub li::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background: url(../img/icon_bullet.svg) no-repeat center / cover;
  position: absolute;
  left: 0;
  top: 11px;
}
.program_tab .tab_sub .sub_list + .sub_list {
  margin-top: 40px;
}

.comm_table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
  text-align: center;
  table-layout: fixed;
}
.comm_table .title-row th {
  border-top: 1px solid #000;
  border-left: none;
  border-right: none;
  background: var(--gray-color-8);
  color: var(--primary-color-1);
  font-size: 18px;
  font-weight: 600;
  padding: 16px 0;
  line-height: 1.5;
}

.comm_table th,
.comm_table td {
  border: 1px solid #ddd;
  padding: 9px;
  vertical-align: middle;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.57;
}
.comm_table .border_lnone {
  border-left: none;
}
.comm_table .border_rnone {
  border-right: none;
}
.equipment-table.comm_table tr td:last-child,
.comm_table.pricing_table tr td:last-child {
  border-right: none;
}
.equipment-table.comm_table col,
.comm_table.pricing_table col {
  width: calc(100% / 4);
}

.facility-usage ul {
  display: flex;
  align-items: flex-start;
  gap: 40px;
}
.facility-usage li {
  width: 120px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  position: relative;
}
.facility-usage li.arrow {
  width: 18px;
  padding-top: 40px;
}
.facility-usage li img {
  display: block;
  width: 100%;
}
.facility-usage li span {
  display: block;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
}
.facility-usage li span.exception {
  position: absolute;
  width: 140px;
  text-align: center;
  left: 50%;
  bottom: -20px;
  transform: translate(-50%, 100%);
}
.refund-table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
  text-align: center;
  table-layout: fixed;
}
.refund-table .col1 {
  width: 250px;
}
.refund-table .col2 {
  width: calc(100% - 250px);
}
.refund-table th,
.refund-table td {
  vertical-align: middle;
  font-size: 16px;
  line-height: 1.75;
  padding: 0 30px;
  text-align: left;
}
.refund-table th {
  color: #2f2f2f;
  border: 1px solid #d9d9d9;
  background: #f7f9fb;
  font-weight: 600;
  border-left: none;
}
.refund-table td {
  height: 60px;
  color: var(--gray-color-1);
  border: 1px solid #d9d9d9;
  border-right: none;
}
.benefit-list {
  counter-reset: list-counter; /* 리스트 카운터 초기화 */
}
.benefit-list li {
  counter-increment: list-counter; /* 각 항목에 번호 증가 */
  font-size: 16px;
  line-height: 1.75;
  position: relative;
  padding-left: 19px;
}
.benefit-list li.pd {
  padding-left: 24px;
}
.benefit-list li::before {
  content: counter(list-counter) ")";
  position: absolute;
  left: 0;
  top: 0;
}
.benefit-list .highlight {
  color: var(--orange-color);
}
.program_tab .instructor_fees.grid_2box ul li.th span {
  padding: 8px 6px;
}
.program_tab .instructor_fees.grid_2box ul li span {
  padding: 28px 6px;
}
.program_tab .grid_2box.grid_2box02 ul li span {
  flex: none;
  width: 390px;
}
.program_tab .grid_2box.grid_2box02 ul li span br {
  display: none;
}
.program_tab .grid_2box.grid_2box02 ul li span:first-child {
  flex: none;
  width: calc(100% - 390px);
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  color: #313131;
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  padding: 9px;
}
.tab_sub .benefit-list .sub li {
  position: relative;
  padding-left: 16px;
}
.tab_sub .benefit-list .sub li::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background: url(../img/icon_bullet.svg) no-repeat center / cover;
  position: absolute;
  left: 0;
  top: 11px;
}
.experience_popup {
  width: 100%;
  max-width: 800px;
}
.pricing-table {
  width: 100%;
  border-collapse: collapse;
  text-align: center;
  border: 1px solid #ddd;
  table-layout: fixed;
}
.pricing-table01 .col1 {
  width: 94px;
}
.pricing-table01 .col2 {
  width: 80px;
}
.pricing-table01 .col3 {
  width: 200px;
}
.pricing-table02 .col1 {
  width: 70px;
}
.pricing-table02 .col2 {
  width: 40px;
}
.pricing-table02 .col3 {
  width: 58px;
}
.pricing-table02 .col4 {
  width: 64px;
}
.pricing-table03 .col1 {
  width: 50%;
}
.pricing-table03 colgroup {
  width: 100%;
}
.pricing-table th,
.pricing-table td {
  border: 1px solid #ddd;
  font-size: 14px;
  text-align: center;
  vertical-align: middle;
  padding: 9px 4px;
}
.pricing-table th {
  background-color: #f8f8f8;
  font-weight: 400;
  font-size: 14px;
  line-height: 22px;
}
.pricing-table .title-row th {
  border-top: 1px solid #000;
}
.pricing-table td {
  line-height: 1.57;
}
.pricing-table .sub-title-row td {
  background-color: #f8f8f8;
  font-weight: bold;
}
.pricing-table .sub-title-row tr td:last-child,
.pricing-table tr th:last-child,
.pricing-table tr td:last-child {
  border-right: 1px solid #fff;
}
.pricing-table .border_lf,
.pricing-table .title-row th:first-child {
  border-left: 1px solid #fff;
}
.pricing-table03 + .pricing-table02 {
  margin-top: 40px;
}
.experience_popup .pc_table {
  display: block;
}
.experience_popup .m_table {
  display: none;
}
.experience_popup .text {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px;
  word-break: keep-all;
}
.experience_popup .list-item {
  margin-bottom: 30px;
}
.experience_popup .list-item li {
  padding-left: 16px;
}
.experience_popup .list-item li {
  position: relative;
  word-break: keep-all;
  padding-left: 16px;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.57;
}
.experience_popup .list-item li::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background: url(../img/icon_bullet.svg) no-repeat center / cover;
  position: absolute;
  left: 0;
  top: 11px;
}
/* 시설 및 요금안내 */
/* 식음시설 */
.dining_list ul {
  display: flex;
  gap: 60px;
}
.dining_list ul li {
  flex: 1;
  border-radius: 8px;
  border: 1px solid var(--gray-color-6);
}
.dining_list ul li img {
  display: block;
  width: 100%;
}
.dining_list ul li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  padding: 40px;
}
.dining_list ul li a p {
  font-size: 24px;
  text-align: center;
  font-weight: 600;
}

.dining_popup .img_slide {
  width: 100%;
  max-width: 660px;
  margin: 0 auto;
  position: relative;
}
.dining_popup .img_slide .swiper-slide img {
  width: 100%;
  display: block;
}
.dining_popup .img_slide .option {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}
.dining_popup .img_slide .swiper-wrapper {
  margin-bottom: 20px;
}
.dining_popup
  .img_slide
  .swiper-pagination-clickable
  .swiper-pagination-bullet {
  margin: 0 !important;
}
.dining_popup .img_slide .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  border-radius: 12px;
  background: #8f9191;
  opacity: 1;
}
.dining_popup .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: var(--primary-color-1);
}
.dining_popup .img_slide .swiper-pagination {
  position: inherit;
  width: fit-content;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
}
.dining_popup .img_slide .btn_play {
  width: 16px;
  height: 16px;
  display: block;
  background: url(../img/ic_16_main_stop.png) no-repeat center / cover;
}
.dining_popup .img_slide .btn_play.stop {
  background: url(../img/ic_16_main_play.png) no-repeat center / cover;
}

.dining_popup .img_slide .btn {
  position: absolute;
  display: block;
  z-index: 5;
  width: 38px;
  top: 50%;
}
.dining_popup .img_slide_box {
  position: relative;
  padding: 30px 0;
}
.dining_popup .img_slide .btn_left {
  left: -10px;
  transform: translate(-100%, -50%);
}
.dining_popup .img_slide .btn_right {
  right: -10px;
  transform: translate(100%, -50%);
}
.dining_popup .img_slide .btn img {
  display: block;
  width: 100%;
}
.dining_popup .text {
  position: relative;
  padding-left: 16px;
  text-align: left;
  font-size: 16px;
  color: var(--gray-color-1);
  line-height: 28px;
  font-weight: 400;
}
.dining_popup .text span {
  color: var(--gray-color-5);
}
.dining_popup .text::after {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background: url(../img/icon_bullet.svg) no-repeat center / cover;
  position: absolute;
  left: 0;
  top: 11px;
}
.dining_popup .text br {
  display: none;
}
/* 식음시설 */
/* WAF_1100_시설선택 */
.facility-selection .title {
  font-size: 30px;
  font-weight: 600;
  color: var(--gray-color-1);
  margin-bottom: 30px;
}
.facility-selection .title span {
  color: var(--primary-color-1);
}
.reservation_slide {
  width: 100%;
  margin-bottom: 60px;
}
.reservation_slide .swiper-slide {
  border-radius: 8px;
  border: 1px solid var(--gray-color-6);
}
.reservation_slide .swiper-slide.on {
  border: 1px solid var(--primary-color-1);
}
.reservation_slide .swiper-slide a {
  display: flex;
  padding: 40px 20px;
  flex-direction: column;
  align-items: center;
  gap: 30px;
}
.reservation_slide .swiper-slide a span {
  font-size: 24px;
  font-weight: 600;
  display: block;
  text-align: center;
}
.reservation_slide .swiper-slide img {
  width: 100%;
  display: block;
}
.reservation_slide .option {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.reservation_slide .swiper-pagination-clickable .swiper-pagination-bullet {
  margin: 0 !important;
}
.reservation_slide .swiper-pagination-bullet {
  width: 7px;
  height: 7px;
  border-radius: 12px;
  background: #8f9191;
  opacity: 1;
}
.reservation_slide .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: var(--primary-color-1);
}
.reservation_slide .swiper-pagination {
  position: inherit;
  width: fit-content;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
}
.reservation_slide .btn_play {
  width: 10px;
  height: 10px;
  display: block;
  background: url(../img/ic_16_main_stop.png) no-repeat center / cover;
}
.reservation_slide .btn_play.stop {
  background: url(../img/ic_16_main_play.png) no-repeat center / cover;
}
.facility-selection .sub_title {
  font-size: 24px;
  font-weight: 600;
}
.reservation_program {
  margin-top: 30px;
}
.reservation_program ul {
  display: flex;
  gap: 10px;
	flex-wrap: wrap;
}
.reservation_program ul li {	
  width: calc((100% - 40px) / 5);
}
.reservation_program ul li a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100px;
  padding: 0px 20px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.5;
  border-radius: 8px;
  background: #f8f8f8;
  color: var(--gray-color-1);
}
.reservation_program ul li.on a {
  background: var(--primary-color-1);
  color: #fff;
}
.popup_wrap.provision_popup {
  max-width: 460px;
}
.popup_wrap.provision_popup .pop_title {
  margin-bottom: 24px;
}
.popup_wrap.provision_popup .pop_title {
  text-align: center;
}
.provision_popup .provision_box {
  border-radius: 8px;
  background: var(--gray-color-8);
  padding: 16px;
}
.provision_popup01 .provision_box + .provision_box {
  margin-top: 24px;
}
.provision_popup .provision_box h3 {
  margin-bottom: 10px;
  font-weight: 600;
  font-size: 18px;
}
.provision_popup01 .provision_box .list li br {
  display: none;
}
.provision_popup .provision_box .list > li {
  padding-left: 10px;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
  position: relative;
}
.provision_popup .provision_box .list > li::after {
  content: "-";
  display: block;
  width: 10px;
  font-size: 16px;
  line-height: 1.75;
  position: absolute;
  left: 0;
  top: 0;
}
.provision_popup .provision_box .list > li .sub li {
  display: flex;
  align-items: flex-start;
  width: calc(100% - 14px);
  font-size: 16px;
}
.provision_popup .provision_box .list > li .sub span {
  width: 14px;
  display: block;
  color: var(--point-color-5);
  font-weight: 400;
  font-size: 16px;
}
.popup_wrap .pop_btnBox {
  width: 100%;
  margin-top: 30px;
}
.provision_popup a.btn-base {
  line-height: 60px;
  font-size: 18px;
}
/* WAF_1100_시설선택 */
/* 예약하기 */
.rez_form {
  width: 100%;
  padding: 40px 0px 0;
  border-radius: 8px;
  border: 1px solid var(--gray-color-6);
}
.rez_form .title {
  text-align: center;
  font-size: 30px;
  margin-bottom: 30px;
}
.rez_form .title span {
  color: var(--primary-color-1);
}
.rez_calendar {
  border-bottom: 1px solid var(--gray-color-6);
}
.rez_form .form_box {
  width: 600px;
  margin: 0 auto;
  padding: 40px;
  min-height: 813px;
}
.pc_calendar_wrap {
  display: block;
}
.rez_calendar #inline-datepicker {
  display: none;
}

.pc_calendar_wrap .calendar-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 270px;
  margin: 0 auto 16px;
}
.pc_calendar_wrap .calendar-header h2 {
  font-size: 24px;
  font-weight: 400;
  color: #4a5660;
}
.pc_calendar_wrap .week_box {
  display: flex;
  justify-content: center;
  align-items: center;
}
.pc_calendar_wrap .week_box ul,
.pc_calendar {
  width: 550px;
  display: flex;
  gap: 10px;
  justify-content: center;
}
.pc_calendar_box {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 30px;
  padding-top: 16px;
  gap: 25px;
}
.pc_calendar_wrap .calendar_day {
  display: flex;
  width: 30px;
  height: 30px;
  justify-content: center;
  align-items: center;
  font-weight: 600;
  font-size: 16px;
  color: var(--gray-color-3);
  cursor: pointer;
}
.pc_calendar_wrap .calendar_day.selected {
  border-radius: 50%;
  background: var(--primary-color-1);
  color: #fff;
}
.pc_calendar_wrap .calendar_day.off {
  background: var(--gray-color-7);
  position: relative;
}
.pc_calendar_wrap .calendar_day.off + .off::before {
  content: "";
  display: block;
  width: 15px;
  height: 30px;
  background: var(--gray-color-7);
  position: absolute;
  left: -10px;
  top: 0;
}
.pc_calendar_box .nav_btn {
  width: 24px;
  display: block;
  cursor: pointer;
}
.pc_calendar_box .nav_btn img {
  width: 100%;
  display: block;
}
.pc_calendar_wrap .week_box ul li {
  width: 30px;
  text-align: center;
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--gray-color-5);
}

.quantity_box {
  display: flex;
  align-items: center;
  justify-content: center;
}
.quantity_box span,
.quantity_box button {
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid var(--gray-color-6);
  font-size: 1.6rem;
  text-align: center;
  font-weight: 600;
}
.quantity_box span {
  border-left: none;
  border-right: none;
}
.personnel_box .number_box {
  background: var(--gray-color-8);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
}
.personnel_box .number_box + .number_box {
  margin-top: 10px;
}
.personnel_box .number_box p {
  font-size: 1.6rem;
  font-weight: 400;
  color: #2f2f2f;
}
.rez_form .input-baseBox .check_on {
  display: none;
}
.rez_form .input-baseBox .check_on.on {
  padding-top: 10px;
  display: block;
}
.rez_form .input-baseBox .check_on .txt-list {
  margin-top: 16px;
}
.rez_form .input-baseBox .check_on .txt-list ul {
  padding: 1.6rem;
  border-radius: 0.8rem;
  background: var(--gray-color-8);
}
.rez_form .input-baseBox .check_on .txt-list ul + ul {
  margin-top: 16px;
}
.input-baseBox .check_on .txt-list li {
  padding-left: 16px;
  font-size: 14px;
  line-height: 1.57;
}

.input-baseBox .check_on .txt-list li span {
  font-weight: 600;
  color: var(--primary-color-1);
}
.rez_form .qual_list .check_on .txt-list li + li {
  margin-top: 0;
}
.rez_form .qual_list ul > li + li {
  margin-top: 10px;
}
.rez_form .qual_list span {
  font-size: 16px;
}
.rez_form .total_box {
  margin-bottom: 60px;
}
.rez_form .input-baseBox + .input-baseBox {
  margin-top: 30px;
}
.rez_form .btn_bottom {
  padding-bottom: 0;
  padding-top: 30px;
}
.rez_form .qual_list label {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.rez_form .flex_box {
  display: flex;
  gap: 20px;
}
.rez_form .price_flex .selectBox {
  width: 265px;
}
.rez_form .price_flex .item-price {
  display: flex;
  width: 235px;
  height: 44px;
  padding: 10px 0px;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid var(--gray-color-1);
}
.rez_form .price_flex .item-price .item-title {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.57;
  color: var(--gray-color-1);
}
.rez_form .price_flex .item-price .price {
  font-size: 20px;
  font-weight: 600;
  text-align: right;
}
.rez_form .price_flex .item-price .price span {
  color: var(--primary-color-1);
}
.rez_form .facility_flex .selectBox {
  width: 265px;
}
.rez_form .facility_flex .selectBox .label {
  color: var(--gray-color-1);
}
.rez_form .facility_flex .btn_map {
  width: 235px;
}
.facility_flex .btn_map .btn-line.btn-base {
  font-size: 14px;
  line-height: 42px;
  font-weight: 400;
  font-size: 14px;
}
.facility_flex .btn_map .btn-line span {
  font-size: 14px;
  font-weight: 400;
}

.rez-card {
  padding: 20px;
  border: 1px solid var(--gray-color-6);
  border-radius: 8px;
}
.rez-card ul li + li {
  margin-top: 20px;
}
.rez-card ul li {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.rez-card ul li .tit {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
}
.rez-card ul li .detail {
  line-height: 1.25;
  font-size: 16px;

  font-weight: 600;
  text-align: right;
}
.rez-card ul li .detail.fw400 {
  font-weight: 400 !important;
}
.rez-card ul li .detail .main_color {
  color: var(--primary-color-1) !important;
}
.rez-card ul li .detail .red {
  color: #f44e18 !important;
}
.rez-card ul li .detail .fz14 {
  font-weight: 400;
  font-size: 14px !important;
}
.rez-card.rez-card01 .detail {
  width: 175px;
  text-align: left;
}

.popup_wrap .rez-card {
  margin-bottom: 30px;
}
.course_box + .btn_bottom {
  margin-top: 30px;
}
.course_box {
  padding: 1.6rem;
  background: var(--gray-color-8);
  border-radius: 8px;
}
.course_box h4 {
  font-size: 1.4rem;
  font-weight: 600;
  margin-bottom: 10px;
  word-break: keep-all;
}
.course_box li {
  font-size: 1.4rem;
  word-break: keep-all;
  padding-left: 16px;
  position: relative;
}
.course_box li::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background: url(../img/bullet.png) no-repeat center / cover;
  position: absolute;
  left: 0;
  top: 5px;
  line-height: 1.5;
}
.course_box .main_color {
  color: var(--primary-color-1) !important;
}
.course_box p {
  word-break: keep-all;
  color: var(--gray-color-3);
  font-size: 1.4rem;
  line-height: 1.5;
}
.course_box p + p {
  margin-top: 10px;
}
.rez_agreement .course_box {
  margin-bottom: 40px;
}
.rez_agreement .rez_agree {
  margin-bottom: 30px;
}

.rez_agree label {
  display: flex;
  align-items: center;
  padding: 1rem;
  border-radius: 8px;
  gap: 10px;
  border: 1px solid var(--gray-color-6);
}

.rez_agree label span {
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--gray-color-5);
}

.rez_agree label input:checked + span {
  color: var(--primary-color-1);
}
.pop_use .btn-box {
  padding-top: 30px;
}
.img_pop {
  position: relative;
  overflow: hidden;
  border: 1px solid #dddddd;
}
.img_pop img {
  width: 100%;
  display: block;
}
.zoomable {
  transition: transform 0.3s ease-in-out;
  cursor: zoom-in;
}

.zoomable.zoomed {
  transform: scale(2); /* 2배 확대 */
  cursor: zoom-out;
  position: relative;
  z-index: 10;
}
.map_popup .btn-box {
  max-width: 400px;
  margin: 30px auto 0;
  align-items: center;
  justify-content: center;
}

.rez_mileage {
  margin-bottom: 60px;
}
.rez_mileage_box {
  border-radius: 8px;
  padding: 16px 20px;
  background: var(--gray-color-8);
}
.rez_mileage_box .top_box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}
.rez_mileage_box .top_box .tit {
  font-size: 1.6rem;
  font-weight: 400;
}
.rez_mileage_box .top_box .num {
  font-size: 14px;
  font-weight: 600;
}
.rez_mileage_box .top_box .num span {
  color: var(--primary-color-1);
  font-weight: 600;
  font-size: 16px;
}
.input-baseSubBox {
  display: flex;
  align-items: center;
  gap: 10px;
}
.form_subtit {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 20px;
}
.rez_form.payment {
  margin: 0 auto;
  width: 100%;
  max-width: 600px;
  padding: 40px;
}
.rez_form.payment .rez-card {
  border: none;
  padding: 0;
}
.rez_form.payment .rez-card ul li .detail br {
  display: none;
}
.rez_coupon_wrap {
  margin-top: 60px;
  margin-bottom: 60px;
}
.rez_form .rez_coupon_wrap .input-baseBox + .input-baseBox {
  margin-top: 20px;
}
.rez_form.payment .btn-box {
  margin: 0 auto;
  width: 100%;
  max-width: 300px;
}
.complete_box {
  padding: 60px 0;
  background: var(--gray-color-8);
  border-radius: 8px;
}
.complete_box .item .icon_box {
  width: 230px;
}
.complete_box > .item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 25px;

  border-radius: 8px;
  margin-bottom: 25px;
}
.complete_box .item p {
  font-size: 32px;
  font-weight: 600;
}
.complete_box .btn_bottom {
  width: 100%;
  max-width: 525px;
  margin: 0 auto;
}
/* 예약하기 */
/* 회원권 구매 */
.membership_list ul {
  display: flex;
  gap: 60px;
  flex-wrap: wrap;
}
.membership_list ul + ul {
  margin-top: 40px;
}
.membership_list ul li {
  width: calc((100% - 60px) / 2);
}
.membership_list ul li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  padding: 40px 20px;
  border-radius: 8px;
  border: 1px solid var(--gray-color-6);
}
.membership_list ul li .icon_box {
  width: 200px;
  height: 200px;
  border-radius: 200px;
  background: var(--gray-color-8);
  display: flex;
  align-items: center;
  justify-content: center;
}
.membership_list ul li a .info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.membership_list ul li a .info p {
  font-size: 24px;
  font-weight: 600;
}
.membership_list ul li a .info p span {
  font-size: 24px;
  font-weight: 400;
}
.membership_list ul.regular_member li .icon_box img {
  width: 69px;
}
.membership_list ul.associate_member li .icon_box img {
  width: 98px;
}
.membership_list ul li a .info span {
  font-size: 16px;
  font-weight: 400;
}
.membership_list ul li a .info span strong {
  font-weight: 600;
}
/* 회원권 구매 */
.course_box .benefit-list {
  counter-reset: list-counter; /* 리스트 카운터 초기화 */
}
.course_box .benefit-list li {
  counter-increment: list-counter; /* 각 항목에 번호 증가 */
  font-size: 14px;
  line-height: 1.57;
  position: relative;
  padding-left: 22px;
}

.course_box .benefit-list li::before {
  content: counter(list-counter) ")";
  position: absolute;
  left: 0;
  top: 0;
  background: none;
}
.course_box .benefit-list .error {
  color: var(--orange-color);
}

.course_box .benefit-list2 {
  /* counter-reset: list-counter; */
  /* 리스트 카운터 초기화 */
}
.course_box .benefit-list2 li {
  counter-increment: list-counter; /* 각 항목에 번호 증가 */
  font-size: 14px;
  line-height: 1.57;
  position: relative;
  padding-left: 20px;
}

.course_box .benefit-list2 li::before {
  content: counter(list-counter) ".";
  position: absolute;
  left: 0;
  top: 0;
}
.course_box .benefit-list2 .error {
  color: var(--orange-color);
}
.pop_rules.popup_wrap {
  padding: 40px 0;
}
.popup_wrap .pop_title {
  padding: 0 40px;
}
.pop_rules .member_rules {
  width: 100%;
  padding: 20px 40px;
  border-top: 1px solid var(--gray-color-6);
  border-bottom: 1px solid var(--gray-color-6);
  max-height: 493px;
  overflow-y: auto;
}
.pop_rules .member_rules h4 {
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 10px;
}
.pop_rules .member_rules p {
  color: var(--gray-color-3);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.57;
}
.pop_rules .member_rules .item + .item {
  margin-top: 30px;
}
.pop_rules .member_rules::-webkit-scrollbar {
  width: 10px;
}
.pop_rules .member_rules::-webkit-scrollbar-thumb {
  background-color: #a7a9ac;
  border-radius: 10px;
  background-clip: padding-box;
  border: 3px solid transparent;
}
.pop_rules .member_rules::-webkit-scrollbar-track {
  background-color: transparent;
  border-radius: 10px;
}
.pop_rules .rez_agree {
  margin: 30px auto;
  width: 520px;
}
.pop_rules .rez_agree label {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #313131;
}
.pop_rules .rez_agree label span {
  color: #313131;
}
.rez_agree label input:checked + span {
  color: #313131;
}
.pop_rules .btn-box {
  width: 520px;
  margin: 0 auto;
}
/* 구매완료 */

.complete-mileage {
  width: 100%;
  max-width: 600px;
  margin: 60px auto 0;
  border: 1px solid var(--gray-color-6);
  border-radius: 8px;
  padding: 20px 40px;
}
.complete-mileage .rez-card {
  border: none;
  border-radius: none;
  padding: 0;
}
.complete-mileage .btn_bottom {
  padding-bottom: 0;
  z-index: 40;
  padding-top: 50px;
}
.complete_title {
  display: none;
}
/* 마일리지 구매 */

.mileage_list ul {
  display: flex;
  flex-wrap: wrap;
  column-gap: 30px;
  row-gap: 40px;
}
.mileage_list ul li {
  width: calc((100% - 60px) / 3);
  border-radius: 8px;
  border: 1px solid var(--gray-color-6);
}
.mileage_list ul li a {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  padding: 40px 20px;
}
.mileage_list ul li .icon_box {
  display: flex;
  width: 200px;
  height: 200px;
  justify-content: center;
  align-items: center;
  border-radius: 200px;
  background: var(--gray-color-8);
}
.mileage_list ul li .icon_box img {
  width: 108px;
}
.mileage_list ul li .add_tag {
  position: absolute;
  top: 10px;
  right: 12px;
  border-radius: 60px;
  background: var(--orange-color);
  display: flex;
  align-items: center;
  height: 38px;
  padding: 0 10px;
  font-weight: 600;
  font-size: 16px;
  color: #fff;
}
.mileage_list ul li .info {
  width: 100%;
}
.mileage_list ul li .info .flex_box + .flex_box {
  margin-top: 10px;
}
.mileage_list ul li .info .flex_box {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.mileage_list ul li .info .flex_box .pay,
.mileage_list ul li .info .flex_box p {
  font-size: 24px;
  font-weight: 600;
}
/* 마이페이지 */
.reservation-header {
  border-top: 1px solid #000;
  display: grid;
  grid-template-columns: 31px 200px 139px 130px 135px 135px 120px 100px 150px;
  padding: 13px 10px;
  gap: 5px;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
  border-bottom: 1px solid #ddd;
}

.reservation-item {
  display: grid;
  grid-template-columns: 31px 200px 139px 130px 135px 135px 120px 100px 150px;
  padding: 0 10px;
  gap: 5px;
  border-bottom: 1px solid #ddd;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.57;
  color: #313131;
  text-align: center;
}
.reservation-item .item {
  display: flex;
  min-height: 80px;
  align-items: center;
  justify-content: center;
  padding: 14px 0;
}
.reservation-item .item.item-amount {
  text-align: right;
  justify-content: flex-end;
}
.reservation-item .item-actions {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.reservation-item .item-id {
  color: var(--primary-color-1);
  text-decoration: underline;
}
.reservation-item .btn .btn-base {
  border-radius: 4px;
  border: 1px solid var(--gray-dddddd, #ddd);
  background: #fff;
  line-height: 22px;
  font-size: 11px;
  width: 80px;
  font-weight: 600;
}
.reservation-item .btn .btn-base.red {
  color: #eb5757;
}
.reservation-item .btn .btn-base.red .pc_txt {
  display: block;
}
.reservation-item .btn .btn-base.red .m_txt {
  display: none;
}
.reservation-item .btn .btn-base.btn-active {
  color: var(--primary-color-1);
}
.reservation-item .btn_pledge {
  display: none;
}
.btn_pledge a {
  display: flex;
  height: 24px;
  width: 80px;
  padding: 6px 10px;
  justify-content: center;
  align-items: center;
  border-radius: 4px;
  border: 1px solid var(--gray-color-6);
  font-size: 11px;
  font-weight: 600;
  color: var(--gray-color-3);
}
.reservation-item .item-status {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.reservation-item .item-status .btn_pledge {
  display: block;
}
.reservation-item .btn_share {
  display: none;
}
.btn_share .btn-line.btn-base {
  line-height: 42px;
}
.btn_share .btn-line.btn-base .icon_box {
  width: 20px;
}
.btn_share .btn-line.btn-base span {
  font-size: 16px;
  font-weight: 400;
  color: #000;
}
.reservation-item.cancel-box .item-amount-refund,
.reservation-item.cancel-box .item-cancel-date {
  display: none;
}
.filter-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 40px;
}
.filter-option .filter-selectBox {
  display: flex;
  gap: 20px;
}
.filter-option .selectBox {
  width: 150px;
}
.filter-option .selectBox .label {
  line-height: 40px;
  color: #313131;
  padding-left: 0;
  padding-right: 40px;
  border: none;
  border-bottom: 2px solid var(--gray-color-1);
  border-radius: 0;
}
.filter-option .selectBox {
  background: url(../img/filter_select_default.png) no-repeat right center;
  background-size: 40px;
}
.filter-option .selectBox .optionList {
  top: 42px;
}
.filter-option .right_box {
  display: flex;
  align-items: center;
  gap: 20px;
}
.filter-total {
  font-size: 16px;
  font-weight: 400;
}
.filter-total strong {
  font-weight: 600;
}
.btn-sort-latest .btn-line {
  border-radius: 8px;
  border: 1px solid #ddd;
  display: inline-flex;
  height: 44px;
  padding: 10px 20px;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  font-weight: 600;
  color: var(--gray-color-1);
}
.filter-option .left_box .btn-sort-latest {
  display: none;
}
.membership-container {
  border-radius: 8px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid var(--gray-color-6);
  padding: 20px 40px;
  min-height: 123px;
  margin-bottom: 40px;
}
.membership-container .top_box {
  display: flex;
  align-items: center;
  gap: 10px;
}
.membership-container .top_box h2 {
  font-weight: 400;
  font-size: 18px;
}
.membership-container .top_box h2 strong {
  font-weight: 600;
}
.membership-container .btn_edit {
  height: 30px;
  padding: 4px 20px;
  display: inline-block;
  border-radius: 60px;
  background: var(--primary-color-1);
  color: #fff;
  font-size: 14px;
  font-weight: 400;
}
.membership-container .membership-details {
  display: flex;
  align-items: center;
  gap: 41px;
  margin-top: 16px;
}
.membership-container .membership-details p {
  position: relative;
  font-size: 16px;
  line-height: 1.75;
  font-weight: 400;
}
.membership-container .membership-details p + p::after {
  content: "";
  display: block;
  width: 1px;
  width: 1px;
  height: 16px;
  background: #d9d9d9;
  position: absolute;
  left: -21px;
  top: 50%;
  transform: translateY(-50%);
}
.membership-container .membership-details p .highlights {
  color: #f44e18;
  font-weight: 600;
}
.membership-container .points-container {
  display: flex;
  align-items: center;
}
.membership-container .points-item {
  width: 172px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
}
.membership-container .points-item p {
  line-height: 1.5;
  font-size: 36px;
  color: var(--primary-color-1);
  font-weight: 600;
}
.membership-container .points-item span {
  display: block;
  font-size: 16px;
  font-weight: 600;
  text-align: center;
}
.membership-container .points-item + .points-item {
  border-left: 1px solid var(--gray-color-6);
}
.mypage_tab .swiper-slide {
  width: auto;
  flex-shrink: 0;
}
.mypage_container .btn_more {
  display: none;
}
.membership-container + .membership-container {
  margin-top: 40px;
}
.membership-container .membership-details .registering_tag {
  display: inline-block;
  border-radius: 4px;
  border: 1px solid var(--primary-color-1);
  padding: 4px 20px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.57;
  color: var(--primary-color-1);
}
.mypage_container .coupon_list {
  margin-bottom: 30px;
}
.mypage_container .coupon_list .coupon_item a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 40px;
  border-radius: 8px;
  border: 1px solid var(--gray-color-6);
}
.mypage_container .coupon_list .coupon_item .discount_tag {
  display: inline-block;
  color: #fff;
  font-size: 16px;
  line-height: 38px;
  font-weight: 600;
  padding: 0 10px;
  border-radius: 50px;
  background: var(--point-color-5);
}
.mypage_container .coupon_list .coupon_item .info p {
  color: #000;
  font-size: 18px;

  font-weight: 600;
  line-height: 1.55;
}
.mypage_container .coupon_list .coupon_item .info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}
.mypage_container .coupon_list .coupon_item .info .day {
  font-size: 14px;
  color: #000;
  font-weight: 400;
  line-height: 1.57;
}
.mypage_container .coupon_list li + li {
  margin-top: 30px;
}
.mypage_container .caution_box {
  border-radius: 8px;
  background: var(--gray-color-8);
  padding: 20px 16px;
}
.mypage_container .caution_box h4 {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 10px;
}
.mypage_container .caution_box ul li {
  position: relative;
  padding-left: 16px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.57;
}
.mypage_container .caution_box ul li::before {
  display: block;
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 6px;
  height: 6px;
  border-radius: 50px;
  background: var(--gray-color-3);
}
.popup_wrap .btn_box2 .btn-box01 a.btn-base {
  line-height: 42px;
  font-size: 16px;
}
.popup_wrap .btn_box2 .btn-box + .btn-box {
  margin-top: 30px;
}
.history-container .reservation-header,
.history-container .reservation-item {
  grid-template-columns: 31px 200px calc(100% - 439px) 193px;
}
.mileage-management .reservation-header,
.mileage-management .reservation-item {
  grid-template-columns: 31px 250px calc(100% - 489px) 193px;
}
.mileage-recharge .reservation-header,
.mileage-recharge .reservation-item {
  grid-template-columns: 31px 150px 150px 566px 138px 120px;
}
.hand-over .reservation-header,
.hand-over .reservation-item {
  grid-template-columns: 31px 250px 150px 269px 150px 150px 150px;
}
.receive-transfer .reservation-header,
.receive-transfer .reservation-item {
  grid-template-columns: 31px 250px 150px 269px 150px 150px 150px;
}
.item.mileage-item-details,
.item.reservation-details,
.item.reservation-application {
  justify-content: flex-start;
}
.sub_tab_wrap {
  display: flex;
  padding: 20px 60px;
  justify-content: space-between;
  align-items: center;
  background: #f8f8f8;
  margin-bottom: 20px;
}
.sub_tab_wrap .sub_tab_box {
  display: flex;
  align-items: center;
  gap: 24px;
}

.sub_tab_wrap .sub_tab label {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 10px 10px 0px;
  cursor: pointer;
}
.sub_tab_wrap .sub_tab label span {
  font-size: 14px;
  font-weight: 400;
}
.sub_tab_wrap .right_box {
  display: flex;
  padding: 10px 10px 10px 0px;
  justify-content: center;
  align-items: center;
  gap: 40px;
}
.sub_tab_wrap .right_box p {
  font-size: 14px;
  font-weight: 400;
}
.sub_tab_wrap .right_box .mileage_use {
  font-size: 14px;
  font-weight: 400;
}
.sub_tab_wrap .right_box .mileage_use span {
  font-size: 24px;
  font-weight: 600;
}
.sub_tab_conts .sub_tab_tab {
  display: none;
}
.sub_tab_conts .sub_tab_tab:first-child {
  display: block;
}
.mypage_container .rechargeHistory_tab .caution_box {
  margin-top: 40px;
}
.mypage_container .btn_handOver {
  display: flex;
  justify-content: flex-end;
  margin-top: 30px;
}
.mypage_container .btn_handOver a {
  width: 120px;
  font-size: 16px;
  line-height: 50px;
}
.receive-transfer .item.receive-item-cancel {
  display: flex;
  flex-direction: column-reverse;
  gap: 5px;
}
.receive-transfer-wrap .bot_group .caution_box {
  margin-top: 50px;
}
/* 서비스 이용약관  */
.terms_of_wrap {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 40px;
  border-radius: 8px;
  border: 1px solid var(--gray-color-6);
  padding: 24px 30px;
  width: 100%;
}
.terms_of_wrap h2 {
  display: block;
  width: 100%;
  text-align: center;
  padding: 20px 0px;
  background: #f2f9ff;
  font-size: 24px;
  font-weight: 600;
}
.terms_of_wrap h3 {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.55;
}
.terms_of_wrap ul li span,
.terms_of_wrap p {
  color: var(--gray-color-3);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.55;
  word-break: keep-all;
}
.terms_of_wrap ul li {
  display: flex;
  align-items: flex-start;
}
.terms_of_wrap ul li span {
  display: block;
  width: 20px;
}
.terms_of_wrap ul li p {
  width: calc(100% - 20px);
}
.terms_of_wrap h3 + p {
  margin-top: 10px;
}
/* 회원선택 */
.signup-user-type {
  display: flex;
  gap: 60px;
}
.signup-user-type .item_box {
  width: calc((100% - 60px) / 2);
  border-radius: 8px;
  border: 1px solid #ddd;
  padding: 50px;
}
.signup-user-type .item_box .list_item ul {
  display: flex;
  gap: 20px;
}
.signup-user-type .item_box .list_item ul li {
  flex: 1;
  border: 1px solid var(--gray-color-1);
  border-radius: 8px;
}
.signup-user-type .item_box .list_item ul li a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 150px;
  padding: 40px 0px;
  font-weight: 600;
  font-size: 24px;
  text-align: center;
  line-height: 1.3;
}
.signup-user-type .item_box .list_item.list_item02 ul li a {
  font-size: 20px;
}
.signup-user-type .item_box h3 {
  font-weight: 600;
  font-size: 30px;
  text-align: center;
  margin-bottom: 50px;
}
.signup_sns ul li + li {
  margin-top: 20px;
}
.signup_sns {
  margin-top: 50px;
}
.signup_sns ul li a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 60px;
  border-radius: 78px;
  border: 1px solid #d9d9d9;
}
.signup_sns ul li a span {
  font-size: 18px;
  color: #392020;
  font-weight: 400;
}
.signup_sns ul li a img {
  width: 46px;
  display: block;
}
.step-indicator {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto 40px;
}

.steps {
  display: flex;
}

.step {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  position: relative;
}

.step .step-circle {
  position: relative;
  width: 36px;
  height: 36px;
  background: var(--gray-color-3);
  color: #fff;
  font-size: 24px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.step.active .step-circle {
  background-color: var(--primary-color-1); /* Active circle color */
}

.step .step-label {
  font-size: 18px;
  font-weight: 600;
  color: var(--gray-color-1);
  text-align: center;
}
.step.active .step-label {
  color: var(--primary-color-1);
}
.step.step02 {
  margin: 0 170px;
}
.step.step02 .step-circle::before,
.step.step02 .step-circle::after {
  content: "";
  display: block;
  width: 150px;
  height: 1px;
  background: #bbb;
  position: absolute;
  top: 20px;
}
.step.step02 .step-circle::after {
  right: -23px;
  transform: translateX(100%);
}
.step.step02 .step-circle::before {
  left: -23px;
  transform: translateX(-100%);
}
.signup_form .flex_box {
  display: flex;
  column-gap: 10px;
}

.signup_form .gender_list {
  display: flex;
  align-items: center;
  gap: 16px;
}
.signup_form .gender_list label {
  display: flex;
  align-items: center;
  height: 44px;
  gap: 10px;
}
.signup_form .gender_list label span {
  display: block;
  font-size: 14px;
  font-weight: 400;
}
.signup_form .input-baseBox label.check_sub {
  margin-top: 10px;
}
.signup_form label.check_sub {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.signup_form label.check_sub span {
  font-size: 14px;
  font-weight: 400;
}
.signup_form {
  width: 100%;
  max-width: 600px;
  padding: 40px;
  margin: 0 auto;
  border-radius: 8px;
  border: 1px solid var(--gray-color-6);
}
.signup_form .input-baseBox + .input-baseBox {
  margin-top: 30px;
}
.signup_form .flex_box .input-baseBox + .input-baseBox {
  margin-top: 0;
}
.signup_form .input-baseBox.phone,
.signup_form .flex_box {
  margin-top: 30px;
}
.signup_form .confirm_box {
  position: relative;
}
.signup_form .confirm_box .time {
  opacity: 0;
  position: absolute;
  font-size: 16px;
  color: #ff404b;
  font-weight: 400;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  display: none;
}
.signup_form .confirm_box .time.on {
  opacity: 1;
  display: block;
}
.signup_form .confirm_input .input-baseBox .txt-list li {
  position: relative;
  padding-left: 20px;
  font-size: 1.2rem;
  font-weight: 400;
  word-break: keep-all;
}
.signup_form .confirm_input .confirm_num {
  display: none;
  align-items: flex-start;
  justify-content: space-between;
  gap: 5px;
}
.signup_form .confirm_input .confirm_num.on {
  display: flex;
}
.signup_form .confirm_input .confirm_num .btn_timeExtend {
  font-size: 12px;
  padding: 0 12px;
  line-height: 24px;
  border-radius: 4px;
  min-width: fit-content;
  margin-top: 10px;
  font-weight: 400;
}
.signup_form .confirm_input .confirm_num .btn_timeExtend_join {
  font-size: 12px;
  padding: 0 12px;
  line-height: 24px;
  border-radius: 4px;
  min-width: fit-content;
  margin-top: 10px;
  font-weight: 400;
}
.signup_form .confirm_input .confirm_num .txt-list {
  width: calc(100% - 70px);
}
.signup_form .input-baseBox .confirm_num .txt-list li {
  color: #0062b1;
}
.signup_form .input-baseBox .confirm_num .txt-list li::after {
  background: #0062b1;
}
.signup_form .confirm_input {
  display: none;
}
.signup_form .confirm_input.on {
  display: block;
}
.signup_form .input-baseBox.item01 {
  width: 270px;
}
.signup_form .input-baseBox.item02 {
  width: 240px;
}
.signup_form .input-baseSubBox input {
  width: calc(100% - 110px);
}
.step_terms .btn_bottom,
.signup_form .btn_bottom {
  padding-top: 30px;
  padding-bottom: 0;
  width: 300px;
  margin: 0 auto;
}
.step_terms .item .title {
  font-size: 18px;
  line-height: 1.55;
  margin-bottom: 20px;
  font-weight: 600;
}
.step_terms .item .terms_scroll {
  height: 250px;
  padding: 20px;
  overflow-y: auto;
  font-size: 16px;
  line-height: 1.75;
  border: 1px solid var(--gray-color-6);
  color: var(--gray-color-3);
}
.step_terms .flex_box label {
  display: flex;
  align-items: center;
  gap: 10px;
}
.step_terms .item + .item {
  margin-top: 60px;
}
.step_terms .flex_box {
  padding: 20px 0;
}
.step_terms .flex_box label span {
  font-size: 16px;
  font-weight: 400;
}
.step_terms .flex_box.all {
  border-top: 1px solid var(--gray-color-6);
  border-bottom: 1px solid var(--gray-color-6);
}
.step_terms .flex_box.all label span {
  font-weight: 600;
}
.signup_form .complete_box .icon_box {
  width: 208px;
  margin-bottom: 40px;
}
.signup_form .complete_box .item02 .icon_box {
  width: 128px;
}
.signup_form .complete_box .item {
  margin-bottom: 0;
}
.signup_form .complete_box .item p {
  font-size: 24px;
  margin-bottom: 16px;
  text-align: center;
}
.signup_form .complete_box .item span {
  font-size: 14px;
  font-weight: 600;
  color: #666;
  text-align: center;
}
.signup_form .complete_box > .item {
  gap: 0;
}
.signup_form .complete_box .item p br,
.signup_form .complete_box .item span br {
  display: none;
}
.pop_detail02 .rez-card.rez-card01 .detail {
  width: 220px;
}
.pop_detail02 .btn_bottom {
  padding-bottom: 0;
}

.change_personnel {
  width: 100%;
  padding: 40px 0 0;
  border-radius: 8px;
  border: 1px solid var(--gray-color-6);
}
.change_personnel .form {
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
}
.change_personnel .change_personnel_box {
  padding: 40px;
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
}
.change_personnel .change_personnel_box .txt-list {
  padding: 10px 0px;
}
.change_personnel .change_personnel_box .txt-list li {
  font-size: 14px;
}
.change_personnel .change_personnel_box .txt-list li .main_color {
  font-weight: 600;
}
.change_personnel .change_personnel_box .txt-list li::after {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background: url(../img/bullet.png);
  border-radius: 5px;
  position: absolute;
  left: 0px;
  top: 5px;
}
.change_personnel .btn-box {
  margin-top: 30px;
}

.rez_form .info_table + .info_table {
  margin-top: 20px;
}
.rez_form .change_table {
  margin-top: 60px;
  margin-bottom: 60px;
}
.change_table .info_table .col1 {
  width: 250px;
}
.change_table .info_table .col2 {
  width: 270px;
}
.change_payinfo .rez_form .btn-box {
  max-width: 100%;
}
.change_payinfo .course_box {
  margin-bottom: 20px;
}
.change_payinfo .course_box li {
  line-height: 1.58;
}
.change_payinfo .course_box li::before {
  top: 8px;
}

.rezDetails_cardBox {
  border: 1px solid var(--gray-color-6);
  border-radius: 8px;
  overflow: hidden;
}

.rezDetails_cardBox .rezDetails_item .btn_title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--gray-color-8);
  width: 100%;
  padding: 16px 20px;
  font-size: 18px;
  font-weight: 600;
}
.rezDetails_cardBox .btn_title .icon_box {
  width: 24px;
}
.popup_wrap .rezDetails_cardBox .rez-card {
  border: none;
}
.rezDetails_cardBox .detail_conts .img_box + .img_box {
  margin-top: 16px;
}
.rezDetails_cardBox .detail_conts .img_box {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 295 / 100;
  background: var(--gray-color-7);
  margin-top: 16px;
}
.rezDetails_cardBox .signature_box + .signature_box {
  margin-top: 16px;
}
.rezDetails_cardBox .signature_box img {
  width: 100%;
  display: block;
  padding: 0 20px;
}
.rezDetails_item .detail_conts {
  display: none;
}
.rezDetails_item.on .detail_conts {
  display: block;
  padding-bottom: 16px;
}
.rezDetails_cardBox .rezDetails_item.on .btn_title {
  border-bottom: 1px solid var(--gray-color-6);
}
.rezDetails_cardBox .rezDetails_item.on .btn_title .icon_box {
  transform: rotate(180deg);
}
.rezDetails_cardBox + .rezDetails_cardBox {
  margin-top: 30px;
}
.rezDetails_cardBox + .btn_bottom {
  margin-top: 30px;
  padding-bottom: 0;
}
.rezDetails_wrap .btn_subbox {
  margin-bottom: 30px;
}
.rezDetails_wrap .btn_subbox a.btn-base {
  line-height: 42px;
  font-size: 16px;
  font-weight: 600;
}
.popup_wrap .qr_list {
  margin-bottom: 30px;
}
.popup_wrap .qr_list ul li + li {
  margin-top: 30px;
}
.popup_wrap .qr_item {
  border: 1px solid var(--gray-color-6);
  border-radius: 8px;
  padding: 20px;
}
.popup_wrap .qr_item .top_group {
  margin-bottom: 20px;
}
.popup_wrap .qr_item .top_group h2 {
  font-size: 20px;
  font-weight: 600;
}
.popup_wrap .qr_item .top_group .day_box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 4px;
}
.popup_wrap .qr_item .top_group .day_box span {
  display: block;
  font-size: 16px;
  font-weight: 600;
}
.popup_wrap .qr_item .top_group .tag {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 60px;
  height: 26px;
  background: var(--orange-color);
  color: #fff;
  min-width: 62px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 600;
}
.popup_wrap .qr_item .top_group .tag.day {
  border: 1px solid var(--gray-color-6);
  background: #fff;
  color: var(--gray-color-3);
}
.popup_wrap .qr_item .conts p {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
  word-break: break-all;
}

.popup_wrap .qr_wrap .qr_box {
  margin-top: 30px;
  margin-bottom: 30px;
  background: var(--gray-color-8);
  border-radius: 8px;
  padding: 30px 16px;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  row-gap: 30px;
}
.popup_wrap .qr_wrap .qr_box .img_box {
  width: 148px;
}
.popup_wrap .qr_wrap .txt-list {
  width: 100%;
}
.popup_wrap .qr_wrap .txt-list li {
  width: 100%;
  position: relative;
  padding-left: 16px;
  font-size: 14px;
  font-weight: 400;
  word-break: keep-all;
  line-height: 1.5;
}
.popup_wrap .qr_wrap .txt-list.error li {
  color: var(--orange-color);
}
.popup_wrap .qr_wrap .txt-list li::after {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background: url(../img/bullet.png) no-repeat center / cover;
  border-radius: 5px;
  position: absolute;
  left: 0;
  top: 4px;
}
.popup_wrap .signup_form {
  padding: 0;
  border: none;
}
.popup_wrap .signup_form {
  font-size: 16px;
  margin-bottom: 24px;
}
.popup_wrap .signup_form .btn_bottom {
  width: 100%;
  padding-top: 24px;
}
.provision_popup.popup_wrap .signup_form a.btn-base {
  line-height: 56px;
  font-size: 16px;
}
.provision_popup.popup_wrap .signup_form .input-baseBox + .input-baseBox {
  margin-top: 24px;
}
.provision_popup.popup_wrap .signup_form .rez-card a.btn-base {
  line-height: 44px;
  margin-top: 24px;
}
.provision_popup.popup_wrap .rez_mileage {
  margin-bottom: 24px;
  margin-top: 24px;
}
.provision_popup.popup_wrap .rez_mileage .form_subtit {
  font-size: 14px;
  margin-bottom: 24px;
}
.popup_wrap .signup_form .input-baseBox .confirm_num .txt-list li {
  color: #313131;
}
.popup_wrap .signup_form .input-baseBox .confirm_num .txt-list li::after {
  background: var(--gray-color-1);
}
.modal_txt p.modal_subtit {
  margin-top: 10px;
  color: var(--gray-color-3);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
  margin-bottom: 0;
}
.popup_wrap .m_br,
.modal_txt .m_br {
  display: none;
}
.comm_modal .modal_contents .modal_tit {
  padding-bottom: 0;
  padding-top: 24px;
}
.popup_wrap .mileage_infoBox {
  display: flex;
  align-items: center;
  background: var(--primary-color-1);
  width: 100%;
  padding: 16px 20px;
  justify-content: space-between;
  gap: 10px;
  border-radius: 8px;
  color: #fff;
  margin-bottom: 30px;
}
.popup_wrap .mileage_infoBox p {
  font-size: 18px;
  color: #fff;
  font-weight: 600;
}
.popup_wrap .mileage_infoBox .mileage_use {
  font-size: 20px;
  color: var(--gray-color-6);
  font-weight: 600;
}
.popup_wrap .mileage_infoBox .mileage_use span {
  font-size: 24px;
  color: #fff;
}
.edit_grid {
  display: grid;
  grid-template-columns: 250px calc(100% - 250px);
  border-bottom: 1px solid #d9d9d9;
}
.edit_grid02 {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.edit_grid02 .edit_grid + .edit_grid {
  border-left: 1px solid #d9d9d9;
}
.edit_grid .label_th {
  display: flex;
  align-items: center;
  justify-content: center;

  padding: 0px 30px;
  min-height: 68px;
  background: #f7f9fb;
  border-right: 1px solid #d9d9d9;
}
.edit_grid .label_th .input_label {
  width: 100%;
  text-align: left;
}
.edit_grid .info_td {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 12px 30px;
  flex-direction: column;
}
.edit_grid .info_td .info_box {
  font-size: 16px;
  font-weight: 400;
}
.edit_grid .txt-list li {
  position: relative;
  padding-left: 16px;
  font-size: 12px;
  font-weight: 400;
  word-break: keep-all;
}
.edit_grid .txt-list li::after {
  content: "";
  display: block;
  width: 5px;
  height: 5px;
  background: var(--gray-color-1);
  border-radius: 5px;
  position: absolute;
  left: 7px;
  top: 5px;
}
.edit_grid .info_td input + .txt-list {
  margin-top: 7px;
}
.edit_grid .input-baseSubBox {
  width: 100%;
}
.edit_grid .certificate-list li {
  display: flex;
  align-items: center;
  gap: 10px;
}
.edit_grid .certificate-list li .name {
  font-size: 16px;
  font-weight: 400;
}
.edit_grid .certificate-list li + li {
  margin-top: 10px;
}
.edit_grid .input_label {
  font-size: 16px;
  font-weight: 600;
}
.edit_pw_mbox {
  display: none;
}

.edit_form .gender_list {
  display: none;
  align-items: center;
  gap: 16px;
}
.edit_form .gender_list label {
  display: flex;
  align-items: center;
  height: 44px;
  gap: 10px;
}
.edit_form .gender_list label span {
  display: block;
  font-size: 14px;
  font-weight: 400;
}
.marketing-consent {
  margin-top: 60px;
}
.marketing-consent h3 {
  font-size: 18px;
  margin-bottom: 20px;
  font-weight: 600;
}
.marketing-consent-box {
  background: #f8f8f8;
}
.consent-item {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 20px 40px;
}

.consent-label {
  font-size: 14px;
  font-weight: 600;
}

.consent-options {
  display: flex;
  align-items: center;
  gap: 24px;
}

.consent-options label {
  font-size: 14px;
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 10px;
}
.my_editwrap .agree_receive {
  display: none;
}
.my_editwrap .btn_editbox {
  display: flex;
  justify-content: flex-end;
  margin-top: 30px;
}
.my_editwrap .btn_editbox a {
  background: var(--primary-color-1);
  font-size: 16px;
  width: 120px;
}
.my_editwrap .pc_none {
  display: none;
}
.edit_form {
  border-top: 1px solid #d9d9d9;
}
.pledge_wrap .edit_form .gender_list {
  display: flex;
}
.edit_grid .input_label {
  display: flex;
  align-items: center;
  gap: 4px;
}
.pledge_wrap .question {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 10px;
}
.pledge_wrap .question_answer {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
}
.case_history .question_answer .gender_list {
  width: 180px;
}
.case_history .question_answer input.input-base {
  width: calc(100% - 192px);
}
.pledge_wrap .edit_form .gender_list {
  gap: 40px;
}
.pledge_wrap .birthday ul {
  display: flex;
  align-items: center;
  gap: 31px;
}
.pledge_wrap .birthday ul li {
  position: relative;
  width: 120px;
}
.pledge_wrap .birthday ul li + li::after {
  content: "~";
  font-size: 16px;
  font-weight: 400;
  position: absolute;
  left: -18px;
  top: 50%;
  transform: translateY(-50%);
}
.birthday_box .pc_none {
  display: none;
}
.pledge_signature {
  margin-top: 60px;
  margin-bottom: 60px;
}
.pledge_signature .input-baseBox .input_label {
  font-size: 18px;
}
.pledge_signature .box {
  width: 100%;
  height: 200px;
  background: #f8f8f8;
}
.pledge_wrap .btn_editbox {
  display: flex;
  justify-content: flex-end;
  margin-top: 30px;
}
.pledge_wrap .btn_editbox a {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  gap: 10px;
  background: var(--primary-color-1);
  border-radius: 8px;
}
.pledge_wrap .btn_editbox a img {
  display: block;
  width: 24px;
}
.pledge_wrap .btn_editbox a span {
  font-size: 16px;
  color: #fff;
  font-weight: 600;
}
.pledge_wrap .rez-card {
  margin-bottom: 76px;
}
.pledge_wrap .rez-card ul {
  width: 400px;
}
.pledge_wrap .pledge_terms_box {
  margin-bottom: 60px;
}
.pledge_terms_box .top_box {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 20px;
}
.pledge_terms_box .top_box .form_subtit {
  margin-bottom: 0;
}
.pledge_terms_box .top_box .btn_link a {
  padding: 0 20px;
  line-height: 44px;
  font-size: 16px;
}
.pledge_terms_box .btn_full a {
  line-height: 66px;
  padding: 0 30px;
  font-size: 16px;
  text-align: left;
  justify-content: flex-start;
  color: var(--primary-color-1);
}
.pledge_terms_box .txt-list {
  margin-top: 10px;
}
.pledge_terms_box .txt-list li {
  position: relative;
  padding-left: 16px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.42;
  word-break: keep-all;
}
.pledge_terms_box .txt-list li::after {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background: url(../img/bullet.png);
  position: absolute;
  left: 7px;
  top: 5px;
}
.participant_name .edit_grid {
  display: grid;
  grid-template-columns: 68px 1fr 68px 1fr;
  border-bottom: none;
}
.participant_name .edit_grid .label_th {
  padding: 0;
}
.participant_name .edit_grid .label_th .input_label {
  text-align: center;
  justify-content: center;
}

.participant_name .edit_grid .label_th,
.participant_name .edit_grid .info_td {
  border-bottom: 1px solid #d9d9d9;
}
.participant_name .special-border {
  border-left: 1px solid #d9d9d9;
}
.pledge_item + .pledge_item {
  margin-top: 60px;
}
.tab_menu {
  margin-bottom: 60px;
  padding-bottom: 0;
  padding-top: 0;
}
.pledge_wrap .rez-card {
  margin-bottom: 60px;
}
.popup_wrap .qual_list label {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.popup_wrap .qual_list span {
  font-size: 16px;
}
.popup_wrap .qual_list ul > li + li {
  margin-top: 10px;
}
.input-file-box .input-base {
  display: block;
  height: 42px;
  background: #fff;
}
.input-file-box label {
  display: block;
  cursor: pointer;
}
.provision_popup .input-baseBox + .input-baseBox {
  margin-top: 24px;
}
.provision_popup .input-baseBox + .course_box {
  margin-top: 24px;
}

.provision_popup .input_label + .course_box {
  margin-top: 10px;
}
.provision_popup .qual_list ul li .input-base {
  margin-top: 8px;
}
.provision_popup .input-baseBox + .btn_bottom {
  margin-top: 30px;
}
.provision_popup .course_box + .rez_agree {
  margin-top: 30px;
}
.pop_detail .btn-box {
  margin-top: 30px;
}

.id_alarm {
  background: var(--gray-color-8);
  margin-top: 30px;
  border-radius: 8px;
  padding: 33px 10px;
  margin-bottom: 30px;
}
.id_alarm p {
  text-align: center;
  font-size: 1.6rem;
  font-weight: 600;
}
.id_alarm p span {
  color: var(--primary-color-1);
  font-size: 1.6rem;
  font-weight: 600;
}
.comm_modal .error_txt {
  display: block;
  text-align: center;
  font-size: 14px;
  color: #757575;
  margin-top: 10px;
}
.input-passwordBox {
  width: 100%;
}
.input-passwordBox .btn-eye {
  width: 2.4rem;
  height: 2.4rem;
  display: block;
  background: url(../img/eye.svg) no-repeat center / cover;
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
}
.input-passwordBox.on .btn-eye {
  background: url(../img/eye_off.png) no-repeat center / cover;
}
.login_box .save-id {
  margin-top: 10px;
  margin-bottom: 24px;
}
.login_box .save-id label {
  display: flex;
  align-items: center;
  gap: 10px;
}
.login_box .save-id label span {
  font-size: 14px;
  font-weight: 400;
}
.login_box .find_list {
  margin-top: 10px;
}
.login_box .find_list ul {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 21px;
}
.login_box .find_list ul li {
  position: relative;
}
.login_box .find_list ul li a {
  display: block;
  font-size: 14px;
  font-weight: 400;
  color: var(--gray-color-3);
}
.login_box .find_list ul li::after {
  content: "";
  display: block;
  width: 1px;
  height: 12px;
  background: #d9d9d9;
  position: absolute;
  left: -11px;
  top: 50%;
  transform: translateY(-50%);
}
.pop_login .login_box .signup_sns {
  margin-top: 26px;
}
.pop_login {
  padding: 40px 30px;
}
.pop_login .login_box .logo {
  width: 118px;
  margin: 0 auto 50px;
}
.pop_login .login_box .logo a {
  display: block;
}
.pop_login .login_box .logo a img {
  width: 100%;
  display: block;
}
.pop_login .login_box h3 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 24px;
}
.pop_id .find_id {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.pop_id .error_conts {
  margin-bottom: 10px;
  margin-top: 20px;
}
.filter-option .input-search .input-base {
  border: none;
  border-radius: 0;
  border-bottom: 2px solid #313131;
  font-weight: 400;
  font-size: 16px;
  line-height: 40px;
  width: 100%;
}
.filter-option .input-search {
  width: 268px;
}
.notice_wrap .selectBox.selectBox02 {
  width: 160px;
}
.sub_container .notice_list {
  border-top: 1px solid #dddddd;
  margin-bottom: 50px;
}
.sub_container .notice_list li a {
  position: relative;
  display: grid;
  gap: 20px;
  grid-template-columns: 60px 170px calc(100% - 466px) 84px 72px;
  padding: 30px 20px;
}
.sub_container .notice_list .tag_new {
  display: inline-block;
  border-radius: 20px;
  background: #f44e18;
  padding: 5px 10px;
  font-weight: 700;
  font-size: 16px;
  position: absolute;
  color: #fff;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
}
.sub_container .notice_list .title_box {
  display: flex;
  align-items: center;
  gap: 20px;
}
.sub_container .notice_list .title_box p {
  width: calc(100% - 36px);
  font-size: 20px;
  font-weight: 600;
  text-align: left;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-all;
  transition: 0.15s ease-in-out;
}
.sub_container .notice_list .title_box .icon_box {
  width: 16px;
  opacity: 0;
  transition: 0.15s ease-in-out;
}
.sub_container .notice_list li {
  border-bottom: 1px solid #dddddd;
  transition: 0.15s ease-in-out;
}
.sub_container .notice_list li:hover {
  background: var(--primary-color-1);
}
.sub_container .notice_list li:hover .icon_box {
  opacity: 1;
}
.sub_container .notice_list .num {
  text-align: center;
  font-size: 18px;
  font-weight: 400;
  color: var(--gray-color-3);
  transition: 0.15s ease-in-out;
}
.sub_container .notice_list .category {
  font-size: 20px;
  font-weight: 600;
  transition: 0.15s ease-in-out;
}
.sub_container .notice_list .view,
.sub_container .notice_list .day {
  font-size: 16px;
  font-weight: 400;
  color: var(--gray-color-3);
  text-align: center;
  transition: 0.15s ease-in-out;
}
.sub_container .notice_list li:hover .category,
.sub_container .notice_list li:hover .title_box p,
.sub_container .notice_list li:hover .num,
.sub_container .notice_list li:hover .view,
.sub_container .notice_list li:hover .day {
  color: #fff;
}
.pagination .m_img {
  display: none;
}
/*  */
.board_title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  padding-bottom: 30px;
  border-bottom: 2px solid #2f2f2f;
}

.board_title .category {
  display: flex;
  align-items: center;
  gap: 31px;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.55;
}
.board_title .category span {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.55;
  font-weight: 600;
}
.board_title .category span.answer {
  color: #666666;
}
.board_title .category span.answer.waiting {
  color: var(--primary-color-1);
}
.board_title .category span + span {
  position: relative;
}
.board_title .category span + span::after {
  content: "";
  display: block;
  width: 1px;
  height: 14px;
  background: #d9d9d9;
  position: absolute;
  left: -16px;
  top: 50%;
  transform: translateY(-50%);
}
.board_title .right_box {
  display: flex;
  align-items: center;
  gap: 31px;
  height: 28px;
}
.board_title .right_box span {
  display: block;
  font-size: 14px;
  font-weight: 400;
  color: var(--gray-color-3);
  position: relative;
}

.board_title .right_box span + span::after {
  content: "";
  display: block;
  width: 1px;
  height: 14px;
  background: #d9d9d9;
  position: absolute;
  left: -16px;
  top: 50%;
  transform: translateY(-50%);
}
.board_title h2 {
  width: 100%;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.55;
}
.board_conts {
  padding: 40px 20px;
}
.board_conts .img_box {
  width: 100%;
  margin-bottom: 30px;
}
.board_conts p {
  color: #2f2f2f;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
}
.board_conts .attachment_box {
  display: flex;
  padding: 10px 0px;
  align-items: center;
  gap: 50px;
  margin-top: 30px;
}
.board_conts .attachment_box .tit {
  font-size: 16px;
  font-weight: 600;
}
.board_conts .attachment_box .download_box a {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #666;
  font-size: 16px;
  font-weight: 400;
}
.board_conts .attachment_box .download_box a .icon_box {
  width: 32px;
}

.board_answer {
  background: #fafafa;
  border-top: 1px solid #d9d9d9;
  border-bottom: 1px solid #d9d9d9;
  background: #fafafa;
  padding: 20px;
}
.board_answer .top_box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 15px;
}
.board_answer .top_box .admin {
  font-size: 16px;
  font-weight: 600;
}
.board_answer .top_box .day {
  font-size: 14px;
  font-weight: 400;
  color: var(--gray-color-3);
}
.board_answer .title {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px;
}
.board_answer_conts p {
  color: var(--gray-color-3);
  font-size: 16px;
  line-height: 1.75;
}
.post-navigation {
  border-top: 1px solid #d9d9d9;
  border-bottom: 1px solid #d9d9d9;
  padding: 20px;
  background: #fafafa;
}
.post-navigation .post-nav {
  display: flex;
  align-items: center;
  gap: 50px;
}
.post-navigation div:first-child {
  border-top: none;
}
.post-navigation .label {
  font-weight: bold;
  font-size: 14px;
}
.post-navigation .content {
  width: calc(100% - 100px);
}
.post-navigation .content a {
  width: 100%;
  display: block;

  color: #666;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-all;
}

.post-navigation .post-nav + .post-nav {
  margin-top: 16px;
}
.notice_board .btn_board {
  display: flex;
  justify-content: flex-end;
  margin-top: 30px;
}

.notice_board .btn_board a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 120px;
  height: 54px;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  border-radius: 8px;
  background: #a7a9ac;
}
.event_list ul {
  display: flex;
  align-items: flex-start;
  column-gap: 66px;
  row-gap: 50px;
  flex-wrap: wrap;
}
.event_list li {
  width: calc((100% - 198px) / 4);
}
.event_list li .img_box {
  aspect-ratio: 1 / 1;
  margin-bottom: 20px;
}
.event_list li .img_box img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center;
}
.event_list li p {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 20px;
}
.event_list .bot_group {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.event_list .bot_group .item {
  display: flex;
  align-items: center;
  gap: 6px;
}
.event_list .bot_group .item span {
  font-size: 14px;
  font-weight: 400;
  color: #666666;
}
.event_list .bot_group .item img {
  width: 16px;
}
.event_list {
  margin-bottom: 50px;
}

.question_list {
  border-top: 1px solid #ddd;
  margin-bottom: 50px;
}
.question_list .q_box .icon_box {
  width: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.question_list .q_box .icon_box img {
  filter: invert(59%) sepia(8%) saturate(50%) hue-rotate(131deg) brightness(96%)
    contrast(91%);
}
.question_list li {
  border-bottom: 1px solid #ddd;
}
.question_list .a_box {
  display: none;
}
.question_list .on .a_box {
  display: flex;
  gap: 20px;
  padding: 30px 60px;
  background: #f5f5f5;
  border-top: 1px solid #ddd;
}
.question_list .q_box {
  display: flex;
  gap: 20px;
  padding: 20px;
}
.question_list .q_box .title {
  display: flex;
  align-items: center;
  gap: 20px;
  width: calc(100% - 16px);
}
.question_list .q_box .title .txt {
  width: calc(100% - 60px);
  font-size: 18px;
  line-height: 1.5;
  font-weight: 600;
}
.question_list .tag {
  width: 40px;
  height: 40px;
  background: url(../img/ic_40_q_selected.svg) no-repeat center / cover;
  display: block;
}
.question_list .a_box .txt {
  width: calc(100% - 60px);
  font-size: 16px;
  line-height: 1.75;
}
.question_list .tag.tag_a {
  width: 40px;
  height: 40px;
  background: url(../img/ic_40_a.png) no-repeat center;
  background-size: contain;
  display: block;
}

.question_list .on .q_box .icon_box img {
  transform: rotate(180deg);
  filter: none;
}
.question_list .on .q_box .title .txt {
  color: var(--primary-color-1);
}
.inquiry_wrap {
  padding-top: 42px;
}

.inquiry_wrap .edit_grid {
  display: grid;
  grid-template-columns: 250px calc(100% - 250px);
  border-bottom: none;
}
.inquiry_wrap .edit_grid .label_th {
  border-bottom: 1px solid #d9d9d9;
}
.inquiry_wrap .edit_grid .info_td {
  border-bottom: 1px solid #d9d9d9;
}
.special-border {
  border-left: 1px solid #d9d9d9;
}
.inquiry_wrap .inquiry_contents textarea {
  border: 1px solid #d9d9d9;
  width: 100%;
  height: 256px;
  line-height: 1.4;
  border-radius: 8px;
  font-size: 16px;
  padding: 10px;
  color: var(--gray-color-1);
}
.inquiry_wrap .input-file-box .input-base {
  background: #f8f8f8;
}
.inquiry_list_wrap .btn_editbox,
.inquiry_wrap .btn_box {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  margin-top: 30px;
}
.inquiry_list_wrap .btn_editbox a,
.inquiry_wrap .btn_editbox a {
  width: fit-content;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 54px;
  padding: 15px 20px;
  gap: 10px;
  background: var(--primary-color-1);
  border-radius: 8px;
}
.inquiry_list_wrap .btn_editbox a img,
.inquiry_wrap .btn_editbox a img {
  display: block;
  width: 24px;
}
.inquiry_list_wrap .btn_editbox a span,
.inquiry_wrap .btn_editbox a span {
  font-size: 16px;
  color: #fff;
  font-weight: 600;
}
.inquiry_wrap .btn_board a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 120px;
  height: 54px;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  border-radius: 8px;
  background: #a7a9ac;
}
.inquiry_wrap .edit_form .radio_list {
  display: flex;
	flex-wrap:wrap;
  align-items: center;
  gap: 20px;
}
.inquiry_wrap .edit_form .radio_list li {
  min-width: 117px;
}
.inquiry_wrap .edit_form .radio_list label {
  display: flex;
  align-items: center;
  height: 44px;
  gap: 6px;
}
.inquiry_wrap .radio_list label span {
  display: block;
  font-size: 16px;
  font-weight: 400;
}
.inquiry_list ul {
  border-top: 1px solid var(--gray-color-6);
}
.inquiry_list ul li {
  border-bottom: 1px solid var(--gray-color-6);
}
.inquiry_list ul li a {
  display: grid;
  gap: 20px;
  grid-template-columns: 60px 170px 164px calc(100% - 638px) 84px 60px;
  padding: 30px 20px;
  font-size: 20px;
}
.inquiry_list ul li a .num {
  font-size: 18px;
  color: var(--gray-color-3);
  font-weight: 400;
  text-align: center;
}
.inquiry_list ul li a .category,
.inquiry_list ul li a .facilities {
  font-weight: 600;
  font-size: 20px;
  color: var(--gray-color-1);
  text-align: center;
}
.inquiry_list ul li a .title {
  font-size: 20px;
  font-weight: 600;
  text-align: left;
}
.inquiry_list ul li a .title p {
  font-size: 20px;
  font-weight: 600;
  text-align: left;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-all;
}
.inquiry_list ul li a .day {
  font-size: 16px;
  font-weight: 400;
  color: var(--gray-color-3);
  text-align: center;
}
.inquiry_list ul li a .answer {
  font-size: 13px;
  font-weight: 600;
  color: var(--gray-color-3);
  text-align: center;
}
.inquiry_list ul li a .answer.waiting {
  color: var(--primary-color-1);
}
.inquiry_list_wrap .btn_editbox {
  margin-bottom: 50px;
}
.inquiry_board {
  padding-top: 42px;
}
.inquiry_board .bot_group {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}