/* ----- Common Layout ----- */
.dcu-nonsubject.list { background-color: #ECF3F7; }
.dcu-nonsubject.list#content { padding-right:0; }
.dcu-nonsubject.detail#content { padding-right:0; }

.dcu26 #content { padding-top: 18rem; }
.dcu26 #content.main { padding-top: 0; padding-bottom: 0; }
.dcu26 #content.main section { margin-bottom: 0; }

body:has(.dcu-nonsubject) .header,
body:has(.dcu-nonsubject) .m_menu_top { background-color: transparent; }
body:has(.drop_menu.active) .header,
body:has(.active_tablet_menu) .m_menu_top,
body:has(.dcu-search-popup.is-open) .header,
body:has(.dcu-search-popup.is-open) .m_menu_top { background-color: #fff; }


@media (max-width: 1024px) {
  .dcu26 #content { padding-top: 6.4rem; }
  .dcu26 #content section { margin-bottom: 1.6rem; }
  .dcu26 #content.detail section { margin-bottom: 4.8rem; }
}

@media (max-width: 768px) {
}

/* ----- Components ----- */
.badge-beams-wrap { position:absolute; top:0px; left:0px; display:flex; flex-direction:row; border-top-left-radius: 1.2rem; overflow:hidden; }
.badge-beams-wrap .badge-beams { color:#fff; text-align:center; width:45px; height:55px; line-height:55px; font-weight:bold; font-size:var(--dcu-text-size-depth1-title); }
.badge-beams-wrap .badge-beams.badge-beams-B { background-color:#e42f30; }
.badge-beams-wrap .badge-beams.badge-beams-B::before { content: "B"; }
.badge-beams-wrap .badge-beams.badge-beams-E { background-color:#ffb806; }
.badge-beams-wrap .badge-beams.badge-beams-E::before { content: "E"; }
.badge-beams-wrap .badge-beams.badge-beams-A { background-color:#ff873a; }
.badge-beams-wrap .badge-beams.badge-beams-A::before { content: "A"; }
.badge-beams-wrap .badge-beams.badge-beams-M { background-color:#5ab56f; }
.badge-beams-wrap .badge-beams.badge-beams-M::before { content: "M"; }
.badge-beams-wrap .badge-beams.badge-beams-S { background-color:#376be1; }
.badge-beams-wrap .badge-beams.badge-beams-S::before { content: "S"; }

.slide-new-big .badge-beams-wrap { right:0px; left:auto; border-top-left-radius: 0; }
.slide-recommand.swiper-slide-active .badge-beams-wrap { border-top-left-radius: 3.2rem; }
.slide-recommand:hover .badge-beams-wrap { border-top-left-radius: 3.2rem; }

p.nonsubject-content { white-space:pre-wrap;word-break:break-word;overflow-wrap:break-word; }

/* program-card-01 */
.program-card-01 {  }

/* program-card-02 */
.program-card-02 { background-color: #fff; height: 100%; border-radius: 3.2rem; display: flex; flex-direction: column; position: relative; }
.program-card-02 .thumb { width: 100%; aspect-ratio: 163 / 111; height: auto; position:relative; }
.program-card-02 .thumb-wrap { overflow: hidden; border-radius: 3.2rem 3.2rem 0 3.2rem; aspect-ratio: 22 / 15; }
.program-card-02 .thumb-wrap img { width: 100%; height: 100%; object-fit: cover; }
.program-card-02 .body-wrap { width: 100%; flex: 1; min-height: 0; padding: 1.6rem 2.4rem 2.4rem; display: flex; flex-direction: column; justify-content: space-between; gap: 1.6rem; }
.program-card-02 .body-wrap .upper-wrap { width: 100%;  display: flex; flex-direction: column; gap: 1.4rem; }
.program-card-02 .body-wrap .upper-wrap .badge-row { display: flex; gap: 0.4rem; }
.program-card-02 .body-wrap .upper-wrap .badge-row .badge { padding: 0.8rem 1.4rem; border-radius: 1.6rem; font-size: 1.4rem; font-weight: 700; line-height: 1; }
.program-card-02 .body-wrap .upper-wrap .badge-row .badge.recruit { background-color: var(--dcu-color-green-600); color: var(--dcu-color-gray-white); }
.program-card-02 .body-wrap .upper-wrap .badge-row .badge.dday { background-color: var(--dcu-color-blue-100); color: var(--dcu-color-text-400); }
.program-card-02 .body-wrap .upper-wrap .title-wrap { width: 100%; display: flex; flex-direction: column; gap: 0.8rem; }
.program-card-02 .body-wrap .upper-wrap .title-wrap .title-text { font-size: 2.2rem; font-weight: 700; line-height: 1.2; text-overflow: ellipsis; word-break: break-all; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.program-card-02 .body-wrap .upper-wrap .title-wrap .title-desc { font-size: 1.5rem; font-weight: 600; color: var(--dcu-color-text-300); line-height: 1.3; display: -webkit-box; -webkit-box-orient: vertical;  -webkit-line-clamp: 2; overflow: hidden; }
.program-card-02 .body-wrap .bottom-wrap { width: 100%; display: flex; justify-content: space-between; align-items: center; }
.program-card-02 .body-wrap .bottom-wrap .leading {  min-width: 0; }
.program-card-02 .body-wrap .bottom-wrap .btn-goto { width: 4rem; height: 4rem; display: flex; align-items: center; justify-content: center; background-color: #22a3ff; border-radius: 50%; }
.program-card-02 .body-wrap .bottom-wrap .btn-goto svg { width: 1.6rem; height: 1.6rem; }
.program-card-02 .body-wrap .bottom-wrap .status-wrap { display: flex; gap: 18px; }
.program-card-02 .body-wrap .bottom-wrap .status-wrap > .status-item { display: flex; flex-direction: column; font-weight: 600; font-size: 14px; text-align: center; color: var(--dcu-color-gray-500); }
.program-card-02 .body-wrap .bottom-wrap .status-wrap > .status-item > .num { font-size: 24px; font-weight: 700; line-height: 1; color: var(--dcu-color-primary-400); }
.program-card-02 .body-wrap .bottom-wrap .status-wrap > .status-item > .num.green { color: var(--dcu-color-semantic-success-500); }
.program-card-02 .body-wrap .bottom-wrap .status-wrap > .status-item > .num.gray { color: #363636; }

.program-card-02.small-date { background-color: rgba(255, 255, 255, 0.7); }
.program-card-02.small-date .body-wrap { padding: 1.2rem 1.6rem 2rem; }
.program-card-02.small-date .body-wrap .upper-wrap .badge-row .badge { padding: 0.6rem 1rem; font-size: 1.3rem; }
.program-card-02.small-date .body-wrap .upper-wrap .title-wrap .title-text { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; font-size: 1.7rem;  text-overflow: ellipsis; word-break: break-all; }
.program-card-02.small-date .body-wrap .upper-wrap .title-wrap .date-wrap { display: flex; flex-direction: column; gap: 0.6rem; }
.program-card-02.small-date .body-wrap .upper-wrap .title-wrap .date-row { font-size: 1.3rem; display: block; font-weight: 700; line-height: 1.3; }
.program-card-02.small-date .body-wrap .upper-wrap .title-wrap .date-row > .date-label { color: var(--dcu-color-gray-300); padding-right: 0.8rem; }
.program-card-02.small-date .body-wrap .bottom-wrap .status-wrap > .status-item { flex-direction: row; align-items: center; gap: 0.4rem; font-size: 1.2rem; }
.program-card-02.small-date .body-wrap .bottom-wrap .status-wrap > .status-item > .num { font-size: 1.8rem; }

/* program-card-big */
.program-card-big { padding: 2.4rem; background-color: rgba(255, 255, 255, 0.7); border: 2px solid var(--dcu-color-gray-white); border-radius: 2.4rem; box-shadow: 4px 4px 16px 0 rgba(0, 0, 0, 0.06); }
.program-card-big .thumb { flex-shrink: 0; width: 39rem; height: 32rem; border-radius: 1.2rem; background: var(--dcu-color-common-solid-200); overflow: hidden; position: relative; }
.program-card-big .thumb img { width: 100%; height: 100%; object-fit: cover; }
.program-card-big .body { min-width: 0; padding-top: 1.2rem; }
.program-card-big .badge { padding: 1.2rem 2.4rem; border-radius: 3.2rem; font-size: 1.6rem; line-height: 1; }
.program-card-big .badge.recruit { background-color: var(--dcu-color-green-600); color: var(--dcu-color-gray-white); }
.program-card-big .badge.dday { background-color: var(--dcu-color-blue-100); color: var(--dcu-color-text-400); }
.program-card-big .stats { height: 3.9rem; }
.program-card-big .stat { min-width: 2.8rem; }
.program-card-big .stat-num { font-size: 2.4rem; line-height: 1; }
.program-card-big .stat.apply .stat-num { color: var(--dcu-color-primary-400); }
.program-card-big .stat.recruit .stat-num { color: var(--dcu-color-green-500); }
.program-card-big .stat.wait .stat-num { color: var(--dcu-color-text-400); }
.program-card-big .stat-label { font-size: 1.4rem; color: var(--dcu-color-text-300); line-height: 1.2; }
.program-card-big .main { padding-bottom: 2.8rem; border-bottom: 1px solid var(--dcu-color-common-line-150); margin-bottom: 1.6rem; }
.program-card-big .title { margin: 0 0 0.8rem; font-size: var(--dcu-text-size-xxxl); line-height: 1.3; color: var(--dcu-color-text-400); }
.program-card-big .desc { margin: 0; font-size: var(--dcu-text-size-md); line-height: 1.3; color: var(--dcu-color-text-300); overflow: hidden; text-overflow: ellipsis; }
.program-card-big .info { column-gap: 4rem; margin-bottom: 1.2rem; font-size: var(--dcu-text-size-sm); }
.program-card-big .info-item { gap: 0.2rem; }
.program-card-big .info-label { color: var(--dcu-color-text-300); line-height: 1.3; }
.program-card-big .info-value { color: var(--dcu-color-text-400); line-height: 1.3; }
.program-card-big .foot { margin-top: auto; }
.program-card-big .tags { min-width: 0; padding-top: 0.4rem; }
.program-card-big .dcu-tag { border-radius: 1.6rem; border-color: var(--dcu-color-common-line-200); }
.program-card-big .btn { justify-content: center; height: 5.6rem; padding: 1.6rem 2.1rem 1.6rem 2.8rem; border-radius: 1.2rem; font-size: 1.8rem; flex-shrink: 0; min-width: 21rem; }
.program-card-big .btn svg { flex-shrink: 0; }


@media (max-width: 1024px) {
  .program-card-big { flex-direction: column; align-items: center; gap: 1.6rem; padding: 1.2rem; padding-bottom: 1.6rem; border-radius: 1.6rem; }
  .program-card-big .thumb { width: 100%; aspect-ratio: 334 / 220; height: auto; }
  .program-card-big .body { flex: 0 0 auto; padding-top: 0.4rem; padding-left: 0.6rem; padding-right: 0.6rem; width:100%; }
  .program-card-big .badge { padding: 0.8rem 1.4rem; font-size: 1.3rem; }
  .program-card-big .stats { height: auto; gap: 1.6rem; }
  .program-card-big .stat { min-width: 2.3rem; }
  .program-card-big .stat-num { font-size: 2rem; }
  .program-card-big .stat-label { font-size: 1.2rem; }
  .program-card-big .main { padding-bottom: 2rem; margin-bottom: 1.2rem; }
  .program-card-big .title { font-size: 1.8rem; }
  .program-card-big .desc { font-size: 1.4rem; /* white-space: normal; */ }
  .program-card-big .info { row-gap: 1.2rem; margin-bottom: 1.2rem; font-size: 1.3rem; }
/*  .program-card-big .info-item:nth-child(n+4) { display: none; }
  .program-card-big .info-item { max-width: 9.6rem; }
  .program-card-big .info-item:nth-child(2) { max-width: 15.7rem; }
  .program-card-big .info-item:nth-child(3) { max-width: 16.1rem; } */
  .program-card-big .info-label { font-size: 1.3rem; }
  .program-card-big .info-value { font-size: 1.4rem; white-space: nowrap; }
  .program-card-big .foot { flex-direction: column; align-items: stretch; gap: 2rem; }
  .program-card-big .tags { padding-top: 0; }
  .program-card-big .dcu-tag { padding: 0.6rem 1.2rem; }
  .program-card-big .btn { width: 100%; min-width: 0; height: auto; padding: 1.4rem 1.6rem; border-radius: 0.8rem; font-size: 1.4rem; }
  .program-card-big .btn svg { width: 1.4rem; height: 1.4rem; }
}


/* program-calandar-card */
.program-calandar-card { display: flex; flex-direction: column; gap: 32px; height: 100%; padding: 14px 20px; border-radius: 12px; background-color: rgba(255, 255, 255, 0.30); }
.program-calandar-card .card-header { display: flex; justify-content: space-between; align-items: center; }
.program-calandar-card .card-header .date { overflow: hidden; min-width: 0; font-size: var(--dcu-text-size-lg); font-weight: 700; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.program-calandar-card .card-header .badge-date { display: flex; justify-content: center; align-items: center; height: 30px; padding: 0 14px; border-radius: 24px; font-size: var(--dcu-text-size-xs); font-weight: 700; white-space: nowrap; }
.program-calandar-card .card-header .badge-date.yellow { background-color: var(--dcu-color-secondary-400); }
.program-calandar-card .card-header .badge-date.black { background-color: #000; color: #fff; }
.program-calandar-card .card-body { height: calc(100% - 64px); }
.program-calandar-card .card-body-inner { height: 100%; }
.program-calandar-card .card-item-list { display: flex; flex-direction: column; gap: 6px; overflow-y: auto; overflow-x: hidden; height: 100%; }
.program-calandar-card .card-item { display: flex; gap: 12px; font-size: var(--dcu-text-size-sm); }
.program-calandar-card .card-item-label { font-weight: 500; color: var(--dcu-color-text-350); }
.program-calandar-card .card-item-title { min-width: 0; font-weight: 600; }


@media (max-width: 1024px) {
  .program-calandar-card { min-height: 300px; }
}

/* Swiper pagination */
.swiper-pagination-nonsubject { display: flex; justify-content: center; align-items: center; gap: 5px; }
.swiper-pagination-bullet { width: 6px; height: 6px; background-color: #AEBECA; opacity: 1; border-radius: 4px; }
.swiper-pagination-bullet-active { width: 40px; background-color: #656E75; }



/* Dropdown List - custom select (button + list) */
.dcu26 .input-line.dcu-custom-select { position: relative; width: 100%; }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__trigger { box-sizing: border-box; width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 0.8rem; margin: 0; padding: 1.4rem 2.8rem 1.4rem 0.4rem; height: 5.2rem; border: 0; border-bottom: 2px solid var(--dcu-color-primary-400); border-radius: 0; background-color: transparent; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2 5.5L8 11.5L14 5.5' stroke='%230B96FA' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.4rem center; color: var(--dcu-color-primary-400); font-size: var(--dcu-text-size-xl); font-weight: 600; font-family: inherit; line-height: 1.2; text-align: left; cursor: pointer; }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__trigger:focus-visible { outline: 2px solid var(--dcu-color-primary-400); outline-offset: 2px; }
.dcu26 .input-line.dcu-custom-select.is-open .dcu-custom-select__trigger { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2 10.5L8 4.5L14 10.5' stroke='%230B96FA' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__value { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__value--placeholder { color: var(--dcu-color-primary-400); font-weight: 600; }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__list-wrap { position: absolute; left: 0; top: calc(100% + 0.4rem); min-width: 100%; z-index: 30; display: flex; flex-direction: row; gap: 0; background-color: var(--dcu-color-gray-white, #fff); border: 1px solid var(--dcu-color-common-line-150); border-radius: 0.8rem; box-shadow: 4px 8px 24px rgba(0, 0, 0, 0.1); max-height: min(24rem, 50vh); }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__list-wrap[hidden] { display: none; }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__list[hidden] { display: none; }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__list { flex: 1; margin: 0; padding: 0.4rem 0; max-height: 20rem; list-style: none; overflow-y: auto;  }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__list + .dcu-custom-select__list { border-left: 1px solid var(--dcu-color-common-line-150); }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__item { margin: 0; }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__option { box-sizing: border-box; display: block; width: 100%; margin: 0; padding: 1rem 1.2rem; border: 0; background: transparent; color: var(--dcu-color-text-400); font-size: var(--dcu-text-size-md); font-weight: 600; font-family: inherit; line-height: 1.3; text-align: left; cursor: pointer; }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__option:hover { background-color: var(--dcu-color-blue-100); outline: none; }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__option:focus-visible { background-color: var(--dcu-color-blue-100); outline: none; }
.dcu26 .input-line.dcu-custom-select .dcu-custom-select__option.is-selected { color: var(--dcu-color-primary-400); }
/* detail-filter */
.detail-filter { width: 100%; max-height: 0; overflow: hidden; transition: max-height 0.4s ease; }
.detail-filter.open { max-height: 1000px; }


/* no-data-wrap */
.no-data-wrap { display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: center; width: 100%; }
.no-data-wrap img { width: 50%; max-width: 371px; }
.no-data-wrap p { margin-top: -1.2vh; color: #6D7882; text-align: center; font-size: 30px; letter-spacing: -0.6px; line-height: 1.3; }

@media (max-width: 1024px) {
  .dcu26 .input-line.dcu-custom-select .dcu-custom-select__trigger { height: 4.8rem; }
  .program-section .no-data-wrap p { font-size: 25px; }
}
@media (max-width: 768px) {
  .program-section .no-data-wrap p { font-size: 20px; }
}

/* ----- Main ----- */
/* Hero Section ---------------------------------*/
.dcu26 #content section.program-section { width: 100%; height: max(100vh, 900px); position: relative; gap: min(48px, 4.44vh); }
.program-section-title-wrap { width: 100%; position: relative; margin: 0 auto; padding: 0 2.4rem; display: flex; justify-content: space-between; align-items: center; max-width: 1516px; }
.program-section-title-wrap > .title-text { font-size: 40px; font-weight: 800; letter-spacing: -0.03em; }
.program-section-title-wrap > .btn-more { font-size: 14px; font-weight: 600; background-color: #fff; border: 1px solid var(--dcu-color-gray-300); border-radius: 24px; display: flex; align-items: center; gap: 2px; padding: 10px 10px 10px 14px; }

.hero-section-wrap { background: #CADDF7; }
.hero-section-wrap > .inner-container { width: 100%; max-width: 1514px; height: 100%; position: relative; margin: auto; padding: 0 24px; }
.hero-section-wrap > .inner-container > .hero-title { width: 100%; font-size: 56px; font-weight: 700; position: absolute; top: calc(50% - 320px); }

.hero-section-wrap > .inner-container .hero-my-wrap { position: absolute; left: 24px; bottom: calc(100% + 3.2rem); display: flex; align-items: center; gap: 1.2rem; }
.hero-section-wrap > .inner-container .hero-my-wrap > .hero-my-info { display: flex; flex-direction: column; gap: 0.2rem; }
.hero-section-wrap > .inner-container .hero-my-wrap > .hero-my-info > .hero-my-name { font-size: var(--dcu-text-size-lg); font-weight: 700; }
.hero-section-wrap > .inner-container .hero-my-wrap > .hero-my-info > .hero-my-major { font-size: var(--dcu-text-size-sm); font-weight: 600; }
.hero-section-wrap > .inner-container .hero-my-wrap > .hero-my-info > .hero-my-major > em { font-weight: 700; }

.hero-section-wrap > .inner-container > .content-wrap { width: calc(100% - 48px); position: absolute; top: calc(50% - 80px); display: flex; gap: min(24px, 1.25vw); padding: 12px 24px; border-radius: 16px; border: 1px solid rgba(255, 255, 255, 0.20); background: rgba(255, 255, 255, 0.15); box-shadow: 4px 4px 16px 0 rgba(0, 0, 0, 0.10); backdrop-filter: blur(40px); }
.hero-section-wrap > .inner-container > .content-wrap .content-section { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.hero-section-wrap > .inner-container > .content-wrap .content-header { padding: 6px 0; display: flex; align-items: center; justify-content: space-between; gap: 32px; min-height: 48px; }
.hero-section-wrap > .inner-container > .content-wrap .content-header-title { position: relative; font-size: 24px; font-weight: 700; }
.hero-section-wrap > .inner-container > .content-wrap .content-header-tooltip { position: relative; }
.hero-section-wrap > .inner-container > .content-wrap .content-header-tooltip .tooltip-popover { display: none; position: absolute; top: calc(100% + 8px); left: 0; translate: -30% 0; min-width: 350px; background-color: #fff; padding: 12px 10px; border-radius: 12px; box-shadow: 2px 4px 16px 0 rgba(0, 0, 0, 0.12); }
.hero-section-wrap > .inner-container > .content-wrap .content-header-tooltip.active .tooltip-popover { display: block; }
.hero-section-wrap > .inner-container > .content-wrap .content-header-tooltip .tooltip-popover .btn-close { position: absolute; top: 8px; right: 8px; }
.hero-section-wrap > .inner-container > .content-wrap .content-header-tooltip .tooltip-popover .tooltip-popover__content .text-block { padding: 0.4rem 0.4rem 0.4rem 0.8rem; display: flex; flex-direction: column; gap: 1.6rem; font-size: var(--dcu-text-size-xs); font-weight: 400; color: var(--dcu-color-text-350); }
.hero-section-wrap > .inner-container > .content-wrap .content-header-tooltip .tooltip-popover .tooltip-popover__content .text-block .text-title { color: var(--dcu-color-text-400); font-weight: 600; }
.hero-section-wrap > .inner-container > .content-wrap .content-header-tooltip .tooltip-popover .tooltip-popover__content ul li { display: flex; gap: 0.4rem; margin-bottom: 0.4rem; }
.hero-section-wrap > .inner-container > .content-wrap .content-header-tooltip .tooltip-popover .tooltip-popover__content ul li em { flex-shrink: 0; font-weight: 700; }
.hero-section-wrap > .inner-container > .content-wrap .content-body { flex: 1; min-height: 409px; height: 409px; max-height: 409px; }

@media (max-width: 1024px) {
  .dcu26 #content section.program-section { justify-content: flex-start; height: auto; padding-top: 56px; padding-bottom: 64px; gap: 56px; }
  .program-section-title-wrap > .title-text { font-size: 32px; }
  .hero-section-wrap > .inner-container { padding-top: 80px; padding-bottom: 64px; margin: 0; }
  .hero-section-wrap > .inner-container > .hero-title { position: static; margin-bottom: 5em; font-size: 36px; }
  .hero-section-wrap > .inner-container .hero-my-wrap { position: static; padding: 20px 0 12px; }
  .hero-section-wrap > .inner-container > .content-wrap { flex-direction: column; gap: 24px; position: static; top: auto; left: auto; width: 100%; }
  .hero-section-wrap > .inner-container > .content-wrap .content-header { flex-direction: column; align-items: flex-start; gap: 10px; }
  .hero-section-wrap > .inner-container > .content-wrap .content-body { min-height: 0; max-height: none; height: auto; }
}

@media (max-width: 768px) {
  .hero-section-wrap > .inner-container > .content-wrap .content-header-tooltip .tooltip-popover { translate: -45% 0; }  
}

/* program-status-card -------------------------------------------------- */
.hero-section-wrap > .inner-container > .content-wrap .non-section { flex: 520; }

.program-status-card { width: 100%; height: 100%; padding: 14px 16px 20px; border-radius: 12px; background: rgba(255, 255, 255, 0.30); display: flex; flex-direction: column; gap: 40px; }

.program-status-header { display: flex; flex-direction: column; gap: 8px; }
.program-status-header button { align-self: flex-end; }
.program-status-top { display: flex; justify-content: center; gap: 12px; padding: 20px 12px; border-radius: 12px; background-color: #fff; }
.program-status-stat { width: 80px; padding-left: 20px; display: flex; flex-direction: column; gap: 10px; }
.program-status-stat + .program-status-stat { border-left: 1px solid rgba(105, 105, 105, 0.30); }

.program-status-stat-label { font-size: var(--dcu-text-size-md); }
.program-status-stat-value { margin: 0; font-size: var(--dcu-text-size-xxl); font-weight: 700; line-height: 1; color: #33363DAA; }
.program-status-stat-value .highlight { color: var(--dcu-color-primary-500); opacity: 1; }
.program-status-stat-value .slash { margin: 0 2px; }

.program-status-middle { display: flex; justify-content: space-between; gap: min(16px, 0.83vw); }
.program-status-middle-left { flex: 1; padding: 0 min(16px, 0.83vw); display: flex; flex-direction: column; gap: 20px; }
.program-status-title { font-size: 16px; font-weight: 700; line-height: 1; }
.program-status-middle-left .items-wrap { display: flex; flex-direction: column; gap: 16px; }
.program-status-skill { display: flex; flex-direction: column; gap: 6px; }
.program-status-skill-label { display: flex; justify-content: space-between; font-size: var(--dcu-text-size-xs); font-weight: 600; }
.program-status-bar { position: relative; width: 100%; height: 6px; border-radius: 999px; background-color: #fff; overflow: hidden; }
.program-status-bar-fill { height: 100%; border-radius: inherit; }
.program-status-bar-fill.blue { background-color: var(--dcu-color-blue-500); }
.program-status-bar-fill.green { background-color: var(--dcu-color-teal-500); }
.program-status-bar-fill.red { background-color: var(--dcu-color-rose-500); }
.program-status-bar-value { font-weight: 800;  }
.program-status-bar-value.blue { color: var(--dcu-color-blue-500); }
.program-status-bar-value.green { color: var(--dcu-color-teal-500); }
.program-status-bar-value.red { color: var(--dcu-color-rose-500); }

.program-status-middle-right { display: flex; flex-direction: column; gap: 10px; padding: 0 min(16px, 0.83vw);  }
.dcu26 .program-status-link { border-radius: 60px; border: 1px solid #FFF; background: rgba(255, 255, 255, 0.50); color: inherit; }
.program-status-link:hover { background-color: #eee !important; }

@media (max-width: 1024px) {
  .program-status-middle { flex-direction: column; }
  .program-status-middle-right { flex-direction: row; padding: 10px 0; margin-top: 16px; }
  .dcu26 .program-status-link { flex: 1; }
}

/*  */
.hero-section-wrap > .inner-container > .content-wrap .calendar-section { flex: 940; }
.calendar-section .calendar-header-left { display: flex; gap: 24px; align-items: center; }
.calendar-section .calendar-header-toggle .dcu-toggle-onoff-track { padding: 3px; }
.calendar-section .calendar-header-toggle .dcu-toggle-onoff-input ~ .dcu-toggle-onoff-track,
.calendar-section .calendar-header-toggle .dcu-toggle-onoff-input:checked ~ .dcu-toggle-onoff-track { background-color: #003EA2; }
.calendar-section .calendar-header-toggle .dcu-toggle-onoff-thumb { background-color: #00B2FF; border-radius: 4px; }
.calendar-section .calendar-header-toggle .dcu-toggle-onoff-input:not(:checked) ~ .dcu-toggle-onoff-track .dcu-toggle-onoff-text--on,
.calendar-section .calendar-header-toggle .dcu-toggle-onoff-input:checked ~ .dcu-toggle-onoff-track .dcu-toggle-onoff-text--off { color: rgba(255,255,255,0.6); }
.calendar-section .calendar-header-toggle .dcu-toggle-onoff-input:not(:checked) ~ .dcu-toggle-onoff-track .dcu-toggle-onoff-text--off,
.calendar-section .calendar-header-toggle .dcu-toggle-onoff-input:checked ~ .dcu-toggle-onoff-track .dcu-toggle-onoff-text--on { color: #fff; }
.calendar-section .calendar-header-right { flex: 1; display: flex; gap: 8px; align-items: center; }
.calendar-section .calendar-header-right .week-row { flex: 1; display: flex; gap: 8px; margin-left: 8px; }
.calendar-section .calendar-header-right .week-item { font-size: var(--dcu-text-size-md); font-weight: 600; border-bottom: 2px solid transparent; }
.calendar-section .calendar-header-right .week-item.active { border-bottom-color: currentColor; }
.calendar-section .calendar-swiper { height: 100%; }
.calendar-section .calendar-swiper .swiper-slide { height: auto; }
.calendar-section .card-item-blank { display: flex; flex-direction: column; align-items: center; gap: 1.2rem; font-size: 1.4rem; }
.calendar-section .card-item-blank-icon { display: flex; justify-content: center; align-items: center; width: 7.2rem; height: 7.2rem; background-color: rgba(192, 201, 210, 0.80); border-radius: 50%; }

.calendar-section[data-calendar-type="weekly"] .monthly-calendar { display: none; }
.calendar-section[data-calendar-type="monthly"] .calendar-header-right,
.calendar-section[data-calendar-type="monthly"] .weekly-calendar { display: none; }

.calendar-section .monthly-calendar .schedule-calendar { flex: 2; display: flex; flex-direction: column; min-height: 0; max-width: 310px; }
.calendar-section .monthly-calendar .calendar-header { display: flex; align-items: center; justify-content: center; gap: 2.4rem; padding: 1rem 1.2rem; flex-shrink: 0; }
.calendar-section .monthly-calendar .calendar-header .month-year { font-size: var(--dcu-text-size-xxl); font-weight: 700; color: var(--dcu-color-text-500); line-height: 1; }
.calendar-section .monthly-calendar .calendar-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 0.4rem; margin-bottom: 0.6rem; flex-shrink: 0; padding: 1rem 0; text-align: center; font-size: var(--dcu-text-size-xs); font-weight: 700; color: var(--dcu-color-text-300); line-height: 1.7; border-bottom: 1px solid var(--dcu-color-common-line-200); }
.calendar-section .monthly-calendar .calendar-days p { margin: 0; }
.calendar-section .monthly-calendar .calendar-dates { flex: 1; min-height: 0; align-content: start; }

.calendar-section .monthly-calendar .schedule-calendar .calendar-dates { display: grid; grid-template-columns: repeat(7, 1fr); grid-template-rows: repeat(6,minmax(0,1fr)); gap: 0.6rem 0.2rem; }
.calendar-section .monthly-calendar .calendar-cell-day { min-height: 4rem; max-height: 5rem; display: flex; padding: 0.8rem 0.4rem; flex-direction: column; justify-content: center; align-items: center; font-size: var(--dcu-text-size-lg); font-weight: 700; line-height: 1; color: var(--dcu-color-text-500); border: 1px solid transparent; border-radius: 0.8rem; background-color: transparent; transition: 0.2s; }
.calendar-section .monthly-calendar .calendar-cell-day:not(:disabled):not(.active):hover,
.calendar-section .monthly-calendar .calendar-cell-day:not(:disabled):not(.active):focus-visible { background-color: var(--dcu-color-common-solid-250); }
.calendar-section .monthly-calendar .calendar-cell-day.active { background-color: var(--dcu-color-primary-400); color: #fff !important; }
.calendar-section .monthly-calendar .calendar-cell-day.is-weekend { color: var(--dcu-color-text-300); }
.calendar-section .monthly-calendar .calendar-cell-day span { position: relative; }
.calendar-section .monthly-calendar .calendar-cell-day .calendar-dot-wrap { position: absolute; bottom: calc(100% + 1px); left: 100%; display: flex; gap: 0.2rem; }
.calendar-section .monthly-calendar .calendar-cell-day .calendar-dot { display: inline-block; width: 4px; height: 4px; border-radius: 50%; }
.calendar-section .monthly-calendar .calendar-cell-day .calendar-dot-academic { background-color: #FF9900; }
.calendar-section .monthly-calendar .calendar-cell-day.active .calendar-dot { background-color: #fff; }

.calendar-section .monthly-calendar { display: flex; background-color: #fff; border-radius: 12px; padding: 16px; }
.calendar-section .monthly-calendar .btn-schedule-month { display: inline-flex; align-items: center; justify-content: center; width: 3.2rem; height: 3.2rem; padding: 0; border: 1px solid var(--dcu-color-common-line-200) !important; border-radius: 60px; background-color: #fff !important; background-position: center; background-repeat: no-repeat; font-size: 0; cursor: pointer; transition: border-color 0.2s, background-color 0.2s; }
.calendar-section .monthly-calendar .btn-schedule-month--prev { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M9%2012L4%207L9%202%22%20stroke%3D%22%23020202%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E"); }
.calendar-section .monthly-calendar .btn-schedule-month--next { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M5%2012L10%207L5%202%22%20stroke%3D%22%23020202%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E"); }
.calendar-section .monthly-calendar .btn-schedule-month:hover,
.calendar-section .monthly-calendar .btn-schedule-month:focus-visible { border-color: var(--dcu-color-primary-500); background-color: #fff; }
.calendar-section .monthly-calendar .btn-schedule-month:hover { outline: none; }
.calendar-section .monthly-calendar .btn-schedule-month:focus-visible { outline: 2px solid var(--dcu-color-primary-500); outline-offset: 2px; }

.calendar-list { flex: 3; min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: 1.2rem; word-wrap: anywhere; }
.calendar-items { flex: 1; min-width: 0; height: 100%; list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; padding-left: 40px; padding-right: 40px;  overflow-y: auto; min-height: 0; overscroll-behavior: contain; }
.calendar-items .schedule-item-1 { display: flex; gap: 0.4rem; padding-top: 0.8rem; line-height: 1.2; min-width: 0; }
.calendar-items .schedule-item-1__left { position: relative; display: flex; align-items: flex-start; gap: 0.6rem; flex-basis: 3.5rem; flex-shrink: 0; padding-top: 1.3rem; line-height: 1; }
.calendar-items .schedule-item-1__dot-wrap { position: relative; flex-shrink: 0; }
.calendar-items .schedule-item-1__dot { display: block; width: 1.2rem; height: 1.2rem; border-radius: 50%; background-color: var(--dcu-color-primary-400); flex-shrink: 0; }
.calendar-items .schedule-item-1__line { position: absolute; top: 2rem; left: 0.5rem; width: 2px; min-height: 1.6rem; height: 110%; flex: 1; background-color: var(--dcu-color-primary-200); }
.calendar-items .schedule-item-1__time { font-size: 1.4rem; font-weight: 700; color: var(--dcu-color-blue-500); }
.calendar-items .schedule-item-1__content { display: flex; flex-direction: column; align-items: flex-start; gap: 0.6rem; min-width: 0; flex: 1; padding: 1.2rem 1.6rem 0.4rem 0.4rem; }
.calendar-items .schedule-item-1__title { font-size: 1.6rem; font-weight: 700; line-height: 1; }
.calendar-items .schedule-item-1__meta { font-size: 1.4rem; line-height: 1.2; color: var(--dcu-color-text-300); }

@media (max-height: 960px) {
  .calendar-items { overscroll-behavior: initial; }
}

@media (max-width: 1024px) {
  .calendar-section .card-item-blank-icon { width: 5.6rem; height: 5.6rem; }
  .calendar-section .calendar-header-left { padding: 6px 0; }
  .calendar-section .calendar-header-right { flex: auto; width: 100%; }
  .calendar-section .calendar-swiper { height: 58vh; max-height: 415px; }
  .calendar-items { overscroll-behavior: initial; }
}

@media (max-width: 768px) {
  .calendar-section .monthly-calendar { flex-direction: column; gap: 24px; }
  .calendar-section .monthly-calendar .calendar-header .month-year { font-size: var(--dcu-text-size-xxxl); }
  .calendar-section .monthly-calendar .schedule-calendar { flex: auto; max-width: none; }
  .calendar-section .monthly-calendar .schedule-calendar .calendar-dates { grid-template-rows: repeat(5,minmax(0,1fr)); }

  .calendar-list { max-height: 400px; }
  .calendar-items { padding-left: 16px; padding-right: 16px; }
}

/*  */
.hero-section-wrap > .back-img-wrap { width: 100%; height: 100%; position: absolute; }
.hero-section-wrap > .back-img-wrap > .hero-back-img { position: absolute; }
.hero-section-wrap > .back-img-wrap > .hero-back-img.hero-student { width: min(296px, 15.41vw); left: calc(50% + min(100px, 5.2vw)); bottom: 55%; }
.hero-section-wrap > .back-img-wrap > .hero-back-img.hero-character { width: min(240px, 12.5vw); left: calc(50% + min(380px, 19.8vw)); bottom: 53%; }
.hero-section-wrap > .back-img-wrap > .hero-back-img.hero-obj-1 { width: 280px; left: calc(50% - 900px); bottom: calc(50% - 440px); }
.hero-section-wrap > .back-img-wrap > .hero-back-img.hero-obj-2 { width: 280px; right: calc(50% - 940px); bottom: calc(50% - 300px); }

@media (max-width: 1024px) {
  .hero-section-wrap > .back-img-wrap > .hero-back-img.hero-student { width: 160px; left: auto; right: 162px; top: 180px; }
  .hero-section-wrap > .back-img-wrap > .hero-back-img.hero-character { width: 130px; left: auto; right: 32px; top: 130px; } 
  .hero-section-wrap > .back-img-wrap > .hero-back-img.hero-obj-1,
  .hero-section-wrap > .back-img-wrap > .hero-back-img.hero-obj-2 { display: none; }
}


/*  */
.program-new-section { background-color: #e3f0f8; width: 100%; display: flex; flex-direction: column; justify-content: center; }
.program-new-section > .new-swipers-wrap { width: 100%; position: relative; padding-left: calc(50% - 757px); }
.program-new-section > .new-swipers-wrap > .swiper-control-wrap { display: flex; align-items: center; gap: 24px; position: absolute; top: calc(100% + 3.5vh); right: 10%; z-index: 10; }
.program-new-section > .new-swipers-wrap.is-single > .swiper-control-wrap { display: none; }
.program-new-section > .new-swipers-wrap > .swiper-control-wrap .program-navigation button { width: 4.8rem; height: 4.8rem; }
.program-new-section > .new-swipers-wrap > .swiper-control-wrap .program-navigation button.prev svg { margin-right: 2px; }
.program-new-section > .new-swipers-wrap > .swiper-control-wrap .program-navigation button.next svg { margin-left: 2px; }
.program-recommand-section { background-color: #c9ebfe; width: 100%; display: flex; flex-direction: column; justify-content: center; }
.program-recommand-section > .inner-container { width: 100%; max-width: 1514px; margin: auto; padding: 0 24px; }

.new-swipers-wrap { width: 100%; height: 500px; display: flex; }

.swiper-new-big { width: 860px; height: 540px; overflow: hidden; flex-shrink: 0; display: flex; align-items: center; }
.swiper-new-big > .swiper-wrapper { padding-top: 36px; }
.swiper-new-small { flex: 1; width: 50%; height: 500px; overflow: hidden; padding-left: 4px; padding-top: 82px; }
.swiper-new-small.is-two-slide { box-sizing: border-box; flex: 0 0 264px; width: 264px; padding-left: 0; }
.new-swipers-wrap.is-single .swiper-new-small { display: none; }
.slide-new-big { width: 840px; height: 490px; position: relative; display: flex; background-color: #fff; border-radius: 16px 32px 32px; overflow: hidden; cursor: pointer; filter: drop-shadow(4px 4px 6px rgba(0,0,0,.06)); opacity: .94; transition: opacity .18s ease, filter .18s ease; }
.slide-new-big > .thumb-wrap { position: relative; width: 50%; height: 100%; overflow: hidden; background-color: #67c7ff; }
.slide-new-big > .thumb-wrap > img { position: absolute; width: 100%; height: 100%; object-fit: cover; object-position: center; right: 0; transition: opacity .18s ease; }
.slide-new-big > .body-wrap { position: relative; width: 50%; height: 100%; overflow: hidden; background-color: #fff; }
.slide-new-big > .body-wrap > .slide-big-body-inner { width: 100%; height: 100%; padding: 32px; position: absolute; display: flex; top: 0; flex-direction: column; right: 0; transition: opacity .18s ease; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .title-wrap { width: 100%; flex-grow: 1; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .title-wrap > h3 { display: -webkit-box; overflow: hidden; margin: 0; padding: 0; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: 32px; font-weight: 700; letter-spacing: -0.03em; word-break: keep-all; text-overflow: ellipsis; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .title-wrap > .title-desc { width: 100%; font-size: 16px; line-height: 1.35em; font-weight: 500; color: var(--dcu-color-gray-500); word-break: keep-all; margin: 8px 0; display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; text-overflow: ellipsis; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .detail-info { width: 100%; display: flex; flex-direction: column; padding-bottom: 28px; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .detail-info > .date-row { font-size: 15px; display: block; font-weight: 700; padding: 4px 0; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .detail-info > .date-row > .date-label { color: var(--dcu-color-gray-300); padding-right: 6px; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .detail-info > .tags-row { display: flex; gap: 4px; margin-top: 12px; flex-wrap: wrap; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .detail-info > .tags-row > .tag { display: inline-block; padding: 7px 10px; border-radius: 24px; font-size: 13px; border: 1px solid var(--dcu-color-gray-200); font-weight: 600; color: var(--dcu-color-gray-600); line-height: 1em; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .action-row { width: 100%; display: flex; justify-content: space-between; padding-top: 20px; border-top: 1px solid var(--dcu-color-gray-100); }
.slide-new-big > .body-wrap > .slide-big-body-inner > .action-row > .status-wrap { display: flex; gap: 18px; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .action-row > .status-wrap > .status-item { display: flex; flex-direction: column; font-weight: 600; font-size: 14px; text-align: center; color: var(--dcu-color-gray-500); }
.slide-new-big > .body-wrap > .slide-big-body-inner > .action-row > .status-wrap > .status-item > .num { font-size: 24px; font-weight: 700; color: #3b82f6; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .action-row > .status-wrap > .status-item > .num.green { color: #16a34a; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .action-row > .status-wrap > .status-item > .num.gray { color: #363636; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .action-row > .btn-goto { font-size: 16px; display: flex; align-items: center; font-weight: 700; gap: 8px; }
.slide-new-big > .body-wrap > .slide-big-body-inner > .action-row > .btn-goto > .bullet { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: #22a3ff; border-radius: 50%; }
.slide-new-big > .badge-date { color: #fff; text-align: center; display: flex; align-items: center; flex-direction: column; justify-content: center; position: absolute; width: 80px; height: 80px; border-radius: 16px 0; }
.slide-new-big > .badge-date > span { display: block; width: 100%; font-weight: 700; font-size: 16px; }
.slide-new-big > .badge-date.orange { background-color: #ff7300; }
.active .slide-new-big > .thumb-wrap > img { right: 0; }
.active .slide-new-big > .body-wrap > .slide-big-body-inner { right: 0; }
.active .slide-new-big { opacity: 1; }
.slide-new-big:hover { outline: 1px solid #0077bc; filter: drop-shadow(4px 4px 6px rgba(0,0,0,.1)); }
.swiper-new-small .swiper-slide { width: 264px; }
.slide-new-small { width: 100%; border-radius: 3.2rem; cursor: pointer; height: 350px !important; box-shadow: 4px 4px 6px #0000; transition: box-shadow .18s ease, background-color .18s ease, outline-color .18s ease; }
.slide-new-small > img { max-width: 100%; width: 264px; }
.slide-new-small:hover { box-shadow: 4px 4px 6px #0000001a; background-color: #fff; outline: 2px solid #fff; }

.swiper-recommand-wrap { position: relative; width: 100%; margin-top: min(48px, 4.44vh); }
.slide-recommand { position: relative; max-width: 420px; aspect-ratio: 420 / 550; border-radius: 3.2rem; cursor: pointer; flex-shrink: 0; transition: all .3s; min-height:450px; }
.slide-recommand > .back-img { position: absolute; width: 100%; height: 100%; object-fit: contain; object-position: center center; left: 0; top: -24%; }
.slide-recommand > .slide-recommand-body { width: 100%; position: absolute; left: 0; bottom: 0; transition: bottom .3s; }
.slide-recommand:not(.swiper-slide-active) { transform: scale(.85); }
.slide-recommand:not(.swiper-slide-active):hover { transform: scale(.9); }
.slide-recommand.swiper-slide-active { border: 3px solid #fff; opacity: 1; filter: brightness(100%); filter: drop-shadow(4px 4px 12px rgba(0,0,0,.1)); border-radius: 3.5rem; }
.slide-recommand:hover { outline: 3px solid #fff; filter: drop-shadow(4px 4px 6px rgba(0,0,0,.1)); transform: scale(1.035); }
.swiper-recommand-wrap.is-two-slide .slide-recommand:hover { transform: scale(0.9); }
.swiper-recommand-wrap.is-two-slide .slide-recommand:not(.swiper-slide-active):hover { transform: scale(0.9); }
.swiper-recommand-wrap .swiper-control-wrap { margin-top: 20px; display: flex; justify-content: center; gap: 24px; }
.swiper-recommand-wrap .swiper-control-wrap .swiper-recommand-navigation button { width: 4.8rem; height: 4.8rem; }
.swiper-recommand-wrap .swiper-control-wrap .swiper-recommand-navigation button.prev svg { margin-right: 2px; }
.swiper-recommand-wrap .swiper-control-wrap .swiper-recommand-navigation button.next svg { margin-left: 2px; }


@media (max-width: 1280px) {
  .program-new-section > .new-swipers-wrap > .swiper-control-wrap { right: 5%; }
}

@media (max-width: 1024px) {
  .new-swipers-wrap { height: auto; flex-direction: column;  }
  .swiper-new-big { position: static; width: auto; height: auto; }
  .swiper-new-big > .swiper-wrapper { padding-top: 0; }
  .swiper-new-small { width: 100%; overflow: initial; height: auto; padding-top: 56px; }
  .swiper-new-small.is-two-slide { box-sizing: border-box; flex: 0 0 auto; width: 264px; overflow: hidden; padding-left: 0; }
  .program-new-section > .new-swipers-wrap  { padding-left: 24px; padding-right: 24px; }
  .program-new-section > .new-swipers-wrap > .swiper-control-wrap { position: static; justify-content: center; margin-top: 32px; }
  .program-new-section > .new-swipers-wrap > .swiper-control-wrap .swiper-navigation-nonsubject,
  .swiper-recommand-wrap .swiper-control-wrap .swiper-recommand-navigation { display: none; }
  .program-recommand-section.is-recommand-static .swiper-recommand-wrap > .swiper-wrapper { display: flex; flex-direction: column; align-items: center; gap: 16px; }
  .swiper-recommand-wrap { margin-top: 56px; }
  .slide-new-big { flex-direction: column; width: 100%; height: auto; }
  .slide-new-big > .thumb-wrap { width: 100%; height: auto; max-height: 400px; aspect-ratio: 358 / 313; }
  .slide-new-big > .body-wrap { width: 100%; height: auto; }
  .slide-new-big > .body-wrap > .slide-big-body-inner { position: static; }
}


/* modal */
.dcu26 .nonsubject-modal { width: 960px; max-width: calc(100vw - 32px); margin: 0; }

.dcu26 .nonsubject-modal__footer-text { margin: 0; width: 100%; text-align: center; font-size: 1.4rem; font-weight: 500; color: var(--dcu-color-text-350); line-height: 1.3; }

.dcu26 .nonsubject-modal__grid { display: flex; gap: 2.4rem; height: 100%; }

.dcu26 .nonsubject-modal__pie-area { width: 44.4rem; display: flex; flex-direction: column; align-items: center; gap: 1.6rem; padding-top: 0.8rem; }
.dcu26 .nonsubject-modal__donut-wrap { width: 32rem; height: 32rem; position: relative; display: flex; align-items: center; justify-content: center; }
.dcu26 .nonsubject-modal__donut-canvas { width: 100%; height: 100%; display: block; }


.dcu26 .nonsubject-modal__donut-center { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none; }
.dcu26 .nonsubject-modal__donut-center-title { font-size: 1.6rem; font-weight: 700; color: var(--dcu-color-text-500); line-height: 1.1; }
.dcu26 .nonsubject-modal__donut-center-total { display: flex;  align-items: flex-end; gap: 0.2rem; }
.dcu26 .nonsubject-modal__donut-center-total-label { font-size: 2.4rem; font-weight: 700; color: var(--dcu-color-text-350); line-height: 1; }
.dcu26 .nonsubject-modal__donut-center-total-num { font-size: 3.2rem; font-weight: 700; color: var(--dcu-color-text-500); line-height: 1; }
.dcu26 .nonsubject-modal__donut-center-total-unit { font-size: 2.4rem; font-weight: 700; color: var(--dcu-color-text-350); line-height: 1; }

.dcu26 .nonsubject-modal__legend { width: 32rem; display: grid; grid-template-columns: repeat(3, max-content); column-gap: 2.4rem; row-gap: 1.2rem; justify-content: center; }
.dcu26 .nonsubject-modal__legend-item { display: inline-flex; align-items: center; gap: 0.8rem; }
.dcu26 .nonsubject-modal__legend-dot { width: 1.2rem; height: 1.2rem; border-radius: 50%; background-color: #e5e7eb; }
.dcu26 .nonsubject-modal__legend-label { font-size: 1.4rem; font-weight: 600; color: var(--dcu-color-text-350); line-height: 1.2; }
.dcu26 .nonsubject-modal__bar-area { flex: 1; min-width: 0; display: flex; justify-content: flex-start; }
.dcu26 .nonsubject-modal__bars { width: 100%; display: flex; flex-direction: column; gap: 2.4rem; padding-top: 3.2rem; padding-right: 2.4rem; overflow: hidden; }
.dcu26 .nonsubject-modal__bar-item { width: 100%; display: flex; flex-direction: column; gap: 1rem; }
.dcu26 .nonsubject-modal__bar-row { display: flex; align-items: flex-end; justify-content: space-between; width: 100%; }
.dcu26 .nonsubject-modal__bar-label { margin: 0; font-size: 1.6rem; font-weight: 700; color: var(--dcu-color-text-500); line-height: 1; }
.dcu26 .nonsubject-modal__bar-value { margin: 0; font-size: 1.6rem; font-weight: 800; color: var(--dcu-color-text-500); line-height: 1; }
.dcu26 .nonsubject-modal__progress { width: 100%; height: 0.8rem; border-radius: 2rem; background-color: rgba(0, 0, 0, 0.1); overflow: hidden; }
.dcu26 .nonsubject-modal__progress-fill { height: 100%; border-radius: 2rem 0 0 2rem; width: 0; }

.dcu26 .nonsubject-modal__bar-area { position: relative; }
.dcu26 .nonsubject-modal__bar-item { cursor: pointer; }
.dcu26 .nonsubject-modal__donut-canvas { cursor: pointer; }

.dcu26 .nonsubject-modal__detail { position: absolute; inset: 0; z-index: 5; display: none; }
.dcu26 .nonsubject-modal__detail.is-open { display: flex; }
.dcu26 .nonsubject-modal__detail-inner { width: 100%; height: 100%; background-color: #fff; border: 1px solid var(--dcu-color-common-line-150); border-radius: 0.8rem; overflow: hidden; display: flex; flex-direction: column; }
.dcu26 .nonsubject-modal__detail-head { background-color: var(--dcu-color-common-solid-200, #f4f5f6); border-bottom: 1px solid var(--dcu-color-common-line-150); padding: 1.8rem 1.2rem; display: flex; align-items: center; gap: 0.8rem; }
.dcu26 .nonsubject-modal__detail-back { width: 2.4rem; height: 2.4rem; display: inline-flex; align-items: center; justify-content: center; border: 0; background: transparent; padding: 0; color: var(--dcu-color-text-400); font-size: 2rem; line-height: 1; cursor: pointer; }
.dcu26 .nonsubject-modal__detail-title { margin: 0; font-size: 1.8rem; font-weight: 700; color: var(--dcu-color-text-400, #33363d); line-height: 1.2; letter-spacing: -0.036px; }
.dcu26 .nonsubject-modal__detail-body { position: relative; flex: 1 1 0; min-height: 0; background-color: var(--dcu-color-common-solid-150); padding: 1.6rem 2rem; display: flex; flex-direction: column; gap: 2.4rem; overflow-y: auto; }
.dcu26 .nonsubject-modal__detail-item { display: flex; flex-direction: column; gap: 1rem; }
.dcu26 .nonsubject-modal__detail-row { display: flex; align-items: flex-end; justify-content: space-between; }
.dcu26 .nonsubject-modal__detail-label { margin: 0; font-size: 1.6rem; font-weight: 700; color: var(--dcu-color-text-500); line-height: 1; }
.dcu26 .nonsubject-modal__detail-value { margin: 0; font-size: 1.6rem; font-weight: 800; color: var(--dcu-color-text-500); line-height: 1; }
.dcu26 .nonsubject-modal__detail-progress { width: 100%; height: 0.8rem; border-radius: 2rem; background-color: rgba(0, 0, 0, 0.1); overflow: hidden; }
.dcu26 .nonsubject-modal__detail-progress-fill { height: 100%; width: 0; background-color: #2dd4bf; border-radius: 2rem 0 0 2rem; }


@media (max-width: 768px) {
  .dcu26 .nonsubject-modal .modal-body { height: auto; }
  .dcu26 .nonsubject-modal__grid { flex-direction: column; gap: 1.6rem; }
  .dcu26 .nonsubject-modal__pie-area { width: 100%; }
  .dcu26 .nonsubject-modal__legend { width: 100%; }
  .dcu26 .nonsubject-modal__bars { padding-top: 1.6rem; padding-right: 0; }
}


/* ----- List ----- */
.dcu26 .page-tit-block h2 { }
.dcu26 .page-tit-block .subtit { font-size: var(--dcu-text-size-depth1-title); font-weight: 600; color: var(--dcu-color-text-300); }
.dcu26 #content .sec-search { margin-bottom: 5.6rem; gap: 1.6rem; background-color: #fff; border-radius: 1.2rem; box-shadow: 4px 4px 16px 0 rgba(0, 0, 0, 0.06); }
.sec-search .input-line-block { flex-basis: 17%; justify-content: space-between; }
.sec-search .input-line-block.cascade { flex-basis: 30%; }
.sec-search__inner { flex-direction: row; flex-wrap: wrap; padding: 3.2rem 4rem;  }
.sec-search__inner label.check-label { flex-basis: auto; width: fit-content; }
.dcu26 .filter-modal { margin: 0; width: 960px; max-width: 100%; }
.sec-search-detail .input-line-block { flex-basis: auto; width: 100%; }
.sec-search-detail .dcu-layout-flex-wrap .input-line-block { flex-basis: 17%; }
.sec-search-detail .dcu-layout-flex-wrap .input-line-block.cascade { flex-basis: 30%; }
.sec-search-detail .radio-filter-group { display: flex; gap: 3.2rem; }
.sec-search-detail .radio-filter-group .input-line-block { flex-basis: 11rem; flex-grow: 0; flex-shrink: 0; justify-content: flex-end; }
.dcu26 #content .sec-program-list { gap: 3.2rem; }
.sec-program-list ul { list-style: none; margin: 0; padding: 0; }
.sec-program-list li { margin-bottom: 2rem; }
.sec-program-list li:last-child { margin-bottom: 0; }
.sec-program-list .sec-program-tab { display: flex; flex-direction:row; column-gap: 3rem; row-gap: 1rem; flex-wrap: wrap; align-items: center; }
.sec-program-list .sec-program-tab .program-list-btn { display: flex; flex-direction:row; gap: 0.5rem; flex-wrap: wrap; min-width:0; }
.sec-program-list .sec-program-tab .program-list-btn .overflow-btn { display: block; width: 100%; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

@media (max-width: 768px) {
	.sec-program-list .sec-program-tab { justify-content: center; }
	.sec-program-list .sec-program-tab .program-list-btn { justify-content: center; }
}


.dcu26 #content.list .sec-program-list .dcu-pagination { text-align: center; }
.dcu26 #content.list .sec-program-list .pagination li:not(.active) a:not(:hover) { background-color: #ECF3F7; }
.dcu26 .filter-modal .search-keyword { width: 40%; }

.dcu26 .input-line-block:has(> .program-modal) { position: relative; }
.dcu26 .input-line.date { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; }
.dcu26 .date-input-box { position: relative; width: calc((100% - 30px) / 2); }
.dcu26 .date-input-box input { color: transparent; }
.dcu26 .date-input-box.active input { color: var(--dcu-color-primary-400); }
.dcu26 .date-input-box input[type="date"]::-webkit-calendar-picker-indicator { opacity: 0; position: absolute; right: 0; width: 100%; height: 100%; cursor: pointer; }
.dcu26 .date-input-box .placeholder { position: absolute; left: 2px; top: 50%; transform: translateY(-50%); font-size: 20px; color: var(--dcu-color-primary-400);; pointer-events: none; }
.dcu26 .date-input-box.active .placeholder { opacity: 0; }
.dcu26 .input-line.date em { width: 30px; text-align: center; color: var(--dcu-color-primary-400); }

/* program modal */
.program-modal { display: none; position: absolute; top: calc(100% + 15px); padding: 25px 17px; border: 1px solid var(--dcu-color-primary-200); border-radius: 1.2rem; background-color: #fff; z-index: 10; }
.program-modal.active { display: block; }
.program-modal .search-wrap { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; position: relative; }
.program-modal .search-wrap::before { content: ''; position: absolute; top: 0; left: 0; width: 40px; height: 100%; background: url(/DCU_Portal/pages/common_v2/images/nonsubject/filter_icon_write.svg) no-repeat center; background-size: 30px auto; }
.program-modal .search-wrap input { -webkit-appearance: none; appearance: none; width: 50vw; max-width: 300px; margin-left: 40px; padding: 0.5rem 10px; border: none; transition: none }
.program-modal .search-wrap input:focus-visible { outline: none; border-color: transparent !important; background-color: #ECF6FF !important; }
.dcu26 .program-modal .search-wrap button { width: 40px; min-height: 35px; text-indent: -9999px; color: transparent; background: url(/DCU_Portal/pages/common_v2/images/nonsubject/filter_icon_reset.svg) no-repeat center; background-size: auto 27px; }
.program-modal .result-wrap { display: none; }
.program-modal .result-wrap.active { display: block; }
.program-modal .result-wrap ul { display: flex; flex-direction: column; flex-wrap: wrap; gap: 1rem; margin-top: 15px; padding-top: 22px; border-top: 2px solid #888; }
.program-modal .result-wrap li a { color: var(--dcu-color-text-300); }
.program-modal .result-wrap li a:hover { color: var(--dcu-color-primary-400); }

@media (max-width: 1024px) {
  .dcu26 #content .sec-search { margin-bottom: 4.8rem; }
  .sec-search__inner { padding: 2.4rem 2rem; }
  .dcu26 #content .sec-program-list { gap: 1.6rem; }
  .dcu26 .filter-modal .search-keyword { width: 100%; }
}
@media (max-width: 768px) {
  .sec-search { position: relative; }
  .sec-search__inner { padding: calc(2.4rem + 60px) 2rem 2.4rem; }
  .sec-search .input-line-block { flex-basis: 100%; }
  .sec-search .input-line-block.cascade { flex-basis: 100%; }
  .search-btn-wrap { position: absolute; top: 2.4rem; right: 2rem; }
}

/* ----- Detail ----- */
/* program-info */
.program-info-wrap .thumb { flex-shrink: 0; width: 43.2rem; height: auto; aspect-ratio: 1 / 1; border-radius: 2.4rem; background: #D9D9D9; position: relative; }
.program-info-wrap .thumb .thumb-wrap { overflow: hidden; border-radius: 2.4rem; }
.program-info-wrap .thumb .thumb-wrap img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 1 / 1; }
.program-info-wrap .body { min-width: 0; }
.program-info-wrap .main { padding-bottom: 1.6rem; padding-bottom: 2.8rem; border-bottom: 1px solid var(--dcu-color-common-line-150); }
.program-info-wrap .term { width: 100%; padding: 2.4rem 0; gap: 1rem; font-size: var(--dcu-text-size-xl); border-bottom: 1px solid var(--dcu-color-common-line-150); }
.program-info-wrap .title { margin: 0 0 0.8rem; font-size: var(--dcu-text-size-xxxl); font-weight: 600; line-height: 1.3; color: var(--dcu-color-text-400); }
.program-info-wrap .desc { margin: 0; font-size: var(--dcu-text-size-md); line-height: 1.3; color: var(--dcu-color-text-300); }
.program-info-wrap .badges { display: flex; align-items: center; gap: 0.4rem; }
.program-info-wrap .badges .badge { padding: 1.2rem 2.4rem; border-radius: 3.2rem; font-size: 1.6rem; line-height: 1;  }
.program-info-wrap .badges .badge.recruit { background-color: var(--dcu-color-green-600); color: var(--dcu-color-gray-white); }
.program-info-wrap .badges .badge.dday { background-color: var(--dcu-color-blue-100); color: var(--dcu-color-text-400); }
.program-info-wrap .detail { gap: 2.4rem 3.2rem; max-width: 72rem; }
.program-info-wrap .detail-label { color: var(--dcu-color-text-300); }
.program-info-wrap .info { padding-top: 2.4rem; padding-bottom: 3.2rem; align-items: flex-start; border-bottom: 1px solid var(--dcu-color-common-line-150); }
.program-info-wrap .info-title { font-size: var(--dcu-text-size-lg); font-weight: 700; line-height: 1; }
.program-info-wrap .stat { min-width: 5rem; }
.program-info-wrap .stat-num { font-size: 3.6rem; line-height: 1; }
.program-info-wrap .stat.apply .stat-num { color: var(--dcu-color-primary-400); }
.program-info-wrap .stat.recruit .stat-num { color: var(--dcu-color-green-500); }
.program-info-wrap .stat-label { font-size: 1.4rem; color: var(--dcu-color-text-300); line-height: 1.2; }
.program-info-wrap .btn { justify-content: center; height: 5.6rem; padding: 1.6rem 2.1rem 1.6rem 2.8rem; border-radius: 1.2rem; font-size: 1.8rem; flex-shrink: 0; min-width: 21rem; }
.program-info-wrap .btn svg { flex-shrink: 0; }

@media (max-width: 1024px) {
  .program-info-wrap .thumb { width: 28.6rem; }
}

@media (max-width: 768px) {
  .program-info-wrap .thumb { width: 100%; aspect-ratio: 358 / 230; height: auto; }
}

/* program-basi */
.dcu26 .list-item-inline__value.item-wrap { border-left: 0; }
.program-tag { padding: 0.7rem 1.6rem; border-radius: 2rem; border: 1px solid var(--dcu-color-common-line-200); font-size: var(--dcu-text-size-sm); line-height: 1.3; }
.program-file { display: inline-flex; align-items: center; gap: 0.4rem; }
.program-file svg { flex-shrink: 0; }


/* program-content */
.sec-program-content .box-model article { font-size: var(--dcu-text-size-lg); line-height: 1.3; }

@media (max-width: 768px) {
  .sec-program-content .box-model article { padding: 2rem; font-size: var(--dcu-text-size-md);  }
}


/* application-modal */
.dcu26 .application-modal { margin: 0; width: 960px; max-width: 100%; }
.dcu26 .application-modal .modal-header { padding: 2.4rem; }
.dcu26 .application-modal .modal-body { max-height: calc(100vh - 24rem); }


.dcu-survey-list { flex-grow: 1; display: flex; flex-direction: column; gap: 4rem; min-width: 0; } 

.dcu-survey-item { display: flex; flex-direction: column; gap: 16px; } 
.dcu-survey-item__header { display: flex; align-items: flex-start; gap: 8px; font-size: 1.8rem; } 
.dcu-survey-item__number {  font-weight: 700; color: var(--dcu-color-primary-450); line-height: 1; padding-top: 0.2rem; }
.dcu-survey-item__question { font-weight: 500; color: var(--dcu-color-text-500); margin: 0; line-height: 1.3; }
.dcu-survey-item__options { display: flex; justify-content: space-between; gap: 0.8rem; } 

.dcu-survey-radio { display: block; position: relative; cursor: pointer; flex: 0 1 18.5rem; min-width: 0; } 
.dcu-survey-radio input { position: absolute; opacity: 0; cursor: pointer; } 
.dcu-survey-radio__box { display: flex; flex-direction: column; justify-content: space-between; gap: 1.6rem; align-items: flex-start; width: 100%; height: 100%; min-height: 10rem; padding: 2rem; background-color: var(--dcu-color-common-solid-200); border-radius: 0.8rem; font-size: var(--dcu-text-size-md); font-weight: 600; line-height: 1; transition: background-color 0.2s, color 0.2s; }

/* üũ ¾ÆÀÌÄÜ(°¡»ó ¿ä¼Ò·Î Ãß°¡) */
.dcu-survey-radio__box::after { content: ''; display: block; width: 26px; height: 26px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 26 26' fill='none'%3E%3Cpath d='M7 12.5L12 17.5L23.5 4' stroke='%23B1B8BE' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M18 2.08808C16.4779 1.38949 14.7844 1 13 1C6.37258 1 1 6.37258 1 13C1 19.6274 6.37258 25 13 25C19.6274 25 25 19.6274 25 13C25 11.9641 24.8687 10.9589 24.6219 10' stroke='%23B1B8BE' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; align-self: flex-start; }
.dcu-survey-radio input:checked ~ .dcu-survey-radio__box { background-image: none; background-color: var(--dcu-color-primary-400); color: #FFFFFF; } 

/* üũµÇ¾úÀ» ¶§ ¾ÆÀÌÄÜ »ö»ó º¯°æ (Èò»ö) */
.dcu-survey-radio input:checked ~ .dcu-survey-radio__box::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 26 26' fill='none'%3E%3Cpath d='M7 12.5L12 17.5L23.5 4' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M18 2.08808C16.4779 1.38949 14.7844 1 13 1C6.37258 1 1 6.37258 1 13C1 19.6274 6.37258 25 13 25C19.6274 25 25 19.6274 25 13C25 11.9641 24.8687 10.9589 24.6219 10' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; } 


@media (max-width: 768px) {
  .dcu26 .application-modal .modal-body { max-height: none; }

  .dcu-survey-list { gap: 4rem; }
  .dcu-survey-item__header { font-size: 1.6rem; }

  .dcu-survey-item__options { flex-direction: column; }
  .dcu-survey-radio { flex: auto; }
  .dcu-survey-radio__box { flex-direction: row; align-items: center; min-height: 0; padding: 1.2rem 1.6rem; }
}

/* curriculum-table */
.cur-table-wrap { }
.cur-table { width: 100%; }
.cur-table col { width: 10rem; }
.cur-table col:nth-child(2) { width: 14rem; }
.cur-table col:nth-child(3) { width: auto; }
.cur-table-wrap .tb-cell { background-color: #E8F2FF; border-color: #B9DEFF; }
.cur-table-wrap .tb-cell--row-head { border-right: 1px solid #B9DEFF; }
.cur-table tr:first-child .tb-cell { border-top: 1px solid #B9DEFF; }
.cur-table tr:first-child .tb-cell-bd { border-top: 1px solid var(--dcu-color-common-line-150); }
.cur-table tr:first-child > *:first-child .tb-cell { border-left: 1px solid #B9DEFF;}
.cur-table .first-row-header [class*="tb-cell"] { border-top-left-radius: 1.2rem; }
.cur-table .last-row-header [class*="tb-cell"] { border-bottom-left-radius: 1.2rem; }
.cur-table .first-row-action [class*="tb-cell"] { border-top-right-radius: 1.2rem; }
.cur-table .last-row-action [class*="tb-cell"] { border-bottom-right-radius: 1.2rem; }


@media (max-width: 1024px) {
  .cur-table col { width: 8rem; }
  .cur-table col:nth-child(2) { width: 12rem; }
}

@media (max-width: 768px) {
  .cur-table col { width: 5rem; }
  .cur-table col:nth-child(2) { width: 7.2rem; }
}