@charset "UTF-8";


.font-weight-bold {
  font-weight: var(--krds-font-weight-bold, 700);
}
.font-color-primary {
  color: var(--krds-light-color-text-secondary);
}
.font-color-blue {
  color: var(--krds-color-light-primary-50);
}
.font-color-secondary {
  color: var(--krds-light-color-text-subtle);
}

.krds-main-menu .gnb-menu .gnb-main-trigger::before, .tab.line .btn-tab:before{
  background-color: var(--krds-light-color-action-secondary-active, #063a74);
}

.ai-chatbot::before {
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center center;
  mask-size: contain;
  -webkit-mask-image: url(../../img/kosac/ai_chatbot.svg);
  mask-image: url(../../img/kosac/ai_chatbot.svg);
}
/* ============================================
   로그인 선택 페이지 스타일
   ============================================ */

/* 로그인 선택 컨테이너 */
.login-select {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-layout-h1-h2, 48px);
  padding-bottom: var(--krds-gap-layout-contents-footer, 64px);
  width: 100%;
}

/* 헤더 영역 (타이틀 + 설명) */
.login-select__header {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-layout-title-body-large, 24px);
  width: 100%;
}

/* 서브타이틀 */
.login-select__subtitle {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-font-size-heading-xxsmall, 1.5rem);
  line-height: var(--krds-line-height-base, 1.5);
  letter-spacing: var(--krds-typo-letter-spacing-0, 0);
  color: var(--krds-light-color-text-subtle);
  margin: 0;
}

/* 메인 타이틀 */
.login-select__title {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-font-size-heading-xlarge, 4rem);
  line-height: var(--krds-line-height-base, 1.5);
  letter-spacing: var(--krds-typo-letter-spacing-1, 1px);
  color: var(--krds-light-color-text-basic);
  margin: 0;
}

/* 설명 텍스트 */
.login-select__desc {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-font-size-body-large, 1.9rem);
  line-height: var(--krds-line-height-base, 1.5);
  letter-spacing: var(--krds-typo-letter-spacing-0, 0);
  color: var(--krds-light-color-text-basic);
}

.login-select__desc p {
  margin: 0;
}

/* 본문 영역 */
.login-select__body {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-9, 40px);
  width: 100%;
}

/* 키보드 보안 토글 영역 */
.login-select__security {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-2, 4px);
}

.login-select__security .krds-form-check.toggle {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
}

.login-select__security .krds-form-check.toggle input[type="checkbox"] {
  position: relative;
  width: 32px;
  height: 20px;
  appearance: none;
  -webkit-appearance: none;
  background-color: var(--krds-light-color-element-gray, #6d7882);
  border-radius: var(--krds-radius-max, 1000px);
  cursor: pointer;
  transition: background-color 0.2s ease;
  padding: 2px;
}

.login-select__security .krds-form-check.toggle input[type="checkbox"]:checked {
  background-color: var(--krds-light-color-element-primary, #256ef4);
}

.login-select__security .krds-form-check.toggle input[type="checkbox"]::before {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  background-color: var(--krds-light-color-element-inverse, #fff);
  border-radius: 50%;
  transition: transform 0.2s ease;
}

.login-select__security .krds-form-check.toggle input[type="checkbox"]:checked::before {
  transform: translateX(12px);
}

.login-select__security .krds-form-check.toggle label {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-font-size-label-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-basic);
  cursor: pointer;
}

/* 도움말 버튼 */
.login-select__help-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
}

.login-select__help-btn .svg-icon {
  width: 20px;
  height: 20px;
  background-color: var(--krds-light-color-text-subtle);
}

/* 도움말 패널 */
.login-select__help-panel {
  padding: var(--krds-padding-6, 16px);
  background-color: var(--krds-light-color-surface-gray-subtler, #f4f5f6);
  border-radius: var(--krds-radius-medium3, 8px);
  font-family: var(--krds-typo-font-type);
  font-size: var(--krds-font-size-body-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-subtle);
}

.login-select__help-panel p {
  margin: 0;
}

/* 로그인 방식 목록 */
.login-select__list {
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
  border-bottom: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
}

/* 로그인 방식 그룹 */
.login-select__group {
  display: flex;
  gap: var(--krds-gap-7, 24px);
  padding: var(--krds-padding-8, 24px) 0;
}

.login-select__group + .login-select__group {
  border-top: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
}

/* 그룹 타이틀 */
.login-select__group-title {
  flex: 1;
  min-width: 0;
  padding-top: var(--krds-padding-8, 24px);
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-font-size-heading-medium, 2.4rem);
  line-height: var(--krds-line-height-base, 1.5);
  letter-spacing: var(--krds-typo-letter-spacing-0, 0);
  color: var(--krds-light-color-text-basic);
  margin: 0;
}

.login-select__group-title span {
  display: block;
}

/* 카드 컨테이너 */
.login-select__cards {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 16px);
  width: 844px;
  flex-shrink: 0;
}

/* 로그인 선택 카드 */
.login-select-card {
  display: flex;
  align-items: flex-start;
  gap: var(--krds-gap-7, 24px);
  padding: var(--krds-padding-9, 32px);
  background-color: var(--krds-light-color-surface-gray-subtler, #f4f5f6);
  border: none;
  border-radius: var(--krds-radius-xlarge2, 12px);
  cursor: pointer;
  text-align: left;
  width: 100%;
  transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.login-select-card:hover {
  background-color: var(--krds-light-color-surface-gray-subtle, #eaebed);
}

.login-select-card:focus {
  outline: none;
  box-shadow: 0 0 0 4px var(--krds-light-color-border-primary);
}

/* 카드 아이콘 */
.login-select-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
}

.login-select-card__icon .svg-icon {
  width: 40px;
  height: 40px;
  background-color: var(--krds-light-color-text-basic);
}

/* 카드 콘텐츠 */
.login-select-card__content {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
  flex: 1;
  min-width: 0;
}

/* 카드 타이틀 */
.login-select-card__title {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-font-size-heading-small, 1.9rem);
  line-height: var(--krds-line-height-base, 1.5);
  letter-spacing: var(--krds-typo-letter-spacing-0, 0);
  color: var(--krds-light-color-text-basic);
}

/* 카드 설명 */
.login-select-card__desc {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-font-size-body-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  letter-spacing: var(--krds-typo-letter-spacing-0, 0);
  color: var(--krds-light-color-text-subtle);
}

/* 카드 링크 */
.login-select-card__link {
  display: inline-flex;
  align-items: center;
  gap: var(--krds-gap-2, 4px);
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-font-size-label-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-basic);
  text-decoration: none;
}

.login-select-card__link:hover {
  text-decoration: underline;
}

.login-select-card__link .svg-icon {
  width: 20px;
  height: 20px;
  background-color: var(--krds-light-color-text-basic);
}

/* 카드 화살표 */
.login-select-card__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  align-self: center;
}

.login-select-card__arrow .svg-icon {
  width: 24px;
  height: 24px;
  background-color: var(--krds-light-color-text-basic);
}

/* 아이콘 정의 */
.svg-icon.ico-help-outline {
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center center;
  mask-size: contain;
  -webkit-mask-image: url(../../img/component/icon/ico_information.svg);
  mask-image: url(../../img/component/icon/ico_information.svg);
}

.svg-icon.ico-certification-mobile {
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center center;
  mask-size: contain;
  -webkit-mask-image: url(../../img/component/icon/ico_login_certify_type_01.svg);
  mask-image: url(../../img/component/icon/ico_login_certify_type_01.svg);
}

.svg-icon.ico-login-id-pw {
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center center;
  mask-size: contain;
  -webkit-mask-image: url(../../img/component/icon/ico_login_certify_type_02.svg);
  mask-image: url(../../img/component/icon/ico_login_certify_type_02.svg);
}

.svg-icon.ico-certification-simple {
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center center;
  mask-size: contain;
  -webkit-mask-image: url(../../img/component/icon/ico_login_certify_type_03.svg);
  mask-image: url(../../img/component/icon/ico_login_certify_type_03.svg);
}

/* ============================================
   반응형 스타일 (모바일)
   ============================================ */
@media (max-width: 1023px) {
  .login-select {
    gap: var(--krds-gap-layout-h1-h2, 32px);
    padding-bottom: var(--krds-gap-layout-contents-footer, 40px);
  }

  .login-select__header {
    gap: var(--krds-gap-layout-title-body-large, 20px);
  }

  .login-select__subtitle {
    font-size: var(--krds-font-size-heading-xxsmall, 1.5rem);
  }

  .login-select__title {
    font-size: var(--krds-font-size-heading-xlarge, 2.8rem);
  }

  .login-select__body {
    gap: var(--krds-gap-7, 24px);
  }

  /* 로그인 방식 그룹 - 모바일 세로 배치 */
  .login-select__group {
    flex-direction: column;
    gap: var(--krds-gap-5, 16px);
    padding: var(--krds-padding-6, 16px) 0;
  }

  .login-select__group + .login-select__group {
    border-top: 1px solid var(--krds-light-color-divider-gray, #8a949e);
  }

  .login-select__list {
    border-top-color: var(--krds-light-color-divider-gray, #8a949e);
    border-bottom-color: var(--krds-light-color-divider-gray, #8a949e);
  }

  .login-select__group-title {
    padding-top: 0;
    font-size: var(--krds-font-size-heading-medium, 2.2rem);
  }

  /* 카드 컨테이너 - 전체 너비 */
  .login-select__cards {
    width: 100%;
    gap: var(--krds-gap-4, 12px);
  }

  /* 로그인 선택 카드 - 모바일 */
  .login-select-card {
    gap: var(--krds-gap-5, 16px);
    padding: var(--krds-padding-8, 24px);
    flex-wrap: wrap;
  }

  .login-select-card__icon {
    width: 32px;
    height: 32px;
  }

  .login-select-card__icon .svg-icon {
    width: 32px;
    height: 32px;
  }

  .login-select-card__content {
    flex: 1;
  }

  .login-select-card__arrow {
    align-self: flex-start;
  }
}

/* ============================================
   다크모드/고대비 모드 지원
   ============================================ */
[data-krds-mode="high-contrast"] .login-select__subtitle {
  color: var(--krds-high-contrast-color-text-subtle);
}

[data-krds-mode="high-contrast"] .login-select__title {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .login-select__desc {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .login-select__security .krds-form-check.toggle label {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .login-select__security .krds-form-check.toggle input[type="checkbox"] {
  background-color: var(--krds-high-contrast-color-element-gray);
}

[data-krds-mode="high-contrast"] .login-select__security .krds-form-check.toggle input[type="checkbox"]:checked {
  background-color: var(--krds-high-contrast-color-element-primary);
}

[data-krds-mode="high-contrast"] .login-select__help-panel {
  background-color: var(--krds-high-contrast-color-surface-gray-subtler);
  color: var(--krds-high-contrast-color-text-subtle);
}

[data-krds-mode="high-contrast"] .login-select__list {
  border-color: var(--krds-high-contrast-color-divider-gray-light);
}

[data-krds-mode="high-contrast"] .login-select__group + .login-select__group {
  border-color: var(--krds-high-contrast-color-divider-gray-light);
}

[data-krds-mode="high-contrast"] .login-select__group-title {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .login-select-card {
  background-color: var(--krds-high-contrast-color-surface-gray-subtler);
}

[data-krds-mode="high-contrast"] .login-select-card:hover {
  background-color: var(--krds-high-contrast-color-surface-gray-subtle);
}

[data-krds-mode="high-contrast"] .login-select-card:focus {
  box-shadow: 0 0 0 4px var(--krds-high-contrast-color-border-primary);
}

[data-krds-mode="high-contrast"] .login-select-card__title {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .login-select-card__desc {
  color: var(--krds-high-contrast-color-text-subtle);
}

[data-krds-mode="high-contrast"] .login-select-card__link {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .login-select-card__icon .svg-icon,
[data-krds-mode="high-contrast"] .login-select-card__arrow .svg-icon,
[data-krds-mode="high-contrast"] .login-select-card__link .svg-icon {
  background-color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .login-select__help-btn .svg-icon {
  background-color: var(--krds-high-contrast-color-text-subtle);
}

/* ============================================
   아이디/비밀번호 로그인 페이지 스타일
   (sub-layout.css: login-type-tab, login-form-area, login-info-wrap 활용)
   ============================================ */

/* 로그인 컨테이너 */
.login-id-pw {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-layout-h1-h2, 48px);
  padding-bottom: var(--krds-gap-layout-contents-footer, 64px);
  width: 100%;
}

/* 헤더 영역 */
.login-id-pw__header {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-layout-title-body-small, 16px);
}

/* 서브타이틀 */
.login-id-pw__subtitle {
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-pc-font-size-heading-xxsmall, 1.5rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-subtle);
  margin: 0;
}

/* 메인 타이틀 */
.login-id-pw__title {
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-pc-font-size-heading-xlarge, 4rem);
  line-height: var(--krds-line-height-base, 1.5);
  letter-spacing: var(--krds-typo-letter-spacing-1, 0.05em);
  color: var(--krds-light-color-text-basic);
  margin: 0;
}

/* 설명 텍스트 (탭 패널 내부) */
.login-id-pw__desc {
  font-size: var(--krds-pc-font-size-body-medium);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-basic);
  margin: 0;
}

/* login-form-area 내 form 태그에 flex 적용 (sub-layout.css는 > div 만 대응) */
.login-form-area > form {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
}

/* 버튼 전체 너비 */
.w-full {
  width: 100%;
}

/* ============================================
   SNS 간편로그인 버튼 스타일
   ============================================ */

/* SNS 버튼 - 아이콘 좌측 정렬 */
.login-sns-btn {
  justify-content: flex-start;
}

.login-sns-btn__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* 카카오톡 아이콘 */
.login-sns-btn__icon--kakao {
  background-image: url(../../img/kosac/ico_kakaotalk.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}

/* 네이버 아이콘 */
.login-sns-btn__icon--naver {
  background-image: url(../../img/kosac/ico_naver.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}



.login-sns-btn__text {
  flex: 1;
  text-align: center;
}

/* ============================================
   로그인 - 반응형 (모바일)
   ============================================ */
@media (max-width: 1023px) {
  .login-id-pw {
    gap: var(--krds-gap-8, 32px);
    padding-bottom: var(--krds-gap-9, 40px);
  }

  .login-id-pw__title {
    font-size: var(--krds-mobile-font-size-heading-xlarge, 2.8rem);
  }

  .login-id-pw__desc {
    font-size: var(--krds-mobile-font-size-body-medium);
  }

  /* 모바일에서 form 태그 세로 배치 */
  .login-form-area > form {
    gap: var(--krds-gap-5, 16px);
  }
}

/* ============================================
   고대비 모드
   ============================================ */
[data-krds-mode="high-contrast"] .login-id-pw__subtitle {
  color: var(--krds-high-contrast-color-text-subtle);
}

[data-krds-mode="high-contrast"] .login-id-pw__title,
[data-krds-mode="high-contrast"] .login-id-pw__desc {
  color: var(--krds-high-contrast-color-text-basic);
}

@media (prefers-color-scheme: dark) {
  [data-krds-mode="theme"] .login-select__subtitle {
    color: var(--krds-high-contrast-color-text-subtle);
  }

  [data-krds-mode="theme"] .login-select__title {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .login-select__desc {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .login-select__security .krds-form-check.toggle label {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .login-select__security .krds-form-check.toggle input[type="checkbox"] {
    background-color: var(--krds-high-contrast-color-element-gray);
  }

  [data-krds-mode="theme"] .login-select__security .krds-form-check.toggle input[type="checkbox"]:checked {
    background-color: var(--krds-high-contrast-color-element-primary);
  }

  [data-krds-mode="theme"] .login-select__help-panel {
    background-color: var(--krds-high-contrast-color-surface-gray-subtler);
    color: var(--krds-high-contrast-color-text-subtle);
  }

  [data-krds-mode="theme"] .login-select__list {
    border-color: var(--krds-high-contrast-color-divider-gray-light);
  }

  [data-krds-mode="theme"] .login-select__group + .login-select__group {
    border-color: var(--krds-high-contrast-color-divider-gray-light);
  }

  [data-krds-mode="theme"] .login-select__group-title {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .login-select-card {
    background-color: var(--krds-high-contrast-color-surface-gray-subtler);
  }

  [data-krds-mode="theme"] .login-select-card:hover {
    background-color: var(--krds-high-contrast-color-surface-gray-subtle);
  }

  [data-krds-mode="theme"] .login-select-card:focus {
    box-shadow: 0 0 0 4px var(--krds-high-contrast-color-border-primary);
  }

  [data-krds-mode="theme"] .login-select-card__title {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .login-select-card__desc {
    color: var(--krds-high-contrast-color-text-subtle);
  }

  [data-krds-mode="theme"] .login-select-card__link {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .login-select-card__icon .svg-icon,
  [data-krds-mode="theme"] .login-select-card__arrow .svg-icon,
  [data-krds-mode="theme"] .login-select-card__link .svg-icon {
    background-color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .login-select__help-btn .svg-icon {
    background-color: var(--krds-high-contrast-color-text-subtle);
  }
}

/* ============================================
   회원가입 유형 선택 페이지 스타일
   ============================================ */

/* 안내 박스 */
.join-select-info {
  display: flex;
  align-items: center;
  padding: var(--krds-padding-8, 24px);
  background-color: var(--krds-light-color-surface-secondary-subtler, #eef2f7);
  border-radius: var(--krds-radius-xlarge2, 12px);
  margin-bottom: var(--krds-gap-layout-h1-h2, 48px);
}

.join-select-info p {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-secondary, #052b57);
  margin: 0;
}

/* 회원 유형 목록 */
.join-select-list {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 0;
  padding-bottom: var(--krds-number-17, 56px);
}

/* 수직 구분선 (데스크탑) */
.join-select-divider {
  width: 1px;
  align-self: stretch;
  background-color: var(--krds-light-color-divider-gray-light, #cdd1d5);
  flex-shrink: 0;
}

/* 회원 유형 항목 */
.join-select-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-7, 24px);
  flex: 1;
  min-width: 0;
  padding: 0 var(--krds-padding-8, 24px);
}

/* 아바타 이미지 */
.join-select-item__ico {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
}

.join-select-item__ico img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 텍스트 영역 */
.join-select-item__info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
  text-align: center;
  width: 100%;
}

/* 유형 타이틀 */
.join-select-item__title {
  display: block;
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-pc-font-size-heading-medium, 2.4rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-basic, #1e2124);
}

/* 유형 설명 */
.join-select-item__desc {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-subtle, #464c53);
  margin: 0;
}

/* 버튼 영역 */
.join-select-item__btn {
  display: flex;
  justify-content: center;
  width: 100%;
}

.join-select-item__btn .krds-btn {
  width: 250px;
}

/* 외국인 버튼 - 어두운 계열 */
.join-select-btn--foreign {
  background-color: var(--krds-light-color-element-secondary, #083891) !important;
  border-color: var(--krds-light-color-element-secondary, #083891) !important;
}

.join-select-btn--foreign:hover {
  background-color: #052b6e !important;
  border-color: #052b6e !important;
}

/* ============================================
   반응형 (모바일)
   ============================================ */
@media (max-width: 1023px) {
  #container .in-between .contents{
    width: 100%;
  }
}
@media (max-width: 767px) {
  .join-select-info {
    margin-bottom: var(--krds-gap-layout-h1-h2, 32px);
  }

  .join-select-info p {
    font-size: var(--krds-mobile-font-size-body-medium, 1.7rem);
  }

  /* 세로 배치로 전환 */
  .join-select-list {
    flex-direction: column;
    gap: 0;
  }

  /* 수평 구분선 (모바일) */
  .join-select-divider {
    width: 100%;
    height: 1px;
    align-self: auto;
  }

  /* 상하 패딩으로 간격 조정 */
  .join-select-item {
    padding: var(--krds-padding-8, 24px) 0;
  }

  .join-select-item__title {
    font-size: var(--krds-mobile-font-size-heading-medium, 2.2rem);
  }

  .join-select-item__desc {
    font-size: var(--krds-mobile-font-size-body-medium, 1.7rem);
  }

  .join-select-item__btn .krds-btn {
    width: 250px;
  }
}

/* ============================================
   다크모드/고대비 모드
   ============================================ */
[data-krds-mode="high-contrast"] .join-select-info {
  background-color: var(--krds-high-contrast-color-surface-secondary-subtler);
}

[data-krds-mode="high-contrast"] .join-select-info p {
  color: var(--krds-high-contrast-color-text-secondary);
}

[data-krds-mode="high-contrast"] .join-select-divider {
  background-color: var(--krds-high-contrast-color-divider-gray-light);
}

[data-krds-mode="high-contrast"] .join-select-item__title {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .join-select-item__desc {
  color: var(--krds-high-contrast-color-text-subtle);
}

[data-krds-mode="high-contrast"] .join-select-btn--foreign {
  background-color: var(--krds-high-contrast-color-element-secondary, #083891) !important;
  border-color: var(--krds-high-contrast-color-element-secondary, #083891) !important;
}

@media (prefers-color-scheme: dark) {
  [data-krds-mode="theme"] .join-select-info {
    background-color: var(--krds-high-contrast-color-surface-secondary-subtler);
  }

  [data-krds-mode="theme"] .join-select-info p {
    color: var(--krds-high-contrast-color-text-secondary);
  }

  [data-krds-mode="theme"] .join-select-divider {
    background-color: var(--krds-high-contrast-color-divider-gray-light);
  }

  [data-krds-mode="theme"] .join-select-item__title {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .join-select-item__desc {
    color: var(--krds-high-contrast-color-text-subtle);
  }

  [data-krds-mode="theme"] .join-select-btn--foreign {
    background-color: var(--krds-high-contrast-color-element-secondary, #083891) !important;
    border-color: var(--krds-high-contrast-color-element-secondary, #083891) !important;
  }
}

/* ============================================
   본인인증 페이지 스타일
   ============================================ */

/* 본인인증 안내박스: flex-col 다중 문단 */
.join-verify-info {
  flex-direction: column;
  gap: var(--krds-gap-5, 16px);
  align-items: flex-start;
}

/* 팝업 안내 줄 */
.join-verify-info__notice {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-2, 4px);
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-secondary, #052b57);
  margin: 0;
}

.join-verify-info__notice .svg-icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-color: var(--krds-light-color-element-secondary, #052b57);
}

/* 본인인증 방법 카드 */
.join-verify-box {
  display: flex;
  gap: var(--krds-gap-7, 24px);
  align-items: flex-start;
  padding: var(--krds-padding-9, 32px);
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-xlarge2, 12px);
}

/* 아이콘 영역 */
.join-verify-box__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.join-verify-box__icon img {
  width: 40px;
  height: 40px;
  object-fit: contain;
}

/* 내용 영역 */
.join-verify-box__content {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
  flex: 1;
  min-width: 0;
}

/* 타이틀 + 설명 영역 */
.join-verify-box__info {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
}

/* 카드 타이틀 */
.join-verify-box__title {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-pc-font-size-heading-medium, 2.4rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}

/* 카드 설명 */
.join-verify-box__desc {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-subtle, #464c53);
  margin: 0;
}

/* 안내 메모 영역 (구분선 상단) */
.join-verify-box__notes {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
  padding-top: var(--krds-padding-6, 16px);
  border-top: 1px solid var(--krds-light-color-border-secondary-light, #d6e0eb);
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-subtle, #464c53);
}

.join-verify-box__notes p {
  margin: 0;
}

/* ============================================
   본인인증 반응형 (모바일)
   ============================================ */
@media (max-width: 1023px) {
  .join-verify-info__notice {
    font-size: var(--krds-mobile-font-size-body-medium, 1.7rem);
  }

  .join-verify-box {
    padding: var(--krds-padding-8, 24px);
    gap: var(--krds-gap-5, 16px);
  }

  .join-verify-box__title {
    font-size: var(--krds-mobile-font-size-heading-medium, 2.2rem);
  }

  .join-verify-box__desc,
  .join-verify-box__notes {
    font-size: var(--krds-mobile-font-size-body-medium, 1.7rem);
  }
}

/* ============================================
   본인인증 고대비/다크모드
   ============================================ */
[data-krds-mode="high-contrast"] .join-verify-info__notice {
  color: var(--krds-high-contrast-color-text-secondary);
}

[data-krds-mode="high-contrast"] .join-verify-info__notice .svg-icon {
  background-color: var(--krds-high-contrast-color-element-secondary);
}

[data-krds-mode="high-contrast"] .join-verify-box {
  border-color: var(--krds-high-contrast-color-border-gray-light);
}

[data-krds-mode="high-contrast"] .join-verify-box__title {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .join-verify-box__desc,
[data-krds-mode="high-contrast"] .join-verify-box__notes {
  color: var(--krds-high-contrast-color-text-subtle);
}

[data-krds-mode="high-contrast"] .join-verify-box__notes {
  border-top-color: var(--krds-high-contrast-color-border-secondary-light);
}

@media (prefers-color-scheme: dark) {
  [data-krds-mode="theme"] .join-verify-info__notice {
    color: var(--krds-high-contrast-color-text-secondary);
  }

  [data-krds-mode="theme"] .join-verify-info__notice .svg-icon {
    background-color: var(--krds-high-contrast-color-element-secondary);
  }

  [data-krds-mode="theme"] .join-verify-box {
    border-color: var(--krds-high-contrast-color-border-gray-light);
  }

  [data-krds-mode="theme"] .join-verify-box__title {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .join-verify-box__desc,
  [data-krds-mode="theme"] .join-verify-box__notes {
    color: var(--krds-high-contrast-color-text-subtle);
  }

  [data-krds-mode="theme"] .join-verify-box__notes {
    border-top-color: var(--krds-high-contrast-color-border-secondary-light);
  }
}

/* ============================================
   회원가입 완료 페이지 
   ============================================ */

.join-complete {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding-bottom: var(--krds-gap-layout-contents-footer, 64px);
}

.join-complete__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-9, 40px);
  width: 100%;
  max-width: 100%;
}

.join-complete__figure {
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.join-complete__figure img {
  display: block;
  width: 180px;
  max-width: 100%;
  height: auto;
  max-height: 120px;
  object-fit: contain;
}

.join-complete__text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  text-align: center;
}

.join-complete__title {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-pc-font-size-heading-large, 3.2rem);
  line-height: var(--krds-line-height-base, 1.5);
  letter-spacing: var(--krds-typo-letter-spacing-1, 1px);
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}

.join-complete__title-em {
  color: var(--krds-light-color-text-primary, #0b50d0);
}

.join-complete__desc {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}

.join-complete__actions {
  display: flex;
  justify-content: center;
  width: 100%;
}

.join-complete__btn-main {
  width: 200px;
  max-width: 100%;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
}

@media (max-width: 1023px) {
  #container .in-between .contents.join-complete-page .krds-breadcrumb-wrap {
    margin-bottom: var(--krds-mobile-gap-layout-breadcrumb-h1);
  }

  .join-complete {
    padding-bottom: var(--krds-mobile-gap-layout-contents-footer);
  }

  .join-complete__inner {
    gap: 0;
  }

  .join-complete__figure {
    margin-bottom: var(--krds-gap-5);
  }

  .join-complete__text {
    margin-bottom: var(--krds-gap-8);
  }

  .join-complete__figure img {
    width: 150px;
    max-width: 100%;
    max-height: 100px;
  }

  .join-complete__title {
    font-size: var(--krds-mobile-font-size-heading-large);
    white-space: normal;
  }

  .join-complete__desc {
    font-size: var(--krds-mobile-font-size-body-medium);
    white-space: normal;
    max-width: 100%;
  }

  .join-complete__btn-main {
    width: 100%;
    max-width: 100%;
  }
}

@media (max-width: 767px) {
  #container .in-between .contents.join-complete-page {
    padding-right: var(--krds-contents-padding-x);
  }
}

[data-krds-mode="high-contrast"] .join-complete__title {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .join-complete__title-em {
  color: var(--krds-high-contrast-color-text-primary);
}

[data-krds-mode="high-contrast"] .join-complete__desc {
  color: var(--krds-high-contrast-color-text-basic);
}

@media (prefers-color-scheme: dark) {
  [data-krds-mode="theme"] .join-complete__title {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .join-complete__title-em {
    color: var(--krds-high-contrast-color-text-primary);
  }

  [data-krds-mode="theme"] .join-complete__desc {
    color: var(--krds-high-contrast-color-text-basic);
  }
}

/* ============================================
   아이디 찾기 확인 결과
   ============================================ */

.find-id-result {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-number-14);
  width: 100%;
}

.find-id-result__message {
  margin: 0;
  text-align: center;
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-bold);
  font-size: var(--krds-pc-font-size-heading-large);
  line-height: var(--krds-line-height-base);
  letter-spacing: var(--krds-typo-letter-spacing-1);
  color: var(--krds-light-color-text-basic);
}

.find-id-result__lead,
.find-id-result__suffix {
  font-weight: var(--krds-font-weight-bold);
}

.find-id-result__id {
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-primary);
}

.find-id-result__meta {
  box-sizing: border-box;
  width: 100%;
  padding: var(--krds-padding-9) var(--krds-padding-10);
  background-color: var(--krds-light-color-surface-gray-subtler);
  border-radius: var(--krds-radius-xlarge2);
}

.find-id-result__date {
  margin: 0;
  text-align: center;
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular);
  font-size: var(--krds-pc-font-size-body-medium);
  line-height: var(--krds-line-height-base);
  letter-spacing: var(--krds-typo-letter-spacing-0);
  color: var(--krds-light-color-text-basic);
}

.find-id-result__actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--krds-gap-3);
  width: 100%;
  margin-bottom: 4rem;
}

.find-id-result__btn {
  width: 200px;
  max-width: 100%;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
}

.find-id-result__pw-help {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--krds-gap-5);
  width: 100%;
  padding-top: var(--krds-number-14);
  border-top: var(--krds-light-border-width-static-regular) solid var(--krds-light-color-divider-gray);
}

.find-id-result__pw-label {
  margin: 0;
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-bold);
  font-size: var(--krds-pc-font-size-heading-small);
  line-height: var(--krds-line-height-base);
  color: var(--krds-light-color-text-basic);
}

.find-id-result__pw-link {
  text-decoration: none;
}

@media (max-width: 1023px) {
  #container .in-between .contents.find-id-result-page .krds-breadcrumb-wrap {
    margin-bottom: var(--krds-mobile-gap-layout-breadcrumb-h1);
  }

  .find-id-result-page {
    gap: var(--krds-mobile-gap-layout-h1-h2);
    padding-bottom: var(--krds-mobile-gap-layout-contents-footer);
  }

  .find-id-result__message {
    font-size: var(--krds-mobile-font-size-heading-large);
  }

  .find-id-result__id {
    font-size: var(--krds-pc-font-size-heading-large);
  }

  .find-id-result__meta {
    padding: var(--krds-padding-8) var(--krds-padding-10);
  }

  .find-id-result__date {
    font-size: var(--krds-mobile-font-size-body-medium);
  }

  .find-id-result__actions {
    flex-direction: column;
    gap: var(--krds-gap-5);
  }

  .find-id-result__btn {
    width: 100%;
  }

  .find-id-result__pw-help {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-5);
  }

  .find-id-result__pw-label {
    font-size: var(--krds-mobile-font-size-heading-small);
  }
}

@media (max-width: 767px) {
  #container .in-between .contents.find-id-result-page {
    padding-right: var(--krds-contents-padding-x);
  }
}

[data-krds-mode="high-contrast"] .find-id-result__message {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .find-id-result__id {
  color: var(--krds-high-contrast-color-text-primary);
}

[data-krds-mode="high-contrast"] .find-id-result__meta {
  background-color: var(--krds-high-contrast-color-surface-gray-subtler);
}

[data-krds-mode="high-contrast"] .find-id-result__date {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .find-id-result__pw-help {
  border-top-color: var(--krds-high-contrast-color-divider-gray);
}

[data-krds-mode="high-contrast"] .find-id-result__pw-label {
  color: var(--krds-high-contrast-color-text-basic);
}

@media (prefers-color-scheme: dark) {
  [data-krds-mode="theme"] .find-id-result__message {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .find-id-result__id {
    color: var(--krds-high-contrast-color-text-primary);
  }

  [data-krds-mode="theme"] .find-id-result__date {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .find-id-result__pw-label {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .find-id-result__pw-help {
    border-top-color: var(--krds-high-contrast-color-divider-gray);
  }

  [data-krds-mode="theme"] .find-id-result__meta {
    background-color: var(--krds-high-contrast-color-surface-gray-subtler);
  }
}

/* ============================================
   비밀번호 재설정 
   ============================================ */

.pw-reset-page {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  /* gap: var(--krds-pc-gap-layout-h1-h2); */
  width: 100%;
  padding-bottom: var(--krds-pc-gap-layout-contents-footer);
}

.pw-reset-page__form {
  display: flex;
  flex-direction: column;
  gap: var(--krds-pc-gap-layout-h1-h2);
  width: 100%;
}

.pw-reset-page__fields {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-9);
  width: 100%;
}

.pw-reset-page .form-group {
  --krds-form-group--gap: var(--krds-gap-7);
}

.pw-reset-page .form-group .form-conts {
  gap: var(--krds-gap-3);
}

.pw-reset-page__actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: var(--krds-gap-5);
  width: 100%;
}

.pw-reset-page__btn {
  min-width: 9.8rem;
  box-sizing: border-box;
}

@media (max-width: 1023px) {
  #container .in-between .contents.pw-reset-page .krds-breadcrumb-wrap {
    margin-bottom: var(--krds-mobile-gap-layout-breadcrumb-h1);
  }

  .pw-reset-page {
    /* gap: var(--krds-mobile-gap-layout-h1-h2); */
    padding-bottom: var(--krds-mobile-gap-layout-contents-footer);
  }

  .pw-reset-page__form {
    gap: var(--krds-mobile-gap-layout-h1-h2);
  }

  .pw-reset-page__fields {
    gap: var(--krds-gap-8);
  }

  .pw-reset-page .form-group {
    --krds-form-group--gap: var(--krds-gap-5);
  }

  .pw-reset-page__actions {
    flex-direction: column;
    align-items: stretch;
    gap: var(--krds-gap-5);
  }

  .pw-reset-page__btn {
    width: 100%;
    min-width: 0;
  }
}

@media (max-width: 767px) {
  #container .in-between .contents.pw-reset-page {
    padding-right: var(--krds-contents-padding-x);
  }
}

/* ============================================
   정보입력 페이지 스타일 
   ============================================ */

.join-profile-form__wrap {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-9, 40px);
  width: 100%;
}

.join-profile-card {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-9, 40px);
  width: 100%;
  padding: var(--krds-pc-padding-card-large, 4rem);
  border: 1px solid var(--krds-light-color-border-gray, #b1b8be);
  border-radius: var(--krds-radius-xlarge2, 12px);
  background-color: var(--krds-light-color-surface-white-subtle, #fff);
  box-sizing: border-box;
}

.join-profile-card__title {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-pc-font-size-heading-medium, 2.4rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-bolder, #131416);
  margin: 0;
}

.join-profile-card .form-group > .form-label {
  color: var(--krds-light-color-text-basic, #1e2124);
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-pc-font-size-heading-small, 1.9rem);
}

.join-profile-form__phone-row.form-conts {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
}

.join-profile-form__phone-row .krds-input {
  flex: 1 1 auto;
  min-width: min(100%, 20rem);
}

.join-profile-form__phone-row .krds-btn {
  flex-shrink: 0;
}

.join-profile-card .form-group .form-conts .krds-check-area {
  flex-wrap: wrap;
  align-items: center;
}

@media (max-width: 1023px) {
  .join-profile-card {
    padding: var(--krds-mobile-padding-card-large, 4rem);
  }

  .join-profile-card__title {
    font-size: var(--krds-mobile-font-size-heading-medium, 2.2rem);
  }

  .join-profile-card .form-group > .form-label {
    font-size: var(--krds-mobile-font-size-heading-small, 1.9rem);
  }

  .join-profile-form__phone-row.form-conts {
    flex-direction: column;
    align-items: stretch;
  }

  .join-profile-form__phone-row .krds-input,
  .join-profile-form__phone-row .krds-btn {
    width: 100%;
  }

  .join-profile-form__phone-row .krds-form-check {
    width: 100%;
  }
}

[data-krds-mode="high-contrast"] .join-profile-card {
  border-color: var(--krds-high-contrast-color-border-gray);
  background-color: var(--krds-high-contrast-color-surface-white-subtle);
}

[data-krds-mode="high-contrast"] .join-profile-card__title,
[data-krds-mode="high-contrast"] .join-profile-card .form-group > .form-label {
  color: var(--krds-high-contrast-color-text-basic);
}

@media (prefers-color-scheme: dark) {
  [data-krds-mode="theme"] .join-profile-card {
    border-color: var(--krds-high-contrast-color-border-gray);
    background-color: var(--krds-high-contrast-color-surface-white-subtle);
  }

  [data-krds-mode="theme"] .join-profile-card__title,
  [data-krds-mode="theme"] .join-profile-card .form-group > .form-label {
    color: var(--krds-high-contrast-color-text-basic);
  }
}

/* ============================================
   약관동의 페이지 스타일
   ============================================ */

/* 모바일 단계 표시 + 섹션 헤딩 영역 */
.join-agree__heading-wrap {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
}

/* 모바일 단계 텍스트 (PC에서 숨김) */
.join-agree__step-text {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-subtle, #464c53);
  margin: 0;
}

.join-agree__step-current {
  color: var(--krds-light-color-text-primary, #0b50d0);
  font-weight: var(--krds-font-weight-bold, 700);
}

/* 섹션 헤딩 (약관동의) */
.join-agree__heading {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-pc-font-size-heading-large, 3.2rem);
  line-height: var(--krds-line-height-base, 1.5);
  letter-spacing: var(--krds-typo-letter-spacing-1, 1px);
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}

/* 약관 목록 컨테이너 */
.join-agree__list {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-9, 40px);
}

/* 약관 섹션 내 전체 레이아웃 */
.join-agree {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-9, 40px);
  padding-bottom: var(--krds-gap-layout-contents-footer, 64px);
}

/* 개별 약관 블록 */
.join-terms-block {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
}

/* 약관 타이틀 */
.join-terms-block__title {
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-pc-font-size-heading-medium, 2.4rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}

/* 필수 표시 */
.txt-required {
  color: var(--krds-light-color-text-danger, #ab2b36);
}

/* 약관 내용 박스 */
.join-terms-box {
  border: 1px solid var(--krds-light-color-border-gray, #b1b8be);
  border-radius: var(--krds-radius-xlarge2, 12px);
  background-color: var(--krds-light-color-surface-white, #fff);
  overflow: hidden;
}

.join-terms-box__inner {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 16px);
  padding: var(--krds-padding-8, 24px);
}

/* 약관 서브 타이틀 */
.join-terms-box__subtitle {
  display: block;
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-pc-font-size-heading-small, 1.9rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-basic, #1e2124);
}

/* 약관 텍스트 스크롤 영역 */
.join-terms-box__text {
  height: 240px;
  overflow-y: auto;
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-basic, #1e2124);
}

.join-terms-box__text p {
  margin: 0;
}

/* 동의 선택 영역 */
.join-terms-agree {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-7, 24px);
  padding: var(--krds-padding-8, 24px);
  background-color: var(--krds-light-color-surface-gray-subtler, #f4f5f6);
  border-radius: var(--krds-radius-xlarge2, 12px);
}

.join-terms-agree__text {
  flex: 1;
  min-width: 0;
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}

/* 동의 라디오 버튼 그룹 */
.join-terms-agree .krds-check-area {
  display: flex;
  gap: var(--krds-gap-7, 24px);
  flex-shrink: 0;
}

/* 전체 동의 영역 */
.join-agree-all {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  padding: var(--krds-padding-8, 24px);
  background-color: var(--krds-light-color-surface-gray-subtler, #f4f5f6);
  border-radius: var(--krds-radius-xlarge2, 12px);
}

.join-agree-all__text {
  flex: 1;
  min-width: 0;
  font-family: var(--krds-typo-font-type);
  font-weight: var(--krds-font-weight-regular, 400);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: var(--krds-line-height-base, 1.5);
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}

/* 버튼 영역 */
.join-agree__btn-wrap {
  display: flex;
  justify-content: flex-end;
  gap: var(--krds-gap-5, 16px);
}

/* ============================================
   약관동의 반응형 (모바일)
   ============================================ */
@media (max-width: 1023px) {

  .join-agree__heading {
    font-size: var(--krds-mobile-font-size-heading-large, 2.8rem);
  }

  .join-agree {
    gap: var(--krds-gap-8, 32px);
    padding-bottom: var(--krds-gap-9, 40px);
  }

  .join-agree__list {
    gap: var(--krds-gap-8, 32px);
  }

  .join-terms-block__title {
    font-size: var(--krds-mobile-font-size-heading-medium, 2.2rem);
  }

  .join-terms-box__subtitle {
    font-size: var(--krds-mobile-font-size-heading-small, 1.9rem);
  }

  .join-terms-box__text {
    font-size: var(--krds-mobile-font-size-body-medium, 1.7rem);
  }

  /* 동의 영역 모바일: 세로 배치 */
  .join-terms-agree {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-5, 16px);
  }

  .join-terms-agree__text {
    font-size: var(--krds-mobile-font-size-body-medium, 1.7rem);
  }

  .join-agree-all {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-5, 16px);
  }

  .join-agree-all__text {
    font-size: var(--krds-mobile-font-size-body-medium, 1.7rem);
  }

  /* 모바일 버튼 영역 */
  .join-agree__btn-wrap {
    flex-direction: column-reverse;
  }

  .join-agree__btn-wrap .krds-btn {
    width: 100%;
  }
}

/* ============================================
   약관동의 고대비/다크모드
   ============================================ */
[data-krds-mode="high-contrast"] .join-agree__heading {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .join-agree__step-current {
  color: var(--krds-high-contrast-color-text-primary);
}

[data-krds-mode="high-contrast"] .join-terms-block__title {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .txt-required {
  color: var(--krds-high-contrast-color-text-danger);
}

[data-krds-mode="high-contrast"] .join-terms-box {
  border-color: var(--krds-high-contrast-color-border-gray);
  background-color: var(--krds-high-contrast-color-surface-white);
}

[data-krds-mode="high-contrast"] .join-terms-box__subtitle,
[data-krds-mode="high-contrast"] .join-terms-box__text {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .join-terms-agree,
[data-krds-mode="high-contrast"] .join-agree-all {
  background-color: var(--krds-high-contrast-color-surface-gray-subtler);
}

[data-krds-mode="high-contrast"] .join-terms-agree__text,
[data-krds-mode="high-contrast"] .join-agree-all__text {
  color: var(--krds-high-contrast-color-text-basic);
}

@media (prefers-color-scheme: dark) {
  [data-krds-mode="theme"] .join-agree__heading,
  [data-krds-mode="theme"] .join-terms-block__title {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .join-agree__step-current {
    color: var(--krds-high-contrast-color-text-primary);
  }

  [data-krds-mode="theme"] .txt-required {
    color: var(--krds-high-contrast-color-text-danger);
  }

  [data-krds-mode="theme"] .join-terms-box {
    border-color: var(--krds-high-contrast-color-border-gray);
    background-color: var(--krds-high-contrast-color-surface-white);
  }

  [data-krds-mode="theme"] .join-terms-box__subtitle,
  [data-krds-mode="theme"] .join-terms-box__text {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .join-terms-agree,
  [data-krds-mode="theme"] .join-agree-all {
    background-color: var(--krds-high-contrast-color-surface-gray-subtler);
  }

  [data-krds-mode="theme"] .join-terms-agree__text,
  [data-krds-mode="theme"] .join-agree-all__text {
    color: var(--krds-high-contrast-color-text-basic);
  }
}

/* ============================================
   나의 활동 
   ============================================ */

/* --- 페이지 타이틀 아이콘 액션 --- */
.my-activity-page__title-actions {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-10);
  margin-left: auto;
  flex-shrink: 0;
}

/* --- 전체 래퍼: 상단(프로필+통계)과 게시판 사이 64px --- */
.my-activity {
  display: flex;
  flex-direction: column;
  gap: 6.4rem;
  width: 100%;
}

/* --- 상단 그룹: 프로필 카드 + 통계 카드 (gap-24px) --- */
.my-activity__top {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-10);
  width: 100%;
}

/* --- 프로필 카드 (CSS Grid)
   PC: [avatar | info  | action]
       [avatar | badge | action]
   MO: [avatar | info  | action]
       [badge  | badge | badge ]
   --- */
.my-activity__profile {
  display: grid;
  grid-template-columns: auto 1fr auto;
  column-gap: var(--krds-gap-10);
  row-gap: var(--krds-gap-7);
  align-items: center;
  width: 100%;
  padding: 3.3rem 3.2rem;
  background-color: var(--krds-light-color-background-white);
  border: var(--krds-light-border-width-static-regular) solid var(--krds-light-color-border-gray-light);
  border-radius: var(--krds-radius-xlarge2);
  box-sizing: border-box;
}

.my-activity__profile-avatar {
  grid-row: 1 / 3;
  grid-column: 1;
  align-self: center;
  width: 8rem;
  height: 8rem;
  border-radius: 50%;
  background-color: var(--krds-light-color-background-gray-subtle);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.my-activity__profile-avatar-icon {
  display: block;
  width: 5.6rem;
  height: 5.6rem;
  background-color: var(--krds-light-color-text-disabled);
  flex-shrink: 0;
}

.my-activity__profile-info {
  grid-row: 1;
  grid-column: 2;
  align-self: end;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.my-activity__profile-action {
  grid-row: 1 / 3;
  grid-column: 3;
  align-self: center;
  flex-shrink: 0;
}

.my-activity__profile-badge-row {
  grid-row: 2;
  grid-column: 2;
  align-self: start;
}

.my-activity__profile-name-row {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5);
  flex-wrap: nowrap;
  line-height: var(--krds-line-height-base);
}

.my-activity__profile-name {
  font-size: var(--krds-pc-font-size-heading-medium);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic);
  line-height: var(--krds-line-height-base);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.my-activity__profile-id {
  font-size: var(--krds-pc-font-size-navigation-depth-medium);
  font-weight: var(--krds-font-weight-regular);
  color: var(--krds-light-color-text-disabled);
  line-height: var(--krds-line-height-base);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.my-activity__sns-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--krds-gap-3);
  background-color: var(--krds-light-color-border-gray-dark);
  color: var(--krds-light-color-background-white);
  font-size: var(--krds-pc-font-size-body-medium);
  font-weight: var(--krds-font-weight-bold);
  padding: var(--krds-padding-3) var(--krds-padding-5);
  border-radius: var(--krds-radius-xlarge2);
  line-height: var(--krds-line-height-base);
  white-space: nowrap;
}

.my-activity__sns-badge-icon {
  display: block;
  flex-shrink: 0;
  width: 2.4rem;
  height: 2.4rem;
}

/* --- 통계 카드 --- */
.my-activity__stats {
  display: flex;
  flex-direction: row;
  gap: var(--krds-gap-8);
  width: 100%;
}

.my-activity__stat-card {
  flex: 1 0 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  padding: 2.4rem;
  border: 0.15rem solid var(--krds-light-color-divider-gray-light);
  border-radius: var(--krds-radius-xlarge2);
  box-sizing: border-box;
}

.my-activity__stat-card--primary {
  background-color: var(--krds-light-color-surface-primary-subtler);
}

.my-activity__stat-card--success {
  background-color: var(--krds-light-color-surface-success-subtler);
}

.my-activity__stat-card--gray {
  background-color: var(--krds-light-color-surface-gray-subtler);
}

.my-activity__stat-card-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  width: 100%;
}

.my-activity__stat-card-label {
  flex: 1 0 0;
  min-width: 0;
  font-size: var(--krds-pc-font-size-navigation-depth-medium);
  font-weight: var(--krds-font-weight-regular);
  color: var(--krds-light-color-text-basic);
  line-height: var(--krds-line-height-base);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.my-activity__stat-card-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
}

.my-activity__stat-card-icon img {
  display: block;
  width: 4rem;
  height: 4rem;
}

.my-activity__stat-card-count {
  font-size: var(--krds-pc-font-size-heading-large);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-subtle);
  line-height: var(--krds-line-height-base);
  letter-spacing: var(--krds-letter-spacing-1);
}

/* --- 게시판 (2-column) --- */
.my-activity__board {
  display: flex;
  flex-direction: row;
  gap: var(--krds-gap-7);
  align-items: stretch;
  width: 100%;
}

.my-activity__board-card {
  flex: 1 0 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: var(--krds-padding-10) 0;
  background-color: var(--krds-light-color-background-white);
  border: var(--krds-light-border-width-static-regular) solid var(--krds-light-color-border-gray-light);
  border-radius: var(--krds-radius-xlarge2);
  box-sizing: border-box;
  overflow: hidden;
}

.my-activity__board-header {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5);
  padding: 0 var(--krds-padding-10);
  flex-shrink: 0;
  margin-bottom: var(--krds-gap-8);
}

.my-activity__board-title {
  flex: 1 0 0;
  min-width: 0;
  font-size: var(--krds-pc-font-size-heading-medium);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic);
  line-height: var(--krds-line-height-base);
}

/* --- 리스트 --- */
.my-activity__list {
  list-style: none;
  padding: 0 var(--krds-padding-10);
  margin: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.my-activity__list-item {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5);
  padding: 1.6rem 0;
  border-bottom: var(--krds-light-border-width-static-regular) solid var(--krds-light-color-border-gray-light);
}

.my-activity__list-item--last {
  border-bottom: none;
}

.my-activity__list-meta {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5);
  width: 100%;
  min-height: 4rem;
}

.my-activity__list-date {
  flex: 1 0 0;
  min-width: 0;
  font-size: var(--krds-pc-font-size-label-medium);
  font-weight: var(--krds-font-weight-regular);
  color: var(--krds-light-color-text-subtle);
  line-height: var(--krds-line-height-base);
  text-align: right;
}

.my-activity__list-text {
  font-size: var(--krds-pc-font-size-label-medium);
  font-weight: var(--krds-font-weight-regular);
  color: var(--krds-light-color-text-subtle);
  line-height: var(--krds-line-height-base);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* --- 맞춤 알람 리스트 --- */
.my-activity__alarm-meta {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-7);
  width: 100%;
}

.my-activity__alarm-icon {
  flex-shrink: 0;
  width: 4rem;
  height: 4rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.my-activity__alarm-icon img {
  display: block;
  width: 4rem;
  height: 4rem;
}

.my-activity__alarm-type {
  flex-shrink: 0;
  font-size: var(--krds-pc-font-size-body-large);
  font-weight: var(--krds-font-weight-regular);
  color: var(--krds-light-color-text-secondary);
  line-height: var(--krds-line-height-base);
  white-space: nowrap;
}

/* ==============================================
   MO (≤ 1023px)
   ============================================== */
@media (max-width: 1023px) {
  .my-activity-page__icon-btn--print {
    display: none;
  }

  .my-activity {
    gap: 4rem;
  }

  .my-activity__top {
    gap: var(--krds-gap-8);
  }

  /* 프로필 카드 MO:
     [avatar | info  | action]
     [badge  | badge | badge ] */
  .my-activity__profile {
    column-gap: var(--krds-gap-8);
    row-gap: var(--krds-gap-8);
    align-items: center;
    padding: 2.4rem;
  }

  .my-activity__profile-avatar {
    grid-row: 1;
    grid-column: 1;
    width: 6.4rem;
    height: 6.4rem;
  }

  .my-activity__profile-info {
    grid-row: 1;
    grid-column: 2;
    align-self: center;
  }

  .my-activity__profile-action {
    grid-row: 1;
    grid-column: 3;
    align-self: flex-start;
    padding-top: var(--krds-padding-1);
  }

  .my-activity__profile-badge-row {
    grid-row: 2;
    grid-column: 1 / -1;
  }

  .my-activity__profile-name {
    font-size: var(--krds-mobile-font-size-body-large);
  }

  .my-activity__profile-id {
    font-size: var(--krds-mobile-font-size-body-medium);
  }

  .my-activity__profile-btn-text {
    display: none;
  }

  .my-activity__sns-badge {
    font-size: var(--krds-mobile-font-size-body-medium);
  }

  /* 통계 카드 MO: 세로 스택, 카드 내부 가로 배치 */
  .my-activity__stats {
    flex-direction: column;
    gap: var(--krds-gap-7);
  }

  .my-activity__stat-card {
    flex: none;
    width: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--krds-gap-8);
    padding: 2.4rem;
  }

  .my-activity__stat-card-header {
    flex: 1 0 0;
    min-width: 0;
  }

  .my-activity__stat-card-label {
    font-size: var(--krds-mobile-font-size-body-large);
  }

  .my-activity__stat-card-count {
    flex-shrink: 0;
    font-size: var(--krds-mobile-font-size-heading-large);
  }

  /* 게시판 MO: 세로 스택 */
  .my-activity__board {
    flex-direction: column;
    gap: var(--krds-gap-8);
  }

  .my-activity__board-card {
    flex: none;
    width: 100%;
  }

  .my-activity__board-header {
    padding: 0 var(--krds-padding-8);
  }

  .my-activity__board-title {
    font-size: var(--krds-mobile-font-size-heading-medium);
  }

  .my-activity__list {
    padding: 0 var(--krds-padding-8);
  }

  .my-activity__list-text {
    font-size: var(--krds-mobile-font-size-label-medium);
    white-space: normal;
  }

  .my-activity__alarm-type {
    font-size: var(--krds-mobile-font-size-body-large);
  }
}

@media (max-width: 767px) {
  #container .in-between .contents.my-activity-page {
    padding-right: var(--krds-contents-padding-x);
  }
  .my-activity-page__title-actions{
    gap: var(--krds-gap-7);
  }
  .my-activity__profile-name-row{
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
  }
}

/* --- high-contrast --- */
[data-krds-mode="high-contrast"] .my-activity__profile {
  border-color: var(--krds-high-contrast-color-border-gray-light);
  background-color: var(--krds-high-contrast-color-background-white);
}

[data-krds-mode="high-contrast"] .my-activity__profile-name {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .my-activity__profile-id {
  color: var(--krds-high-contrast-color-text-disabled);
}

[data-krds-mode="high-contrast"] .my-activity__stat-card {
  border-color: var(--krds-high-contrast-color-divider-gray-light);
}

[data-krds-mode="high-contrast"] .my-activity__stat-card-label,
[data-krds-mode="high-contrast"] .my-activity__stat-card-count {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .my-activity__board-card {
  border-color: var(--krds-high-contrast-color-border-gray-light);
  background-color: var(--krds-high-contrast-color-background-white);
}

[data-krds-mode="high-contrast"] .my-activity__board-title {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .my-activity__list-item {
  border-bottom-color: var(--krds-high-contrast-color-border-gray-light);
}

[data-krds-mode="high-contrast"] .my-activity__list-text,
[data-krds-mode="high-contrast"] .my-activity__list-date {
  color: var(--krds-high-contrast-color-text-subtle);
}

[data-krds-mode="high-contrast"] .my-activity__alarm-type {
  color: var(--krds-high-contrast-color-text-secondary);
}

@media (prefers-color-scheme: dark) {
  [data-krds-mode="theme"] .my-activity__profile {
    border-color: var(--krds-high-contrast-color-border-gray-light);
    background-color: var(--krds-high-contrast-color-background-white);
  }

  [data-krds-mode="theme"] .my-activity__profile-name {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .my-activity__profile-id {
    color: var(--krds-high-contrast-color-text-disabled);
  }

  [data-krds-mode="theme"] .my-activity__stat-card {
    border-color: var(--krds-high-contrast-color-divider-gray-light);
  }

  [data-krds-mode="theme"] .my-activity__stat-card-label,
  [data-krds-mode="theme"] .my-activity__stat-card-count {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .my-activity__board-card {
    border-color: var(--krds-high-contrast-color-border-gray-light);
    background-color: var(--krds-high-contrast-color-background-white);
  }

  [data-krds-mode="theme"] .my-activity__board-title {
    color: var(--krds-high-contrast-color-text-basic);
  }

  [data-krds-mode="theme"] .my-activity__list-item {
    border-bottom-color: var(--krds-high-contrast-color-border-gray-light);
  }

  [data-krds-mode="theme"] .my-activity__list-text,
  [data-krds-mode="theme"] .my-activity__list-date {
    color: var(--krds-high-contrast-color-text-subtle);
  }

  [data-krds-mode="theme"] .my-activity__alarm-type {
    color: var(--krds-high-contrast-color-text-secondary);
  }
}

/* =============================================================================
   헤더 PC 메인메뉴 펼침 
   ============================================================================= */
/*  1depth(우측 배너: 라이트 블루 카드 + 세로 스택 */
.kosac-header .krds-main-menu .gnb-toggle-wrap .gnb-sub-list.single-list{
  padding: 4rem 0;
}

#krds-header .krds-main-menu .gnb-menu > li .gnb-sub-list.single-list.between .gnb-sub-banner {
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: var(--krds-gap-3);
  min-height: 22rem;
  width: var(--krds-main-menu--main-menu-width);
  flex-shrink: 0;
  box-sizing: border-box;
  background-color: var(--krds-light-color-surface-primary-subtler);
  border: var(--krds-light-border-width-static-regular) solid var(--krds-light-color-border-primary-light);
  border-radius: var(--krds-radius-xlarge2);
}

#krds-header .krds-main-menu .gnb-menu > li .gnb-sub-list.single-list.between .gnb-sub-banner .txt {
  margin: 0.8rem 0 0;
  font-size: var(--krds-pc-font-size-body-small);
  color: var(--krds-light-color-text-subtle);
  line-height: var(--krds-line-height-base);
  max-width: 20rem;
}

#krds-header .krds-main-menu .gnb-menu > li .gnb-sub-list.single-list.between .gnb-sub-banner .txt strong{
  font-size: var(--krds-pc-font-size-body-medium);
}
@media (max-width: 767px) {
  #krds-header .krds-main-menu .gnb-menu > li .gnb-sub-list.single-list.between .gnb-sub-banner .txt {
    font-size: var(--krds-mobile-font-size-body-small);
  }
}

[data-krds-mode="high-contrast"] #krds-header .krds-main-menu .gnb-menu > li .gnb-sub-list.single-list.between .gnb-sub-banner {
  background-color: var(--krds-high-contrast-color-surface-primary-subtler);
  border-color: var(--krds-high-contrast-color-border-primary-light);
}

@media (prefers-color-scheme: dark) {
  [data-krds-mode="theme"] #krds-header .krds-main-menu .gnb-menu > li .gnb-sub-list.single-list.between .gnb-sub-banner {
    background-color: var(--krds-high-contrast-color-surface-primary-subtler);
    border-color: var(--krds-high-contrast-color-border-primary-light);
  }
}

/* PC 헤더*/
@media (min-width: 1024px) {
  /* 로고(좌) + 글자·화면 설정(우) 한 줄, 세로 중앙 정렬 */
  #krds-header.kosac-header .header-container .inner {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--krds-gap-6, 20px);
    padding-top: var(--krds-padding-8, 24px);
    padding-bottom: 3.4rem;
  }
  #krds-header.kosac-header .header-branding {
    flex: 1;
    min-width: 0;
    margin: 0;
  }
  /* PC: 로그인·회원가입·마이페이지·전체메뉴 영역 숨김 */
  #krds-header.kosac-header .header-actions {
    display: none;
  }
  #krds-header.kosac-header .header-utility {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: flex-end;
    margin: 0;
  }
  #krds-header.kosac-header .header-utility .utility-list {
    align-items: center;
    margin: 0;
  }
  #krds-header.kosac-header .header-utility .utility-list > li:not(:first-child)::before {
    display: none;
  }
  /* 로고 사이즈 (Figma 200x40) */
  #krds-header.kosac-header .header-container .logo.sample {
    width: 20rem;
    height: 4rem;
  }
  #krds-header.kosac-header .header-container .logo.sample a {
    background-size: contain;
    background-position: left center;
  }

  /* GNB: 현재 섹션 활성 (Figma selected — 진한 파란 텍스트 + 하단 4px 언더라인) */
  #krds-header.kosac-header .krds-main-menu .gnb-menu .gnb-main-trigger.selected {
    color: var(--krds-light-color-text-secondary, #052b57);
  }
  #krds-header.kosac-header .krds-main-menu .gnb-menu .gnb-main-trigger.selected::before {
    left: 0;
    width: 100%;
    height: 0.4rem;
    background-color: var(--krds-light-color-action-secondary-active, #063a74);
  }
  #krds-header.kosac-header .krds-main-menu .gnb-menu .gnb-main-trigger.selected::after {
    background-color: var(--krds-light-color-text-secondary, #052b57);
  }
}

/* ============================================
   개인정보 관리 - 비밀번호 확인 페이지 (pw-verify-page)
   ============================================ */

.pw-verify-page {
  flex: 1;
  padding-bottom: var(--krds-gap-12);
}

/* 중앙 정렬 콘텐츠 블록 */
.pw-verify-page__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-7);
  width: 100%;
  padding-top: var(--krds-padding-10);
}

/* 일러스트 */
.pw-verify-page__illust {
  width: 18rem;
  height: 12rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.pw-verify-page__illust img {
  width: 18rem;
  height: 16rem;
  object-fit: contain;
}

/* 타이틀 (heading/xlarge) */
.pw-verify-page__title {
  font-size: var(--krds-pc-font-size-heading-xlarge);
  font-weight: var(--krds-font-weight-bold);
  line-height: 1.5;
  letter-spacing: 0.1rem;
  text-align: center;
  color: var(--krds-light-color-text-basic);
  white-space: nowrap;
}

/* "확인" 텍스트 강조 색상 */
.pw-verify-page__title--accent {
  color: var(--krds-light-color-text-primary);
}

/* 설명 텍스트 */
.pw-verify-page__desc {
  font-size: var(--krds-pc-font-size-body-medium);
  line-height: 1.5;
  text-align: center;
  color: var(--krds-light-color-text-basic);
  max-width: 83.2rem;
}

/* 입력 폼 회색 박스 */
.pw-verify-page__form-wrap {
  background-color: var(--krds-light-color-surface-gray-subtler);
  border-radius: var(--krds-radius-xlarge2);
  padding: var(--krds-padding-9) var(--krds-padding-10);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 폼 내부 너비 고정 (PC: 360px) */
.pw-verify-page__form-inner {
  width: 36rem;
}

/* 버튼 그룹 */
.pw-verify-page__btn-wrap {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: var(--krds-gap-3);
  width: 100%;
}

.pw-verify-page__btn {
  min-width: 9.8rem;
  box-sizing: border-box;
}

/* PC 이하 (≤ 1023px) */
@media (max-width: 1023px) {
  #container .in-between .contents.pw-verify-page .krds-breadcrumb-wrap {
    margin-bottom: var(--krds-mobile-gap-layout-breadcrumb-h1);
  }

  .pw-verify-page {
    padding-bottom: var(--krds-mobile-gap-layout-contents-footer);
  }

  .pw-verify-page__content {
    gap: var(--krds-gap-8);
    padding-top: var(--krds-padding-8);
  }

  .pw-verify-page__title {
    font-size: var(--krds-mobile-font-size-heading-xlarge);
  }

  .pw-verify-page__desc {
    font-size: var(--krds-mobile-font-size-body-medium);
    max-width: 100%;
  }

  .pw-verify-page__form-wrap {
    padding: var(--krds-padding-8);
  }

  .pw-verify-page__form-inner {
    width: 100%;
  }

  .pw-verify-page__btn-wrap {
    flex-direction: column;
    gap: var(--krds-gap-5);
  }

  .pw-verify-page__btn {
    width: 100%;
    min-width: 0;
  }
}

/* 모바일 (≤ 767px) */
@media (max-width: 767px) {
  #container .in-between .contents.pw-verify-page {
    padding-right: var(--krds-contents-padding-x);
  }
  .pw-verify-page__illust img {
    width: 12rem;
    height: 12rem;
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .pw-verify-page__form-wrap {
  background-color: var(--krds-high-contrast-color-surface-gray-subtler);
}

[data-krds-mode="high-contrast"] .pw-verify-page__title--accent {
  color: var(--krds-high-contrast-color-text-primary);
}

/* ============================================
   개인정보 관리 편집 페이지 (pi-edit-page)
   ============================================ */

/* 페이지 컨테이너 */
.pi-edit-page {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  width: 100%;
  padding-bottom: var(--krds-pc-gap-layout-contents-footer);
}

/* 폼 전체 래퍼 */
.pi-edit-form {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-10);
  width: 100%;
}

/* 카드 섹션 목록 (24px 간격) */
.pi-edit-form__sections {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-10);
  width: 100%;
}

/* 각 카드 내부 필드 목록 (40px 간격) */
.pi-fields {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-11);
  width: 100%;
}

/* 개별 필드 (라벨 + 콘텐츠, 24px 간격) */
.pi-field {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7);
  width: 100%;
}


.pi-field__label {
  font-size: var(--krds-pc-font-size-heading-xsmall);
  font-weight: var(--krds-font-weight-bold);
  line-height: 1.5;
  color: var(--krds-light-color-text-bolder);
  margin: 0;
}


.pi-field__value {
  font-size: var(--krds-pc-font-size-body-medium);
  font-weight: var(--krds-font-weight-regular);
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle);
  margin: 0;
}

/* 버튼 단독 배치 (비밀번호 변경 등) */
.pi-field__action {
  display: flex;
  align-items: center;
}

/* 전화번호 + 재인증 버튼 행 */
.pi-field__phone-row {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  gap: var(--krds-gap-5);
  flex-wrap: nowrap;
}

.pi-field__phone-input {
  width: 36rem;
  flex-shrink: 0;
}

/* SNS 연동 박스 목록 (2열 flex) */
.pi-sns-list {
  display: flex;
  flex-direction: row;
  gap: var(--krds-gap-5);
  width: 100%;
}

/* 개별 SNS 박스 */
.pi-sns-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--krds-gap-3);
  flex: 1 1 0;
  padding: var(--krds-padding-3) var(--krds-padding-5);
  border: 1px solid var(--krds-light-color-border-gray);
  border-radius: var(--krds-radius-xlarge2);
  background-color: var(--krds-light-color-surface-white-subtle);
  box-sizing: border-box;
  min-width: 0;
}

/* SNS 아이콘 공통 */
.pi-sns-box__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.4rem;
  height: 2.4rem;
  flex-shrink: 0;
}

/* 네이버 아이콘 (CSS로 구현) */
.pi-sns-box__icon--naver {
  background-color: #03c75a;
  border-radius: 0.4rem;
  color: #fff;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1;
}

/* SNS 서비스명 */
.pi-sns-box__name {
  flex: 1 1 0;
  min-width: 0;
  font-size: var(--krds-pc-font-size-body-large);
  line-height: 1.5;
  color: var(--krds-light-color-text-basic);
}

/* SNS 연동 버튼 */
.pi-sns-box__btn {
  flex-shrink: 0;
}

/* 관심 분야 헤더 (타이틀 + 설명) */
.pi-interest-header {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-2);
  width: 100%;
}

.pi-interest-header__desc {
  font-size: var(--krds-pc-font-size-body-medium);
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle);
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 관심 분야 체크박스 목록 (2열, 24px 간격) */
.pi-interest-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-10);
  align-items: flex-start;
}

.pi-interest-item {
  width: calc(50% - var(--krds-gap-10) / 2);
  box-sizing: border-box;
}

/* 버튼 그룹 (취소하기: 왼쪽 / 저장하기: 오른쪽) */
.pi-edit-form__actions {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: var(--krds-gap-3);
  width: 100%;
}

.pi-edit-form__btn {
  min-width: 9.8rem;
  box-sizing: border-box;
}

/* ---- 모바일 (≤ 1023px) ---- */
@media (max-width: 1023px) {
  #container .in-between .contents.pi-edit-page .krds-breadcrumb-wrap {
    margin-bottom: var(--krds-mobile-gap-layout-breadcrumb-h1);
  }

  .pi-edit-page {
    padding-bottom: var(--krds-mobile-gap-layout-contents-footer);
  }

  .pi-field__label {
    font-size: var(--krds-mobile-font-size-heading-xsmall);
  }

  .pi-field__value {
    font-size: var(--krds-mobile-font-size-body-medium);
  }

  /* SNS 박스: 세로 배치 */
  .pi-sns-list {
    flex-direction: column;
  }

  .pi-sns-box__name {
    font-size: var(--krds-mobile-font-size-body-large);
  }

  /* 전화번호 입력: 전체 너비 */
  .pi-field__phone-row {
    flex-wrap: wrap;
    align-items: stretch;
  }

  .pi-field__phone-input {
    width: 100%;
    flex: 1 1 auto;
  }

  /* 관심 분야: 1열 */
  .pi-interest-list {
    gap: var(--krds-gap-7);
  }

  .pi-interest-item {
    width: 100%;
  }

  .pi-interest-header__desc {
    white-space: normal;
  }

  /* 버튼 그룹: 세로 배치, 전체 너비 */
  .pi-edit-form__actions {
    flex-direction: column-reverse;
    align-items: stretch;
    gap: var(--krds-gap-5);
  }

  .pi-edit-form__btn {
    width: 100%;
    min-width: 0;
  }
}

/* 모바일 소형 (≤ 767px) */
@media (max-width: 767px) {
  #container .in-between .contents.pi-edit-page {
    padding-right: var(--krds-contents-padding-x);
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .pi-sns-box {
  border-color: var(--krds-high-contrast-color-border-gray);
  background-color: var(--krds-high-contrast-color-surface-white-subtle);
}

[data-krds-mode="high-contrast"] .pi-field__label {
  color: var(--krds-high-contrast-color-text-bolder);
}

[data-krds-mode="high-contrast"] .pi-field__value {
  color: var(--krds-high-contrast-color-text-subtle);
}

/* ============================================
   관심 리스트 페이지 
   ============================================ */

/* 페이지 컨테이너 */
.wishlist-page {
  display: flex;
  flex-direction: column;
  width: 100%;
}

/* 콘텐츠 래퍼 */
.wishlist-content {
  display: flex;
  flex-direction: column;
  width: 100%;
}

/* 탭 카운트 숫자 */
.wishlist-tab-count {
  font-size: var(--krds-pc-font-size-label-large);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-subtle);
  margin-left: 0.4rem;
}

/* 활성 탭의 카운트 강조 */
.active .wishlist-tab-count {
  color: var(--krds-light-color-text-secondary);
}

/* 검색결과 + 정렬 툴바 */
.wishlist-toolbar {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.wishlist-toolbar__count {
  font-size: var(--krds-pc-font-size-body-medium);
  line-height: var(--krds-line-height-body);
  color: var(--krds-light-color-text-basic);
  margin: 0;
}

.wishlist-toolbar__count strong {
  font-weight: var(--krds-font-weight-bold);
}

.wishlist-toolbar__sort {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1.2rem;
}

.wishlist-toolbar__sort-label {
  font-size: var(--krds-pc-font-size-body-medium);
  line-height: var(--krds-line-height-body);
  color: var(--krds-light-color-text-basic);
}

/* 정렬 select: 텍스트처럼 보이되 동작하는 드롭다운 */
.wishlist-toolbar__select {
  appearance: none;
  -webkit-appearance: none;
  border: none;
  background: transparent;
  font-size: var(--krds-pc-font-size-body-medium);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-secondary);
  cursor: pointer;
  padding: 0;
}

.wishlist-toolbar__select:focus {
  outline: var(--krds-box-shadow-outline);
  outline-offset: 0.2rem;
  border-radius: 0.2rem;
}

/* 카드 리스트: 툴바 아래 24px, PC 3열 gap 24px */
.wishlist-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.4rem;
  list-style: none;
  padding: 0;
  margin: 0;
  margin-top: 2.4rem;
  width: 100%;
}

/* 개별 카드 */
.wishlist-card {
  display: flex;
  flex-direction: column;
  border-radius: var(--krds-radius-large1);
  overflow: hidden;
  border: 1px solid var(--krds-light-color-border-gray-light);
  background-color: var(--krds-light-color-surface-white-subtle);
  transition: box-shadow var(--krds-transition-base);
}

.wishlist-card:hover {
  box-shadow: var(--krds-box-shadow-medium);
}

.wishlist-card__link {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  height: 100%;
}

/* 카드 썸네일 (PC 288×161, 비율 고정) */
.wishlist-card__thumb {
  width: 100%;
  aspect-ratio: 288 / 161;
  overflow: hidden;
  background-color: var(--krds-light-color-surface-gray-subtler);
  flex-shrink: 0;
}

.wishlist-card__thumb.end_thumb {
  position: relative;
}
.wishlist-card__thumb.end_thumb::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  content: '';
  z-index: 1;
}

.wishlist-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 카드 본문 (padding 32px, 요소 간 gap 12px) */
.wishlist-card__body {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  padding: 3.2rem;
  flex: 1;
}

/* 카드 타이틀 (1줄 말줄임) */
.wishlist-card__title {
  font-size: var(--krds-pc-font-size-body-large);
  font-weight: var(--krds-font-weight-bold);
  line-height: var(--krds-line-height-heading);
  color: var(--krds-light-color-text-basic);
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 카드 기간 ("기간" 레이블 + 날짜) */
.wishlist-card__period {
  display: flex;
  align-items: baseline;
  gap: 0.8rem;
  font-size: var(--krds-pc-font-size-body-medium);
  line-height: var(--krds-line-height-body);
  color: var(--krds-light-color-text-subtle);
  margin: 0;
}

.wishlist-card__period-key {
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic);
  flex-shrink: 0;
}

.wishlist-card__period-date{
  white-space: nowrap;
}

/* 카드 설명 텍스트형 (기간 없는 카드) */
.wishlist-card__desc {
  font-size: var(--krds-pc-font-size-body-medium);
  line-height: var(--krds-line-height-body);
  color: var(--krds-light-color-text-subtle);
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 페이지네이션: 카드 아래 40px, 가운데 정렬 */
.wishlist-content__pagination {
  margin-top: 4rem;
  display: flex;
  justify-content: center;
}

/* ---- 모바일 (≤ 1023px) ---- */
@media (max-width: 1023px) {
  .wishlist-tab-count {
    font-size: var(--krds-mobile-font-size-label-medium);
  }

  /* 모바일: 정렬 전체 숨김 */
  .wishlist-toolbar__sort {
    display: none;
  }

  .wishlist-toolbar__count {
    font-size: var(--krds-mobile-font-size-body-large);
  }

  /* 카드 리스트: 1열, gap 16px */
  .wishlist-cards {
    grid-template-columns: 1fr;
    gap: 1.6rem;
    margin-top: 1.6rem;
  }

  /* 카드 썸네일 (모바일 328×183) */
  .wishlist-card__thumb {
    aspect-ratio: 328 / 183;
  }

  /* 카드 본문 패딩 축소 */
  .wishlist-card__body {
    padding: 2.4rem;
  }

  .wishlist-card__title {
    font-size: var(--krds-mobile-font-size-body-large);
  }

  .wishlist-card__period,
  .wishlist-card__desc {
    font-size: var(--krds-mobile-font-size-body-medium);
  }

  .wishlist-content__pagination {
    margin-top: 3.2rem;
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .wishlist-card {
  border-color: var(--krds-high-contrast-color-border-gray);
  background-color: var(--krds-high-contrast-color-surface-default);
}

[data-krds-mode="high-contrast"] .wishlist-card__title {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .wishlist-card__period,
[data-krds-mode="high-contrast"] .wishlist-card__desc {
  color: var(--krds-high-contrast-color-text-subtle);
}

[data-krds-mode="high-contrast"] .wishlist-toolbar__count,
[data-krds-mode="high-contrast"] .wishlist-toolbar__sort-label {
  color: var(--krds-high-contrast-color-text-basic);
}


/* ============================================
   1:1 문의 페이지 
   ============================================ */

/* 탭 카운트 숫자 */
.inquiry-tab-count {
  font-size: inherit;
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-subtle);
  margin-left: 0.4rem;
}

/* 목록 외감: 상단 2px 구분선 */
.inquiry-list-wrap {
  /* border-top: 2px solid var(--krds-light-color-element-secondary); */
  border-top: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-border-secondary-light);
}

/* PC 헤더 행 */
.inquiry-list__head {
  display: flex;
  align-items: center;
  min-height: 5.5rem;
  background-color: var(--krds-light-color-surface-secondary-subtler);
  border-bottom: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-border-secondary-light);
}

/* 목록 초기화 */
.inquiry-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* 각 행 */
.inquiry-list__item {
  display: flex;
  align-items: center;
  min-height: 5.8rem;
  border-bottom: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-divider-gray-light);
}

.inquiry-badges {
  display: contents;
}

/* ─ 공통 셀 ─ */
.inquiry-col {
  padding: var(--krds-padding-5) var(--krds-padding-6);
  font-size: var(--krds-pc-font-size-label-medium);
  color: var(--krds-light-color-text-subtle);
  font-weight: var(--krds-font-weight-regular);
  line-height: 1.5;
}
.inquiry-list__head .inquiry-col {
  padding: var(--krds-padding-3) var(--krds-padding-6);
  font-size: var(--krds-pc-font-size-heading-xxsmall);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-bolder);
}

/* ─ 열 너비 & 순서 ─ */
.inquiry-col--no     { flex: 0 0 8rem;    order: 1; text-align: center; }
.inquiry-col--type   { flex: 0 0 11rem;   order: 2; text-align: center; white-space: nowrap; }
.inquiry-col--title  { flex: 1;           order: 3; min-width: 0; }
.inquiry-col--date   { flex: 0 0 12.1rem; order: 4; text-align: center; white-space: nowrap; }
.inquiry-col--status { flex: 0 0 11rem;   order: 5; display: flex; align-items: center; justify-content: center; }

/* 제목 링크 */
a.inquiry-col--title {
  text-decoration: none;
  display: block;
}
a.inquiry-col--title:hover,
a.inquiry-col--title:focus-visible {
  color: var(--krds-light-color-text-primary);
  text-decoration: underline;
}


/* 답변완료: secondary-lighter (#eef2f7, navy 텍스트) */
.inquiry-col--status .krds-badge.bg-secondary {
  background-color: var(--krds-badge--color-secondary-element-lighter);
  color: var(--krds-badge--color-secondary-text);
}
/* 답변대기: primary-lighter (#ecf2fe, blue 텍스트) */
.inquiry-col--status .krds-badge.bg-gray {
  background-color: var(--krds-badge--color-primary-element-lighter);
  color: var(--krds-badge--color-primary-text);
}

/* 페이지네이션 */
.inquiry-pagination {
  margin-top: 4rem;
  justify-content: center;
}

/* 문의 작성하기 버튼 */
.inquiry-btn-group {
  display: flex;
  justify-content: flex-end;
  margin-top: 4rem;
}

/* ═══════════════════════════════
   모바일 반응형 (≤1023px) – 카드 레이아웃
   ═══════════════════════════════ */
@media (max-width: 1023px) {
  /* PC 헤더 숨김 */
  .inquiry-list__head {
    display: none;
  }

  .inquiry-list__item {
    flex-direction: column;
    align-items: flex-start;
    min-height: 0;
    padding: 1.6rem 0.8rem;
    gap: 0.4rem;  /* 제목↔날짜 기본 간격: 4px */
  }

  /* 번호 숨김 */
  .inquiry-col--no {
    display: none !important;
  }

  /*
   * .inquiry-badges → 실제 flex 컨테이너로 전환
   */
  .inquiry-badges {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    order: 1;
    margin-bottom: 0.4rem;
  }

  /* 답변상태: light 배지 색상으로 오버라이드 */
  .inquiry-col--status {
    flex: none;
    order: unset;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0;
    min-height: 0;
  }
  /* 답변완료: secondary-lighter (#eef2f7, navy 텍스트) */
  .inquiry-col--status .krds-badge.bg-secondary {
    background-color: var(--krds-badge--color-secondary-element-lighter);
    color: var(--krds-badge--color-secondary-text);
  }
  /* 답변대기: primary-lighter (#ecf2fe, blue 텍스트) */
  .inquiry-col--status .krds-badge.bg-gray {
    background-color: var(--krds-badge--color-primary-element-lighter);
    color: var(--krds-badge--color-primary-text);
  }

  /* 분류: outline-gray 배지 스타일 */
  .inquiry-col--type {
    flex: none;
    order: unset;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: var(--krds-size-height-5);
    padding: 0 var(--krds-padding-3);
    border: 1px solid var(--krds-light-color-text-subtle);
    border-radius: var(--krds-radius-small2);
    font-size: var(--krds-mobile-font-size-label-medium);
    color: var(--krds-light-color-text-subtle);
    font-weight: var(--krds-font-weight-regular);
    text-align: center;
    white-space: nowrap;
    line-height: 1;
  }

  

  /* 제목 */
  a.inquiry-col--title {
    order: 2;
    width: 100%;
    padding: 0;
    font-size: var(--krds-mobile-font-size-label-medium);
    color: var(--krds-light-color-text-subtle);
    font-weight: var(--krds-font-weight-regular);
    text-decoration: none;
    line-height: 1.5;
  }

  /* 등록일 */
  .inquiry-col--date {
    order: 3;
    flex: none;
    width: 100%;
    padding: 0;
    text-align: left;
    font-size: var(--krds-mobile-font-size-label-medium);
    color: var(--krds-light-color-text-subtle);
    white-space: nowrap;
  }

  .inquiry-pagination {
    margin-top: 3.2rem;
  }

  .inquiry-btn-group {
    margin-top: 3.2rem;
    justify-content: center;
  }
  .inquiry-btn-group .krds-btn {
    width: 100%;
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .inquiry-list-wrap {
  border-top-color: var(--krds-high-contrast-color-element-secondary);
}
[data-krds-mode="high-contrast"] .inquiry-list__head {
  background-color: var(--krds-high-contrast-color-surface-secondary-subtler);
  border-bottom-color: var(--krds-high-contrast-color-border-secondary-light);
}
[data-krds-mode="high-contrast"] .inquiry-list__item {
  border-bottom-color: var(--krds-high-contrast-color-divider-gray-light);
}
[data-krds-mode="high-contrast"] .inquiry-col {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .inquiry-list__head .inquiry-col {
  color: var(--krds-high-contrast-color-text-bolder);
}
[data-krds-mode="high-contrast"] a.inquiry-col--title:hover {
  color: var(--krds-high-contrast-color-text-primary);
}
[data-krds-mode="high-contrast"] .inquiry-tab-count {
  color: var(--krds-high-contrast-color-text-primary);
}

/* ============================================
   1:1 문의 상세 페이지 (inquiry-detail-page)
   ============================================
   [PC]  제목 / 내용(이미지+본문) / 답변(이미지+본문) / 버튼그룹
         버튼: [삭제하기(left)] ··· [목록(primary,right)]
   [MO]  버튼: [목록(full-width)] / [삭제하기(full-width)]
   ============================================ */

.inquiry-detail-wrap {
  display: flex;
  flex-direction: column;
  gap: 4rem;
  margin-top: 4.8rem;
}

/* ─ 문의 제목 + 메타 영역 ─ */
.inquiry-detail__head {
  border-top: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-divider-gray);
  border-bottom: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-divider-gray);
  padding: var(--krds-padding-8) 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5);
}

.inquiry-detail__title {
  font-size: var(--krds-pc-font-size-heading-large);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-bolder);
  line-height: 1.5;
  letter-spacing: 0.1rem;
}

/* ─ 메타 정보 (배지 | 분류 | 날짜) ─ */
.inquiry-detail__meta,
.inquiry-detail__reply-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.8rem;
}

/* 답변완료 배지: secondary-lighter 색상 */
.inquiry-detail__status-badge {
  background-color: var(--krds-badge--color-secondary-element-lighter);
  color: var(--krds-badge--color-secondary-text);
}

/* 세로 구분선 */
.inquiry-detail__vt-divider {
  display: inline-block;
  width: 1px;
  height: 1.6rem;
  background-color: var(--krds-light-color-divider-gray-light);
  flex-shrink: 0;
}

.inquiry-detail__meta-text,
.inquiry-detail__meta-date {
  font-size: var(--krds-pc-font-size-body-medium);
  color: var(--krds-light-color-text-subtle);
  font-weight: var(--krds-font-weight-regular);
  line-height: 1.5;
  white-space: nowrap;
}

/* ─ 문의 내용 (이미지 + 본문) ─ */
.inquiry-detail__content {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}

/* 이미지 샘플 placeholder */
.inquiry-detail__img-placeholder {
  width: 100%;
  height: 24rem;
  background-color: var(--krds-light-color-background-gray-subtle, #e6e8ea);
  border-radius: var(--krds-radius-small2);
}

/* 본문 텍스트 */
.inquiry-detail__text {
  font-size: var(--krds-pc-font-size-body-medium);
  color: var(--krds-light-color-text-subtle);
  font-weight: var(--krds-font-weight-regular);
  line-height: 1.5;
}

/* ─ 문의 답변 영역 ─ */
.inquiry-detail__reply {
  border-top: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-divider-gray);
  border-bottom: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-divider-gray);
  padding: var(--krds-padding-8) 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5);
}

.inquiry-detail__reply-title {
  font-size: var(--krds-pc-font-size-heading-medium);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-bolder);
  line-height: 1.5;
}

/* 답변 이미지+본문 (하단 40px 여백 포함) */
.inquiry-detail__reply-content {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  padding-bottom: 4rem;
}

/* ─ 버튼 그룹 ─ */
.inquiry-detail__btn-group {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

/* 삭제하기 컨테이너: 왼쪽으로 밀어냄 */
.inquiry-detail__btn-left {
  flex: 1 0 0;
}

/* ═══════════════════════════════
   모바일 반응형 (≤1023px)
   ═══════════════════════════════ */
@media (max-width: 1023px) {
  .inquiry-detail-wrap {
    gap: 3.2rem;
    margin-top: 3.2rem;
  }

  .inquiry-detail__title {
    font-size: var(--krds-mobile-font-size-heading-medium);
    letter-spacing: 0;
  }

  /* 날짜: 줄 바꿈 (배지+분류 행 아래로) */
  .inquiry-detail__vt-divider--hide-mo {
    display: none;
  }
  .inquiry-detail__meta > .inquiry-detail__meta-date {
    flex-basis: 100%;
  }

  .inquiry-detail__reply-title {
    font-size: var(--krds-mobile-font-size-heading-medium);
  }

  /* 이미지 placeholder 높이 조정 */
  .inquiry-detail__img-placeholder {
    height: 20rem;
  }

  /* 답변 내용 하단 여백 제거 */
  .inquiry-detail__reply-content {
    padding-bottom: 0;
  }

  /* 버튼: 세로 스택 — 목록 위, 삭제하기 아래 */
  .inquiry-detail__btn-group {
    flex-direction: column;
    gap: 1.6rem;
  }
  .inquiry-detail__btn-group > .krds-btn {
    order: 1;
    width: 100%;
  }
  .inquiry-detail__btn-left {
    order: 2;
    width: 100%;
    flex: none;
  }
  .inquiry-detail__btn-left .krds-btn {
    width: 100%;
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .inquiry-detail__title,
[data-krds-mode="high-contrast"] .inquiry-detail__reply-title {
  color: var(--krds-high-contrast-color-text-bolder);
}
[data-krds-mode="high-contrast"] .inquiry-detail__meta-text,
[data-krds-mode="high-contrast"] .inquiry-detail__meta-date,
[data-krds-mode="high-contrast"] .inquiry-detail__text {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .inquiry-detail__head,
[data-krds-mode="high-contrast"] .inquiry-detail__reply {
  border-color: var(--krds-high-contrast-color-divider-gray);
}
[data-krds-mode="high-contrast"] .inquiry-detail__vt-divider {
  background-color: var(--krds-high-contrast-color-divider-gray-light);
}

/* ============================================
   맞춤 알람 센터 (alarm-center)
   ============================================

/* ─ 안내 문구 ─ */
.alarm-center__desc {
  font-size: var(--krds-pc-font-size-body-large, 1.9rem);
  color: var(--krds-light-color-text-basic);
  font-weight: var(--krds-font-weight-regular);
  line-height: 1.5;
  margin-top: 1.6rem;
}

/* ─ 알림 목록 ─ */
.alarm-list {
  margin: 4.8rem 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}

/* ─ 알림 카드 (링크 전체) ─ */
.alarm-item__link {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  padding: 1.6rem 2.4rem;
  border: var(--krds-light-border-width-variable-regular, 1px) solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-medium4, 0.8rem);
  background-color: var(--krds-light-color-background-white, #fff);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s;
}

.alarm-item__link:hover,
.alarm-item__link:focus-visible {
  border-color: var(--krds-light-color-border-primary, #2860e1);
  outline-offset: 0;
}

/* ─ 알림 유형별 아이콘 원형 ─ */
.alarm-item__icon {
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
}

.alarm-item__icon--badge    { background-color: var(--krds-light-color-surface-primary-subtler, #ecf2fe); }
.alarm-item__icon--qa       { background-color: var(--krds-light-color-surface-success-subtler, #eaf6ec); }
.alarm-item__icon--emergency { background-color: var(--krds-light-color-surface-point-subtler, #fbeff0); }
.alarm-item__icon--learning  { background-color: var(--krds-light-color-surface-secondary-subtler, #eef2f7); }
.alarm-item__icon--notice    { background-color: var(--krds-light-color-surface-secondary-subtler, #eef2f7); }

.alarm-item__icon img {
  width: 4rem;
  height: 4rem;
  object-fit: contain;
}

/* ─ 알림 본문 ─ */
.alarm-item__body {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

/* 유형 + 시간 행 */
.alarm-item__header {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  flex-shrink: 0;
}

.alarm-item__type {
  font-size: var(--krds-pc-font-size-body-large, 1.9rem);
  color: var(--krds-light-color-text-secondary, #063a74);
  font-weight: var(--krds-font-weight-regular);
  line-height: 1.5;
  white-space: nowrap;
}

.alarm-item__time {
  font-size: var(--krds-pc-font-size-label-medium, 1.7rem);
  color: var(--krds-light-color-text-subtle, #464c53);
  font-weight: var(--krds-font-weight-regular);
  line-height: 1.5;
  white-space: nowrap;
}

/* 메시지 텍스트 (PC: 한 줄 말줄임) */
.alarm-item__msg {
  display: block;
  font-size: var(--krds-pc-font-size-body-large, 1.9rem);
  color: var(--krds-light-color-text-subtle, #464c53);
  font-weight: var(--krds-font-weight-regular);
  line-height: 1.5;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* ═══════════════════════════════
   모바일 반응형 (≤1023px)
   ═══════════════════════════════ */
@media (max-width: 1023px) {
  .alarm-center__desc {
    font-size: var(--krds-mobile-font-size-body-medium, 1.6rem);
    margin-top: 1.2rem;
  }

  .alarm-list {
    margin-top: 3.2rem;
    gap: 1.6rem;
  }

  .alarm-item__link {
    padding: 1.6rem;
    gap: 1.2rem;
  }

  /* 모바일: 메시지 줄바꿈 허용 */
  .alarm-item__msg {
    white-space: normal;
    font-size: var(--krds-mobile-font-size-body-medium, 1.6rem);
    overflow: visible;
    text-overflow: clip;
  }

  .alarm-item__type {
    font-size: var(--krds-mobile-font-size-body-medium, 1.6rem);
  }

  .alarm-item__time {
    font-size: var(--krds-mobile-font-size-label-medium, 1.5rem);
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .alarm-item__type {
  color: var(--krds-high-contrast-color-text-secondary, #063a74);
}
[data-krds-mode="high-contrast"] .alarm-item__time,
[data-krds-mode="high-contrast"] .alarm-item__msg {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .alarm-item__link {
  border-color: var(--krds-high-contrast-color-border-gray-light);
  background-color: var(--krds-high-contrast-color-background-white);
}
[data-krds-mode="high-contrast"] .alarm-center__desc {
  color: var(--krds-high-contrast-color-text-basic);
}


/* ============================================
   AI 교육소식 페이지 & 문의/제안/신고 내역 페이지
   ============================================ */
.search-top-box .sch-filter-box .filter-form{
flex-wrap: nowrap;
}
.search-top-box .sch-filter-box .filter-form > div.ai-news-keyword-group{
  max-width: fit-content;
}
.ai-news-search-mo, .inquiry-search-mo{
  display: none;
}

/* PC 테이블 래퍼 */
.ai-news-table-wrap, .inquiry-table-wrap {
  margin-top: 0;
}

/* 모바일 목록 - PC에서 숨김 */
.ai-news-list-mo, .inquiry-list-mo {
  display: none;
  list-style: none;
  margin: 0;
  padding: 0;
}

.krds-table-wrap .tbl.data tbody td.notice-item, .krds-table-wrap .notice-item span, .krds-table-wrap .notice-item a{
  font-weight: var(--krds-font-weight-bold);
}

.krds-table-wrap table a:hover, .krds-table-wrap table a:focus-visible {
  color: var(--krds-light-color-text-primary);
  text-decoration: underline;
}

/* 모바일 목록 아이템 */
.ai-news-list-mo__item, .inquiry-list-mo__item {
  border-bottom: 1px solid var(--krds-light-color-divider-gray-light, #d9dde2);
}
.ai-news-list-mo__item:first-child, .inquiry-list-mo__item:first-child {
  border-top: 1px solid var(--krds-light-color-divider-gray-light, #d9dde2);
}
.ai-news-list-mo__link, .inquiry-list-mo__link {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 16px 0;
  text-decoration: none;
  color: var(--krds-light-color-text-basic, #1a1f27);
}
.ai-news-list-mo__link:hover .ai-news-list-mo__title, .inquiry-list-mo__link:hover .inquiry-list-mo__title,
.ai-news-list-mo__link:focus-visible .ai-news-list-mo__title, .inquiry-list-mo__link:focus-visible .inquiry-list-mo__title {
  text-decoration: underline;
  color: var(--krds-light-color-text-primary, #0054b4);
}
.ai-news-list-mo__title-row, .inquiry-list-mo__title-row {
  display: flex;
  align-items: flex-start;
  gap: 6px;
}
.ai-news-list-mo__title-row .svg-icon, .inquiry-list-mo__title-row .svg-icon {
  flex-shrink: 0;
  margin-top: 2px;
  color: var(--krds-light-color-text-danger, #c0392b);
}
.ai-news-list-mo__title, .inquiry-list-mo__title {
  font-size: var(--krds-mobile-font-size-body-medium, 1.6rem);
  font-weight: var(--krds-font-weight-regular, 400);
  line-height: 1.5;
  word-break: break-word;
}
.ai-news-list-mo__date, .inquiry-list-mo__date {
  font-size: var(--krds-mobile-font-size-label-small, 1.4rem);
  color: var(--krds-light-color-text-subtle, #5c6370);
}

/* 반응형: 모바일 (≤767px) */
@media (max-width: 767px) {
  /* 모바일 검색 표시 */
  .ai-news-search-mo, .inquiry-search-mo {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 16px;
  }
  .ai-news-list-mo__item.notice-item, .inquiry-list-mo__item.notice-item{
    font-weight: var(--krds-font-weight-bold);
  }
  .ai-news-search-mo .krds-form-select, .inquiry-search-mo .krds-form-select {
    width: 100%;
  }
  .ai-news-search-mo .sch-input, .inquiry-search-mo .sch-input {
    display: flex;
    width: 100%;
  }
  .ai-news-search-mo .sch-input .krds-input, .inquiry-search-mo .sch-input .krds-input {
    flex: 1;
  }

  /* PC 테이블 숨김 */
  .ai-news-table-wrap, .inquiry-table-wrap {
    display: none;
  }

  /* 모바일 목록 표시 */
  .ai-news-list-mo, .inquiry-list-mo {
    display: block;
  }
  .inquiry-list-mo__item .krds-badge {
    margin-top: 1.6rem;
  }
}

/* 고대비 모드 - 모바일 목록 */
[data-krds-mode="high-contrast"] .ai-news-list-mo__link, [data-krds-mode="high-contrast"] .inquiry-list-mo__link {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .ai-news-list-mo__item, [data-krds-mode="high-contrast"] .inquiry-list-mo__item {
  border-color: var(--krds-high-contrast-color-divider-gray-light);
}
[data-krds-mode="high-contrast"] .ai-news-list-mo__date, [data-krds-mode="high-contrast"] .inquiry-list-mo__date {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .ai-news-list-mo__title-row .svg-icon, [data-krds-mode="high-contrast"] .inquiry-list-mo__title-row .svg-icon {
  color: var(--krds-high-contrast-color-text-danger);
}

/* 목록 외감: 상단 2px 구분선 */
.ai-news-list-wrap {
  /* border-top: 2px solid var(--krds-light-color-element-secondary); */
  border-top: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-border-secondary-light);
}

/* PC 헤더 행 */
.ai-news-list__head {
  display: flex;
  align-items: center;
  min-height: 5.5rem;
  background-color: var(--krds-light-color-surface-secondary-subtler);
  border-bottom: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-border-secondary-light);
}

/* 목록 초기화 */
.ai-news-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* 각 행 */
.ai-news-list__item {
  display: flex;
  align-items: center;
  min-height: 5.8rem;
  border-bottom: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-divider-gray-light);
}
.notice-item .svg-icon.ico-sound{
  background-image: url(../../img/kosac/icon_notice.svg);
}
.notice-item a, .notice-item span{
  font-weight: var(--krds-font-weight-bold);
}
.ai-news-badges {
  display: contents;
}

/* ─ 공통 셀 ─ */
.ai-news-col {
  padding: var(--krds-padding-5) var(--krds-padding-6);
  font-size: var(--krds-pc-font-size-label-medium);
  color: var(--krds-light-color-text-subtle);
  font-weight: var(--krds-font-weight-regular);
  line-height: 1.5;
}
.ai-news-list__head .ai-news-col {
  padding: var(--krds-padding-3) var(--krds-padding-6);
  font-size: var(--krds-pc-font-size-heading-xxsmall);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-bolder);
  text-align: center;
}

/* ─ 열 너비 & 순서 ─ */
.ai-news-col--no     { flex: 0 0 5rem;    order: 1; text-align: center; }
.ai-news-col--type   { flex: 0 0 11rem;   order: 2; text-align: center; white-space: nowrap; }
.ai-news-col--title  { flex: 1;           order: 3; min-width: 0; }
.ai-news-col--date   { flex: 0 0 12.1rem; order: 4; text-align: center; white-space: nowrap; }
.ai-news-col--writer { flex: 0 0 7rem;   order: 6; display: flex; align-items: center; justify-content: center; }
.ai-news-col--view-count { flex: 0 0 5em;   order: 7; display: flex; align-items: center; justify-content: center; }

/* 제목 링크 */
a.ai-news-col--title {
  text-decoration: none;
  display: block;
}
a.ai-news-col--title:hover,
a.ai-news-col--title:focus-visible {
  color: var(--krds-light-color-text-primary);
  text-decoration: underline;
}


/* 답변완료: secondary-lighter (#eef2f7, navy 텍스트) */
.ai-news-col--status .krds-badge.bg-secondary {
  background-color: var(--krds-badge--color-secondary-element-lighter);
  color: var(--krds-badge--color-secondary-text);
}
/* 답변대기: primary-lighter (#ecf2fe, blue 텍스트) */
.ai-news-col--status .krds-badge.bg-gray {
  background-color: var(--krds-badge--color-primary-element-lighter);
  color: var(--krds-badge--color-primary-text);
}

/* 페이지네이션 */
.ai-news-pagination {
  margin-top: 4rem;
  justify-content: center;
}

/* 작성하기 버튼 */
.ai-news-btn-group {
  display: flex;
  justify-content: flex-end;
  margin-top: 4rem;
}

/* ═══════════════════════════════
   모바일 반응형 (≤1023px) – 카드 레이아웃
   ═══════════════════════════════ */
@media (max-width: 1023px) {
  /* PC 헤더 숨김 */
  .ai-news-list__head {
    display: none;
  }

  .ai-news-search-mo{
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
  }

  .ai-news-list__item {
    flex-direction: column;
    align-items: flex-start;
    min-height: 0;
    padding: 1.6rem 0.8rem;
    gap: 0.4rem;  /* 제목↔날짜 기본 간격: 4px */
  }

  /* 번호, 작성자, 조회수 숨김 */
  .ai-news-col--no, .ai-news-col--writer, .ai-news-col--view-count {
    display: none !important;
  }

  /*
   * .inquiry-badges → 실제 flex 컨테이너로 전환
   */
  .ai-news-badges {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    order: 1;
    margin-bottom: 0.4rem;
  }

  /* 답변상태: light 배지 색상으로 오버라이드 */
  .ai-news-col--status {
    flex: none;
    order: unset;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0;
    min-height: 0;
  }
  /* 답변완료: secondary-lighter (#eef2f7, navy 텍스트) */
  .ai-news-col--status .krds-badge.bg-secondary {
    background-color: var(--krds-badge--color-secondary-element-lighter);
    color: var(--krds-badge--color-secondary-text);
  }
  /* 답변대기: primary-lighter (#ecf2fe, blue 텍스트) */
  .ai-news-col--status .krds-badge.bg-gray {
    background-color: var(--krds-badge--color-primary-element-lighter);
    color: var(--krds-badge--color-primary-text);
  }

  /* 분류: outline-gray 배지 스타일 */
  .ai-news-col--type {
    flex: none;
    order: unset;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: var(--krds-size-height-5);
    padding: 0 var(--krds-padding-3);
    border: 1px solid var(--krds-light-color-text-subtle);
    border-radius: var(--krds-radius-small2);
    font-size: var(--krds-mobile-font-size-label-medium);
    color: var(--krds-light-color-text-subtle);
    font-weight: var(--krds-font-weight-regular);
    text-align: center;
    white-space: nowrap;
    line-height: 1;
  }

  

  /* 제목 */
  a.ai-news-col--title {
    order: 2;
    width: 100%;
    padding: 0;
    font-size: var(--krds-mobile-font-size-label-medium);
    color: var(--krds-light-color-text-subtle);
    font-weight: var(--krds-font-weight-regular);
    text-decoration: none;
    line-height: 1.5;
  }
  .notice-item a.ai-news-col--title {
    font-weight: var(--krds-font-weight-bold);
  }

  /* 등록일 */
  .ai-news-col--date {
    order: 3;
    flex: none;
    width: 100%;
    padding: 0;
    text-align: left;
    font-size: var(--krds-mobile-font-size-label-medium);
    color: var(--krds-light-color-text-subtle);
    white-space: nowrap;
  }

  .ai-news-pagination {
    margin-top: 3.2rem;
  }

  .ai-news-btn-group {
    margin-top: 3.2rem;
    justify-content: center;
  }
  .ai-news-btn-group .krds-btn {
    width: 100%;
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .ai-news-list-wrap {
  border-top-color: var(--krds-high-contrast-color-element-secondary);
}
[data-krds-mode="high-contrast"] .ai-news-list__head {
  background-color: var(--krds-high-contrast-color-surface-secondary-subtler);
  border-bottom-color: var(--krds-high-contrast-color-border-secondary-light);
}
[data-krds-mode="high-contrast"] .ai-news-list__item {
  border-bottom-color: var(--krds-high-contrast-color-divider-gray-light);
}
[data-krds-mode="high-contrast"] .ai-news-col {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .ai-news-list__head .ai-news-col {
  color: var(--krds-high-contrast-color-text-bolder);
}
[data-krds-mode="high-contrast"] a.ai-news-col--title:hover {
  color: var(--krds-high-contrast-color-text-primary);
}
[data-krds-mode="high-contrast"] .ai-news-tab-count {
  color: var(--krds-high-contrast-color-text-primary);
}

/* ============================================
   AI 교육소식 상세 페이지 (ai-news-detail-page)
   ============================================ */

.ai-news-detail-wrap {
  display: flex;
  flex-direction: column;
  gap: 4rem;
  margin-top: 4.8rem;
}

/* ─ 제목 + 메타 영역 ─ */
.ai-news-detail__head {
  border-top: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-divider-gray);
  border-bottom: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-divider-gray);
  padding: var(--krds-padding-8) 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5);
}

.ai-news-detail__title {
  font-size: var(--krds-pc-font-size-heading-large);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-bolder);
  line-height: 1.5;
  letter-spacing: 0.1rem;
}

/* ─ 첨부파일 제목 ─ */
.box-group-area-title{
  margin-bottom: 2rem;
}

/* ─ 메타 정보 (배지 | 분류 | 날짜) ─ */
.ai-news-detail__meta,
.inquiry-detail__reply-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.8rem;
}

/* 세로 구분선 */
.ai-news-detail__vt-divider {
  display: inline-block;
  width: 1px;
  height: 1.6rem;
  background-color: var(--krds-light-color-divider-gray-light);
  flex-shrink: 0;
}

.ai-news-detail__meta-text,
.ai-news-detail__meta-date {
  font-size: var(--krds-pc-font-size-body-medium);
  color: var(--krds-light-color-text-subtle);
  font-weight: var(--krds-font-weight-regular);
  line-height: 1.5;
  white-space: nowrap;
}

/* ─ 내용 (이미지 + 본문) ─ */
.ai-news-detail__content {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}

/* 이미지 샘플 placeholder */
.ai-news-detail__img-placeholder {
  width: 100%;
  height: 24rem;
  background-color: var(--krds-light-color-background-gray-subtle, #e6e8ea);
  border-radius: var(--krds-radius-small2);
}

/* 본문 텍스트 */
.ai-news-detail__text {
  font-size: var(--krds-pc-font-size-body-medium);
  color: var(--krds-light-color-text-subtle);
  font-weight: var(--krds-font-weight-regular);
  line-height: 1.5;
}

/* ─ 버튼 그룹 ─ */
.ai-news-detail__btn-group {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  justify-content: flex-end;
}

/* 삭제하기 컨테이너: 왼쪽으로 밀어냄 */
.ai-news-detail__btn-left {
  flex: 1 0 0;
}

/* ═══════════════════════════════
   모바일 반응형 (≤1023px)
   ═══════════════════════════════ */
@media (max-width: 1023px) {
  .ai-news-detail-wrap {
    gap: 3.2rem;
    margin-top: 3.2rem;
  }

  .ai-news-detail__title {
    font-size: var(--krds-mobile-font-size-heading-medium);
    letter-spacing: 0;
  }

  /* 날짜: 줄 바꿈 (배지+분류 행 아래로) */
  .ai-news-detail__vt-divider--hide-mo {
    display: none;
  }
  .ai-news-detail__meta > .ai-news-detail__meta-date {
    flex-basis: 100%;
  }

  .ai-news-detail__reply-title {
    font-size: var(--krds-mobile-font-size-heading-medium);
  }

  /* 이미지 placeholder 높이 조정 */
  .ai-news-detail__img-placeholder {
    height: 20rem;
  }

  /* 답변 내용 하단 여백 제거 */
  .ai-news-detail__reply-content {
    padding-bottom: 0;
  }

  /* 버튼: 세로 스택 — 목록 위, 삭제하기 아래 */
  .ai-news-detail__btn-group {
    flex-direction: column;
    gap: 1.6rem;
  }
  .ai-news-detail__btn-group > .krds-btn {
    order: 1;
    width: 100%;
  }
  .ai-news-detail__btn-left {
    order: 2;
    width: 100%;
    flex: none;
  }
  .ai-news-detail__btn-left .krds-btn {
    width: 100%;
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .ai-news-detail__title,
[data-krds-mode="high-contrast"] .ai-news-detail__reply-title {
  color: var(--krds-high-contrast-color-text-bolder);
}
[data-krds-mode="high-contrast"] .ai-news-detail__meta-text,
[data-krds-mode="high-contrast"] .ai-news-detail__meta-date,
[data-krds-mode="high-contrast"] .ai-news-detail__text {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .ai-news-detail__head,
[data-krds-mode="high-contrast"] .ai-news-detail__reply {
  border-color: var(--krds-high-contrast-color-divider-gray);
}
[data-krds-mode="high-contrast"] .ai-news-detail__vt-divider {
  background-color: var(--krds-high-contrast-color-divider-gray-light);
}

/* ============================================
   이전글/다음글 네비게이션
   ============================================ */
.ai-news-prev-next {
  border-top: 2px solid var(--krds-light-color-divider-gray-dark, #6d7882);
  /* margin-top: var(--krds-gap-9, 4rem); */
}

.ai-news-prev-next__item {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-7, 24px);
  padding: var(--krds-padding-5, 16px) 0;
  border-bottom: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
}

.ai-news-prev-next__label {
  flex-shrink: 0;
  width: 10rem;
  padding: 0 var(--krds-padding-8, 40px) 0 var(--krds-padding-8, 40px);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-subtle, #464c53);
  line-height: 1.5;
}

.ai-news-prev-next__link {
  flex: 1;
  min-width: 0;
  padding: 0 var(--krds-padding-7, 24px);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-subtle, #464c53);
  line-height: 1.5;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ai-news-prev-next__link:hover,
.ai-news-prev-next__link:focus-visible {
  color: var(--krds-light-color-text-primary, #0054b4);
  text-decoration: underline;
}

/* 반응형: 모바일 */
@media (max-width: 767px) {
  .ai-news-prev-next {
    margin-top: var(--krds-gap-8, 3.2rem);
  }

  .ai-news-prev-next__item {
    align-items: flex-start;
    gap: var(--krds-gap-3, 8px);
    padding: var(--krds-padding-4, 12px) 0;
  }

  .ai-news-prev-next__label {
    width: auto;
    padding: 0;
    font-size: var(--krds-mobile-font-size-label-medium, 1.5rem);
  }

  .ai-news-prev-next__link {
    padding: 0;
    font-size: var(--krds-mobile-font-size-body-medium, 1.6rem);
    white-space: normal;
    word-break: break-word;
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .ai-news-prev-next {
  border-top-color: var(--krds-high-contrast-color-divider-gray-dark);
}
[data-krds-mode="high-contrast"] .ai-news-prev-next__item {
  border-bottom-color: var(--krds-high-contrast-color-divider-gray-light);
}
[data-krds-mode="high-contrast"] .ai-news-prev-next__label,
[data-krds-mode="high-contrast"] .ai-news-prev-next__link {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .ai-news-prev-next__link:hover,
[data-krds-mode="high-contrast"] .ai-news-prev-next__link:focus-visible {
  color: var(--krds-high-contrast-color-text-primary);
}

/* ============================================
   이벤트/행사 목록 페이지 (event-page)
   ============================================ */

/* 검색 필터 - 상태 라디오 버튼 */
.event-filter-status {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
}
.event-filter-status .label {
  font-weight: var(--krds-font-weight-bold);
  white-space: nowrap;
  min-width: 4.5rem;
}
.event-filter-status .krds-check-area {
  display: flex;
  gap: var(--krds-gap-5, 16px);
}

/* 이벤트 검색 필터 (PC) — sub-layout .filter-form 규칙보다 구체성 높게 지정 */
.ai-edu-event-page .search-top-box .sch-filter-box {
  margin-top: 0;
  border-radius: var(--krds-radius-xlarge2, 1.2rem);
}
.search-top-box .sch-filter-box .filter-form.event-filter-form {
  flex-direction: column;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: var(--krds-gap-7, 2.4rem);
  width: 100%;
}
.search-top-box .sch-filter-box .filter-form.event-filter-form > .event-filter-form__row {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  max-width: none;
  width: 100%;
  gap: var(--krds-gap-7, 2.4rem);
}
.search-top-box .sch-filter-box .filter-form.event-filter-form > .event-filter-form__row--keyword {
  gap: var(--krds-gap-4, 1.2rem);
}
.search-top-box .sch-filter-box .filter-form.event-filter-form .label {
  min-width: 4.5rem;
  width: 4.5rem;
  flex-shrink: 0;
}
.search-top-box .sch-filter-box .filter-form.event-filter-form .event-filter-form__category {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-4, 1.2rem);
  max-width: none;
  width: auto;
  flex-shrink: 0;
}
.search-top-box .sch-filter-box .filter-form.event-filter-form .event-filter-form__category .label {
  min-width: 4.5rem;
  width: 4.5rem;
}
.search-top-box .sch-filter-box .filter-form.event-filter-form .event-filter-form__category .krds-form-select {
  width: 20.8rem;
  flex-shrink: 0;
}
.search-top-box .sch-filter-box .filter-form.event-filter-form .krds-form-chip {
  max-width: none;
  width: auto;
  flex-shrink: 0;
}
.search-top-box .sch-filter-box .filter-form.event-filter-form .event-filter-form__search {
  display: flex;
  flex: 1;
  align-items: center;
  gap: var(--krds-gap-5, 1.6rem);
  min-width: 0;
  max-width: none;
  width: auto;
}
.search-top-box .sch-filter-box .filter-form.event-filter-form .event-filter-form__search .sch-input {
  flex: 1;
  min-width: 0;
}
.search-top-box .sch-filter-box .filter-form.event-filter-form .event-filter-form__search .sch-input .krds-input {
  width: 100%;
}
.search-top-box .sch-filter-box .filter-form.event-filter-form .event-filter-form__search > .krds-btn.primary {
  flex-shrink: 0;
  min-width: 7.8rem;
  height: var(--krds-size-height-7, 4.8rem);
}

/* 검색어 그룹 너비 확장 */
.event-keyword-group {
  flex: 1;
  max-width: fit-content;
}
.event-keyword-group .sch-input {
  flex: 1;
}
.event-keyword-group .krds-input {
  width: 100%;
  min-width: 30rem;
}

/* 모바일 검색 - PC에서 숨김 */
.event-search-mo {
  display: none;
}

/* 정렬 버튼 그룹 */
.sort-btn-group {
  display: flex;
  gap: var(--krds-gap-3, 8px);
}
.sort-btn-group .krds-btn.active {
  color: var(--krds-light-color-text-primary);
}
.krds-btn.icon .ico-card{
  background-image: url(../../img/kosac/ico_card.svg);
  background-size: 100% 100%;
  background-color: transparent;
}
.krds-btn.icon .ico-calendar{
  background-image: url(../../img/kosac/ico_calendar.svg);
  background-size: 100% 100%;
  background-color: transparent;
  mask: none;
}
.sort-btn-group .krds-btn.icon.active{
  border-radius: 4px;
  background-color: #D6E0EB;
}

.krds-btn.icon .ico-card:hover,
.krds-btn.icon .ico-card:focus-visible,
.krds-btn.icon .ico-calendar:hover,
.krds-btn.icon .ico-calendar:focus-visible {
  border-radius: 4px;
  background-color: #D6E0EB;
}
/* 카드 리스트 - 3열 그리드 */
.event-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--krds-gap-7, 24px);
  margin: 0;
  padding: 0;
  list-style: none;
  margin-top: var(--krds-gap-8, 32px);
}

/* 카드 아이템 */
.event-card {
  background: var(--krds-light-color-background-white, #fff);
  border-radius: var(--krds-radius-large, 8px);
  overflow: hidden;
  border: 1px solid var(--krds-light-color-border-gray-light, #d9dde2);
  transition: box-shadow 0.2s ease;
}
.event-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.event-card__link {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* 썸네일 */
.event-card__thumb {
  position: relative;
  width: 100%;
  padding-top: 56%;
  background: var(--krds-light-color-surface-secondary-subtler, #f5f7fa);
  overflow: hidden;
}
/* 행사ㆍ세미나: 포스터형(세로) 썸네일 비율 — 288:398 */
.ai-edu-event-page .event-card__thumb {
  padding-top: 138.194%;
}
.event-card__thumb img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.event-card__thumb.end_thumb::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
}

/* 카드 본문 */
.event-card__body {
  padding: var(--krds-padding-8, 32px);
}

/* 제목 */
.event-card__title {
  margin: var(--krds-gap-4, 12px) 0;
  font-size: var(--krds-pc-font-size-body-large, 1.9rem);
  font-weight: var(--krds-font-weight-bold);
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1a1f27);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.event-card__link:hover .event-card__title,
.event-card__link:focus-visible .event-card__title {
  color: var(--krds-light-color-text-primary, #0054b4);
  text-decoration: underline;
}

/* 기간 */
.event-card__period {
  display: flex;
  gap: var(--krds-gap-2, 8px);
  margin: 0;
  font-size: var(--krds-pc-font-size-label-medium, 1.5rem);
  color: var(--krds-light-color-text-subtle, #464c53);
}
.event-card__period-key {
  font-weight: var(--krds-font-weight-regular);
  color: var(--krds-light-color-text-subtle, #464c53);
}
.event-card__period-date {
  color: var(--krds-light-color-text-subtle, #464c53);
}

/* 태그 */
.card-btm{
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  padding-top: 1.6rem;
  margin-top: 0.8rem;
  border-top: 0.1rem solid #cdd1d5;
}
.card-btm .krds-tag {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  background-color: #ffffff;
  height: 3.2rem;
  padding: 1rem;
  font-size: 1.5rem;
  color: #1e2124;
  border-radius:100rem;
  border: 0.1rem solid #cdd1d5;
}

/* ── 반응형: 태블릿 (≤1023px) ── */
@media (max-width: 1023px) {
  .event-cards {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ── 반응형: 모바일 (≤767px) ── */
@media (max-width: 767px) {
  /* 모바일 검색 표시 */
  .event-search-mo {
    display: flex;
    flex-direction: column;
    gap: var(--krds-gap-5, 1.6rem);
    margin-bottom: var(--krds-gap-5, 1.6rem);
  }
  .event-search-mo .krds-form-select {
    width: 100%;
  }
  .event-search-mo .sch-input {
    display: flex;
    width: 100%;
  }
  .event-search-mo .sch-input .krds-input {
    flex: 1;
  }
  .event-search-mo .krds-form-chip {
    align-self: flex-start;
  }

  /* 카드 1열 */
  .event-cards {
    grid-template-columns: 1fr;
    gap: var(--krds-gap-5, 16px);
  }

  /* 카드 본문 패딩 축소 */
  .event-card__body {
    padding: var(--krds-padding-6, 24px);
  }

  /* 제목 폰트 크기 */
  .event-card__title {
    font-size: var(--krds-mobile-font-size-body-large, 1.8rem);
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .event-card {
  border-color: var(--krds-high-contrast-color-border-gray-light);
  background-color: var(--krds-high-contrast-color-background-white);
}
[data-krds-mode="high-contrast"] .event-card__title {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .event-card__period,
[data-krds-mode="high-contrast"] .event-card__period-key,
[data-krds-mode="high-contrast"] .event-card__period-date {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .event-card__link:hover .event-card__title,
[data-krds-mode="high-contrast"] .event-card__link:focus-visible .event-card__title {
  color: var(--krds-high-contrast-color-text-primary);
}

/* ============================================
   이벤트/행사 캘린더 보기
   ============================================ */

/* 캘린더 래퍼 */
.event-calendar-wrap {
  display: flex;
  gap: var(--krds-gap-10, 48px);
  margin-top: var(--krds-gap-8, 32px);
}

/* 캘린더 영역 */
.event-calendar {
  flex-shrink: 0;
  width: 48rem;
  padding: var(--krds-padding-7, 24px);
  border: 1px solid var(--krds-light-color-border-gray-light, #d9dde2);
  border-radius: var(--krds-radius-large, 8px);
  background: var(--krds-light-color-background-white, #fff);
  max-height: max-content;
}

/* 캘린더 헤더 */
.event-calendar__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--krds-gap-5, 16px);
}
.event-calendar__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.2rem;
  height: 3.2rem;
  border: none;
  background: transparent;
  cursor: pointer;
}
.event-calendar__nav .svg-icon {
  width: 2rem;
  height: 2rem;
}
.event-calendar__nav.prev .svg-icon {
  transform: rotate(90deg);
}
.event-calendar__nav.next .svg-icon {
  transform: rotate(-90deg);
}
.event-calendar__title {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
}
.event-calendar__title select {
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  font-weight: var(--krds-font-weight-bold);
}

/* 범례 */
.event-calendar__legend {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-4, 12px);
  margin-bottom: var(--krds-gap-5, 16px);
  padding-bottom: var(--krds-gap-4, 12px);
  border-bottom: 1px solid var(--krds-light-color-border-gray-light, #d9dde2);
}
.legend-item {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: var(--krds-pc-font-size-label-small, 1.3rem);
  color: var(--krds-light-color-text-subtle, #464c53);
}
.legend-item .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
}
.legend-item--ing .dot {
  background: #8754F9;
}
.legend-item--end .dot {
  background: var(--krds-light-color-text-subtle, #464c53);
}
.event-calendar__today {
  margin-left: auto;
}

/* 캘린더 그리드 */
.event-calendar__weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  margin-bottom: var(--krds-gap-3, 8px);
}
.event-calendar__weekdays .weekday {
  text-align: center;
  font-size: var(--krds-pc-font-size-label-small, 1.3rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-subtle, #464c53);
  padding: 8px 0;
}
.event-calendar__weekdays .weekday.sun {
  color: var(--krds-light-color-text-danger, #c0392b);
}
.event-calendar__weekdays .weekday.sat {
  color: var(--krds-light-color-text-primary, #0054b4);
}

/* 날짜 그리드 */
.event-calendar__days .day-row {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
}
.event-calendar__days .day {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  padding: 8px 4px;
  min-height: 5rem;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: var(--krds-pc-font-size-body-small, 1.5rem);
  color: var(--krds-light-color-text-basic, #1a1f27);
  transition: background 0.15s ease;
}
.event-calendar__days .day:hover {
  background: var(--krds-light-color-surface-secondary-subtler, #f5f7fa);
  border-radius: var(--krds-radius-medium, 4px);
}
.event-calendar__days .day.sun {
  color: var(--krds-light-color-text-danger, #c0392b);
}
.event-calendar__days .day.sat {
  color: var(--krds-light-color-text-primary, #0054b4);
}
.event-calendar__days .day.other-month {
  color: var(--krds-light-color-text-disabled, #adb3ba);
}
.event-calendar__days .day.active span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.8rem;
  height: 2.8rem;
  background: var(--krds-light-color-element-primary, #246beb);
  color: #fff;
  border-radius: 50%;
}

/* 오늘 날짜 스타일 */
.event-calendar__days .day.today span {
  position: relative;
}
.event-calendar__days .day.today:not(.active) span::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 50%;
  transform: translateX(-50%);
  width: 4px;
  height: 4px;
  background: var(--krds-light-color-element-primary, #246beb);
  border-radius: 50%;
}
.event-calendar__days .day.today.active span::after {
  background: #fff;
}

/* 이벤트 도트 */
.event-calendar__days .day .dot-wrap {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.3rem;
}
.event-calendar__days .day .dot {
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
}
.event-calendar__days .day .dot.ing {
  background-color: #8754F9;
}
.event-calendar__days .day .dot.end {
  background: var(--krds-light-color-text-subtle, #464c53);
}
.event-calendar__days .day.has-event {
  position: relative;
}

/* 일정 목록 영역 */
.event-calendar__list {
  flex: 1;
  min-width: 0;
}
.event-calendar__list-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: var(--krds-gap-6, 20px);
  padding-bottom: var(--krds-gap-4, 12px);
  border-bottom: 2px solid var(--krds-light-color-border-gray-dark, #6d7882);
}
.event-calendar__list-date {
  font-size: var(--krds-pc-font-size-heading-medium, 2.4rem);
  font-weight: var(--krds-font-weight-bold);
  margin: 0;
}
.event-calendar__list-count {
  font-size: var(--krds-pc-font-size-label-medium, 1.5rem);
  color: var(--krds-light-color-text-subtle, #464c53);
}
.event-calendar__list-count strong {
  color: var(--krds-light-color-text-primary, #0054b4);
}

/* 일정 아이템 */
.event-calendar__items {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-6, 20px);
}
.event-calendar__item {
  border: 1px solid var(--krds-light-color-border-gray-light, #d9dde2);
  border-radius: var(--krds-radius-large, 8px);
  overflow: hidden;
  background: var(--krds-light-color-background-white, #fff);
}
.event-calendar__item-link {
  display: block;
  text-decoration: none;
  color: inherit;
}
.event-calendar__item-thumb {
  width: 100%;
  height: 18rem;
  background: var(--krds-light-color-surface-secondary-subtler, #f5f7fa);
  overflow: hidden;
}
.event-calendar__item-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.event-calendar__item-body {
  padding: var(--krds-padding-6, 24px);
}
.event-calendar__item-badges {
  display: flex;
  gap: var(--krds-gap-2, 8px);
  margin-bottom: var(--krds-gap-3, 8px);
}
.event-calendar__item-title {
  font-size: var(--krds-pc-font-size-body-large, 1.9rem);
  font-weight: var(--krds-font-weight-bold);
  line-height: 1.5;
  margin: 0 0 var(--krds-gap-3, 8px);
  color: var(--krds-light-color-text-basic, #1a1f27);
}
.event-calendar__item-link:hover .event-calendar__item-title,
.event-calendar__item-link:focus-visible .event-calendar__item-title {
  color: var(--krds-light-color-text-primary, #0054b4);
  text-decoration: underline;
}
.event-calendar__item-period {
  font-size: var(--krds-pc-font-size-label-medium, 1.5rem);
  color: var(--krds-light-color-text-subtle, #464c53);
  margin: 0 0 var(--krds-gap-4, 12px);
}
.event-calendar__item-period strong {
  font-weight: var(--krds-font-weight-regular);
  margin-right: var(--krds-gap-2, 8px);
}
.event-calendar__item-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-2, 8px);
}

/* ── 반응형: 모바일 (≤767px) ── */
@media (max-width: 767px) {
  .event-calendar-wrap {
    flex-direction: column;
    gap: var(--krds-gap-7, 24px);
  }
  .event-calendar {
    width: 100%;
  }
  .event-calendar__list-date {
    font-size: var(--krds-mobile-font-size-heading-small, 2rem);
  }
  .event-calendar__item-thumb {
    height: 14rem;
  }
  .event-calendar__item-body {
    padding: var(--krds-padding-5, 16px);
  }
  .event-calendar__item-title {
    font-size: var(--krds-mobile-font-size-body-large, 1.8rem);
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .event-calendar,
[data-krds-mode="high-contrast"] .event-calendar__item {
  border-color: var(--krds-high-contrast-color-border-gray-light);
  background-color: var(--krds-high-contrast-color-background-white);
}
[data-krds-mode="high-contrast"] .event-calendar__days .day.active {
  background: var(--krds-high-contrast-color-element-primary);
}
[data-krds-mode="high-contrast"] .event-calendar__days .day.today:not(.active) span::after {
  background: var(--krds-high-contrast-color-element-primary);
}
[data-krds-mode="high-contrast"] .event-calendar__list-header {
  border-bottom-color: var(--krds-high-contrast-color-border-gray-dark);
}

/* ============================================
   자주 찾는 질문 (FAQ) 페이지
   ============================================ */

/* 검색 필터 (PC) */
.faq-filter-form {
  flex-wrap: nowrap;
}
.faq-keyword-group {
  flex: 1;
  max-width: 40rem;
}
.faq-content .krds-tab-area{
  gap: 0;
}

/* 모바일 검색 (기본 숨김) */
.faq-search-mo {
  display: none;
}

/* 검색 결과 수 */
.faq-result-count {
  border-bottom: none;
}
.faq-result-count .sch-info li {
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-basic, #1a1f27);
}

/* FAQ 아코디언 스타일 */
.faq-accordion .accordion-item {
  border-bottom: 1px solid var(--krds-light-color-border-gray-light, #d9dde2);
}
.faq-accordion .accordion-item:first-child {
  border-top: 1px solid var(--krds-light-color-border-gray-dark, #6d7882);
}
.faq-accordion .btn-accordion {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-6, 24px);
  width: 100%;
  padding: var(--krds-padding-6, 24px) var(--krds-padding-4, 16px);
  text-align: left;
  background: transparent;
  border: none;
  cursor: pointer;
}
.faq-accordion .btn-accordion::after {
  content: '';
  flex-shrink: 0;
  width: 2.4rem;
  height: 2.4rem;
  margin-left: auto;
  background: url(../../img/component/icon/ico_angle.svg) no-repeat center;
  background-size: contain;
  transform: rotate(180deg);
  transition: transform 0.2s ease;
}
.faq-accordion .btn-accordion.active::after {
  transform: rotate(0deg);
}

/* 카테고리 라벨 */
.faq-category {
  flex-shrink: 0;
  min-width: 8rem;
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic, #1a1f27);
}

/* 질문 제목 */
.faq-title {
  flex: 1;
  font-size: var(--krds-pc-font-size-body-large, 1.9rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic, #1a1f27);
  line-height: 1.5;
}

/* 답변 영역 */
.faq-answer {
  padding: var(--krds-padding-6, 24px);
  padding-left: calc(8rem + var(--krds-gap-6, 24px) + var(--krds-padding-4, 16px));
  background: var(--krds-light-color-surface-secondary-subtler, #f5f7fa);
}
.faq-answer p {
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: 1.7;
  color: var(--krds-light-color-text-basic, #1a1f27);
  margin: 0;
}

/* 해시태그 */
.faq-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-2, 8px);
  margin-top: var(--krds-gap-5, 16px);
}

/* ── 반응형: 모바일 (≤767px) ── */
@media (max-width: 767px) {
  /* PC 검색 숨기기, 모바일 검색 표시 */
  .faq-search-pc {
    display: none;
  }
  .faq-search-mo {
    display: block;
    margin-bottom: var(--krds-gap-5, 16px);
  }
  .faq-search-mo .sch-form-wrap {
    display: flex;
    flex-direction: column;
    gap: var(--krds-gap-3, 8px);
  }
  .faq-search-mo .krds-form-select {
    width: 100%;
  }
  .faq-search-mo .sch-input {
    width: 100%;
  }

  /* 아코디언 스타일 */
  .faq-accordion .btn-accordion {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-2, 8px);
    padding: var(--krds-padding-5, 16px) var(--krds-padding-4, 12px);
    position: relative;
  }
  .faq-accordion .btn-accordion::after {
    position: absolute;
    right: var(--krds-padding-4, 12px);
    top: 50%;
    transform: translateY(-50%) rotate(180deg);
  }
  .faq-accordion .btn-accordion.active::after {
    transform: translateY(-50%) rotate(0deg);
  }
  .faq-category {
    min-width: auto;
    font-size: var(--krds-mobile-font-size-body-small, 1.4rem);
    font-weight: var(--krds-font-weight-regular);
    color: var(--krds-light-color-text-subtle, #464c53);
  }
  .faq-title {
    width: calc(100% - 3rem);
    font-size: var(--krds-mobile-font-size-body-medium, 1.6rem);
    padding-right: var(--krds-padding-4, 12px);
  }
  .faq-answer {
    padding: var(--krds-padding-5, 16px);
  }
  .faq-answer p {
    font-size: var(--krds-mobile-font-size-body-small, 1.4rem);
  }
  .faq-result-count .sch-info li {
    font-size: var(--krds-mobile-font-size-body-medium, 1.6rem);
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .faq-accordion .accordion-item {
  border-color: var(--krds-high-contrast-color-border-gray-light);
}
[data-krds-mode="high-contrast"] .faq-accordion .accordion-item:first-child {
  border-top-color: var(--krds-high-contrast-color-border-gray-dark);
}
[data-krds-mode="high-contrast"] .faq-category {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .faq-title {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .faq-answer {
  background: var(--krds-high-contrast-color-surface-secondary-subtler);
}
[data-krds-mode="high-contrast"] .faq-answer p {
  color: var(--krds-high-contrast-color-text-basic);
}

/* ============================================
   1:1 문의 페이지
   ============================================ */

/* 콘텐츠 영역 */
.inquiry-content {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-10, 40px);
}

/* 섹션 제목 */
.inquiry-section-title {
  font-size: var(--krds-pc-font-size-heading-medium, 2.4rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic, #1a1f27);
  margin: 0;
}

/* 개인정보 동의 박스 */
.inquiry-privacy-box {
  border: 1px solid var(--krds-light-color-border-gray, #b1b8be);
  border-radius: var(--krds-radius-xlarge, 12px);
  padding: var(--krds-padding-7, 24px);
  background: var(--krds-light-color-background-white, #fff);
}

.inquiry-privacy-content {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 16px);
  overflow-y: auto;
  max-height: 42rem;
}

.inquiry-privacy-title {
  font-size: var(--krds-pc-font-size-body-large, 1.9rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic, #1a1f27);
  margin: 0;
  line-height: 1.5;
}
.inquiry-privacy-title .point {
  color: var(--krds-light-color-text-danger, #ab2b36);
}

.inquiry-privacy-desc {
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-basic, #1a1f27);
  line-height: 1.5;
  margin: 0;
}

/* 개인정보 항목 리스트 */
.inquiry-privacy-list {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 16px);
}

.inquiry-privacy-item {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
}

.inquiry-privacy-item-title {
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  font-weight: var(--krds-font-weight-regular);
  color: var(--krds-light-color-text-basic, #1a1f27);
  line-height: 1.5;
  margin: 0;
}

.inquiry-privacy-item-content {
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-subtle, #464c53);
  line-height: 1.5;
  margin: 0;
  padding-left: var(--krds-padding-3, 8px);
}
.inquiry-privacy-item-content.highlight {
  color: var(--krds-light-color-text-danger, #ab2b36);
}

/* 동의 라디오 버튼 영역 */
.inquiry-agree-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--krds-gap-6, 24px);
  padding: var(--krds-padding-7, 24px);
  background: var(--krds-light-color-surface-secondary-subtler, #f4f5f6);
  border-radius: var(--krds-radius-xlarge, 12px);
}

.inquiry-agree-text {
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-basic, #1a1f27);
  margin: 0;
  flex: 1;
}
.inquiry-agree-text .point {
  color: var(--krds-light-color-text-danger, #ab2b36);
}

.inquiry-agree-radio {
  flex-shrink: 0;
}
.inquiry-agree-radio .krds-check-area {
  display: flex;
  gap: var(--krds-gap-6, 24px);
}

/* 버튼 그룹 */
.inquiry-btn-group {
  display: flex;
  justify-content: flex-end;
  gap: var(--krds-gap-3, 8px);
}

/* ── 반응형: 모바일 (≤767px) ── */
@media (max-width: 767px) {
  .inquiry-content {
    gap: var(--krds-gap-7, 24px);
  }

  .inquiry-section-title {
    font-size: var(--krds-mobile-font-size-heading-small, 2rem);
  }

  .inquiry-privacy-box {
    padding: var(--krds-padding-5, 16px);
  }

  .inquiry-privacy-title {
    font-size: var(--krds-mobile-font-size-body-medium, 1.6rem);
  }

  .inquiry-privacy-content {
    max-height: 47rem;
  }

  .inquiry-privacy-desc,
  .inquiry-privacy-item-title,
  .inquiry-privacy-item-content {
    font-size: var(--krds-mobile-font-size-body-small, 1.4rem);
  }

  .inquiry-agree-box {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-4, 12px);
    padding: var(--krds-padding-5, 16px);
  }

  .inquiry-agree-text {
    font-size: var(--krds-mobile-font-size-body-small, 1.4rem);
  }

  .inquiry-agree-radio .krds-check-area {
    gap: var(--krds-gap-5, 16px);
  }

  .inquiry-btn-group {
    flex-direction: column;
  }
  .inquiry-btn-group .krds-btn {
    width: 100%;
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .inquiry-privacy-box {
  border-color: var(--krds-high-contrast-color-border-gray);
  background: var(--krds-high-contrast-color-background-white);
}
[data-krds-mode="high-contrast"] .inquiry-section-title,
[data-krds-mode="high-contrast"] .inquiry-privacy-title,
[data-krds-mode="high-contrast"] .inquiry-privacy-desc,
[data-krds-mode="high-contrast"] .inquiry-privacy-item-title,
[data-krds-mode="high-contrast"] .inquiry-agree-text {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .inquiry-privacy-item-content {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .inquiry-agree-box {
  background: var(--krds-high-contrast-color-surface-secondary-subtler);
}

/* ============================================
   1:1 문의 작성 페이지 (inquiry-form)
   ============================================ */

/* 폼 박스 */
.inquiry-form-box {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-10, 40px);
  padding: var(--krds-padding-10, 40px);
  border: 1px solid var(--krds-light-color-border-gray, #b1b8be);
  border-radius: var(--krds-radius-xlarge, 12px);
  background: var(--krds-light-color-background-white, #fff);
}

/* 폼 그룹 */
.inquiry-form-group {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
}

/* 폼 라벨 */
.inquiry-form-label {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-1, 4px);
  line-height: 1.5;
}
.inquiry-form-label .label-text {
  font-size: var(--krds-pc-font-size-heading-small, 1.9rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic, #1e2124);
}
.inquiry-form-label .label-required {
  font-size: var(--krds-pc-font-size-body-large, 1.9rem);
  font-weight: var(--krds-font-weight-regular);
  color: var(--krds-light-color-text-danger, #de3412);
}
.inquiry-form-label .label-count {
  font-size: var(--krds-pc-font-size-body-large, 1.9rem);
  font-weight: var(--krds-font-weight-regular);
  color: var(--krds-light-color-text-basic, #1e2124);
}

/* 파일 첨부 라벨 */
.inquiry-form-label--file {
  justify-content: space-between;
}
.inquiry-form-label--file .label-wrap {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-1, 4px);
}

/* 폼 필드 */
.inquiry-form-field {
  width: 100%;
}
.inquiry-form-field--select {
  width: 36rem;
}
.inquiry-form-field--select .krds-form-select {
  width: 100%;
}

/* 입력 필드 */
.inquiry-form-field .krds-input.large {
  width: 100%;
  height: var(--krds-size-height-8, 56px);
}

/* textarea 스타일 */
.inquiry-form-field .krds-textarea.large {
  width: 100%;
  min-height: 14.4rem;
  padding: var(--krds-padding-3, 8px) var(--krds-padding-6, 16px);
  border: 1px solid var(--krds-light-color-input-border, #58616a);
  border-radius: var(--krds-radius-medium2, 6px);
  background: var(--krds-light-color-input-surface, #fff);
  font-size: var(--krds-pc-font-size-label-medium, 1.7rem);
  line-height: 1.5;
  resize: vertical;
}
.inquiry-form-field .krds-textarea.large::placeholder {
  color: var(--krds-light-color-text-disabled, #8a949e);
}
.inquiry-form-field .krds-textarea.large:focus {
  border-color: var(--krds-light-color-input-border-active, #256ef4);
  outline: none;
}

/* textarea 정보 영역 */
.inquiry-textarea-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: var(--krds-gap-3, 8px);
}
.inquiry-textarea-hint {
  font-size: var(--krds-pc-font-size-body-small, 1.5rem);
  color: var(--krds-light-color-text-subtle, #464c53);
  line-height: 1.5;
}
.inquiry-textarea-counter {
  font-size: var(--krds-pc-font-size-body-small, 1.5rem);
  line-height: 1.5;
}
.inquiry-textarea-counter .counter-current {
  color: var(--krds-light-color-text-primary, #0b50d0);
}
.inquiry-textarea-counter .counter-divider {
  color: var(--krds-light-color-text-subtle, #464c53);
}


/* ── 반응형: 모바일 (≤767px) ── */
@media (max-width: 767px) {
  .inquiry-form-box {
    gap: var(--krds-gap-7, 24px);
    padding: var(--krds-padding-5, 16px);
  }

  .inquiry-form-group {
    gap: var(--krds-gap-5, 16px);
  }

  .inquiry-form-label .label-text {
    font-size: var(--krds-mobile-font-size-heading-small, 1.7rem);
  }
  .inquiry-form-label .label-required,
  .inquiry-form-label .label-count {
    font-size: var(--krds-mobile-font-size-body-medium, 1.6rem);
  }

  .inquiry-form-field--select {
    width: 100%;
  }

  .inquiry-form-field .krds-input.large {
    height: var(--krds-size-height-7, 48px);
    font-size: var(--krds-mobile-font-size-label-medium, 1.6rem);
  }

  .inquiry-form-field .krds-textarea.large {
    min-height: 16rem;
    font-size: var(--krds-mobile-font-size-label-medium, 1.6rem);
  }

  .inquiry-textarea-hint,
  .inquiry-textarea-counter {
    font-size: var(--krds-mobile-font-size-body-small, 1.4rem);
  }

}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .inquiry-form-box {
  border-color: var(--krds-high-contrast-color-border-gray);
  background: var(--krds-high-contrast-color-background-white);
}
[data-krds-mode="high-contrast"] .inquiry-form-label .label-text,
[data-krds-mode="high-contrast"] .inquiry-form-label .label-count {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .inquiry-form-label .label-required {
  color: var(--krds-high-contrast-color-text-danger);
}
[data-krds-mode="high-contrast"] .inquiry-form-field .krds-textarea.large {
  border-color: var(--krds-high-contrast-color-input-border);
  background: var(--krds-high-contrast-color-input-surface);
}
[data-krds-mode="high-contrast"] .inquiry-form-field .krds-textarea.large::placeholder {
  color: var(--krds-high-contrast-color-text-disabled);
}
[data-krds-mode="high-contrast"] .inquiry-textarea-hint,
[data-krds-mode="high-contrast"] .inquiry-textarea-counter .counter-divider {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .inquiry-textarea-counter .counter-current {
  color: var(--krds-high-contrast-color-text-primary);
}

/* ============================================
   문의/제안/신고 내역 조회 페이지 (inquiry-history)
   ============================================ */

.inquiry-history-content {
  gap: var(--krds-gap-layout-h1-h2, 48px);
}

.inquiry-email-field {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
}

.inquiry-email-field__at {
  flex-shrink: 0;
  width: 12px;
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-disabled, #8a949e);
  text-align: center;
  line-height: 1.5;
}

.inquiry-email-field .inquiry-form-field {
  flex: 1;
  min-width: 0;
}

.inquiry-email-field .inquiry-form-field--select {
  flex: 1;
  width: auto;
}

.inquiry-email-field .krds-form-select.large {
  width: 100%;
  height: var(--krds-size-height-8, 56px);
}

@media (max-width: 767px) {
  .inquiry-history-content {
    gap: var(--krds-gap-7, 24px);
  }

  .inquiry-email-field {
    flex-wrap: wrap;
    gap: var(--krds-gap-3, 8px);
  }

  .inquiry-email-field .inquiry-form-field:first-child {
    flex: 1 1 100%;
  }

  .inquiry-email-field__at {
    width: auto;
  }

  .inquiry-email-field .inquiry-form-field--select,
  .inquiry-email-field .krds-form-select.large {
    height: var(--krds-size-height-7, 48px);
  }
}

[data-krds-mode="high-contrast"] .inquiry-email-field__at {
  color: var(--krds-high-contrast-color-text-disabled);
}

/* ============================================
   문의/제안/신고 내용 작성 페이지 (inquiry-write)
   ============================================ */

.inquiry-radio-field {
  gap: var(--krds-gap-7, 24px);
}

.inquiry-file-group {
  gap: var(--krds-gap-layout-title-body-large, 24px);
}

.inquiry-file-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

.inquiry-file-item {
  display: flex;
  align-items: center;
  padding: var(--krds-padding-6, 16px);
  border: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-medium4, 8px);
  background: var(--krds-light-color-surface-white-subtle, #fff);
}

.inquiry-file-item__name {
  flex: 1;
  min-width: 0;
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-bolder, #131416);
  line-height: 1.5;
}

.inquiry-btn-group--split {
  justify-content: space-between;
  width: 100%;
}

@media (max-width: 767px) {
  .inquiry-file-item__name {
    font-size: var(--krds-mobile-font-size-body-medium, 1.6rem);
  }
}

[data-krds-mode="high-contrast"] .inquiry-file-item {
  border-color: var(--krds-high-contrast-color-divider-gray-light);
  background: var(--krds-high-contrast-color-surface-white-subtle);
}

[data-krds-mode="high-contrast"] .inquiry-file-item__name {
  color: var(--krds-high-contrast-color-text-bolder);
}


/* ============================================
   1:1 문의 등록 완료 페이지 (inquiry-complete)
   ============================================ */

/* 완료 콘텐츠 영역 */
.inquiry-complete-content {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-12, 48px);
  align-items: center;
}

/* 완료 헤더 (아이콘 + 타이틀) */
.inquiry-complete-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  text-align: center;
}

/* 아이콘 */
.inquiry-complete-icon {
  width: 18rem;
  height: 12rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.inquiry-complete-icon img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* 완료 타이틀 */
.inquiry-complete-title {
  font-size: var(--krds-pc-font-size-heading-xlarge, 4rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
  margin: 0;
  letter-spacing: 0.1rem;
}
.inquiry-complete-title .point {
  color: var(--krds-light-color-text-primary, #256ef4);
}

/* 안내문 박스 */
.inquiry-complete-desc-box {
  width: 100%;
  padding: var(--krds-padding-9, 32px) var(--krds-padding-10, 40px);
  background: var(--krds-light-color-surface-gray-subtler, #f4f5f6);
  border-radius: var(--krds-radius-xlarge, 12px);
  text-align: center;
}
.inquiry-complete-desc-box p {
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
  margin: 0;
}

/* 버튼 그룹 */
.inquiry-complete-btn-group {
  display: flex;
  justify-content: center;
  gap: var(--krds-gap-4, 12px);
}
.inquiry-complete-btn-group .krds-btn {
  min-width: 12rem;
}

/* ── 반응형: 모바일 (≤767px) ── */
@media (max-width: 767px) {
  .inquiry-complete-content {
    gap: var(--krds-gap-10, 40px);
  }

  .inquiry-complete-header {
    gap: var(--krds-gap-3, 8px);
  }

  .inquiry-complete-icon {
    width: 15rem;
    height: 10rem;
  }

  .inquiry-complete-title {
    font-size: var(--krds-mobile-font-size-heading-xlarge, 2.8rem);
  }

  .inquiry-complete-desc-box {
    padding: var(--krds-padding-8, 24px);
  }

  .inquiry-complete-desc-box p {
    font-size: var(--krds-mobile-font-size-body-medium, 1.7rem);
  }

  .inquiry-complete-btn-group {
    flex-direction: column;
    width: 100%;
    gap: var(--krds-gap-5, 16px);
  }
  .inquiry-complete-btn-group .krds-btn {
    width: 100%;
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .inquiry-complete-title {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .inquiry-complete-title .point {
  color: var(--krds-high-contrast-color-text-primary);
}
[data-krds-mode="high-contrast"] .inquiry-complete-desc-box {
  background: var(--krds-high-contrast-color-surface-gray-subtler);
}
[data-krds-mode="high-contrast"] .inquiry-complete-desc-box p {
  color: var(--krds-high-contrast-color-text-basic);
}

/* ============================================
   문의/제안/신고 메뉴 페이지 (inquiry-menu)
   ============================================ */

.inquiry-menu-content {
  gap: 0;
}

.inquiry-menu {
  display: flex;
  gap: var(--krds-gap-10, 40px);
  width: 100%;
}

.inquiry-menu-card {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-7, 24px);
  flex: 1;
  min-width: 0;
  padding: var(--krds-padding-9, 32px);
  background-color: var(--krds-light-color-surface-gray-subtler, #f4f5f6);
  border-radius: var(--krds-radius-xlarge2, 12px);
  text-decoration: none;
  color: inherit;
  transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.inquiry-menu-card:hover {
  background-color: var(--krds-light-color-surface-gray-subtle, #eaebed);
}

.inquiry-menu-card:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px var(--krds-light-color-border-primary);
}

.inquiry-menu-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
}

.inquiry-menu-card__icon img {
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.inquiry-menu-card__title {
  flex: 1;
  min-width: 0;
  font-size: var(--krds-pc-font-size-heading-medium, 2.4rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
  margin: 0;
}

.inquiry-menu-card__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
}

.inquiry-menu-card__arrow .svg-icon {
  width: 32px;
  height: 32px;
  background-color: var(--krds-light-color-text-basic);
}

@media (max-width: 1023px) {
  .inquiry-menu {
    flex-direction: column;
    gap: var(--krds-gap-5, 16px);
  }

  .inquiry-menu-card__title {
    font-size: var(--krds-mobile-font-size-heading-medium, 2.2rem);
  }
}

[data-krds-mode="high-contrast"] .inquiry-menu-card {
  background-color: var(--krds-high-contrast-color-surface-gray-subtler);
}

[data-krds-mode="high-contrast"] .inquiry-menu-card:hover {
  background-color: var(--krds-high-contrast-color-surface-gray-subtle);
}

[data-krds-mode="high-contrast"] .inquiry-menu-card__title {
  color: var(--krds-high-contrast-color-text-basic);
}

[data-krds-mode="high-contrast"] .inquiry-menu-card__arrow .svg-icon {
  background-color: var(--krds-high-contrast-color-text-basic);
}

/* ============================================
   AI 교육 통합검색 페이지 (edu-search)
   ============================================ */

/* 필터 행: 4개 select 가로 배치 */
.edu-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-5, 16px);
  align-items: center;
  margin-bottom: 2rem;
}
.edu-filter-item {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
}
.edu-filter-item .label {
  white-space: nowrap;
}

/* 검색어 행 */
.edu-filter-keyword {
  margin-bottom: 0;
}
.edu-keyword-group {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
}
.edu-keyword-group .label {
  white-space: nowrap;
}
.edu-keyword-group .sch-input {
  width: 36rem;
}

/* 모바일 검색 */
.edu-search-mo {
  display: none;
  margin-bottom: var(--krds-gap-5, 16px);
}
.edu-search-mo .sch-form-wrap {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
}
.edu-search-mo .sch-input {
  width: 100%;
}

/* 정렬 영역 구분선 */
.edu-sort-divider {
  width: 1px;
  height: 1.6rem;
  background: var(--krds-light-color-divider-gray, #8a949e);
  margin: 0 var(--krds-gap-2, 4px);
}

/* 정렬기준 버튼 */
.edu-sort-options {
  display: inline-flex;
  gap: var(--krds-gap-2, 4px);
}
.edu-sort-options .krds-btn.active {
  font-weight: var(--krds-font-weight-medium);
  color: var(--krds-light-color-text-basic, #1e2124);
  border-radius: 4px !important;
  background-color: #D6E0EB;
  text-decoration: underline;
}
.edu-sort-options .krds-btn:not(.active) {
  color: var(--krds-light-color-text-subtle, #464c53);
}
.krds-btn.icon .svg-icon.ico-list{
  background-image: url(../../img/kosac/ico_list.svg);
  background-size: 100% 100%;
  background-color: transparent;
}
.krds-btn .svg-icon.ico-heart{
  background-image: url(../../img/kosac/ico_heart_off.svg);
  background-size: 100% 100%;
  background-color: transparent !important;
}
.krds-btn .svg-icon.ico-heart-fill{
  background-image: url(../../img/kosac/ico_heart_on.svg);
  background-size: 100% 100%;
  background-color: transparent !important;
}

/* ── 카드형 보기 ── */
.edu-card-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--krds-gap-7, 24px);
  list-style: none;
  padding: 0;
  margin: 0;
}

.edu-card {
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-xlarge, 12px);
  overflow: hidden;
  background: var(--krds-light-color-surface-white-subtle, #fff);
  transition: box-shadow 0.2s;
}
.edu-card:hover {
  box-shadow: 0 0.4rem 1.2rem rgba(0, 0, 0, 0.08);
}

.edu-card__link {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  height: 100%;
}

.edu-card__thumb {
  width: 100%;
  aspect-ratio: 288 / 161;
  overflow: hidden;
  flex-shrink: 0;
}
.edu-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.edu-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-2, 4px);
  padding: var(--krds-padding-8, 32px);
  flex: 1;
}

.edu-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--krds-gap-2, 4px);
}
.edu-card__badges {
  display: flex;
  gap: var(--krds-gap-3, 8px);
}
.edu-card__actions {
  display: flex;
  gap: var(--krds-gap-5, 16px);
}

.edu-card__title {
  font-size: var(--krds-pc-font-size-body-large, 1.9rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.edu-card__desc {
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-subtle, #464c53);
  line-height: 1.5;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.edu-card__study-time {
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-primary, #0b50d0);
  line-height: 1.5;
  margin: 0;
}

.edu-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-3, 8px);
  margin-top: auto;
  padding-top: var(--krds-gap-5, 16px);
}
.edu-card__tags.card-btm, .edu-list-item__tags.card-btm{
  border-top: none;
}

/* ── 리스트형 보기 ── */
.edu-list-view {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
  list-style: none;
  padding: 0;
  margin: 0;
}

.edu-list-item {
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-xlarge, 12px);
  overflow: hidden;
  background: var(--krds-light-color-surface-white-subtle, #fff);
  transition: box-shadow 0.2s;
}
.edu-list-item:hover {
  box-shadow: 0 0.4rem 1.2rem rgba(0, 0, 0, 0.08);
}

.edu-list-item__link {
  display: flex;
  gap: var(--krds-gap-8, 32px);
  padding: var(--krds-padding-8, 32px);
  text-decoration: none;
  color: inherit;
}

.edu-list-item__thumb {
  width: 32rem;
  height: 17.9rem;
  flex-shrink: 0;
  border-radius: var(--krds-radius-medium3, 8px);
  overflow: hidden;
}
.edu-list-item__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.edu-list-item__body {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-2, 4px);
  flex: 1;
  min-width: 0;
}

.edu-list-item__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--krds-gap-3, 8px);
}
.edu-list-item__badges {
  display: flex;
  gap: var(--krds-gap-3, 8px);
}
.edu-list-item__actions {
  display: flex;
  gap: var(--krds-gap-5, 16px);
}

.edu-list-item__title {
  font-size: var(--krds-pc-font-size-heading-medium, 2.4rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
  margin: 0;
}

.edu-list-item__desc {
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-subtle, #464c53);
  line-height: 1.5;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.edu-list-item__study-time {
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-primary, #0b50d0);
  line-height: 1.5;
  margin: 0;
}

.edu-list-item__tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-3, 8px);
  margin-top: auto;
  padding-top: var(--krds-gap-5, 16px);
}

/* ── 반응형: 태블릿 (≤1023px) ── */
@media (max-width: 1023px) {
  .edu-card-list {
    grid-template-columns: repeat(2, 1fr);
  }
  .edu-list-item__thumb {
    width: 24rem;
    height: 14rem;
  }
}

/* ── 반응형: 모바일 (≤767px) ── */
@media (max-width: 767px) {
  .edu-search-mo {
    display: block;
  }

  .edu-card-list {
    grid-template-columns: 1fr;
  }

  .edu-card__body {
    padding: var(--krds-padding-5, 16px);
  }

  .edu-card__title {
    font-size: var(--krds-mobile-font-size-body-large, 1.7rem);
  }
  .edu-card__desc {
    font-size: var(--krds-mobile-font-size-body-small, 1.4rem);
  }
  .edu-card__study-time {
    font-size: var(--krds-mobile-font-size-body-small, 1.4rem);
  }

  .edu-list-item__link {
    flex-direction: row;
    gap: var(--krds-gap-5, 16px);
    padding: var(--krds-padding-5, 16px);
  }
  .edu-list-item__thumb {
    width: 12rem;
    height: 9rem;
  }
  .edu-list-item__title {
    font-size: var(--krds-mobile-font-size-body-large, 1.7rem);
  }
  .edu-list-item__desc {
    font-size: var(--krds-mobile-font-size-body-small, 1.4rem);
  }
  .edu-list-item__study-time {
    font-size: var(--krds-mobile-font-size-body-small, 1.4rem);
  }
  .edu-list-item__actions {
    display: none;
  }
  .edu-list-item__tags {
    display: none;
  }

  .edu-sort-divider {
    display: none;
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .edu-card,
[data-krds-mode="high-contrast"] .edu-list-item {
  border-color: var(--krds-high-contrast-color-border-gray-light);
  background: var(--krds-high-contrast-color-surface-white-subtle);
}
[data-krds-mode="high-contrast"] .edu-card__title,
[data-krds-mode="high-contrast"] .edu-list-item__title {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .edu-card__desc,
[data-krds-mode="high-contrast"] .edu-list-item__desc {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .edu-card__study-time,
[data-krds-mode="high-contrast"] .edu-list-item__study-time {
  color: var(--krds-high-contrast-color-text-primary);
}
[data-krds-mode="high-contrast"] .edu-sort-divider {
  background: var(--krds-high-contrast-color-divider-gray);
}

/* ============================================
   나의 강의실 - 수강현황 (myclass)
   ============================================ */

/* 검색 영역 */
.myclass-search {
  display: flex;
  gap: var(--krds-gap-5, 16px);
  align-items: center;
  margin-bottom: var(--krds-gap-9, 48px);
}
.myclass-search .sch-input {
  flex: 0 0 370px;
}
.myclass-search .krds-btn.primary {
  height: 48px;
  min-width: 78px;
}

/* 검색 결과 + 정렬 */
.myclass-list-top {
  margin-bottom: var(--krds-gap-7, 24px);
}

/* 안내 박스 */
.myclass-alert {
  background: var(--krds-light-color-surface-secondary-subtler, #eef2f7);
  border: 1px solid var(--krds-light-color-border-information-light, #d3ebfd);
  border-radius: var(--krds-radius-xlarge, 12px);
  padding: var(--krds-padding-6, 16px);
  margin-bottom: var(--krds-gap-7, 24px);
  overflow: hidden;
}
.myclass-alert p {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-secondary, #052b57);
}

/* ── 수강 목록 ── */
.myclass-course-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
}

/* 수강 카드 아이템 */
.myclass-course-item {
  display: flex;
  gap: var(--krds-gap-8, 32px);
  padding: var(--krds-padding-8, 32px);
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-xlarge, 12px);
  background: var(--krds-light-color-surface-white-subtle, #fff);
}

/* 썸네일 */
.myclass-course-item__thumb {
  flex-shrink: 0;
  width: 320px;
  height: 179px;
  border-radius: 8px;
  overflow: hidden;
}
.myclass-course-item__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 본문 */
.myclass-course-item__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 16px);
}

/* 정보 영역 (배지+제목 / 퍼센트) */
.myclass-course-item__info {
  display: flex;
  gap: 10px;
  align-items: flex-end;
}
.myclass-course-item__head {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
  justify-content: center;
}

/* 배지 */
.myclass-course-item__badges {
  display: flex;
  gap: var(--krds-gap-3, 8px);
  align-items: center;
  flex-wrap: wrap;
}
.myclass-course-item__badges .krds-badge {
  height: 28px;
  padding: 0 8px;
  border-radius: 4px;
  font-size: 15px;
  line-height: 1.5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.myclass-course-item__badges .bg-info-lighter {
  background: var(--krds-light-color-element-information-lighter, #e7f4fe);
  color: var(--krds-light-color-border-information, #0b78cb);
}
.myclass-course-item__badges .bg-success-lighter {
  background: var(--krds-light-color-element-success-lighter, #e4f6ee);
  color: var(--krds-light-color-text-success, #0a6e3a);
}
.myclass-course-item__badges .border-gray {
  border: 1px solid var(--krds-light-color-element-gray-dark, #58616a);
  background: transparent;
  color: var(--krds-light-color-text-subtle, #464c53);
}
.myclass-course-item__badges .border-primary {
  border: 1px solid var(--krds-light-color-border-primary, #256ef4);
  background: transparent;
  color: var(--krds-light-color-text-primary, #0b50d0);
}

/* 제목 */
.myclass-course-item__title {
  font-size: 19px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
  margin: 0;
  white-space: normal;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 퍼센트 */
.myclass-course-item__percent {
  flex-shrink: 0;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--krds-light-color-text-primary, #0b50d0);
  text-align: right;
  white-space: nowrap;
}
.myclass-course-item__percent .num {
  font-size: 40px;
}
.myclass-course-item__percent.zero {
  color: var(--krds-light-color-text-subtle, #464c53);
}
.myclass-course-item__percent.complete {
  color: var(--krds-light-color-text-primary, #0b50d0);
}

/* 프로그레스바 영역 */
.myclass-course-item__progress {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
}
.myclass-progress-bar {
  width: 100%;
}
.myclass-progress-bar__track {
  width: 100%;
  height: 8px;
  background: var(--krds-light-color-element-disabled-light, #cdd1d5);
  border-radius: 4px;
  overflow: hidden;
}
.myclass-progress-bar__fill {
  height: 100%;
  background: var(--krds-light-color-element-primary, #256ef4);
  border-radius: 4px;
  transition: width 0.3s ease;
}
.myclass-progress-bar__fill.complete {
  background: var(--krds-light-color-element-primary, #256ef4);
}
.myclass-course-item__progress-text {
  font-size: 17px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
}

/* 액션 버튼 영역 */
.myclass-course-item__actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--krds-gap-3, 8px);
  align-items: center;
}

/* ── 모바일 반응형 ── */
@media (max-width: 767px) {
  .myclass-search {
    flex-direction: column;
    gap: var(--krds-gap-3, 8px);
  }
  .myclass-search .sch-input {
    flex: 1;
    width: 100%;
  }
  .myclass-search .krds-btn.primary {
    display: none;
    width: 100%;
  }
  .myclass-course-item {
    flex-direction: column;
    gap: var(--krds-gap-5, 16px);
    padding: var(--krds-padding-6, 16px);
  }
  .myclass-course-item__thumb {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
  }
  .myclass-course-item__info {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-3, 8px);
  }
  .myclass-course-item__percent {
    font-size: 28px;
    text-align: left;
  }
  .myclass-course-item__percent .num {
    font-size: 28px;
  }
  .myclass-course-item__title {
    font-size: 17px;
    white-space: normal;
  }
  .myclass-course-item__actions {
    justify-content: flex-end;
  }
  .myclass-alert p {
    font-size: 15px;
  }
}

/* ── 태블릿 반응형 ── */
@media (max-width: 1023px) {
  .myclass-course-item__thumb {
    width: 240px;
    height: 135px;
  }
}
@media (max-width: 1023px) and (min-width: 768px) {
  .myclass-search .sch-input {
    flex: 1;
  }
}

/* ── 고대비 모드 ── */
[data-krds-mode="high-contrast"] .myclass-course-item {
  border-color: var(--krds-high-contrast-color-border-gray-light);
  background: var(--krds-high-contrast-color-surface-white-subtle);
}
[data-krds-mode="high-contrast"] .myclass-alert {
  background: var(--krds-high-contrast-color-surface-secondary-subtler);
  border-color: var(--krds-high-contrast-color-border-information-light);
}
[data-krds-mode="high-contrast"] .myclass-alert p {
  color: var(--krds-high-contrast-color-text-secondary);
}
[data-krds-mode="high-contrast"] .myclass-course-item__title {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .myclass-course-item__percent {
  color: var(--krds-high-contrast-color-text-primary);
}
[data-krds-mode="high-contrast"] .myclass-course-item__percent.zero {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .myclass-progress-bar__track {
  background: var(--krds-high-contrast-color-element-disabled-light);
}
[data-krds-mode="high-contrast"] .myclass-progress-bar__fill {
  background: var(--krds-high-contrast-color-element-primary);
}
[data-krds-mode="high-contrast"] .myclass-course-item__progress-text {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .myclass-course-item__badges .bg-info-lighter {
  background: var(--krds-high-contrast-color-element-information-lighter);
  color: var(--krds-high-contrast-color-border-information);
}
[data-krds-mode="high-contrast"] .myclass-course-item__badges .bg-success-lighter {
  background: var(--krds-high-contrast-color-element-success-lighter);
  color: var(--krds-high-contrast-color-text-success);
}
[data-krds-mode="high-contrast"] .myclass-course-item__badges .border-gray {
  border-color: var(--krds-high-contrast-color-element-gray-dark);
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .myclass-course-item__badges .border-primary {
  border-color: var(--krds-high-contrast-color-border-primary);
  color: var(--krds-high-contrast-color-text-primary);
}

/* 수강현황 탭 스타일 (피그마 디자인) */
.myclass-tab {
  margin-bottom: var(--krds-gap-7, 24px);
}
.myclass-tab .tab.line.full > ul {
  display: flex;
  width: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
}
.myclass-tab .tab.line.full > ul > li {
  flex: 1;
  min-width: 80px;
}
.myclass-tab .tab.line.full .btn-tab {
  width: 100%;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 19px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
  background: transparent;
  border: none;
  border-bottom: 2px solid var(--krds-light-color-border-gray, #b1b8be);
  padding: 0 var(--krds-padding-3, 8px);
  white-space: nowrap;
  cursor: pointer;
  position: relative;
}
.myclass-tab .tab.line.full .btn-tab::before {
  display: none;
}
.myclass-tab .tab.line.full li.active .btn-tab {
  font-weight: 700;
  color: var(--krds-light-color-text-secondary, #052b57);
  border-bottom: 4px solid var(--krds-light-color-border-primary, #256ef4);
}
.myclass-tab .myclass-list-top {
  margin-top: var(--krds-gap-9, 48px);
  margin-bottom: var(--krds-gap-7, 24px);
}
.myclass-tab .tab-conts {
  display: none;
}
.myclass-tab .tab-conts.active {
  display: block;
}

/* 수강현황 탭 반응형 */
@media (max-width: 767px) {
  .myclass-tab .tab.line.full .btn-tab {
    /* font-size: 15px; */
    height: 48px;
  }
  .myclass-tab .myclass-list-top {
    margin-top: var(--krds-gap-7, 24px);
  }
}

/* 수강현황 탭 고대비 모드 */
[data-krds-mode="high-contrast"] .myclass-tab .tab.line.full .btn-tab {
  color: var(--krds-high-contrast-color-text-subtle);
  border-bottom-color: var(--krds-high-contrast-color-border-gray);
}
[data-krds-mode="high-contrast"] .myclass-tab .tab.line.full li.active .btn-tab {
  color: var(--krds-high-contrast-color-text-secondary);
  border-bottom-color: var(--krds-high-contrast-color-border-primary);
}

/* ===========================
   수강 상세 페이지 (course-detail)
   =========================== */

/* 강좌 헤더 영역 */
.course-detail__header {
  display: flex;
  gap: var(--krds-gap-9, 40px);
  align-items: flex-start;
  padding-bottom: var(--krds-gap-9, 40px);
  border-bottom: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
  margin-bottom: var(--krds-gap-9, 40px);
}
.course-detail__info {
  flex: 1;
  min-width: 0;
}
.course-detail__title {
  font-size: var(--krds-font-size-heading-xlarge, 28px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  margin-bottom: var(--krds-gap-7, 24px);
}
.course-detail__meta {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-2, 4px);
}
.course-detail__meta-row {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  font-size: var(--krds-font-size-body-medium, 17px);
  line-height: 1.5;
}
.course-detail__meta-row dt {
  min-width: 64px;
  font-weight: 700;
  color: var(--krds-light-color-text-subtle, #464c53);
}
.course-detail__meta-row dd {
  color: var(--krds-light-color-text-basic, #1e2124);
}

/* 진행률 박스 */
.course-detail__progress-box {
  width: 307px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--krds-gap-8, 32px);
}
.course-detail__progress-info {
  width: 100%;
  display: flex;
  align-items: flex-end;
  gap: var(--krds-gap-2, 4px);
  margin-bottom: var(--krds-gap-3, 8px);
}
.course-detail__progress-label {
  font-size: var(--krds-font-size-body-medium, 17px);
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.course-detail__progress-percent {
  flex: 1;
  text-align: right;
  font-size: var(--krds-font-size-heading-small, 19px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-divider-primary, #256ef4);
}
.course-detail__progress-box .myclass-progress-bar {
  width: 100%;
  margin-bottom: 0;
}
.course-detail__continue-btn {
  width: 100%;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--krds-font-size-label-large, 19px);
  border-radius: var(--krds-radius-medium3, 8px);
}

/* 본문 영역 (좌측 + 우측 사이드) */
.course-detail__body {
  display: flex;
  gap: var(--krds-gap-6, 24px);
  /* align-items: flex-start; */
}
.course-detail__main {
  flex: 1;
  min-width: 0;
}

/* 커리큘럼/강좌소개 탭 */
.course-detail-tab {
  margin-bottom: 0;
}
.course-detail-tab .tab.fill > ul {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: var(--krds-gap-3, 8px);
}
.course-detail-tab .tab.fill > ul > li {
  flex-shrink: 0;
}
.course-detail-tab .tab.fill .btn-tab {
  height: 40px;
  padding: 0 var(--krds-padding-5, 12px);
  min-width: 56px;
  font-size: var(--krds-font-size-heading-xsmall, 17px);
  font-weight: 700;
  line-height: 1.5;
  border: none;
  border-radius: var(--krds-radius-medium1, 6px);
  cursor: pointer;
  white-space: nowrap;
  background: transparent;
  color: var(--krds-light-color-text-subtle, #464c53);
}
.course-detail-tab .tab.fill .btn-tab::before {
  display: none;
}
.course-detail-tab .tab.fill li.active .btn-tab {
  background: var(--krds-light-color-action-secondary-active, #063a74);
  color: var(--krds-light-color-text-inverse-static, #fff);
}
.course-detail-tab .tab-conts {
  display: none;
}
.course-detail-tab .tab-conts.active {
  display: block;
}

/* 챕터 묶음 카드 (하나의 보더 안에 여러 챕터) */
.curriculum-chapters-card {
  border: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-large1, 12px);
  overflow: hidden;
}

/* 챕터 헤더 (button) */
.curriculum-chapter__header {
  width: 100%;
  display: flex;
  align-items: center;
  gap: var(--krds-gap-9, 40px);
  padding: var(--krds-padding-8, 24px) 24px;
  background: transparent;
  border: none;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
}
.curriculum-chapter__head {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
}
.curriculum-chapter__title {
  font-size: var(--krds-font-size-body-medium, 17px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.curriculum-chapter__meta {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  width: 100%;
}
.curriculum-chapter__count {
  flex-shrink: 0;
  padding: 4px 12px;
  border-radius: 8px;
  background: var(--krds-light-color-background-gray-subtler, #f4f5f6);
  font-size: var(--krds-font-size-body-medium, 17px);
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
}
.curriculum-chapter__progress {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: var(--krds-gap-4, 12px);
}
.curriculum-chapter__progress .myclass-progress-bar {
  flex: 1;
  min-width: 0;
}
.curriculum-chapter__percent {
  flex-shrink: 0;
  font-size: var(--krds-font-size-label-xsmall, 19px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-primary, #0b50d0);
  white-space: nowrap;
}
.curriculum-chapter__percent.zero {
  color: var(--krds-light-color-element-gray-dark, #58616a);
}

/* 화살표 아이콘 */
.curriculum-chapter__arrow {
  display: block;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  background: url('../../img/component/icon/ico_angle.svg') no-repeat center / contain;
  transition: transform 0.2s ease;
}
.curriculum-chapter.active .curriculum-chapter__arrow {
  transform: rotate(180deg);
}

/* 챕터 강의 목록 (펼침/접힘) */
.curriculum-chapter__body {
  display: none;
  padding: var(--krds-padding-7, 24px) var(--krds-padding-5, 16px);
  background: var(--krds-light-color-surface-gray-subtler, #f4f5f6);
}
.curriculum-chapter.active .curriculum-chapter__body {
  display: block;
}
.curriculum-lesson-list {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
  list-style: none;
  margin: 0;
  padding: 0;
}
.curriculum-lesson {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
  padding: var(--krds-padding-5, 16px) var(--krds-padding-7, 24px);
  background: #fff;
  border-radius: var(--krds-radius-medium2, 12px);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.05);
}
.curriculum-lesson__title {
  flex: 1;
  min-width: 0;
  font-size: 17px;
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.curriculum-lesson .krds-btn {
  flex-shrink: 0;
  min-width: 102px;
  height: 40px;
}
.curriculum-lesson .krds-btn.disabled {
  background: var(--krds-light-color-button-disabled-fill, #cdd1d5);
  color: var(--krds-light-color-text-disabled-on, #6d7882);
  border: none;
  pointer-events: none;
}

/* 개별 강의 카드 (챕터 없는 단독 강의) */
.curriculum-single-list {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
  margin-top: var(--krds-gap-7, 24px);
}
.curriculum-single-item {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  padding: var(--krds-padding-8, 24px) 24px;
  border: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-large1, 12px);
}
.curriculum-single-item__title {
  flex: 1;
  min-width: 0;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.curriculum-single-item .krds-btn {
  flex-shrink: 0;
  min-width: 102px;
  height: 40px;
}
.curriculum-single-item .krds-btn.disabled {
  background: var(--krds-light-color-button-disabled-fill, #cdd1d5);
  color: var(--krds-light-color-text-disabled-on, #6d7882);
  border: none;
  pointer-events: none;
}

/* 강좌소개 카드 */
.course-intro-card {
  border: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-large1, 12px);
  padding: var(--krds-padding-7, 24px);
}
.course-intro-card__title {
  font-size: var(--krds-font-size-heading-small, 19px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  margin-bottom: var(--krds-gap-4, 12px);
}
.course-intro-card__desc {
  font-size: var(--krds-font-size-body-medium, 17px);
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
}
.course-intro-card__desc p {
  margin-bottom: var(--krds-gap-5, 16px);
}
.course-intro-card__desc p:last-child {
  margin-bottom: 0;
}

/* 우측 사이드 박스 */
.course-detail__side {
  flex-shrink: 0;
  width: 307px;
}
.course-detail__side-box {
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: 12px;
  background: var(--krds-light-color-background-white, #fff);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.05), 0 2px 4px rgba(0, 0, 0, 0.08);
  padding-top: 24px;
  padding-bottom: var(--krds-padding-9, 32px);
  overflow: hidden;
}
.course-detail__side-thumb {
  padding: 0 24px;
  margin-bottom: 0;
}
.course-detail__side-thumb img {
  width: 100%;
  border-radius: 6px;
  display: block;
}
.course-detail__side-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--krds-gap-5, 16px);
  padding: var(--krds-padding-4, 12px) var(--krds-padding-7, 24px) 0;
}
.course-detail__side-info {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 16px);
  padding: 0 var(--krds-padding-7, 24px);
  margin-top: var(--krds-gap-5, 16px);
}
.course-detail__side-info-item {
  display: flex;
  align-items: flex-start;
  gap: var(--krds-gap-3, 8px);
}
.course-detail__side-icon {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--krds-light-color-surface-primary-subtler, #ecf2fe);
  display: flex;
  align-items: center;
  justify-content: center;
}
.course-detail__side-icon .svg-icon {
  width: 20px;
  height: 20px;
}
.course-detail__side-text {
  display: flex;
  flex-direction: column;
}
.course-detail__side-label {
  font-size: 15px;
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
}
.course-detail__side-value {
  font-size: var(--krds-font-size-body-medium, 17px);
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.course-detail__side-value strong {
  font-weight: 700;
}

/* ===========================
   수강 상세 반응형 (태블릿)
   =========================== */
@media (max-width: 1023px) {
  .course-detail__header {
    flex-direction: column;
    gap: var(--krds-gap-7, 24px);
  }
  .course-detail__progress-box {
    width: 100%;
  }
  .course-detail__body {
    flex-direction: column;
  }
  .course-detail__side {
    width: 100%;
  }
  .course-detail__side-box {
    display: flex;
    flex-wrap: wrap;
    gap: var(--krds-gap-5, 16px);
    padding: var(--krds-padding-7, 24px);
  }
  .course-detail__side-thumb {
    padding: 0;
    width: 200px;
    flex-shrink: 0;
  }
  .course-detail__side-actions {
    padding: 0;
    flex: 1;
    justify-content: flex-start;
  }
  .course-detail__side-info {
    width: 100%;
    padding: 0;
    margin-top: 0;
    flex-direction: row;
    gap: var(--krds-gap-9, 40px);
  }
}

/* ===========================
   수강 상세 반응형 (모바일)
   =========================== */
@media (max-width: 767px) {
  .course-detail__header {
    gap: var(--krds-gap-5, 16px);
    padding-bottom: var(--krds-gap-7, 24px);
    margin-bottom: var(--krds-gap-7, 24px);
  }
  .course-detail__title {
    font-size: 22px;
  }
  .course-detail__meta-row {
    font-size: 15px;
  }
  .course-detail__meta-row dt {
    min-width: 56px;
  }
  .course-detail__progress-box {
    gap: var(--krds-gap-5, 16px);
  }
  .course-detail__progress-label {
    font-size: 15px;
  }
  .course-detail__progress-percent {
    font-size: 17px;
  }
  .course-detail__continue-btn {
    height: 48px;
    font-size: 17px;
  }
  .course-detail__body {
    flex-direction: column;
    gap: var(--krds-gap-7, 24px);
  }
  .course-detail__side {
    width: 100%;
    order: -1;
  }
  .course-detail__side-box {
    flex-direction: column;
    padding: var(--krds-padding-5, 16px);
  }
  .course-detail__side-thumb {
    width: 100%;
  }
  .course-detail__side-info {
    flex-direction: column;
    gap: var(--krds-gap-5, 16px);
  }
  .course-detail-tab .tab.fill .btn-tab {
    font-size: 15px;
    height: 36px;
    padding: 0 var(--krds-padding-4, 10px);
  }
  .curriculum-chapter__title {
    font-size: 15px;
  }
  .curriculum-chapter__count {
    font-size: 14px;
    padding: 2px 8px;
  }
  .curriculum-chapter__meta {
    /* flex-direction: column; */
    gap: var(--krds-gap-3, 8px);
    align-items: flex-start;
  }
  .curriculum-chapter__percent {
    font-size: 15px;
  }
  .curriculum-chapter__header {
    padding: var(--krds-padding-5, 16px);
    gap: var(--krds-gap-5, 16px);
  }
  .curriculum-chapter__body {
    padding: var(--krds-padding-5, 16px) var(--krds-padding-4, 12px);
  }
  .curriculum-lesson {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-3, 8px);
    padding: var(--krds-padding-4, 12px) var(--krds-padding-5, 16px);
  }
  .curriculum-lesson .krds-btn {
    min-width: auto;
    align-self: flex-end;
  }
  .curriculum-lesson__title {
    font-size: 15px;
    white-space: normal;
  }
  .curriculum-single-item {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-3, 8px);
    padding: var(--krds-padding-5, 16px);
  }
  .curriculum-single-item .krds-btn {
    align-self: flex-end;
    min-width: auto;
  }
  .curriculum-single-item__title {
    font-size: 15px;
    white-space: normal;
  }
  .course-intro-card {
    padding: var(--krds-padding-5, 16px);
  }
  .course-intro-card__title {
    font-size: 17px;
  }
  .course-intro-card__desc {
    font-size: 15px;
  }
}

/* ===========================
   수강 상세 고대비 모드
   =========================== */
[data-krds-mode="high-contrast"] .course-detail__title {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .course-detail__meta-row dt {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .course-detail__meta-row dd {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .course-detail__progress-percent {
  color: var(--krds-high-contrast-color-text-primary);
}
[data-krds-mode="high-contrast"] .course-detail__progress-label {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .course-detail__header {
  border-bottom-color: var(--krds-high-contrast-color-divider-gray-light);
}
[data-krds-mode="high-contrast"] .course-detail-tab .tab.fill li.active .btn-tab {
  background: var(--krds-high-contrast-color-action-secondary-active);
  color: var(--krds-high-contrast-color-text-inverse-static);
}
[data-krds-mode="high-contrast"] .course-detail-tab .tab.fill .btn-tab {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .curriculum-chapters-card {
  border-color: var(--krds-high-contrast-color-divider-gray-light);
}
[data-krds-mode="high-contrast"] .curriculum-chapter__title {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .curriculum-chapter__count {
  background: var(--krds-high-contrast-color-background-gray-subtler);
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .curriculum-chapter__percent {
  color: var(--krds-high-contrast-color-text-primary);
}
[data-krds-mode="high-contrast"] .curriculum-lesson {
  background: var(--krds-high-contrast-color-background-white);
}
[data-krds-mode="high-contrast"] .curriculum-lesson__title {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .curriculum-chapter__body {
  background: var(--krds-high-contrast-color-surface-gray-subtler);
}
[data-krds-mode="high-contrast"] .curriculum-single-item {
  border-color: var(--krds-high-contrast-color-divider-gray-light);
}
[data-krds-mode="high-contrast"] .curriculum-single-item__title {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .course-intro-card {
  border-color: var(--krds-high-contrast-color-divider-gray-light);
}
[data-krds-mode="high-contrast"] .course-intro-card__title {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .course-intro-card__desc {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .course-detail__side-box {
  border-color: var(--krds-high-contrast-color-border-gray-light);
  background: var(--krds-high-contrast-color-background-white);
}
[data-krds-mode="high-contrast"] .course-detail__side-icon {
  background: var(--krds-high-contrast-color-surface-primary-subtler);
}
[data-krds-mode="high-contrast"] .course-detail__side-label {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .course-detail__side-value {
  color: var(--krds-high-contrast-color-text-basic);
}

/* ===========================
   수료 및 증명 페이지 (cert)
   =========================== */
.cert-content {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-9, 40px);
}

/* 발급 현황 카드 */
.cert-status-cards {
  display: flex;
  gap: var(--krds-gap-5, 16px);
  list-style: none;
  margin: 0;
  padding: 0;
}
.cert-status-card {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  padding: var(--krds-padding-7, 24px) var(--krds-padding-9, 32px);
  border: 1.5px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-large1, 12px);
}
.cert-status-card--available {
  background: var(--krds-light-color-surface-primary-subtler, #ecf2fe);
}
.cert-status-card--total {
  background: var(--krds-light-color-surface-success-subtler, #eaf6ec);
}
.cert-status-card--complete {
  background: var(--krds-light-color-surface-gray-subtler, #f4f5f6);
}
.cert-status-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--krds-gap-3, 10px);
  margin-bottom: var(--krds-gap-5, 16px);
}
.cert-status-card__label {
  flex: 1;
  min-width: 0;
  font-size: var(--krds-font-size-heading-small, 19px);
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cert-status-card__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
}
.cert-status-card--available .cert-status-card__icon {
  background: var(--krds-light-color-element-primary, #256ef4);
}
.cert-status-card--total .cert-status-card__icon {
  background: var(--krds-light-color-element-success, #228738);
}
.cert-status-card--complete .cert-status-card__icon {
  background: var(--krds-light-color-element-gray, #6d7882);
}
.cert-status-card__icon img {
  display: block;
  width: 40px;
  height: 40px;
}
.cert-status-card__count {
  font-size: var(--krds-font-size-heading-large, 32px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  letter-spacing: var(--krds-letter-spacing-1, 1px);
}
.cert-status-card--complete .cert-status-card__count {
  color: var(--krds-light-color-text-subtle, #464c53);
}

/* 탭 영역 */
.cert-tab {
  margin-bottom: 0;
}
.cert-tab .cert-list-top,
.cert-tab .myclass-list-top {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin-top: var(--krds-gap-7, 24px);
  margin-bottom: var(--krds-gap-7, 24px);
}
.cert-tab .tab-conts {
  display: none;
}
.cert-tab .tab-conts.active {
  display: block;
}

/* 증명서 목록 */
.cert-list {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
  list-style: none;
  margin: 0;
  padding: 0;
}
.cert-item {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  padding: var(--krds-padding-7, 24px);
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-large1, 12px);
  background: var(--krds-light-color-background-white, #fff);
}
.cert-item__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
}
.cert-item__badges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-3, 8px);
}
.cert-item__badges .krds-badge {
  height: 28px;
  padding: 0 var(--krds-padding-3, 8px);
  font-size: 15px;
  line-height: 1.5;
}
.cert-item__badges .border-primary{
  border: 1px solid var(--krds-light-color-border-primary, #256ef4);
  background: transparent;
  color: var(--krds-light-color-text-primary, #0b50d0);
}
.cert-item__info {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.cert-item__title {
  font-size: var(--krds-font-size-heading-small, 19px);
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
.cert-item__date {
  font-size: var(--krds-font-size-body-medium, 17px);
  line-height: 1.5;
  color: var(--krds-light-color-text-disabled-on, #6d7882);
}
.cert-item__actions {
  flex-shrink: 0;
}
.cert-item__actions .krds-btn {
  min-width: 90px;
  height: 56px;
  padding: 0 var(--krds-padding-7, 20px);
  font-size: var(--krds-font-size-label-large, 19px);
  border-radius: var(--krds-radius-medium3, 8px);
  white-space: nowrap;
}
.cert-item__btn-issue {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--krds-gap-3, 8px);
}
.cert-item__btn-issue img {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}
.cert-content .krds-pagination {
  margin-top: var(--krds-gap-7, 24px);
}

/* 수료 및 증명 반응형 (태블릿) */
@media (max-width: 1023px) {
  .cert-status-cards {
    flex-wrap: wrap;
  }
  .cert-status-card {
    flex: 1 1 calc(50% - 8px);
    min-width: 200px;
  }
}

/* 수료 및 증명 반응형 (모바일) */
@media (max-width: 767px) {
  .cert-content {
    gap: var(--krds-gap-7, 24px);
  }
  .cert-status-cards {
    flex-direction: column;
    gap: var(--krds-gap-4, 12px);
  }
  .cert-status-card {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex: 1 1 auto;
    width: 100%;
    padding: var(--krds-padding-7, 24px);
    gap: var(--krds-gap-5, 16px);
  }
  .cert-status-card__head {
    flex: 1;
    min-width: 0;
    margin-bottom: 0;
    justify-content: flex-start;
  }
  .cert-status-card__icon {
    order: 1;
    background: transparent;
  }
  .cert-status-card--available .cert-status-card__icon,
  .cert-status-card--total .cert-status-card__icon,
  .cert-status-card--complete .cert-status-card__icon {
    background: transparent;
  }
  .cert-status-card__icon img {
    width: 40px;
    height: 40px;
  }
  .cert-status-card__label {
    flex: 0 1 auto;
    order: 2;
    font-size: var(--krds-font-size-heading-small, 19px);
    font-weight: 400;
  }
  .cert-status-card__count {
    flex-shrink: 0;
    margin: 0;
    font-size: var(--krds-font-size-heading-large, 32px);
    color: var(--krds-light-color-text-subtle, #464c53);
  }
  .cert-status-card--complete .cert-status-card__count {
    color: var(--krds-light-color-text-subtle, #464c53);
  }
  .cert-tab .cert-list-top,
  .cert-tab .myclass-list-top {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-3, 8px);
    margin-top: 0;
    margin-bottom: 0;
  }
  .cert-item {
    flex-direction: column;
    align-items: flex-start;
    padding: var(--krds-padding-5, 16px);
  }
  .cert-item__title {
    font-size: 17px;
    white-space: normal;
  }
  .cert-item__date {
    font-size: 15px;
  }
  .cert-item__actions {
    width: 100%;
  }
  .cert-item__actions .krds-btn {
    width: 100%;
    height: 48px;
    font-size: 17px;
  }
}

/* ============================================
   수료 및 증명 상세 (cert-detail)
   ============================================ */
.cert-detail {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.cert-detail__card + .cert-detail__review {
  margin-top: var(--krds-gap-10, 40px);
}
.cert-detail__review + .cert-detail__actions {
  margin-top: var(--krds-gap-14, 64px);
}

/* 수료증 카드 */
.cert-detail__card {
  display: flex;
  width: 100%;
  border: 1px solid var(--krds-light-color-border-gray, #b1b8be);
  border-radius: var(--krds-radius-xlarge2, 12px);
  overflow: hidden;
  background: var(--krds-light-color-surface-white-subtle, #fff);
}

/* 좌측: 증명서 미리보기 */
.cert-detail__preview {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--krds-padding-12, 48px) var(--krds-padding-10, 40px);
}
.cert-detail__cert-mini {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-8, 28px);
  background-image: url('../../img/kosac/certificate.svg');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center center;
  overflow: visible;
  width: 273px;
  height: 407px;
  padding: 3rem;
  box-sizing: content-box;
}
.cert-detail__cert-badge{
  display: flex;
  flex-direction: column;
  padding: 0 2.5rem;
}
.cert-detail__cert-badge .krds-badge {
  height: 28px;
  padding: 0 12px;
  font-size: 15px;
  line-height: 1.5;
  border: 1px solid var(--krds-light-color-border-primary, #256ef4);
  background: transparent;
  color: var(--krds-light-color-text-primary, #0b50d0);
  border-radius: 15px;
}
.cert-detail__cert-title {
  font-size: var(--krds-font-size-body-large, 19px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  margin: 0;
}
.cert-detail__cert-image {
  width: 120px;
  height: 195px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  overflow: hidden;
}
.cert-detail__cert-image img {
  width: 100%;
  height: auto;
  object-fit: contain;
}
.cert-detail__cert-bottom {
  display: flex;
  /* align-items: center; */
  gap: var(--krds-gap-5, 16px);
  /* width: 100%; */
  padding: 0 2.5rem;
}
.cert-detail__cert-meta {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-2, 4px);
  margin: 0;
}
.cert-detail__cert-meta-row {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-4, 10px);
}
.cert-detail__cert-meta-row dt {
  flex-shrink: 0;
  width: 39px;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.cert-detail__cert-meta-row dd {
  flex: 1;
  min-width: 0;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
  max-width: 105px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.cert-detail__cert-stamp {
  flex-shrink: 0;
  width: 54px;
  height: 54px;
}
.cert-detail__cert-stamp img {
  width: 100%;
  height: 100%;
}

/* 우측: 수료 강의 정보 */
.cert-detail__info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
  padding: var(--krds-padding-12, 48px);
}
.cert-detail__info-heading {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}
.cert-detail__info-table {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0;
}
.cert-detail__info-row {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-7, 24px);
  padding: var(--krds-padding-5, 16px) 0;
  border-top: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
  border-bottom: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
}
.cert-detail__info-row + .cert-detail__info-row {
  border-top: none;
}
.cert-detail__info-row--first {
  border-top: 2px solid var(--krds-light-color-divider-gray, #8a949e);
  padding-top: var(--krds-padding-6, 20px);
}
.cert-detail__info-label {
  flex-shrink: 0;
  min-width: 70px;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}
.cert-detail__info-value {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: var(--krds-gap-4, 12px);
  font-size: 19px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}
.cert-detail__info-divider {
  display: inline-block;
  width: 1px;
  height: 16px;
  background: var(--krds-light-color-divider-gray-light, #cdd1d5);
  flex-shrink: 0;
}
.cert-detail__info-link {
  display: inline-flex;
  align-items: center;
  gap: var(--krds-gap-2, 4px);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-disabled-on, #6d7882);
  text-decoration: none;
  white-space: nowrap;
}
.cert-detail__info-link .svg-icon {
  width: 20px;
  height: 20px;
  background-color: var(--krds-light-color-text-disabled-on, #6d7882);
}
.cert-detail__progress {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
  width: 307px;
}
.cert-detail__progress .myclass-progress-bar {
  flex: 1;
  min-width: 0;
}
.cert-detail__progress-percent {
  flex-shrink: 0;
  font-size: var(--krds-font-size-heading-small, 19px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-divider-primary, #256ef4);
  white-space: nowrap;
}

/* 후기 작성 */
.cert-detail__review {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
  width: 100%;
}
.cert-detail__review-header {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 16px);
}
.cert-detail__review-heading {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}
.cert-detail__review-desc {
  font-size: 19px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}
.cert-detail__review-form {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-10, 40px);
  padding: 32px;
  background: var(--krds-light-color-surface-gray-subtler, #f4f5f6);
  border-radius: 12px;
}
.cert-detail__review-question {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 16px);
  border: none;
  padding: 0;
  margin: 0;
}
.cert-detail__review-q-label {
  font-size: var(--krds-font-size-heading-small, 19px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-bolder, #131416);
  float: none;
  width: auto;
  padding: 0;
}

/* 별점 */
.cert-detail__star-rating {
  display: flex;
  gap: var(--krds-gap-5, 16px);
}
.cert-detail__star {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 40px;
  padding: 0;
  border: none;
  background: transparent;
  color: var(--krds-light-color-element-disabled-light, #cdd1d5);
  cursor: pointer;
  transition: color 0.15s ease;
}
.cert-detail__star svg {
  width: 42px;
  height: 40px;
}
.cert-detail__star.is-active {
  color: #f4a012;
}
.cert-detail__star:hover {
  color: #f4a012;
}
.cert-detail__star:focus-visible {
  outline: 2px solid var(--krds-light-color-border-primary, #256ef4);
  outline-offset: 2px;
  border-radius: 4px;
}

/* 텍스트에어리어 */
.cert-detail__textarea-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.cert-detail__textarea-wrap textarea.krds-input {
  width: 100%;
  height: 144px;
  resize: vertical;
}
.cert-detail__textarea-counter {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-1, 2px);
  margin-top: var(--krds-gap-3, 8px);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
}
.cert-detail__counter-current {
  color: var(--krds-light-color-text-primary, #0b50d0);
}
.cert-detail__counter-max {
  color: var(--krds-light-color-text-subtle, #464c53);
}

/* 하단 버튼 */
.cert-detail__actions {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  width: 100%;
}
.cert-detail__actions-left {
  flex: 1;
  min-width: 0;
}
.cert-detail__actions-right {
  display: flex;
  gap: var(--krds-gap-5, 16px);
}
.cert-detail__actions .krds-btn {
  min-width: 98px;
  height: 64px;
  padding: 0 var(--krds-padding-7, 24px);
  font-size: var(--krds-font-size-label-large, 19px);
  border-radius: var(--krds-radius-medium4, 8px);
}

/* 수료 상세 반응형 (태블릿) */
@media (max-width: 1023px) {
  .cert-detail__card {
    flex-direction: column;
  }
  .cert-detail__preview {
    padding: var(--krds-padding-7, 24px);
  }
  .cert-detail__info {
    padding: var(--krds-padding-7, 24px);
  }
  .cert-detail__progress {
    width: 100%;
  }
}

/* 수료 상세 반응형 (모바일) */
@media (max-width: 767px) {
  .cert-detail__card + .cert-detail__review {
    margin-top: var(--krds-gap-7, 24px);
  }
  .cert-detail__review + .cert-detail__actions {
    margin-top: var(--krds-gap-10, 40px);
  }
  .cert-detail__card {
    flex-direction: column;
  }
  .cert-detail__preview {
    padding: var(--krds-padding-5, 16px);
  }
  .cert-detail__cert-mini {
    padding: var(--krds-padding-7, 24px) var(--krds-padding-5, 16px);
    width: 100%;
  }
  .cert-detail__info {
    padding: var(--krds-padding-5, 16px);
  }
  .cert-detail__info-heading {
    font-size: 19px;
  }
  .cert-detail__info-row {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-2, 4px);
  }
  .cert-detail__info-label {
    font-size: 17px;
  }
  .cert-detail__info-value {
    font-size: 17px;
    flex-wrap: wrap;
  }
  .cert-detail__progress {
    width: 100%;
  }
  .cert-detail__review-heading {
    font-size: 19px;
  }
  .cert-detail__review-desc {
    font-size: 17px;
  }
  .cert-detail__review-form {
    padding: var(--krds-padding-5, 16px);
    gap: var(--krds-gap-7, 24px);
  }
  .cert-detail__review-q-label {
    font-size: 17px;
  }
  .cert-detail__star-rating {
    gap: var(--krds-gap-3, 8px);
  }
  .cert-detail__star {
    width: 36px;
    height: 34px;
  }
  .cert-detail__star svg {
    width: 36px;
    height: 34px;
  }
  .cert-detail__actions {
    flex-direction: column-reverse;
    gap: var(--krds-gap-3, 8px);
  }
  .cert-detail__actions-left,
  .cert-detail__actions-right {
    width: 100%;
  }
  .cert-detail__actions-right {
    justify-content: flex-end;
  }
  .cert-detail__actions .krds-btn {
    height: 56px;
    font-size: 17px;
    flex:1;
  }
  .cert-detail__actions-left .krds-btn {
    width: 100%;
  }
}

/* 수료 상세 고대비 모드 */
[data-krds-mode="high-contrast"] .cert-detail__card {
  border-color: var(--krds-high-contrast-color-border-gray);
  background: var(--krds-high-contrast-color-background-white);
}
[data-krds-mode="high-contrast"] .cert-detail__cert-mini {
  background: var(--krds-high-contrast-color-surface-information-subtler);
  border-color: var(--krds-high-contrast-color-border-primary);
}
[data-krds-mode="high-contrast"] .cert-detail__cert-title,
[data-krds-mode="high-contrast"] .cert-detail__info-heading,
[data-krds-mode="high-contrast"] .cert-detail__review-heading {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .cert-detail__info-row {
  border-color: var(--krds-high-contrast-color-divider-gray-light);
}
[data-krds-mode="high-contrast"] .cert-detail__info-row--first {
  border-top-color: var(--krds-high-contrast-color-divider-gray);
}
[data-krds-mode="high-contrast"] .cert-detail__review-form {
  background: var(--krds-high-contrast-color-surface-gray-subtler);
}

/* 수료 및 증명 고대비 모드 */
[data-krds-mode="high-contrast"] .cert-status-card {
  border-color: var(--krds-high-contrast-color-divider-gray-light);
}
[data-krds-mode="high-contrast"] .cert-status-card--available {
  background: var(--krds-high-contrast-color-surface-primary-subtler);
}
[data-krds-mode="high-contrast"] .cert-status-card--total {
  background: var(--krds-high-contrast-color-surface-success-subtler);
}
[data-krds-mode="high-contrast"] .cert-status-card--complete {
  background: var(--krds-high-contrast-color-surface-gray-subtler);
}
[data-krds-mode="high-contrast"] .cert-status-card__label,
[data-krds-mode="high-contrast"] .cert-status-card__count {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .cert-item {
  border-color: var(--krds-high-contrast-color-border-gray-light);
  background: var(--krds-high-contrast-color-background-white);
}
[data-krds-mode="high-contrast"] .cert-item__title {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .cert-item__date {
  color: var(--krds-high-contrast-color-text-disabled-on);
}

/* ============================================
   디지털 배지함 (myclass030300)
   ============================================ */

/* 발급 현황 요약 카드 */
.badge-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--krds-gap-5, 16px);
  width: 100%;
}
.badge-summary__card {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 16px);
  padding: 24px;
  border: 1.5px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
  border-radius: 12px;
  overflow: hidden;
}
.badge-summary__card--total {
  background-color: var(--krds-light-color-surface-primary-subtler, #ecf2fe);
}
.badge-summary__card--earned {
  background-color: var(--krds-light-color-surface-success-subtler, #eaf6ec);
}
.badge-summary__card--progress {
  background-color: var(--krds-light-color-background-white, #fff);
}
.badge-summary__card--locked {
  background-color: var(--krds-light-color-surface-gray-subtler, #f4f5f6);
}
.badge-summary__info {
  display: flex;
  align-items: center;
  gap: 10px;
}
.badge-summary__label {
  flex: 1;
  min-width: 0;
  font-size: 19px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.badge-summary__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
}
.badge-summary__icon .svg-icon {
  width: 24px;
  height: 24px;
  background-color: #fff;
}
.badge-summary__icon--primary {
  background-color: var(--krds-light-color-element-primary, #256ef4);
}
.badge-summary__icon--success {
  background-color: var(--krds-light-color-element-success, #228738);
}
.badge-summary__icon--info {
  background-color: var(--krds-light-color-divider-primary-light, #d8e5fd);
}
.badge-summary__icon--info .svg-icon {
  background-color: var(--krds-light-color-element-primary, #256ef4);
}
.badge-summary__icon--gray {
  background-color: var(--krds-light-color-element-gray, #6d7882);
}
.badge-summary__count {
  font-size: var(--krds-font-size-heading-large, 32px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.badge-summary__card--progress .badge-summary__count,
.badge-summary__card--locked .badge-summary__count {
  color: var(--krds-light-color-text-subtle, #464c53);
}

/* 배지 목록 섹션 */
.badge-list-section {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
  width: 100%;
  margin-top: var(--krds-gap-10, 40px);
}
.badge-list-section__heading {
  font-size: var(--krds-font-size-heading-medium, 24px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}

/* 배지 그리드 */
.badge-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.badge-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  border-radius: 16px;
  overflow: hidden;
  text-align: center;
  background: var(--krds-light-color-background-white, #fff);
  border: 2px solid transparent;
}
.badge-card__link {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 24px 0;
  text-decoration: none;
  color: inherit;
}
.badge-card__link:focus-visible {
  outline: 2px solid var(--krds-light-color-border-primary, #256ef4);
  outline-offset: 2px;
  border-radius: 16px;
}
.badge-card--inprogress {
  border: 2px solid var(--krds-light-color-border-primary, #256ef4);
}
.badge-card--locked {
  background: var(--krds-light-color-surface-gray-subtler, #f4f5f6);
}

.badge-card:hover,
.badge-card:focus-within {
  border: 2px solid var(--krds-light-color-border-primary, #256ef4);
  box-sizing: border-box;
}

/* 배지 이미지 */
.badge-card__image {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: #fff;
}
.badge-card__image img {
  width: 100px;
  height: auto;
  object-fit: contain;
}
.badge-card__image--luminosity {
  mix-blend-mode: luminosity;
}
.badge-card__lock {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
}
.badge-card__lock .svg-icon {
  width: 48px;
  height: 48px;
  background-color: #fff;
}

.svg-icon.ico-lock{
  background-image: url(../../img/kosac/ico_lock.svg);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-color: transparent;
}

/* 배지 정보 */
.badge-card__info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 0 16px;
  width: 100%;
  box-sizing: border-box;
}
.badge-card__name {
  font-size: var(--krds-font-size-heading-small, 19px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  word-break: keep-all;
}
.badge-card--locked .badge-card__name {
  color: var(--krds-light-color-text-disabled, #8a949e);
}
.badge-card__status {
  font-size: var(--krds-font-size-body-small, 15px);
  font-weight: 400;
  line-height: 1.5;
  margin: 0;
}
.badge-card__status--complete {
  color: var(--krds-light-color-border-success, #228738);
}
.badge-card__status--inprogress {
  color: var(--krds-light-color-border-primary, #256ef4);
}
.badge-card__status--locked {
  color: var(--krds-light-color-text-disabled, #8a949e);
}
.badge-card .myclass-progress-bar {
  width: 100%;
  margin-top: 4px;
}

/* 배지 탭 */
.badge-tab .tab-conts-wrap {
  margin-top: 0;
}
.badge-tab .tab-conts {
  margin-top: var(--krds-gap-7, 24px);
}

/* 반응형: 태블릿 */
@media (max-width: 1023px) {
  .badge-summary__label{
    order:1;
  }
  .badge-summary__label{
    order:2;
  }

  .badge-summary {
    grid-template-columns: repeat(2, 1fr);
  }
  .badge-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* 반응형: 모바일 */
@media (max-width: 767px) {
  .badge-summary {
    grid-template-columns: 1fr;
    gap: var(--krds-gap-4, 12px);
  }
  .badge-summary__card {
    flex-direction: row;
    align-items: center;
    padding: var(--krds-padding-7, 24px);
  }
  .badge-summary__info {
    flex: 1;
    min-width: 0;
  }
  .badge-summary__count {
    flex-shrink: 0;
    font-size: var(--krds-font-size-heading-medium, 24px);
  }
  .badge-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  .badge-card {
    padding: 16px 0;
  }
  .badge-card__image {
    width: 120px;
    height: 120px;
  }
  .badge-card__image img {
    width: 75px;
  }
  .badge-card__lock .svg-icon {
    width: 36px;
    height: 36px;
  }
  .badge-card__name {
    font-size: 15px;
  }
  .badge-card__status {
    font-size: 13px;
  }
  .badge-list-section__heading {
    font-size: var(--krds-font-size-heading-small, 19px);
  }
}

/* ============================================
   디지털 배지함 상세 (myclass030301)
   ============================================ */
.badge-detail {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.badge-detail__card {
  display: flex;
  align-items: flex-start;
  gap: var(--krds-gap-10, 40px);
  width: 100%;
  border-radius: var(--krds-radius-xlarge2, 12px);
  overflow: hidden;
  background: var(--krds-light-color-surface-white-subtle, #fff);
}
.badge-detail__preview {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-7, 24px);
  padding: 0 var(--krds-padding-10, 40px) var(--krds-padding-10, 40px);
}
.badge-detail__badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  width: 100%;
  padding: var(--krds-padding-7, 24px) 0;
  background: var(--krds-light-color-background-white, #fff);
  border-radius: 27px;
}
.badge-detail__badge-image {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 273px;
  height: 273px;
  border-radius: 50%;
  background: #fff;
}
.badge-detail__badge-image img {
  width: 170px;
  height: auto;
  object-fit: contain;
}
.badge-detail__badge-image--luminosity {
  mix-blend-mode: luminosity;
}
.badge-detail__badge-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-4, 12px);
  width: 100%;
  padding: 0 var(--krds-padding-5, 16px);
  text-align: center;
}
.badge-detail__badge-name {
  font-size: var(--krds-font-size-heading-large, 32px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  max-width: 25.2rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.badge-detail__badge-status {
  margin: 0;
  font-size: var(--krds-font-size-body-large, 19px);
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-border-primary, #256ef4);
}
.badge-detail__badge-info .myclass-progress-bar {
  width: 100%;
  max-width: 280px;
}
.badge-detail__download {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
  width: 100%;
}
.badge-detail__download-btn {
  width: 100%;
  height: 64px;
  border-color: var(--krds-light-color-button-disabled-border, #b1b8be);
}
.badge-detail__download-btn .svg-icon {
  width: 24px;
  height: 24px;
}
.badge-detail__download-desc {
  margin: 0;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-disabled-on, #6d7882);
  text-align: center;
}
.badge-detail__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--krds-gap-14, 64px);
}
.badge-detail__section {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
  width: 100%;
}
.badge-detail__section-heading {
  font-size: var(--krds-font-size-heading-medium, 24px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  margin: 0;
}
.badge-detail .cert-detail__info-row--stack {
  align-items: flex-start;
}
.badge-detail .cert-detail__info-value--block {
  display: block;
  white-space: normal;
  word-break: keep-all;
}
.badge-detail__tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-5, 16px);
}
.badge-detail__tag {
  display: inline-flex;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
  padding: var(--krds-padding-3, 8px) var(--krds-padding-5, 12px);
  border-radius: var(--krds-radius-xlarge2, 12px);
  background: var(--krds-light-color-surface-primary-subtler, #ecf2fe);
  font-size: var(--krds-font-size-body-medium, 17px);
  font-weight: 700;
  line-height: 1.5;
}
.badge-detail__tag--secondary {
  color: var(--krds-light-color-border-secondary, #063a74);
}
.badge-detail__tag--primary {
  color: var(--krds-light-color-border-primary, #256ef4);
}
.badge-detail__tag--primary .svg-icon {
  width: 18px;
  height: 18px;
  padding: 3px;
  border-radius: 50%;
  background: var(--krds-light-color-background-white, #fff);
  background-color: var(--krds-light-color-background-white, #fff);
}
.badge-detail__mission-list {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 16px);
  list-style: none;
  margin: 0;
  padding: 0;
}
.badge-detail__mission {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-4, 12px);
  padding: var(--krds-padding-7, 24px);
  border: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
  border-radius: 12px;
  background: var(--krds-light-color-background-white, #fff);
}
.badge-detail__mission--active {
  border: 1px solid var(--krds-light-color-border-primary, #256ef4);
}
.badge-detail__mission-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
}
.badge-detail__mission-icon .svg-icon {
  width: 24px;
  height: 24px;
}
.badge-detail__mission-icon--success {
  background: var(--krds-light-color-border-success-light, #d8eedd);
}
.badge-detail__mission-icon--success .svg-icon {
  background-color: var(--krds-light-color-element-success, #228738);
}
.badge-detail__mission-icon--primary {
  background: var(--krds-light-color-element-primary-light, #d8e5fd);
}
.badge-detail__mission-icon--primary .svg-icon {
  background-color: var(--krds-light-color-element-primary, #256ef4);
}
.badge-detail__mission-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-1, 4px);
}
.badge-detail__mission-title {
  font-size: var(--krds-font-size-heading-small, 19px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.badge-detail__mission-desc {
  margin: 0;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
  overflow: hidden;
  text-overflow: ellipsis;
}
.badge-detail__mission-action {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-1, 4px);
}
.badge-detail__mission-date {
  font-size: 17px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
}
.badge-detail__mission-action .krds-btn {
  min-width: 102px;
  height: 40px;
}
.badge-detail__actions {
  margin-top: var(--krds-gap-14, 64px);
}

/* 배지 상세 반응형 (태블릿) */
@media (max-width: 1023px) {
  .badge-detail__card {
    flex-direction: column;
  }
  .badge-detail__preview {
    padding: var(--krds-padding-7, 24px);
  }
  .badge-detail__body {
    padding: 0 var(--krds-padding-7, 24px) var(--krds-padding-7, 24px);
    gap: var(--krds-gap-10, 40px);
  }
  .badge-detail__badge-image {
    width: 200px;
    height: 200px;
  }
  .badge-detail__badge-image img {
    width: 120px;
  }
  .badge-detail__badge-name {
    font-size: var(--krds-font-size-heading-medium, 24px);
  }
}

/* 배지 상세 반응형 (모바일) */
@media (max-width: 767px) {
  .badge-detail__card {
    flex-direction: column;
    gap: var(--krds-gap-10, 40px);
    background: transparent;
  }
  .badge-detail__preview {
    padding: 0 var(--krds-padding-7, 24px) var(--krds-padding-10, 40px);
    width: 100%;
  }
  .badge-detail__badge {
    padding: var(--krds-padding-7, 24px) 0;
    border-radius: 27px;
    width: 100%;
  }
  .badge-detail__badge-image {
    width: 273px;
    height: 273px;
  }
  .badge-detail__badge-image img {
    width: 170px;
  }
  .badge-detail__badge-name {
    font-size: var(--krds-font-size-heading-small, 19px);
  }
  .badge-detail__badge-status {
    font-size: 17px;
  }
  .badge-detail__download-btn {
    height: 64px;
    font-size: 17px;
  }
  .badge-detail__download-desc {
    font-size: 15px;
  }
  .badge-detail__body {
    padding: 0;
    gap: var(--krds-gap-14, 64px);
  }
  .badge-detail__section-heading {
    font-size: var(--krds-font-size-heading-medium, 24px);
  }
  .badge-detail .cert-detail__info-row {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-2, 4px);
  }
  .badge-detail .cert-detail__info-label,
  .badge-detail .cert-detail__info-value {
    font-size: 17px;
  }
  .badge-detail__mission {
    display: grid;
    grid-template-columns: 40px 1fr;
    column-gap: var(--krds-gap-3, 8px);
    row-gap: var(--krds-gap-3, 8px);
    align-items: center;
    padding: var(--krds-padding-7, 24px);
  }
  .badge-detail__mission-info,
  .badge-detail__mission-action {
    display: contents;
  }
  .badge-detail__mission-icon {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
  }
  .badge-detail__mission-title {
    grid-column: 2;
    grid-row: 1;
    font-size: 22px;
  }
  .badge-detail__mission-desc {
    grid-column: 1 / -1;
    grid-row: 2;
    white-space: normal;
  }
  .badge-detail__mission-date {
    grid-column: 1 / -1;
    grid-row: 3;
  }
  .badge-detail__mission-action .krds-btn {
    grid-column: 1 / -1;
    grid-row: 4;
    width: 100%;
    min-width: 0;
    height: 48px;
    margin-top: var(--krds-gap-5, 16px);
    font-size: 17px;
  }
  .badge-detail__mission:not(:has(.badge-detail__mission-date)) .krds-btn {
    grid-row: 3;
  }
  .badge-detail__actions {
    margin-top: var(--krds-gap-10, 40px);
  }
  .badge-detail__actions.cert-detail__actions {
    flex-direction: row;
    justify-content: flex-end;
    gap: var(--krds-gap-5, 16px);
  }
  .badge-detail__actions .cert-detail__actions-left,
  .badge-detail__actions .cert-detail__actions-right {
    width: auto;
    flex: 1;
  }
  .badge-detail__actions .cert-detail__actions-right {
    justify-content: stretch;
  }
  .badge-detail__actions .krds-btn {
    flex: 1;
    width: 100%;
    height: 64px;
    font-size: var(--krds-font-size-label-large, 19px);
  }
}

/* ============================================
   학습지원 연계 사이트 (support020100)
   ============================================ */
.support-link-content {
  width: 100%;
}
.support-link-tab.myclass-tab {
  margin-bottom: 0;
}
.support-link-tab.myclass-tab .tab-conts-wrap {
  margin-top: var(--krds-gap-9, 48px);
}
.link-site-list {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
  list-style: none;
  margin: 0;
  padding: 0;
}
.link-site-card__inner {
  display: flex;
  gap: var(--krds-gap-8, 32px);
  padding: var(--krds-padding-card-medium, 32px);
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-xlarge2, 12px);
  background: var(--krds-light-color-surface-white-subtle, #fff);
}
.link-site-card__thumb {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 320px;
  height: 180px;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
}
.link-site-card__thumb-label {
  position: relative;
  z-index: 1;
  font-size: var(--krds-font-size-heading-small, 19px);
  font-weight: 700;
  color: #fff;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}
.link-site-card__thumb--ebs {
  background: linear-gradient(127deg, #5c22b9 13.78%, #fb29ff 105.91%);
}
.link-site-card__thumb--school {
  background: linear-gradient(135deg, #256ef4 0%, #0b50d0 100%);
}
.link-site-card__thumb--kooc {
  background: linear-gradient(135deg, #1d7a4e 0%, #063a74 100%);
}
.link-site-card__thumb--knoun {
  background: linear-gradient(135deg, #e65100 0%, #bf360c 100%);
}
.link-site-card__thumb--step {
  background: linear-gradient(135deg, #00838f 0%, #004d40 100%);
}
.link-site-card__thumb--digital {
  background: linear-gradient(135deg, #6a1b9a 0%, #4527a0 100%);
}
.link-site-card__thumb--smba {
  background: linear-gradient(135deg, #c62828 0%, #880e4f 100%);
}
.link-site-card__thumb--kmooc {
  background: linear-gradient(135deg, #1565c0 0%, #283593 100%);
}
.link-site-card__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
}
.link-site-card__head {
  display: flex;
  align-items: center;
}
.link-site-card__badge {
  height: 28px;
  padding: 0 var(--krds-padding-3, 8px);
  border: none;
  border-radius: var(--krds-radius-small2, 4px);
  background: var(--krds-light-color-element-primary-lighter, #ecf2fe);
  color: var(--krds-light-color-text-primary, #0b50d0);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
}
.link-site-card__content {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-1, 4px);
}
.link-site-card__title {
  margin: 0;
  font-size: var(--krds-font-size-heading-medium, 24px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.link-site-card__desc {
  margin: 0;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
  word-break: keep-all;
}
.link-site-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-3, 8px);
}
.link-site-card__tags .krds-tag.small {
  height: 32px;
  padding: var(--krds-padding-3, 8px) 10px;
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-max, 1000px);
  background: var(--krds-light-color-action-white, #fff);
  color: var(--krds-light-color-text-subtle, #464c53);
  font-size: 15px;
}
.link-site-card__action {
  display: flex;
  justify-content: flex-end;
  margin-top: auto;
}
.link-site-card__action .krds-btn {
  min-width: 115px;
  height: 48px;
  padding: 0 var(--krds-padding-6, 16px);
  font-size: 17px;
}
.link-site-card__action .krds-btn .svg-icon {
  width: 20px;
  height: 20px;
}
.support-link-pagination {
  margin-top: var(--krds-gap-14, 64px);
}

/* 학습지원 연계 사이트 반응형 */
@media (max-width: 1023px) {
  .link-site-card__inner {
    flex-direction: column;
  }
  .link-site-card__thumb {
    width: 100%;
    max-width: 100%;
  }
}

@media (max-width: 767px) {
  .support-link-tab.myclass-tab .tab-conts-wrap {
    margin-top: var(--krds-gap-7, 24px);
  }
  .link-site-card__inner {
    padding: var(--krds-padding-5, 16px);
    gap: var(--krds-gap-5, 16px);
  }
  .link-site-card__thumb {
    height: 160px;
  }
  .link-site-card__title {
    font-size: var(--krds-font-size-heading-small, 19px);
  }
  .link-site-card__desc {
    font-size: 15px;
  }
  .link-site-card__action .krds-btn {
    width: 100%;
    min-width: 0;
  }
  .support-link-pagination {
    margin-top: var(--krds-gap-10, 40px);
  }
}

/* ============================================
   찾아오시는 길 (policy080700)
   ============================================ */
.direction-content {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
  width: 100%;
}
.direction-map-area {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
  width: 100%;
}
.direction-map {
  width: 100%;
  height: 240px;
  border-radius: var(--krds-radius-xlarge2, 12px);
  overflow: hidden;
  background: var(--krds-light-color-background-gray-subtle, #e6e8ea);
}
.direction-map__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.direction-map__action {
  display: flex;
  justify-content: flex-end;
  width: 100%;
}
.direction-map__action .krds-btn {
  min-width: 78px;
  height: 48px;
  padding: 0 var(--krds-padding-6, 16px);
  font-size: 17px;
}
.direction-map__action .krds-btn .svg-icon {
  width: 20px;
  height: 20px;
}
.direction-detail {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-14, 64px);
  width: 100%;
}
.direction-section {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
  width: 100%;
}
.direction-section__title.sec-tit {
  margin: 0;
  font-size: var(--krds-font-size-heading-medium, 24px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.direction-info-list {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-4, 12px);
  list-style: none;
  margin: 0;
  padding: 0;
}
.direction-info-item {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
}
.direction-info__icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-color: var(--krds-light-color-text-basic, #1e2124);
}
.svg-icon.ico-map-pin {
  -webkit-mask-image: url(../../img/kosac/ico_map_pin.svg);
  mask-image: url(../../img/kosac/ico_map_pin.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.svg-icon.ico-phone {
  -webkit-mask-image: url(../../img/kosac/ico_phone.svg);
  mask-image: url(../../img/kosac/ico_phone.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.direction-info__text {
  flex: 1;
  min-width: 0;
  font-size: var(--krds-font-size-body-large, 19px);
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  word-break: keep-all;
}
.direction-transport {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-10, 32px);
}
.direction-transport__block {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
  max-width: 814px;
}
.direction-transport__head {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
}
.direction-transport__icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-color: transparent !important;
}
.svg-icon.ico-car {
  background-image: url(../../img/kosac/ico_car.svg);
}
.svg-icon.ico-bus {
  background-image: url(../../img/kosac/ico_bus.svg);
}
.direction-transport__title {
  margin: 0;
  font-size: var(--krds-font-size-body-large, 19px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.direction-transport__desc {
  margin: 0;
  font-size: var(--krds-font-size-body-large, 19px);
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  word-break: keep-all;
}
.direction-transport__list {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-4, 12px);
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: var(--krds-font-size-body-large, 19px);
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  word-break: keep-all;
}

/* 찾아오시는 길 반응형 */
@media (max-width: 767px) {
  .direction-map {
    height: 200px;
  }
  .direction-section__title.sec-tit {
    font-size: var(--krds-font-size-heading-small, 19px);
  }
  .direction-info__text,
  .direction-transport__desc,
  .direction-transport__list,
  .direction-transport__title {
    font-size: 17px;
  }
  .direction-map__action .krds-btn {
    width: 100%;
  }
  .direction-detail {
    gap: var(--krds-gap-10, 40px);
  }
}

/* ============================================
   에러 페이지 (error090100)
   ============================================ */
.error-page {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding-bottom: var(--krds-gap-14, 64px);
}
.error-page__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-10, 40px);
  width: 100%;
}
.error-page__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  width: 100%;
  max-width: 100%;
}
.error-page__visual {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 180px;
  height: 120px;
}
.error-page__illust {
  width: 100%;
  height: auto;
  max-height: 120px;
  object-fit: contain;
}
.error-page__message {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  width: 100%;
  text-align: center;
}
.error-page__title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}
.error-page__code {
  display: block;
  font-size: var(--krds-font-size-heading-large, 32px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: var(--krds-letter-spacing-1, 1px);
  color: var(--krds-light-color-text-primary, #0b50d0);
}
.error-page__headline {
  display: block;
  font-size: var(--krds-font-size-heading-large, 32px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: var(--krds-letter-spacing-1, 1px);
  color: var(--krds-light-color-text-basic, #1e2124);
}
.error-page__desc {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.error-page__desc p {
  margin: 0;
  font-size: var(--krds-font-size-body-medium, 17px);
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  word-break: keep-all;
}
.error-page__actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
  width: 100%;
}
.error-page__btn {
  min-width: 98px;
  width: 200px;
  height: 64px;
  box-sizing: border-box;
}

/* 에러 페이지 반응형 (모바일) */
@media (max-width: 767px) {
  .error-page {
    padding-bottom: var(--krds-gap-10, 40px);
  }
  .error-page__body {
    gap: var(--krds-gap-8, 32px);
  }
  .error-page__visual {
    width: 150px;
    height: 100px;
  }
  .error-page__illust {
    max-height: 100px;
  }
  .error-page__code,
  .error-page__headline {
    font-size: var(--krds-font-size-heading-medium, 24px);
    letter-spacing: var(--krds-letter-spacing-0, 0);
  }
  .error-page__desc p {
    font-size: var(--krds-font-size-body-medium, 17px);
    white-space: normal;
  }
  .error-page__actions {
    flex-direction: column;
    align-items: stretch;
  }
  .error-page__btn {
    width: 100%;
    min-width: 0;
  }
}

/* ============================================
   페이지 준비중 (preparing100000)
   ============================================ */
.preparing-page {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding-bottom: var(--krds-gap-14, 64px);
}
.preparing-page__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: 8rem 0;
}
.preparing-page__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  width: 100%;
  text-align: center;
}
.preparing-page__visual {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18rem;
  height: 12rem;
}
.preparing-page__illust {
  display: block;
  width: 100%;
  height: auto;
  max-height: 12rem;
  object-fit: contain;
}
.preparing-page__title {
  margin: 0;
  font-size: var(--krds-pc-font-size-heading-large, 32px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: var(--krds-letter-spacing-1, 1px);
  color: var(--krds-light-color-text-basic, #1e2124);
  word-break: keep-all;
}
.preparing-page__desc {
  margin: 0;
  font-size: var(--krds-pc-font-size-body-medium, 17px);
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  word-break: keep-all;
}
.preparing-page__desc-line + .preparing-page__desc-line::before {
  content: ' ';
}

/* 페이지 준비중 반응형 (모바일) */
@media (max-width: 767px) {
  .preparing-page {
    padding-bottom: var(--krds-gap-14, 64px);
  }
  .preparing-page__body {
    /* 모바일: 상단 여백 축소 */
    padding: var(--krds-gap-9, 32px) 0 0;
  }
  .preparing-page__visual {
    width: 15rem;
    height: 10rem;
  }
  .preparing-page__illust {
    max-height: 10rem;
  }
  .preparing-page__title {
    font-size: var(--krds-mobile-font-size-heading-large, 32px);
    letter-spacing: var(--krds-letter-spacing-1, 1px);
  }
  .preparing-page__desc {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: var(--krds-mobile-font-size-body-medium, 17px);
  }
  .preparing-page__desc-line {
    display: block;
  }
  .preparing-page__desc-line + .preparing-page__desc-line::before {
    content: none;
  }
}

/* ============================================
   메인 페이지 (main.html)
   ============================================ */
.main-home-hero.main-vban-wrap {
  position: relative;
  overflow: hidden;
  min-height: 65.8rem;
  margin-top: 0;
  background-color: #d9eefc;
}
.main-home-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
}
.main-home-hero__bg .swiper-wrapper,
.main-home-hero__bg .swiper-slide {
  height: 100%;
}
.main-home-hero__banner {
  display: block;
  width: 100%;
  height: 100%;
}
.main-home-hero__banner img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.main-home-hero .main-home-hero__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: 65.8rem;
  padding-bottom: var(--krds-padding-10, 40px);
  pointer-events: none;
}
.main-home-hero .main-home-hero__inner a,
.main-home-hero .main-home-hero__inner button,
.main-home-hero .main-home-hero__inner input {
  pointer-events: auto;
}
.main-home-hero__bottom {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin-top: auto;
}
.main-home-hero__sch-wrap {
  width: 100%;
  max-width: 80rem;
  margin-top: 0;
}
.main-home-hero__sch.main-top-sch {
  width: 100%;
  margin: 0;
  padding-top: 0;
}
.main-home-hero__sch .sch-form-wrap {
  gap: var(--krds-gap-7, 24px);
  align-items: flex-start;
  width: 100%;
  flex-direction: column;
}
.main-home-hero__sch .sch-input {
  display: flex;
  align-items: center;
  gap: var(--krds-padding-3, 8px);
  width: 100%;
  max-width: 80rem;
  min-height: 8rem;
  padding: var(--krds-padding-5, 16px) var(--krds-padding-6, 24px) var(--krds-padding-5, 16px) var(--krds-padding-8, 32px);
  border-radius: var(--krds-radius-max, 1000px);
  background: var(--krds-light-color-surface-white-subtle, #fff);
  box-shadow: 0 8px 12px rgba(31, 31, 31, 0.16);
}
.main-home-hero__sch .sch-input .krds-input {
  flex: 1;
  min-width: 0;
  border: 0;
  box-shadow: none;
  padding: 0;
  min-height: 0;
  height: auto;
  font-size: var(--krds-pc-font-size-body-large, 19px);
  background: transparent;
}
.main-home-hero__sch .sch-input .krds-input:focus {
  outline: none;
  box-shadow: none;
}
.main-home-hero__sch .sch-input .krds-btn.ico-search {
  position: static;
  top: auto;
  right: auto;
  transform: none;
  flex-shrink: 0;
  width: 4.8rem;
  height: 4.8rem;
  min-width: 4.8rem;
  border-radius: 50%;
  /* 검색 버튼: Figma icon/secondary */
  background: var(--krds-light-color-icon-secondary, #052b57);
  color: #fff;
}
.main-home-hero__sch .sch-input .krds-btn.ico-search .svg-icon {
  width: 2.4rem;
  height: 2.4rem;
  filter: brightness(0) invert(1);
}
/* AI 채팅 버튼 (배너 검색창) */
.main-home-hero__ai-chat {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: var(--krds-radius-max, 99px);
  cursor: pointer;
  line-height: 0;
}
.main-home-hero__ai-chat:focus-visible {
  outline: 2px solid var(--krds-light-color-border-primary, #256ef4);
  outline-offset: 2px;
}
.main-home-hero__ai-chat-img {
  display: block;
  width: 5.3rem;
  height: 4.8rem;
  object-fit: contain;
}
.main-home-hero__sch .sch-tag {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--krds-gap-7, 24px);
  width: 100%;
  margin: 0;
}
.main-home-hero__sch .sch-tag dt {
  flex-shrink: 0;
  margin: 0;
  font-size: var(--krds-pc-font-size-body-medium, 17px);
  font-weight: 700;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.main-home-hero__sch .sch-tag dd {
  margin: 0;
  flex: 1;
  min-width: 0;
}
.main-home-hero__sch .sch-tag .krds-tag-wrap {
  gap: var(--krds-gap-3, 8px);
}
.main-home-hero__sch .sch-tag .krds-btn-tag {
  height: 4rem;
  padding: 0 var(--krds-padding-4, 10px);
  border-color: var(--krds-light-color-border-gray, #b1b8be);
  border-radius: var(--krds-radius-max, 1000px) !important;
  background: rgba(255, 255, 255, 0.7);
  font-size: var(--krds-pc-font-size-label-small, 15px);
}
.main-home-hero__controls.swiper-indicator {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--krds-gap-3, 8px);
  width: 100%;
  margin-top: 0;
  padding-top: var(--krds-gap-7, 24px);
}
.main-home-hero__controls-pagination {
  flex: 1 0 0;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 13rem;
}
.main-home-hero__controls .swiper-pagination {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--krds-gap-2, 4px);
  width: auto;
  padding: var(--krds-padding-6, 16px);
  border:none !important;
  background: transparent !important;
}
.main-home-hero__controls .swiper-pagination-bullet {
  width: 0.8rem;
  height: 0.8rem;
  margin: 0 !important;
  border-radius: 0.8rem;
  background: var(--krds-light-color-element-gray, #6d7882);
  opacity: 1;
  transition: width 0.2s ease, background-color 0.2s ease;
}
.main-home-hero__controls .swiper-pagination-bullet-active {
  width: 2rem;
  background: var(--krds-light-color-element-primary, #256ef4);
}
.main-home-hero__controls-nav {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
  flex-shrink: 0;
}
.main-home-hero__controls .main-home-hero__autoplay,
.main-home-hero__controls .main-home-hero__nav-btn {
  position: static;
  margin: 0;
  transform: none;
  width: 4rem;
  height: 4rem;
  min-width: 4rem;
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: 50%;
  background: var(--krds-light-color-surface-white-subtle, #fff);
}
.main-home-hero__controls .main-home-hero__nav-btn::after {
  display: none;
}

.main-home-sect-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--krds-gap-5, 16px);
}
.main-home-sect-head.center {
  justify-content: center;
  text-align: center;
}
.main-home-sect-head.center .main-home-sect-head__text {
  align-items: center;
}
.main-home-sect-head__text {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
}
.main-home-sect-head .sec-tit {
  margin: 0;
  font-size: var(--krds-pc-font-size-heading-large, 32px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.main-home-sect-head .sec-desc {
  margin: 0;
  font-size: var(--krds-pc-font-size-body-large, 19px);
  color: var(--krds-light-color-text-subtle, #464c53);
}
.main-home-sect-head__nav {
  display: none;
}
.main-home-sect-head--course {
  position: relative;
  width: 100%;
  padding-right: 5.6rem;
}
.main-home-sect-head__more {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.main-home-course {
  padding: var(--krds-padding-10, 40px) 0 var(--krds-number-18, 80px);
}
.main-home-course .inner {
  display: flex;
  flex-direction: column;
  gap: var(--krds-number-18, 64px);
}
.main-home-course__intro {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-9, 40px);
}

.main-home-category.menu-list {
  position: relative;
  margin-top: 0;
}
.main-home-category__wrap {
  position: relative;
}
.main-home-category__scroll {
  padding: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}
.main-home-category__scroll::-webkit-scrollbar {
  display: none;
}
.main-home-category__list {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--krds-gap-5, 16px);
  width: max-content;
  margin: 0;
  padding: 0;
  list-style: none;
}
.main-home-category__item {
  flex-shrink: 0;
  width: auto;
}
.main-home-category .menu-item .ico {
  border-radius: 0;
  background-color: transparent;
}
.main-home-category__btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
  width: 100%;
  min-width: 8rem;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.main-sect .menu-list .menu-item .main-home-category__btn .ico {
  display: flex;
  align-items: center;
  justify-content: center;
  /* 아이콘: Figma 64x64 */
  width: 6.4rem;
  height: 6.4rem;
  background: transparent !important;
}
.main-home-category__btn .ico img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.main-home-category__btn .txt {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 8rem;
  height: 5.6rem;
  padding: 0 var(--krds-padding-3, 8px);
  border-bottom: 4px solid transparent;
  font-size: var(--krds-pc-font-size-heading-small, 19px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
  text-align: center;
  white-space: nowrap;
  box-sizing: border-box;
}
.main-home-category__btn.active .txt {
  border-bottom-color: var(--krds-light-color-border-primary, #256ef4);
  color: var(--krds-light-color-text-secondary, #052b57);
}

.main-home-category__more {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  pointer-events: none;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}
.main-home-category__more.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.main-home-category__more-fade {
  flex-shrink: 0;
  width: 2.4rem;
  height: 100%;
  background: linear-gradient(
    to right,
    rgba(255, 255, 255, 0),
    var(--krds-light-color-surface-white-subtle, #fff)
  );
}
.main-home-category__more-btn {
  pointer-events: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 3.2rem;
  height: 3.2rem;
  margin: 0;
  padding: 0;
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-max, 1000px);
  background: var(--krds-light-color-action-white, #fff);
  cursor: pointer;
}
.main-home-category__more-btn .svg-icon {
  width: 1.92rem;
  height: 1.92rem;
}
.main-home-category__more-btn:focus-visible {
  outline: 2px solid var(--krds-light-color-border-primary, #256ef4);
  outline-offset: 2px;
}

@media (min-width: 768px) {
  .main-home-category__more {
    display: none;
  }
  .main-home-category__scroll {
    overflow: visible;
  }
  .main-home-category__list {
    justify-content: center;
    width: 100%;
    gap: var(--krds-gap-7, 24px);
  }
}

@media (max-width: 767px) {
  .main-home-category__wrap {
    margin-inline: calc(var(--krds-contents-padding-x) * -1);
  }
  .main-home-category__scroll {
    margin-inline: 0;
    padding-inline: var(--krds-contents-padding-x);
  }
  .main-home-category__more {
    padding-right: var(--krds-contents-padding-x);
    background: var(--krds-light-color-surface-white-subtle, #fff);
  }
}

.main-home-course__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--krds-number-18, 64px) var(--krds-gap-7, 24px);
  list-style: none;
  margin: 0;
  padding: 0;
}
.main-home-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.main-home-course-card {
  position: relative;
  border-radius: var(--krds-radius-xlarge2, 16px);
  overflow: hidden;
  background: var(--krds-light-color-surface-white-subtle, #fff);
}
.main-home-course-card__link {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: inherit;
}
.main-home-course-card__thumb {
  position: relative;
  aspect-ratio: 282 / 210;
  overflow: visible;
  background-color: var(--krds-light-color-surface-white-subtle, #fff);
}
.main-home-course-card__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  -webkit-clip-path: url(#main-course-thumb-clip);
  clip-path: url(#main-course-thumb-clip);
}
.main-home-course-card__badge {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 5.9rem;
  height: 3.2rem;
  padding: 0 var(--krds-padding-5, 10px);
  border-radius: var(--krds-radius-xlarge2, 16px);
  font-size: var(--krds-pc-font-size-label-medium, 17px);
  font-weight: 400;
  line-height: 1.5;
  white-space: nowrap;
}
.main-home-course-card__badge--beginner {
  background: var(--krds-light-color-high-contrast-warning-10, #ffe0a3);
  color: var(--krds-light-color-text-warning, #8a5c00);
}
.main-home-course-card__badge--intermediate {
  background: #d8eedd;
  color: #267337;
}
.main-home-course-card__badge--advanced {
  background: #fcdfd9;
  color: var(--krds-light-color-text-danger, #bd2c0f);
}
.main-home-course-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
  padding-top: var(--krds-padding-6, 20px);
}
.main-home-course-card__info {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
}
.main-home-course-card__org {
  font-size: var(--krds-pc-font-size-label-large, 15px);
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-primary, #0b50d0);
}
.main-home-course-card__title {
  margin: 0;
  font-size: var(--krds-pc-font-size-heading-xsmall, 19px);
  font-weight: 700;
  line-height: 1.5;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.main-home-course-card__desc {
  margin: 0;
  min-height: 5.2rem;
  font-size: var(--krds-pc-font-size-body-medium, 17px);
  color: var(--krds-light-color-text-subtle, #464c53);
  line-height: 1.5;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.main-home-course-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-3, 8px);
}
.main-home-course-card__tags .krds-tag.outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 4rem;
  padding: var(--krds-padding-3, 8px) var(--krds-padding-5, 12px);
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-max, 1000px);
  background: var(--krds-light-color-surface-white-subtle, #fff);
  font-size: var(--krds-pc-font-size-label-medium, 17px);
  font-weight: 400;
  color: var(--krds-light-color-text-subtle, #464c53);
  line-height: 1.5;
}

.main-home-board-wrap {
  padding: var(--krds-number-18, 80px) 0;
  background-color: #F4F5F6;
}
.main-home-board {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4rem;
  align-items: stretch;
}
.main-home-board__col {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
  min-width: 0;
  min-height: 43.4rem;
}
.main-home-board__col--event {
  align-self: stretch;
}
.main-home-board__head {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: var(--krds-gap-2, 6px);
  margin-bottom: 0;
}
.main-home-board__title {
  flex: 1;
  margin: 0;
  font-size: var(--krds-pc-font-size-heading-large, 32px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 1px;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.main-home-board__more {
  flex-shrink: 0;
  gap: var(--krds-gap-2, 4px);
  padding: var(--krds-padding-1, 2px);
  font-size: var(--krds-pc-font-size-label-medium, 17px);
  font-weight: 400;
  color: var(--krds-light-color-text-basic, #1e2124);
  text-decoration: none;
}
.main-home-board__more .svg-icon {
  width: 2rem;
  height: 2rem;
}
.main-home-board__body {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 16px);
}
.main-home-board__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-3, 8px);
}
.main-home-board__tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 5.6rem;
  padding: 0 var(--krds-padding-5, 12px);
  border: 0;
  border-bottom: 4px solid transparent;
  background: transparent;
  font-size: var(--krds-pc-font-size-heading-small, 19px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
  white-space: nowrap;
  cursor: pointer;
}
.main-home-board__tab.active {
  border-bottom-color: var(--krds-light-color-border-primary, #256ef4);
  color: var(--krds-light-color-text-secondary, #052b57);
}
.main-home-board__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.main-home-board__col > .main-home-board__list:not(.main-home-board__list--seminar) {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.main-home-board__col > .main-home-board__list:not(.main-home-board__list--seminar) > li {
  flex: 1;
  min-height: 0;
}
.main-home-board__col > .main-home-board__list:not(.main-home-board__list--seminar) .main-home-board__item {
  height: 100%;
}
.main-home-board__item {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  padding: var(--krds-padding-5, 16px) 0;
  text-decoration: none;
  color: inherit;
}
.main-home-board__item .tit {
  flex: 1;
  min-width: 0;
  font-size: var(--krds-pc-font-size-body-medium, 17px);
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.main-home-board__item .date {
  flex-shrink: 0;
  font-size: var(--krds-pc-font-size-body-medium, 17px);
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
  text-align: right;
}
.main-home-board__list--seminar {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-4, 12px);
  flex: 1;
  min-height: 0;
}
.main-home-board__seminar-card {
  flex: 1;
  min-height: 0;
}
.main-home-board__seminar-link {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
  height: 100%;
  padding: var(--krds-padding-6, 16px) var(--krds-padding-8, 24px);
  border: 1px solid var(--krds-light-color-border-secondary-light, #d6e0eb);
  border-radius: var(--krds-radius-xlarge2, 16px);
  background: var(--krds-light-color-surface-white, #fff);
  text-decoration: none;
  color: inherit;
}
.main-home-board__seminar-card:first-child .main-home-board__seminar-link {
  padding-block: var(--krds-padding-6, 16px);
}
.main-home-board__seminar-card:not(:first-child) .main-home-board__seminar-link {
  padding-block: var(--krds-padding-5, 12px);
}
.main-home-board__seminar-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-1, 4px);
}
.main-home-board__seminar-tit {
  font-size: var(--krds-pc-font-size-heading-small, 19px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.main-home-board__seminar-date {
  font-size: var(--krds-pc-font-size-body-medium, 17px);
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
}
.main-home-board__status {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 7rem;
  padding: var(--krds-padding-3, 8px) var(--krds-padding-6, 16px);
  border-radius: var(--krds-radius-max, 1000px);
  font-size: var(--krds-pc-font-size-label-small, 15px);
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
}
.main-home-board__status--open {
  border: 1px solid var(--krds-light-color-element-primary, #256ef4);
  background: var(--krds-light-color-element-primary-light, #d8e5fd);
  color: var(--krds-light-color-text-primary, #0b50d0);
}
.main-home-board__status--plan {
  border: 1px solid var(--krds-light-color-element-secondary, #063a74);
  background: transparent;
  color: var(--krds-light-color-text-secondary, #052b57);
}
.main-home-board__event-wrap {
  position: relative;
  flex: 1;
  min-height: 36.2rem;
  border-radius: var(--krds-radius-xlarge2, 16px);
  overflow: hidden;
}
.main-home-board__event-swiper {
  height: 100%;
}
.main-home-board__event-swiper .swiper-slide {
  height: auto;
}
.main-home-board__event-banner {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 36.2rem;
  height: 100%;
  padding: var(--krds-padding-8, 32px);
  padding-bottom: 9.6rem;
  border-radius: var(--krds-radius-xlarge2, 16px);
  overflow: hidden;
  text-decoration: none;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.main-home-board__event-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}
.main-home-board__event-text {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-4, 12px);
}
.main-home-board__event-tit {
  margin: 0;
  font-size: var(--krds-pc-font-size-heading-medium, 24px);
  font-weight: 700;
  line-height: 1.5;
}
.main-home-board__event-desc {
  margin: 0;
  font-size: var(--krds-pc-font-size-body-small, 15px);
  font-weight: 400;
  line-height: 1.5;
}
.main-home-board__event-controls {
  position: absolute;
  left: var(--krds-padding-8, 32px);
  bottom: var(--krds-padding-8, 32px);
  z-index: 2;
  display: flex;
  align-items: center;
  gap: var(--krds-gap-2, 4px);
  padding-right: 20rem;
  pointer-events: none;
}
.main-home-board__event-controls button,
.main-home-board__event-controls .main-home-board__event-fraction {
  pointer-events: auto;
}
.main-home-board__event-fraction.swiper-pagination-fraction {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--krds-gap-2, 4px);
  width: auto;
  min-width: 6.5rem;
  height: 4rem;
  margin: 0;
  padding: 0 var(--krds-padding-6, 16px);
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-max, 1000px);
  background: var(--krds-light-color-surface-white-subtle, #fff);
  font-size: var(--krds-pc-font-size-body-medium, 17px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.main-home-board__event-fraction .swiper-pagination-current {
  color: var(--krds-light-color-text-secondary, #052b57);
}
.main-home-board__event-autoplay,
.main-home-board__event-nav {
  position: static;
  margin: 0;
  transform: none;
  width: 4rem !important;
  height: 4rem !important;
  min-width: 4rem;
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5) !important;
  border-radius: 50% !important;
  background: var(--krds-light-color-surface-white-subtle, #fff) !important;
}
.main-home-board__event-nav::after {
  display: none;
}

.main-home-sponsor__wrap {
  position: relative;
  padding: var(--krds-padding-8, 32px) 5.6rem;
}
.main-home-sponsor__swiper .swiper-wrapper {
  align-items: center;
}
.main-home-sponsor__logo {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 4.8rem;
  padding: 0 var(--krds-padding-6, 16px);
}
.main-home-sponsor__logo img {
  width: auto;
  max-width: 100%;
  object-fit: contain;
}
/* 스폰서 로고 사이 구분 동그라미 (Figma 5px) */
.main-home-sponsor .swiper-slide + .swiper-slide .main-home-sponsor__logo::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background-color: var(--krds-light-color-border-gray-light, #cdd1d5);
}
.main-home-sponsor__prev,
.main-home-sponsor__next {
  position: absolute;
  top: 50%;
  /* transform: translateY(-50%); */
}
.main-home-sponsor__prev { left: 0; }
.main-home-sponsor__next { right: 0; }

@media (max-width: 1023px) {
  .main-home-course__grid {
    grid-template-columns: repeat(2, 1fr);
    row-gap: var(--krds-gap-9, 32px);
  }
  
  .main-home-board {
    grid-template-columns: 1fr;
    gap: var(--krds-gap-10, 48px);
  }
  .main-home-board__col {
    min-height: 0;
  }
  .main-home-board__col > .main-home-board__list:not(.main-home-board__list--seminar) {
    flex: none;
  }
  .main-home-board__col > .main-home-board__list:not(.main-home-board__list--seminar) > li {
    flex: none;
  }
  .main-home-board__col > .main-home-board__list:not(.main-home-board__list--seminar) .main-home-board__item {
    height: auto;
  }
  .main-home-board__list--seminar {
    flex: none;
  }
  .main-home-board__seminar-card {
    flex: none;
  }
  .main-home-board__seminar-link {
    height: auto;
  }
  .main-home-hero .main-home-hero__inner {
    min-height: 65.8rem;
  }
  .main-home-hero__controls-pagination {
    padding-left: 0;
  }
}

@media (max-width: 767px) {
  .main-home-hero.main-vban-wrap {
    min-height: 74.5rem;
  }
  .main-home-hero__banner img {
    object-fit: cover;
    object-position: top center;
  }
  .main-home-hero .main-home-hero__inner {
    min-height: 74.5rem;
    padding-bottom: 0;
  }
  .main-home-hero__bottom {
    flex: 1;
    gap: 0;
    margin-top: 41rem;
    justify-content: flex-end;
    max-width: none;
  }
  .main-home-hero__sch-wrap {
    max-width: none;
  }
  .main-home-hero__sch .sch-form-wrap {
    gap: var(--krds-gap-7, 24px);
  }
  .main-home-hero__sch .sch-input {
    max-width: none;
    min-height: auto;
    /* 모바일: Figma pl16 pr10 py8, gap4 */
    padding: var(--krds-padding-3, 8px) var(--krds-padding-4, 10px) var(--krds-padding-3, 8px) var(--krds-padding-6, 16px);
    gap: var(--krds-padding-2, 4px);
  }
  .main-home-hero__sch .sch-input .krds-input {
    font-size: var(--krds-mobile-font-size-body-small, 15px);
  }
  .main-home-hero__sch .sch-input .krds-btn.ico-search {
    width: 4rem !important;
    height: 4rem !important;
    min-width: 4rem !important;
  }
  .main-home-hero__sch .sch-input .krds-btn.ico-search .svg-icon {
    width: 2rem;
    height: 2rem;
  }
  .main-home-hero__ai-chat-img {
    height: 4rem;
  }
  .main-home-hero__sch .sch-tag {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-3, 8px);
  }
  .main-home-hero__controls {
    justify-content: flex-end;
    padding-top: 0;
    padding-bottom: var(--krds-padding-10, 40px);
  }
  .main-home-hero__controls-pagination {
    flex: 0 0 auto;
    padding-left: 0;
    justify-content: flex-end;
  }
  .main-home-hero__controls .swiper-pagination {
    padding: var(--krds-padding-6, 16px);
  }
  .main-home-sect-head {
    align-items: flex-start;
  }
  .main-home-course {
    padding: var(--krds-number-18, 0) 0;
  }
  .main-home-course .inner {
    gap: var(--krds-gap-10, 48px);
  }
  .main-home-course__intro {
    gap: var(--krds-gap-7, 24px);
  }
  .main-home-sect-head--course {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    padding-right: 0;
    text-align: left;
  }
  .main-home-sect-head--course .main-home-sect-head__text {
    flex: 1;
    align-items: flex-start;
    gap: var(--krds-gap-2, 4px);
  }
  .main-home-sect-head--course .sec-tit {
    font-size: var(--krds-mobile-font-size-heading-xlarge, 40px);
    letter-spacing: 1px;
  }
  .main-home-sect-head--course .sec-desc {
    font-size: var(--krds-pc-font-size-body-large, 19px);
    white-space: normal;
  }
  .main-home-sect-head__more {
    position: static;
    transform: none;
    flex-shrink: 0;
    margin-top: 0.4rem;
  }
  .main-sect .menu-list .menu-item .main-home-category__btn .ico {
    width: 6.4rem;
    height: 6.4rem;
  }
  .main-home-category__btn .txt {
    min-width: auto;
    height: 4.8rem;
    font-size: var(--krds-mobile-font-size-heading-xsmall, 17px);
  }
  .main-home-sect-head.center {
    text-align: left;
    justify-content: flex-start;
  }
  .main-home-sect-head.center .main-home-sect-head__text {
    align-items: flex-start;
  }
  .main-home-sect-head__nav {
    display: none;
  }
  .main-home-course__grid {
    grid-template-columns: 1fr;
    gap: var(--krds-number-18, 64px);
  }
  .main-home-course-card__thumb {
    aspect-ratio: auto;
    height: 24.4rem;
  }
  .main-home-course-card__body {
    padding-top: var(--krds-padding-5, 15px);
    gap: 0;
  }
  .main-home-course-card__title {
    font-size: var(--krds-mobile-font-size-heading-medium, 24px);
  }
  .main-home-board__title {
    letter-spacing: 0;
  }
  .main-home-board__event-banner {
    min-height: 28rem;
    padding-bottom: 8rem;
  }
  .main-home-board__event-controls {
    left: var(--krds-padding-6, 20px);
    bottom: var(--krds-padding-6, 20px);
    padding-right: 0;
  }
  .main-home-sponsor__wrap {
    padding-inline: var(--krds-padding-8, 32px);
  }
}

/* ============================================
   모두의 AI 챌린지 페이지 (challenge)
   ============================================ */

.challenge-page {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-9, 48px);
}

/* 배너 */
.challenge-banner {
  border-radius: var(--krds-radius-xlarge2, 16px);
  overflow: hidden;
}
.challenge-banner picture,
.challenge-banner img {
  display: block;
  width: 100%;
  height: auto;
}

/* 검색 */
.challenge-search-wrap {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 24px);
}
.challenge-search__pc {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5, 16px);
}
.challenge-search__pc .sch-input {
  width: 37rem;
  max-width: 100%;
}
.challenge-search__mo {
  display: none;
}
.challenge-search__mo .sch-input {
  width: 100%;
}

/* 탭 (myclass-tab 확장) */
.challenge-tab.myclass-tab {
  margin-bottom: 0;
}
.challenge-tab.myclass-tab .tab-conts-wrap {
  margin-top: var(--krds-gap-9, 48px);
}
.challenge-tab.myclass-tab .tab-conts {
  display: none;
}
.challenge-tab.myclass-tab .tab-conts.active {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-11, 64px);
}

/* 섹션 제목 */
.challenge-section__title {
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
  margin: 0 0 var(--krds-gap-9, 48px);
}
.challenge-section__title .challenge-section__count {
  color: var(--krds-light-color-text-primary, #0b50d0);
}

/* 카드 목록 */
.challenge-card-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--krds-gap-7, 24px) var(--krds-gap-7, 24px);
  list-style: none;
  margin: 0;
  padding: 0;
}
.challenge-card-list + .challenge-card-list {
  margin-top: var(--krds-gap-9, 48px);
}

.challenge-card {
  border-radius: 0;
}
.challenge-card__link {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  height: 100%;
}
.challenge-card__link:hover .challenge-card__title,
.challenge-card__link:focus-visible .challenge-card__title {
  text-decoration: underline;
}
.challenge-card__media {
  position: relative;
}
.challenge-card__thumb {
  position: relative;
  width: 100%;
  aspect-ratio: 210 / 251;
  overflow: visible;
  background-color: var(--krds-light-color-surface-white-subtle, #fff);
}
.challenge-card__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  -webkit-clip-path: url(#challenge-home-thumb-clip);
  clip-path: url(#challenge-home-thumb-clip);
}
.challenge-card__level {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  min-width: 5.9rem;
  height: 3.2rem;
  padding: 0 var(--krds-padding-5, 10px);
  border-radius: var(--krds-radius-xlarge2, 16px) 0 var(--krds-radius-xlarge2, 16px) 0;
  font-size: var(--krds-pc-font-size-label-medium, 1.7rem);
  line-height: 3.2rem;
}
.challenge-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 8px);
  padding-top: var(--krds-padding-5, 20px);
}
.challenge-card__provider {
  font-size: var(--krds-pc-font-size-label-small, 1.5rem);
  color: var(--krds-light-color-text-primary, #0b50d0);
  line-height: 1.5;
}
.challenge-card__title {
  font-size: var(--krds-pc-font-size-heading-small, 1.9rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 반응형: 태블릿 */
@media (max-width: 1023px) {
  .challenge-card-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* 반응형: 모바일 */
@media (max-width: 767px) {
  .challenge-page {
    gap: var(--krds-gap-8, 40px);
  }

  .challenge-search__pc {
    display: none;
  }
  .challenge-search__mo {
    display: block;
  }

  .challenge-tab.myclass-tab .tab.line.full > ul {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .challenge-tab.myclass-tab .tab.line.full > ul::-webkit-scrollbar {
    display: none;
  }
  .challenge-tab.myclass-tab .tab.line.full > ul > li {
    flex: 0 0 auto;
    min-width: auto;
  }
  .challenge-tab.myclass-tab .tab.line.full .btn-tab {
    height: 48px;
    font-size: var(--krds-mobile-font-size-heading-small, 1.9rem);
    font-weight: var(--krds-font-weight-bold);
    white-space: nowrap;
  }
  .challenge-tab.myclass-tab .tab-conts-wrap {
    margin-top: var(--krds-gap-8, 32px);
  }
  .challenge-tab.myclass-tab .tab-conts.active {
    gap: var(--krds-gap-11, 64px);
  }

  .challenge-section__title {
    font-size: var(--krds-mobile-font-size-heading-large, 2.4rem);
  }

  .challenge-card-list {
    grid-template-columns: 1fr;
    gap: var(--krds-gap-11, 64px);
  }
  .challenge-card-list + .challenge-card-list {
    margin-top: var(--krds-gap-11, 64px);
  }

  .challenge-card__thumb {
    aspect-ratio: 328 / 392;
  }
  .challenge-card__thumb img {
    -webkit-clip-path: url(#challenge-home-thumb-clip-mo);
    clip-path: url(#challenge-home-thumb-clip-mo);
    -webkit-mask-image: url(../../img/kosac/challenge/thumb_mask_mo.svg);
    mask-image: url(../../img/kosac/challenge/thumb_mask_mo.svg);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: 0 0;
    mask-position: 0 0;
  }
  .challenge-card__level {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 5.9rem;
    min-width: 5.9rem;
    height: 4.2rem;
    padding: 0 var(--krds-padding-5, 10px);
    border-radius: var(--krds-radius-xlarge2, 16px);
    font-size: var(--krds-mobile-font-size-label-large, 1.9rem);
    font-weight: var(--krds-font-weight-regular);
    line-height: 1.5;
  }
  .challenge-card__provider {
    font-size: var(--krds-mobile-font-size-label-small, 1.5rem);
  }
}

/* 고대비 모드 */
[data-krds-mode="high-contrast"] .challenge-section__title {
  color: var(--krds-high-contrast-color-text-basic);
}
[data-krds-mode="high-contrast"] .challenge-section__title .challenge-section__count {
  color: var(--krds-high-contrast-color-text-primary);
}
[data-krds-mode="high-contrast"] .challenge-card__provider {
  color: var(--krds-high-contrast-color-text-primary);
}
[data-krds-mode="high-contrast"] .challenge-card__title {
  color: var(--krds-high-contrast-color-text-basic);
}

/* ============================================
   챌린지 상세 모달
   ============================================ */

.challenge-detail-modal .modal-dialog.modal-md {
  max-width: 60rem;
  width: calc(100% - var(--krds-gap-7, 3.2rem));
}
.challenge-detail-modal .modal-content {
  align-items: stretch;
  max-height: 90%;
  padding: var(--krds-padding-card-small, 2.4rem);
}
.challenge-detail-modal .modal-conts {
  width: 100%;
  padding: 0;
  overflow-y: auto;
}
.challenge-detail-modal__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--krds-gap-5, 1.6rem);
  width: 100%;
  padding-bottom: var(--krds-padding-6, 1.7rem);
  margin-bottom: var(--krds-gap-3, 0.8rem);
  border-bottom: 1px solid #dbe5f0;
}
.challenge-detail-modal__head {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-2, 0.4rem);
  min-width: 0;
  flex: 1;
}
.challenge-detail-modal__provider {
  font-size: var(--krds-pc-font-size-label-large, 1.5rem);
  color: var(--krds-light-color-text-primary, #0b50d0);
  line-height: 1.5;
}
.challenge-detail-modal__title {
  font-size: var(--krds-pc-font-size-heading-medium, 2.4rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
  margin: 0;
}
.challenge-detail-modal .btn-close {
  position: static;
  flex-shrink: 0;
  margin: 0;
}
.challenge-detail-modal__summary {
  display: flex;
  gap: var(--krds-gap-5, 1.6rem);
  padding: var(--krds-padding-6, 1.6rem) 0;
}
.challenge-detail-modal__thumb {
  flex: 0 0 19.4rem;
  width: 19.4rem;
  height: 25.4rem;
  border-radius: var(--krds-radius-xlarge2, 1.2rem);
  overflow: hidden;
}
.challenge-detail-modal__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.challenge-detail-modal__intro {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 1.6rem);
  padding: var(--krds-padding-6, 1.6rem);
  border-radius: var(--krds-radius-xlarge2, 1.2rem);
  background: var(--krds-light-color-surface-secondary-subtler, #eef2f7);
}
.challenge-detail-modal__desc {
  margin: 0;
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
}
.challenge-detail-modal__tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-3, 0.8rem);
}
.challenge-detail-modal__meta {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-4, 1.2rem);
  margin: 0;
  padding: var(--krds-gap-3, 0.8rem) 0 var(--krds-gap-7, 2.4rem);
}
.challenge-detail-modal__meta-row {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-3, 0.8rem);
  margin: 0;
}
.challenge-detail-modal__meta-row dt {
  flex: 0 0 6rem;
  margin: 0;
  padding-right: var(--krds-gap-3, 0.8rem);
  border-right: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
  font-size: var(--krds-pc-font-size-heading-xsmall, 1.7rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-subtle, #464c53);
  line-height: 1.5;
}
.challenge-detail-modal__meta-row dt::after {
  content: none;
}
.challenge-detail-modal__meta-row dd {
  margin: 0;
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-subtle, #464c53);
  line-height: 1.5;
}
.challenge-detail-modal__meta-row .challenge-detail-modal__level {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 5.9rem;
  height: 3.2rem;
  padding: 0 var(--krds-padding-5, 1rem);
  border-radius: var(--krds-radius-xlarge2, 1.6rem);
  font-size: var(--krds-pc-font-size-label-medium, 1.7rem);
  line-height: 1.5;
}
.challenge-detail-modal__program-wrap {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-4, 1.2rem);
  padding-bottom: var(--krds-gap-3, 0.8rem);
}
.challenge-detail-modal__program-title {
  margin: 0;
  font-size: var(--krds-pc-font-size-heading-small, 1.9rem);
  font-weight: var(--krds-font-weight-bold);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
}
.challenge-detail-modal__program {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
  border-bottom: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
}
.challenge-detail-modal__program-item {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5, 1.6rem);
  padding: var(--krds-padding-7, 2rem) var(--krds-padding-6, 1.6rem);
}
.challenge-detail-modal__program-num {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 3.2rem;
  height: 3.2rem;
  border-radius: var(--krds-radius-large2, 1.2rem);
  background: var(--krds-light-color-surface-primary-subtler, #ecf2fe);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-subtle, #464c53);
  line-height: 1.5;
}
.challenge-detail-modal__program-text {
  flex: 1;
  min-width: 0;
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-subtle, #464c53);
  line-height: 1.5;
}
.challenge-detail-modal__footer {
  justify-content: flex-end;
  width: 100%;
  padding: var(--krds-gap-5, 1.6rem) 0 0;
  margin: 0;
}
.challenge-detail-modal__footer .krds-btn.disabled {
  min-width: 7.8rem;
  height: 4.8rem;
  pointer-events: none;
}

@media (max-width: 767px) {
  .challenge-detail-modal .modal-dialog.modal-md {
    width: calc(100% - var(--krds-gap-6, 3.2rem));
    max-width: none;
  }
  .challenge-detail-modal .modal-content {
    padding: var(--krds-padding-6, 1.6rem);
    max-height: 92%;
  }
  .challenge-detail-modal__title {
    font-size: var(--krds-mobile-font-size-heading-medium, 2.2rem);
  }
  .challenge-detail-modal__summary {
    flex-direction: column;
    padding-top: var(--krds-gap-3, 0.8rem);
  }
  .challenge-detail-modal__thumb {
    flex: none;
    width: 100%;
    height: auto;
    aspect-ratio: 194 / 254;
  }
  .challenge-detail-modal__meta-row {
    align-items: flex-start;
  }
  .challenge-detail-modal__meta-row dt {
    flex-basis: 6rem;
  }
  .challenge-detail-modal__program-item {
    align-items: flex-start;
  }
}

/* 플랫폼 소개 */
.platform-intro-page .conts-wrap .conts-desc p + p {
  margin-top: var(--krds-gap-4, 1.2rem);
}
.platform-intro-page .platform-intro__figure {
  border: 1px solid #ccc;
  border-radius: var(--krds-radius-xlarge1, 1.2rem);
}
.platform-intro-page .conts-wrap + .platform-intro__figure,
.platform-intro-page .platform-intro__figure + .platform-intro__figure,
.platform-intro-page .platform-intro__figure + .conts-wrap {
  margin-top: var(--krds-pc-gap-layout-h2-h3, 4rem);
}
.platform-intro-page > .conts-wrap + .conts-wrap {
  margin-top: var(--krds-pc-gap-layout-h2-h3, 4rem);
}
.platform-intro__figure picture,
.platform-intro__figure img {
  display: block;
  width: 100%;
  height: auto;
}

/* 브랜드 소개 */
.brand-intro-tab .tab-conts-wrap {
  margin-top: var(--krds-pc-gap-layout-h2-h3, 4rem);
}
.brand-intro-page {
  display: flex;
  flex-direction: column;
  gap: var(--krds-pc-gap-layout-h2-h3, 4rem);
}
.brand-intro__lead {
  text-align: center;
}
.brand-intro__lead .sec-tit {
  margin-bottom: 0;
}
.brand-intro-logo__section {
  display: flex;
  flex-direction: column;
  gap: var(--krds-pc-gap-layout-h2-h3, 4rem);
}
.brand-intro-logo__primary {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 1.6rem);
  /* padding: var(--krds-padding-9, 3.2rem) var(--krds-padding-8, 4rem) 8rem; */
  background-color: var(--krds-light-color-surface-gray-subtler, #f4f5f6);
  border-radius: var(--krds-radius-xlarge2, 1.2rem);
}
.brand-intro-logo__label {
  margin: 0;
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
}
.brand-intro-logo__img {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
}
.brand-intro-logo__img img {
  max-width: 100%;
  height: auto;
}
.brand-intro-logo__variations {
  display: flex;
  gap: var(--krds-gap-7, 2.4rem);
}
.brand-intro-logo__variation {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 3.2rem);
  /* padding: var(--krds-padding-9, 3.2rem) var(--krds-padding-8, 4rem) 8rem; */
  border-radius: var(--krds-radius-xlarge2, 1.2rem);
}
.brand-intro-logo__variation--light {
  background-color: var(--krds-light-color-surface-gray-subtler, #f4f5f6);
}
.brand-intro-logo__variation--dark {
  background-color: var(--krds-light-color-alpha-black100, #000);
}
.brand-intro-logo__variation--dark .brand-intro-logo__label {
  color: var(--krds-light-color-text-inverse-static, #fff);
}
.brand-intro-principles {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 1.6rem);
  margin: 0;
  padding: 0;
  list-style: none;
}
.brand-intro-principles__item {
  display: flex;
  gap: var(--krds-gap-7, 2.4rem);
  align-items: flex-start;
}
.brand-intro-principles__term {
  flex-shrink: 0;
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: 1.5;
  color: var(--krds-light-color-text-bolder, #131416);
}
.brand-intro-principles__desc {
  flex: 1;
  margin: 0;
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
}
.brand-intro-color {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 2.4rem);
}
.brand-intro-color__panel {
  display: flex;
  gap: var(--krds-gap-5, 1.6rem);
  padding: var(--krds-padding-8, 4rem);
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-xlarge2, 1.2rem);
}
.brand-intro-color__item {
  flex: 1;
  display: flex;
  gap: var(--krds-gap-7, 2.4rem);
  align-items: flex-start;
}
.brand-intro-color__swatch {
  flex-shrink: 0;
  width: 4rem;
  height: 4rem;
}
.brand-intro-color__swatch--deep-blue {
  background-color: #496cea;
}
.brand-intro-color__swatch--purple {
  background-color: #893eff;
}
.brand-intro-color__name {
  margin: 0;
  font-weight: var(--krds-font-weight-bold, 700);
  font-size: var(--krds-pc-font-size-heading-small, 1.9rem);
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.brand-intro-color__desc {
  margin: var(--krds-gap-3, 0.8rem) 0 0;
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
}
.brand-intro__figure {
  margin: 0;
}
.brand-intro__figure picture,
.brand-intro__figure img {
  display: block;
  width: 100%;
  height: auto;
}
.brand-intro-character__showcase {
  margin: 0;
  border-radius: var(--krds-radius-xlarge2, 1.2rem);
  overflow: hidden;
}
.brand-intro-character__showcase picture,
.brand-intro-character__showcase img {
  display: block;
  width: 100%;
  height: auto;
}
.brand-intro-character__motif {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-7, 2.4rem);
}
.brand-intro-character__motif-list {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 1.6rem);
}
.brand-intro-character__motif-item {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 1.6rem);
}
.brand-intro-character__motif-tit {
  margin: 0;
  font-size: var(--krds-pc-font-size-heading-small, 1.9rem);
  font-weight: var(--krds-font-weight-bold, 700);
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.brand-intro-character__motif-item .conts-desc p {
  margin: 0;
}
@media (max-width: 767px) {
  .brand-intro-logo__variations {
    flex-direction: column;
  }
  .brand-intro-principles__item {
    flex-direction: column;
    gap: var(--krds-gap-3, 0.8rem);
  }
  .brand-intro-color__panel {
    flex-direction: column;
  }
  .brand-intro-tab .tab.full > ul{
    width:100%;
  }
  .brand-intro-tab .tab.full > ul > li{
    flex:1;
  }
}

/* 함께하는 기관 */
.partner-page {
  display: flex;
  flex-direction: column;
  gap: var(--krds-pc-gap-layout-h2-h3, 4rem);
}
.partner-page > .conts-wrap {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 1.6rem);
}
.partner-logo-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-5, 1.6rem);
  margin: 0;
  padding: 0;
  list-style: none;
}
.partner-logo-list--gov .partner-logo-item, .partner-logo-list--org .partner-logo-item {
  flex: 0 0 calc((100% - (var(--krds-gap-5, 1.6rem) * 2)) / 3);
  max-width: calc((100% - (var(--krds-gap-5, 1.6rem) * 2)) / 3);
}
.partner-logo-item__figure {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 12rem;
  margin: 0;
  padding: var(--krds-padding-7, 2.4rem) var(--krds-padding-8, 4rem);
  background-color: var(--krds-light-color-surface-white-subtle, #fff);
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  border-radius: var(--krds-radius-xlarge2, 1.2rem);
}
.partner-logo-item__figure img {
  display: block;
  max-width: 100%;
  max-height: 4.4rem;
  width: auto;
  height: auto;
  object-fit: contain;
}
@media (max-width: 767px) {
  .partner-logo-list--gov {
    flex-direction: column;
  }
  .partner-logo-list--gov .partner-logo-item, .partner-logo-list--org .partner-logo-item {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* AI 교육 뉴스 */
.ai-edu-news-tab .tab-conts-wrap {
  margin-top: var(--krds-pc-gap-layout-h2-h3, 4rem);
}
.ai-edu-news-tab .tab-conts .ai-news-page {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 1.6rem);
}
.ai-edu-news-filter {
  align-items: flex-end;
  gap: var(--krds-gap-7, 2.4rem);
}
.ai-edu-news-filter > div:first-child {
  flex: 0 0 auto;
}
.ai-edu-news-filter > div:first-child .krds-form-select {
  width: 20.8rem;
}
.ai-edu-news-filter .ai-news-keyword-group {
  flex: 1;
  min-width: 0;
}
.ai-edu-news-filter .ai-news-filter-btn {
  flex-shrink: 0;
}
@media (max-width: 767px) {
  .ai-edu-news-tab .tab.full > ul {
    width: 100%;
  }
  .ai-edu-news-tab .tab.full > ul > li {
    min-width: 0;
  }
  .ai-edu-news-tab .tab.fill .btn-tab {
    padding-left: var(--krds-padding-3, 0.8rem);
    padding-right: var(--krds-padding-3, 0.8rem);
    font-size: var(--krds-mobile-font-size-body-medium, 1.7rem);
  }

  .ai-edu-news-tab .tab-conts-wrap, .ai-edu-news-tab .search-list-top{
    margin:0;
  }
}

/* AI 교육 자료실 */
.ai-edu-archive-tab .tab-conts-wrap {
  margin-top: var(--krds-pc-gap-layout-h2-h3, 4rem);
}
.ai-edu-archive-tab .tab-conts .ai-news-page {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 1.6rem);
}
.ai-edu-archive-tab .sch-filter-box {
  margin-top: 0;
  padding: var(--krds-padding-8, 2.4rem) var(--krds-padding-9, 3.2rem);
}
.ai-edu-archive-filter {
  align-items: flex-end;
  gap: var(--krds-gap-7, 2.4rem);
}
.ai-edu-archive-filter > div:first-child {
  flex: 0 0 auto;
}
.ai-edu-archive-filter > div:first-child .krds-form-select {
  width: 20.8rem;
}
.ai-edu-archive-filter .ai-news-keyword-group {
  flex: 1;
  min-width: 0;
}
.ai-edu-archive-filter .ai-news-filter-btn {
  flex-shrink: 0;
}
@media (max-width: 767px) {
  .ai-edu-archive-tab .tab.full > ul {
    width: 100%;
  }
  .ai-edu-archive-tab .tab.full > ul > li {
    min-width: 0;
  }
  .ai-edu-archive-tab .tab.fill .btn-tab {
    padding-left: var(--krds-padding-3, 0.8rem);
    padding-right: var(--krds-padding-3, 0.8rem);
    font-size: var(--krds-mobile-font-size-body-medium, 1.7rem);
  }

  .ai-edu-archive-tab .tab-conts-wrap,
  .ai-edu-archive-tab .search-list-top {
    margin: 0;
  }
}

/* AI 교육 뉴스 상세 */
.ai-edu-news-detail .ai-edu-news-detail__meta {
  justify-content: space-between;
  gap: var(--krds-gap-7, 2.4rem);
  width: 100%;
}
.ai-edu-news-detail__meta-info {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--krds-gap-7, 2.4rem);
}
.ai-edu-news-detail__meta-item {
  display: inline-flex;
  align-items: center;
  gap: var(--krds-gap-3, 0.8rem);
}
.ai-edu-news-detail__meta-label {
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-subtle, #464c53);
  line-height: 1.5;
  white-space: nowrap;
}
.ai-edu-news-detail__share-btn {
  flex-shrink: 0;
  margin-left: auto;
}
.ai-edu-news-detail__content {
  border-bottom: var(--krds-light-border-width-variable-regular, 1px) solid var(--krds-light-color-divider-gray, #8a949e);
  padding-bottom: var(--krds-padding-10, 4rem);
}
.ai-edu-news-detail__body {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-4, 1.2rem);
}
.ai-edu-news-detail__body .ai-news-detail__text {
  margin: 0;
}
.ai-edu-news-detail__source {
  margin: 0;
  font-size: var(--krds-pc-font-size-body-small, 1.5rem);
  color: var(--krds-light-color-text-disabled, #8a949e);
  line-height: 1.5;
}
@media (max-width: 767px) {
  .ai-edu-news-detail .ai-edu-news-detail__meta {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-5, 1.6rem);
  }
  .ai-edu-news-detail__share-btn {
    margin-left: 0;
  }
}
[data-krds-mode="high-contrast"] .ai-edu-news-detail__source {
  color: var(--krds-high-contrast-color-text-subtle);
}
[data-krds-mode="high-contrast"] .ai-edu-news-detail__content {
  border-bottom-color: var(--krds-high-contrast-color-divider-gray);
}

/* 메인 - AI 챗봇 플로팅 · 상단 이동 */
.main-home-float {
  position: fixed;
  right: var(--krds-padding-10, 4rem);
  bottom: var(--krds-padding-10, 4rem);
  z-index: 500;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--krds-gap-5, 1.2rem);
  pointer-events: none;
}
.main-home-float__chat,
.main-home-float__actions,
.main-home-float__chat-toggle,
.main-home-float__top,
.main-home-float__chat-close,
.main-home-float__chat-quick-btn,
.main-home-float__chat-send {
  pointer-events: auto;
}
.main-home-float__chat {
  display: flex;
  flex-direction: column;
  width: 45.1rem;
  max-width: calc(100vw - var(--krds-padding-8, 3.2rem));
  max-height: calc(100vh - 22rem);
  max-height: calc(100dvh - 22rem);
  border: 1px solid var(--krds-light-color-border-disabled, #b1b8be);
  border-radius: var(--krds-radius-xlarge2, 1.6rem);
  background: var(--krds-light-color-surface-white-subtle, #fff);
  box-shadow: 0 0.4rem 2rem rgba(0, 0, 0, 0.24);
  overflow: hidden;
}
.main-home-float__chat[hidden] {
  display: none;
}
.main-home-float__chat-head {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: space-between;
  gap: var(--krds-gap-5, 1.6rem);
  padding: var(--krds-padding-6, 1.6rem) var(--krds-padding-8, 2.4rem) var(--krds-padding-6, 1.7rem);
  border-bottom: 1px solid #dbe5f0;
  background: var(--krds-light-color-surface-white-subtle, #fff);
}
.main-home-float__chat-head-info {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-5, 1.6rem);
  min-width: 0;
}
.main-home-float__chat-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 6.4rem;
  height: 6.4rem;
  border-radius: 50%;
  background: var(--krds-light-color-element-primary, #256ef4);
  overflow: hidden;
}
.main-home-float__chat-avatar img {
  width: 5rem;
  height: auto;
  object-fit: contain;
}
.main-home-float__chat-tit {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-2, 0.4rem);
}
.main-home-float__chat-title {
  margin: 0;
  font-size: var(--krds-pc-font-size-heading-small, 1.9rem);
  font-weight: var(--krds-font-weight-bold, 700);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
  white-space: nowrap;
}
.main-home-float__chat-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  padding: var(--krds-padding-2, 0.4rem) var(--krds-padding-3, 0.8rem);
  border-radius: var(--krds-radius-medium3, 0.8rem);
  background: var(--krds-light-color-element-primary-light, #d8e5fd);
  font-size: var(--krds-pc-font-size-body-small, 1.5rem);
  color: #0b50d0;
  line-height: 1.5;
  white-space: nowrap;
}
.main-home-float__chat-close {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 3.2rem;
  height: 3.2rem;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.main-home-float__chat-close .svg-icon {
  background-color: var(--krds-light-color-icon-gray, #6d7882);
}
.main-home-float__chat-close:focus-visible {
  outline: 2px solid var(--krds-light-color-border-primary, #256ef4);
  outline-offset: 2px;
}
.main-home-float__chat-body {
  display: flex;
  flex: 1 1 auto;
  min-height: 0;
  flex-direction: column;
  gap: var(--krds-gap-11, 8rem);
  padding: var(--krds-padding-8, 3.2rem) var(--krds-padding-8, 2.4rem) var(--krds-padding-10, 4rem);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.main-home-float__chat-messages {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-3, 0.8rem);
}
.main-home-float__chat-bubble {
  display: inline-flex;
  flex-direction: column;
  gap: 0;
  max-width: 100%;
  padding: var(--krds-padding-5, 1.2rem) var(--krds-padding-6, 1.6rem);
  border: 1px solid var(--krds-light-color-border-primary-light, #d8e5fd);
  border-radius: 0 var(--krds-radius-medium3, 0.8rem) var(--krds-radius-medium3, 0.8rem) var(--krds-radius-medium3, 0.8rem);
  background: var(--krds-light-color-surface-white-subtle, #fff);
}
.main-home-float__chat-bubble p {
  margin: 0;
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
  word-break: keep-all;
}
.main-home-float__chat-quick {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 1.2rem);
}
.main-home-float__chat-quick-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-5, 1.2rem);
}
.main-home-float__chat-quick-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--krds-gap-2, 0.4rem);
  padding: var(--krds-padding-4, 1rem) var(--krds-padding-6, 1.6rem);
  border: 0;
  border-radius: 2.4rem;
  background: var(--krds-light-color-surface-primary-subtler, #ecf2fe);
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
}
.main-home-float__chat-quick-btn:focus-visible,
.main-home-float__chat-toggle:focus-visible,
.main-home-float__top:focus-visible {
  outline: 2px solid var(--krds-light-color-border-primary, #256ef4);
  outline-offset: 2px;
}
.main-home-float__chat-quick-btn--link .svg-icon {
  width: 2.4rem;
  height: 2.4rem;
  background-color: var(--krds-light-color-icon-gray, #6d7882);
}
.main-home-float__chat-time {
  margin: 0;
  font-size: 1.2rem;
  color: rgba(107, 114, 128, 0.82);
  line-height: 1.5;
}
.main-home-float__chat-form {
  display: flex;
  align-items: center;
  gap: var(--krds-gap-3, 0.8rem);
  min-height: 5.6rem;
  padding: var(--krds-padding-3, 0.8rem) var(--krds-padding-5, 1.2rem) var(--krds-padding-3, 0.8rem) var(--krds-padding-6, 1.6rem);
  border: 1px solid var(--krds-light-color-border-primary, #256ef4);
  border-radius: 100rem;
  background: var(--krds-light-color-surface-white-subtle, #fff);
  box-shadow: 0.4rem 0.4rem 0.6rem rgba(72, 109, 168, 0.12);
}
.main-home-float__chat-input {
  flex: 1;
  min-width: 0;
  border: 0;
  padding: 0 0 0 var(--krds-padding-3, 0.8rem);
  background: transparent;
  font-size: var(--krds-pc-font-size-body-medium, 1.7rem);
  color: var(--krds-light-color-text-basic, #1e2124);
  line-height: 1.5;
}
.main-home-float__chat-input::placeholder {
  color: var(--krds-light-color-text-subtle, #464c53);
}
.main-home-float__chat-input:focus {
  outline: none;
}
.main-home-float__chat-send {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 4.8rem;
  height: 4.8rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
}
.main-home-float__chat-send img {
  width: 2.4rem;
  height: 2.4rem;
  object-fit: contain;
}
.main-home-float__actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--krds-gap-5, 1.2rem);
}
.main-home-float__chat-toggle,
.main-home-float__top {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 6.4rem;
  height: 6.4rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
}
.main-home-float__chat-toggle {
  background: var(--krds-light-color-element-primary, #256ef4);
  box-shadow: 0 0.4rem 2rem rgba(0, 0, 0, 0.24);
}
.main-home-float__chat-toggle-icon {
  width: 3.6rem;
  height: 3.6rem;
  object-fit: contain;
}
.main-home-float__chat-toggle-close {
  display: none;
  background-color: var(--krds-light-color-surface-white-subtle, #fff);
}
.main-home-float__chat-toggle.is-open .main-home-float__chat-toggle-icon {
  display: none;
}
.main-home-float__chat-toggle.is-open .main-home-float__chat-toggle-close {
  display: block;
}
.main-home-float__top {
  border: 1px solid var(--krds-light-color-border-gray-light, #cdd1d5);
  background: var(--krds-light-color-action-white, #fff);
  box-shadow: 0 0 0.1rem rgba(0, 0, 0, 0.05), 0 0.4rem 0.4rem rgba(0, 0, 0, 0.08);
}
.main-home-float__top[hidden] {
  display: none;
}
.main-home-float__top .svg-icon {
  background-color: var(--krds-light-color-icon-gray, #6d7882);
}
@media (max-width: 767px) {
  .main-home-float {
    right: var(--krds-padding-6, 1.6rem);
    bottom: var(--krds-padding-6, 1.6rem);
  }
  .main-home-float__chat {
    width: calc(100vw - var(--krds-padding-8, 3.2rem));
    max-height: calc(100dvh - 20rem);
  }
  .main-home-float__chat-body {
    gap: var(--krds-gap-7, 2.4rem);
    padding: var(--krds-padding-7, 2.4rem) var(--krds-padding-6, 1.6rem) var(--krds-padding-8, 3.2rem);
  }
  .main-home-float__chat-title {
    font-size: var(--krds-mobile-font-size-heading-small, 1.7rem);
    white-space: normal;
  }
  .main-home-float__chat-quick-btn {
    white-space: normal;
  }
}

/* ============================================
   전국민 AI경진대회 (fr_001000.html)
   ============================================ */
/* 브레드크럼 + 모바일 공유 */
.fr-contest-page__breadcrumb {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--krds-gap-2, 4px);
  width: 100%;
}
.fr-contest-page__share-mo {
  display: none;
  flex-shrink: 0;
  margin: 0;
  padding: 0;
  min-width: 2.4rem;
  height: 2.4rem;
}
.fr-contest-page__share-mo .svg-icon {
  width: 2.4rem;
  height: 2.4rem;
}

/* PC: 포스터 + 상세 2열 */
.fr-contest {
  display: flex;
  align-items: flex-start;
  gap: var(--krds-number-18, 64px);
  width: 100%;
}
.fr-contest__poster {
  flex-shrink: 0;
  width: 32rem;
  height: 45.6rem;
  border: 1px solid var(--krds-light-color-border-secondary-light, #d6e0eb);
  border-radius: var(--krds-radius-xlarge1, 12px);
  box-shadow:
    0 0 0.2rem var(--krds-light-color-alpha-shadow1, rgba(0, 0, 0, 0.05)),
    0 0.4rem 0.8rem var(--krds-light-color-alpha-shadow2, rgba(0, 0, 0, 0.08));
  overflow: hidden;
}
.fr-contest__poster-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fr-contest__info {
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
  gap: var(--krds-number-18, 64px);
  min-width: 0;
}
.fr-contest__body {
  display: flex;
  flex-direction: column;
  gap: var(--krds-number-14, 40px);
  width: 100%;
}
.fr-contest__intro {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-5, 16px);
  width: 100%;
}
.fr-contest__heading {
  margin: 0;
  font-size: var(--krds-pc-font-size-heading-large, 32px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: var(--krds-letter-spacing-1, 1px);
  color: var(--krds-light-color-text-basic, #1e2124);
  word-break: keep-all;
}
.fr-contest__desc {
  margin: 0;
  font-size: var(--krds-pc-font-size-body-medium, 17px);
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-subtle, #464c53);
  word-break: keep-all;
}

/* 주제/기간/장소 */
.fr-contest__meta {
  display: flex;
  flex-direction: column;
  gap: var(--krds-gap-4, 12px);
  width: 100%;
  margin: 0;
  padding: var(--krds-padding-10, 40px) 0 0;
  list-style: none;
  border-top: 1px solid var(--krds-light-color-divider-gray-light, #cdd1d5);
}
.fr-contest__meta-item {
  display: flex;
  align-items: flex-start;
  gap: var(--krds-gap-7, 24px);
  width: 100%;
}
.fr-contest__meta-label {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: var(--krds-gap-3, 8px);
  width: 12rem;
  font-size: var(--krds-pc-font-size-body-large, 19px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
}
.fr-contest__meta-icon {
  display: block;
  flex-shrink: 0;
  width: 2.4rem;
  height: 2.4rem;
  object-fit: contain;
}
.fr-contest__meta-value {
  flex: 1 0 0;
  min-width: 0;
  margin: 0;
  font-size: var(--krds-pc-font-size-body-large, 19px);
  font-weight: 400;
  line-height: 1.5;
  color: var(--krds-light-color-text-basic, #1e2124);
  word-break: keep-all;
}

/* CTA 버튼 */
.fr-contest__actions {
  display: flex;
  gap: var(--krds-gap-5, 16px);
  width: 100%;
}
.fr-contest__btn {
  flex: 1 0 0;
  min-width: 9.8rem;
  height: 6.4rem;
  justify-content: center;
  text-align: center;
}

/* 태블릿: 세로 스택 */
@media (max-width: 1023px) {
  .fr-contest {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--krds-gap-8, 32px);
  }
  .fr-contest__poster {
    align-self: center;
  }
  .fr-contest__info {
    gap: var(--krds-gap-8, 32px);
    width: 100%;
  }
  .fr-contest__body {
    gap: var(--krds-gap-8, 32px);
  }
  .fr-contest__meta {
    padding-top: var(--krds-padding-9, 32px);
  }
  .fr-contest__meta-item {
    gap: var(--krds-gap-layout-text-text-large, 20px);
  }
  .fr-contest__meta-label {
    width: auto;
    font-size: var(--krds-mobile-font-size-body-medium, 17px);
  }
  .fr-contest__meta-value {
    font-size: var(--krds-mobile-font-size-body-medium, 17px);
  }
  .fr-contest__actions {
    flex-direction: column;
  }
  .fr-contest__btn {
    width: 100%;
    flex: none;
  }
}

/* 모바일 */
@media (max-width: 767px) {
  /* 브레드크럼 우측 공유 표시, PC 타이틀 숨김 */
  .fr-contest-page__share-mo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .fr-contest-page__title-wrap {
    display: none;
  }
  .fr-contest {
    gap: var(--krds-gap-8, 32px);
  }
  .fr-contest__poster {
    width: 32rem;
    max-width: 100%;
    height: auto;
    aspect-ratio: 320 / 456;
  }
  .fr-contest__info {
    gap: var(--krds-gap-8, 32px);
  }
  .fr-contest__body {
    gap: var(--krds-gap-8, 32px);
  }
  .fr-contest__intro {
    gap: var(--krds-gap-5, 16px);
  }
  .fr-contest__heading {
    font-size: var(--krds-mobile-font-size-heading-large, 32px);
  }
  .fr-contest__desc {
    font-size: var(--krds-mobile-font-size-body-medium, 17px);
  }
  .fr-contest__meta {
    gap: var(--krds-gap-4, 12px);
    padding-top: var(--krds-padding-9, 32px);
  }
  .fr-contest__actions {
    flex-direction: column;
    gap: var(--krds-gap-5, 16px);
  }
}