@charset "UTF-8";
/* ==========================================================================
공통 스타일 변수
========================================================================== */
/* ─────────────────────────────────────────
   fluid() — clamp 유틸 함수
   최솟값은 디자인 결정값(px 고정), 최댓값은 피그마 PC값
   ─────────────────────────────────────────
   사용법: fluid($min-px, $max-px, $vp-min: 375, $vp-max: 1920)
   예시  : font-size: fluid(16, 22);  → 최소 16px, 최대 22px
           padding  : fluid(20, 60);  → 최소 20px, 최대 60px
   ───────────────────────────────────────── */
:root {
  --header-height: clamp(64px, 5.5262135922rem + 2.3300970874vw, 10rem);
  --layout: 1520px;
  --layout-md: 1760px;
  --layout-lg: 1920px;
  --vh: 1px;
  --font: "Pretendard";
  --font-en: "Google Sans Flex";
  --icon: remixicon;
  --fs-xs: 1.2rem;
  --fs-sm: 1.4rem;
  --fs-md: 1.6rem;
  --fs-lg: 2.4rem;
  --fs-xl: 3.2rem;
  --fs-2xl: 4.8rem;
  --fs-3xl: 6.4rem;
  --lh-sm: 1.25;
  --lh-md: 1.5;
  --lh-lg: 1.6;
  --br-xxs: 0.4rem;
  --br-xs: 0.8rem;
  --br-sm: 1.2rem;
  --br-md: 1.6rem;
  --br-lg: 2rem;
  --br-xl: 2.4rem;
  --trs: 0.3s ease-in-out;
  /* ─────────────────────────────────────────
   Spacing 토큰 — fluid($min-px, $max-px)
   ───────────────────────────────────────── */
  --space-inner-x: clamp(20px, 0.786407767rem + 3.2362459547vw, 7rem);
  --primary: #092844;
  --second: #003768;
  --point: #c21f23;
  --primary-10: #d8e5fd;
  --primary-20: #b1cefb;
  --primary-30: #86aff9;
  --primary-40: #4c87f6;
  --primary-50: #0b50d0;
  --second-10: #d6e0eb;
  --second-20: #bacbde;
  --second-30: #90b0d5;
  --second-40: #6b96c7;
  --second-50: #1c589c;
  --point-10: #fde8e8;
  --point-20: #fac5c5;
  --point-30: #f6a3a3;
  --point-40: #f17272;
  --point-50: #cc2d2d;
  --gray-0: #ffffff;
  --gray-5: #f4f5f6;
  --gray-10: #e6e8ea;
  --gray-20: #cdd1d5;
  --gray-30: #b1b8be;
  --gray-40: #8a949e;
  --gray-50: #6d7882;
  --gray-60: #58616a;
  --gray-70: #464c53;
  --gray-80: #33363d;
  --gray-90: #1e2124;
  --gray-95: #131416;
  --gray-100: #000000;
  --black-950: #111111;
  --black-900: #222222;
  --black-800: #424242;
  --black-700: #616161;
  --black-600: #757575;
  --black-500: #9e9e9e;
  --black-400: #bdbdbd;
  --black-300: #e0e0e0;
  --black-200: #eeeeee;
  --black-100: #f5f5f5;
  --black-50: #fafafa;
  --layer-dim: rgba(0, 0, 0, 0.4);
  --red: #c41d2d;
  --deep-blue: #00326e;
  --dark-blue: #082036;
  --blue: #133d92;
  --cool-gray: #70839a;
  --white: #ffffff;
  --black: #000000;
  --color-success: #1e7e34;
  --color-success-bg: #d1fae5;
  --color-warning: #d97706;
  --color-warning-bg: #fef3c7;
  --color-error: #dc2626;
  --color-error-bg: #fee2e2;
  --color-01: #0f71c8;
  --color-02: #713cbb;
  --color-03: #cd4c65;
  --color-04: #2f9c82;
  --color-05: #70839a;
}

/*-------------------------------------------------
서브 레이아웃
-------------------------------------------------*/
html.is-sub-page-entering .sub-visual,
html.is-sub-page-entering #container > .contents-tab,
html.is-sub-page-entering #contents {
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, 3rem, 0);
  will-change: opacity, transform;
}
html.is-sub-page-entering .sub-visual {
  transform: translate3d(0, 2rem, 0);
}
html.is-sub-page-entering.is-sub-page-loaded .sub-visual,
html.is-sub-page-entering.is-sub-page-loaded #container > .contents-tab,
html.is-sub-page-entering.is-sub-page-loaded #contents {
  opacity: 1;
  visibility: visible;
  transform: translate3d(0, 0, 0);
  transition: opacity 0.7s ease, transform 0.85s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s;
}
html.is-sub-page-entering.is-sub-page-loaded.has-sub-visual-entry #container > .contents-tab,
html.is-sub-page-entering.is-sub-page-loaded.has-sub-visual-entry #contents {
  transition-delay: 0.16s;
}

@media (prefers-reduced-motion: reduce) {
  html.is-sub-page-entering .sub-visual,
  html.is-sub-page-entering #container > .contents-tab,
  html.is-sub-page-entering #contents {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: none;
  }
}
#container {
  padding-top: calc(var(--header-height));
}
#container:has(.board-view, .total_search) .sub-visual {
  display: none;
}
#container:has(.contents-bg) {
  overflow-x: clip;
}
#container:has(.contents-bg) .sub-visual {
  position: relative;
  max-width: min(var(--layout-lg), 100vw - clamp(40px, 2.0582524272rem + 5.1779935275vw, 12rem));
}
#container:has(.contents-bg) .sub-visual-info {
  position: absolute;
  left: 0;
  top: 0;
  align-items: start;
  padding: clamp(24px, 2.2058252427rem + 0.5177993528vw, 3.2rem) clamp(32px, 2.8116504854rem + 1.0355987055vw, 4.8rem);
  z-index: 1;
  width: fit-content;
}
#container:has(.contents-bg) .sub-visual-info-title {
  display: none;
}
#container:has(.contents-bg) .breadcrumb > li:not(:last-child)::after {
  border-left-color: rgba(255, 255, 255, 0.3);
}
#container:has(.contents-bg) .breadcrumb > li > a {
  color: #fff;
}
#container:has(.contents-bg) .contents {
  margin-top: 0 !important;
}
#container:has(.contents-tab) .contents {
  margin-top: 0;
}
#container:has(.contents-tab) .sub-visual-info {
  padding: clamp(32px, 2.8116504854rem + 1.0355987055vw, 4.8rem) 0 clamp(32px, 2.8116504854rem + 1.0355987055vw, 4.8rem);
}
#container:has(.sub-visual-img[style*=display][style*=none]) .contents {
  margin-top: 0;
}
#container:has(.academy-hero) .contents {
  margin-top: 0;
}
#container:has(.purpose) .contents {
  margin-bottom: 0;
}
@media (max-width: 768px) {
  #container:has(.board-view) .contents {
    margin-top: 0 !important;
  }
}

.breadcrumb {
  display: flex;
  gap: 8px 3.2rem;
  justify-content: center;
  align-items: center;
}
.breadcrumb-wrap {
  font-size: 1.5rem;
}
.breadcrumb > li {
  position: relative;
  display: flex;
  align-items: center;
}
.breadcrumb > li:not(:last-child)::after {
  content: "";
  display: block;
  position: absolute;
  left: calc(100% + 1.6rem);
  width: 1px;
  height: 12px;
  border-left: 1px solid rgba(51, 51, 51, 0.2);
}
.breadcrumb > li > a {
  position: relative;
  display: block;
  color: #424242;
  font-size: clamp(14px, 1.3029126214rem + 0.2588996764vw, 1.8rem);
  font-weight: 500;
  line-height: 160%;
  text-align: center;
}
.breadcrumb > li > a + ul {
  position: absolute;
  display: none;
  flex-direction: column;
  gap: 8px;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  min-width: 16rem;
  background-color: #fff;
  border-radius: var(--br-xxs);
  padding: 1.2rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  z-index: 2;
  transition: 0.25s;
}
.breadcrumb > li > a + ul.active {
  display: flex;
}
.breadcrumb > li > a + ul > li > a {
  display: block;
  color: var(--primary);
  font-size: clamp(13px, 1.227184466rem + 0.1941747573vw, 1.6rem);
  font-weight: 400;
  line-height: 160%;
  text-align: center;
}
.breadcrumb > li > a + ul > li > a:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.breadcrumb > li:not(.home, .no-depth2) > a {
  display: flex;
  align-items: center;
  gap: 4px;
}
.breadcrumb > li:not(.home, .no-depth2) > a:after {
  content: "\ea4e";
  font-family: var(--icon);
  font-size: clamp(16px, 1.5029126214rem + 0.2588996764vw, 2rem);
  transition: transform 0.25s;
}
.breadcrumb > li:not(.home, .no-depth2) > a[aria-expanded=true]:after {
  transform: rotate(180deg);
}
.breadcrumb > li.has-depth2 > a {
  color: #757575;
}
.breadcrumb > li.no-depth2 > a {
  color: #424242;
}
.breadcrumb .current {
  font-weight: 700;
}

.sub-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.sub-visual .inner {
  width: 100%;
}
.sub-visual-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  width: 100%;
  padding: clamp(32px, 2.8116504854rem + 1.0355987055vw, 4.8rem) 0 clamp(48px, 4.4116504854rem + 1.0355987055vw, 6.4rem);
}
.sub-visual-info-title {
  color: #111;
  text-align: center;
}
.sub-visual-info-desc {
  font-size: 2rem;
  color: #fff;
  opacity: 0.8;
}
.sub-visual-img {
  width: 100%;
  height: clamp(160px, 12.1165048544rem + 10.355987055vw, 32rem);
  overflow: hidden;
  padding: 0 clamp(20px, 1.0291262136rem + 2.5889967638vw, 6rem);
  margin: 0 auto;
}
.sub-visual-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--br-sm);
}

.inner:has(.lnb) {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 4rem;
}

.lnb {
  display: none;
  width: 23rem;
}
.lnb-list {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}
.lnb-item .lnb-btn {
  font-size: 2rem;
  font-weight: 700;
}
.lnb-item .lnb-submenu {
  display: none;
}
.lnb-item.active .lnb-submenu {
  display: block;
}
.lnb-subitem {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0.8rem;
  margin-top: 1rem;
}
.lnb-subitem .lnb-btn {
  font-size: 1.6rem;
  color: #666;
}
.lnb-subitem::before {
  content: "";
  width: 0.4rem;
  height: 0.4rem;
  margin-top: 1rem;
  background-color: #ccc;
  border-radius: 50%;
}

.contents {
  position: relative;
  width: 100%;
  margin: clamp(64px, 6.0116504854rem + 1.0355987055vw, 8rem) 0 clamp(120px, 11.0291262136rem + 2.5889967638vw, 16rem);
}
.contents:has(.contents-tab) {
  margin-top: 0;
}

/*-------------------------------------------------
탭
-------------------------------------------------*/
.tab {
  display: flex;
  gap: 0.8rem;
  position: relative;
}
.tab-area {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.tab-btn {
  display: flex;
  min-width: 5.6rem;
  height: 4rem;
  padding: 0 0.4rem;
  justify-content: center;
  align-items: center;
  font-weight: 700;
  position: relative;
  white-space: nowrap;
}
.tab-btn::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 0.3rem;
  background-color: var(--second-50);
  transition: 0.3s;
}
.tab-btn.active {
  color: var(--second-50);
}
.tab-btn.active::before {
  left: 0;
  width: 100%;
}
.tab-panel {
  display: none;
  width: 100%;
  position: relative;
}
.tab-panel.active {
  display: block;
}
.tab-panel .more {
  position: absolute;
  right: 0;
  top: 0;
  transform: translateY(-200%);
  transition: 0.25s;
  border-radius: 0.4rem;
  padding: 0.2rem 0.4rem;
  gap: 0.4rem;
}

@media (max-width: 1024px) {
  .inner:has(.lnb) {
    flex-direction: column;
  }
  .lnb-item {
    display: none;
  }
  .lnb-item.active {
    display: block;
  }
  .contents {
    width: 100%;
  }
}
@media (max-width: 768px) {
  .breadcrumb {
    gap: 8px 12px;
  }
  .breadcrumb > li:not(:last-child)::after {
    display: none;
  }
}
.board-attach {
  position: absolute;
  top: calc(100% - 28px);
  right: 2.4rem;
  z-index: 1;
  min-width: 48rem;
  padding: 24px;
  border-radius: 1.6rem;
  border: 1px solid var(--black-300-border-e-0-e-0-e-0, #e0e0e0);
  background: var(--black-50-background-fafafa, #fafafa);
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1);
}
.board-attach > strong {
  display: block;
  font-size: clamp(15px, 1.3786407767rem + 0.3236245955vw, 2rem);
  font-weight: 600;
  color: #111;
  line-height: 1.5;
  text-align: left;
}
.board-attach > ul {
  display: flex;
  flex-direction: column;
  margin-top: 16px;
  row-gap: 8px;
}
.board-attach > ul > li > a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: clamp(13px, 1.227184466rem + 0.1941747573vw, 1.6rem);
  gap: 16px;
  color: #424242;
  padding: 12px 16px;
  border-radius: 0.8rem;
  border: 1px solid var(--black-300-border-e-0-e-0-e-0, #e0e0e0);
  background: #fff;
}
.board-attach > ul > li > a > span {
  flex: 1;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  word-break: break-all;
  text-align: left;
  font-weight: 500;
  line-height: 150%;
  letter-spacing: -0.01em;
}
.board-attach > ul > li > a > i {
  font-size: clamp(12px, 1.1029126214rem + 0.2588996764vw, 1.6rem);
  font-weight: 500;
  color: #424242;
}
.board-attach > ul > li > a > img {
  display: none;
  opacity: 0;
  visibility: hidden;
}
.board-attach-close {
  position: absolute;
  top: clamp(27.5px, 2.713592233rem + 0.0970873786vw, 2.9rem);
  right: 24px;
}
.board-attach-close > i {
  font-size: clamp(16px, 1.5029126214rem + 0.2588996764vw, 2rem);
  font-weight: 500;
}

@media (max-width: 768px) {
  html.board-attach-open {
    overflow: hidden;
  }
  html.board-attach-open::after {
    position: fixed;
    inset: 0;
    z-index: 10;
    background: rgba(0, 0, 0, 0.45);
    content: "";
  }
  html.board-attach-open body > .board-attach {
    position: fixed;
    top: auto;
    right: auto;
    bottom: 0;
    left: 0;
    z-index: 15;
    width: 100%;
    min-width: 100%;
    min-height: 280px;
    max-height: calc(100dvh - 4rem);
    overflow-y: auto;
    border: none;
    border-radius: 16px 16px 0 0;
    background: #fff;
  }
}
/* ==========================================================================
달력 컴포넌트
========================================================================== */
@keyframes calendar-loading-spin {
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
.calendar {
  flex: 1 1 96rem;
  min-width: 0;
  border-radius: 0.8rem;
  background: #f3f4f5 !important;
}
.calendar-grid {
  position: relative;
}
.calendar.is-loading .calendar-grid {
  min-height: 48rem;
  pointer-events: none;
}
.calendar.is-loading .calendar-grid::before, .calendar.is-loading .calendar-grid::after {
  content: "";
  position: absolute;
  z-index: 20;
}
.calendar.is-loading .calendar-grid::before {
  inset: 0;
  background: #f3f4f5;
}
.calendar.is-loading .calendar-grid::after {
  top: 50%;
  left: 50%;
  width: 3.2rem;
  height: 3.2rem;
  border: 0.3rem solid rgba(0, 85, 164, 0.2);
  border-top-color: var(--primary);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  animation: calendar-loading-spin 0.7s linear infinite;
}
.calendar-board {
  display: flex;
  gap: 4rem;
  width: 100%;
  margin: 0 0 clamp(40px, 3.0291262136rem + 2.5889967638vw, 8rem);
}
.calendar-event-source {
  display: none;
}
.calendar-head {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 8.4rem;
  gap: 2rem;
}
.calendar-title {
  min-width: 13.8rem;
  color: #111;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}
.calendar-nav {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 3.6rem;
  height: 3.6rem;
  border: 1px solid #c9cdd2;
  border-radius: var(--br-xs);
  background: #fff;
  color: #333;
  font-size: 2.4rem;
  line-height: 1;
  transition: 0.2s;
}
.calendar-nav:hover, .calendar-nav:focus-visible {
  border-color: var(--primary);
  color: var(--primary);
}
.calendar-week {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0.4rem;
  padding: 0 0.8rem 0.8rem;
}
.calendar-week > li {
  height: 3.9rem;
  color: #111;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 3.9rem;
  text-align: center;
}
.calendar-week > li:first-child {
  color: #ef3340;
}
.calendar-week > li:last-child {
  color: #006cb8;
}
.calendar-grid {
  display: block;
  padding: 0 0.8rem 0.8rem;
}
.calendar {
  --fc-border-color: transparent;
  --fc-page-bg-color: transparent;
  --fc-neutral-bg-color: transparent;
  --fc-today-bg-color: transparent;
  --fc-event-bg-color: transparent;
  --fc-event-border-color: transparent;
  --fc-event-text-color: #fff;
  background: transparent;
  font-family: inherit;
}
.calendar,
.calendar table {
  font-size: inherit;
}
.calendar table {
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0.4rem;
}
.calendar .fc-scrollgrid,
.calendar .fc-scrollgrid-section > td,
.calendar th,
.calendar td {
  border: 0;
}
.calendar .fc-scrollgrid {
  width: 100%;
}
.calendar .fc-Uy {
  position: static !important;
}
.calendar [role=columnheader] {
  min-width: 0;
  height: auto;
  padding: 0;
  color: #111;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}
.calendar [role=columnheader] > div,
.calendar [role=columnheader] > div > div {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 0;
  width: 100%;
  min-height: 3.9rem;
  height: auto;
  padding: 0.4rem 0.2rem;
  color: inherit;
  font: inherit;
  line-height: inherit;
  text-decoration: none;
}
.calendar [role=columnheader] a,
.calendar [role=columnheader] span,
.calendar [role=columnheader] font {
  min-width: 0;
  max-width: 100%;
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
  line-height: 1.2;
  text-align: center;
}
.calendar [role=columnheader]:first-child,
.calendar [role=columnheader]:first-child > div,
.calendar [role=columnheader]:first-child > div > div {
  color: #ef3340;
}
.calendar [role=columnheader]:last-child,
.calendar [role=columnheader]:last-child > div,
.calendar [role=columnheader]:last-child > div > div {
  color: #006cb8;
}
.calendar [role=grid] {
  gap: 0.8rem;
}
.calendar [role=row],
.calendar [role=rowgroup] {
  gap: 0.4rem;
}
.calendar [role=gridcell][data-date] {
  position: relative;
  display: flex;
  flex-direction: column;
  box-sizing: border-box !important;
  overflow: hidden;
  height: auto !important;
  min-height: 12rem !important;
  padding: 0 0.8rem 1.2rem !important;
  border: 0;
  border-radius: 0.6rem;
  background: #fff;
  box-shadow: inset 0 0 0 1px #d9dde2;
  transition: box-shadow 0.2s;
  cursor: pointer;
}
.calendar [role=gridcell][data-date]:nth-child(7n+1) > div:first-child,
.calendar [role=gridcell][data-date]:nth-child(7n+1) > div:first-child > div {
  color: #ef3340;
}
.calendar [role=gridcell][data-date]:nth-child(7n) > div:first-child,
.calendar [role=gridcell][data-date]:nth-child(7n) > div:first-child > div {
  color: #006cb8;
}
.calendar [role=gridcell][data-date].is-other-month {
  background: #f3f4f5;
}
.calendar [role=gridcell][data-date].is-other-month > div:first-child,
.calendar [role=gridcell][data-date].is-other-month > div:first-child > div {
  color: #b8bdc4;
}
.calendar [role=gridcell][data-date].is-active, .calendar [role=gridcell][data-date]:focus-within {
  box-shadow: inset 0 0 0 1px #003b68;
}
.calendar [role=gridcell][data-date] > div:first-child {
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  flex-shrink: 0;
  width: 100%;
  color: #222;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.2;
  padding: 0.8rem 0;
}
.calendar [role=gridcell][data-date] > div:first-child > div {
  display: block;
  padding: 0;
  color: #222;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.2;
  text-decoration: none;
}
.calendar [role=gridcell][data-date] > div:nth-child(2) {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  margin-top: 0;
  gap: 0.2rem;
}
.calendar [role=gridcell][data-date] > div:nth-child(2) > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.calendar [role=gridcell][data-date] > div:nth-child(2) > div {
  overflow: hidden;
}
.calendar [role=gridcell][data-date] > div:nth-child(2) > div,
.calendar [role=gridcell][data-date] > div:nth-child(2) > div > div {
  min-height: 0 !important;
}
.calendar [role=gridcell][data-date] > div:nth-child(2) > div:first-child {
  overflow: hidden;
  height: calc(60px + 0.4rem) !important;
  min-height: calc(60px + 0.4rem) !important;
}
.calendar [role=gridcell][data-date] .fc-qp.fc-d7 > :first-child {
  align-items: stretch;
  min-height: 20px;
}
.calendar [role=gridcell][data-date] .fc-qp.fc-d7 > :first-child > div {
  min-height: 20px !important;
}
.calendar [role=gridcell][data-date] .fc-qp.fc-d7 {
  min-height: 20px !important;
}
.calendar [role=gridcell][data-date] .fc-ry {
  color: var(--black-600);
  font-family: var(--font);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  white-space: nowrap;
}
.calendar [role=gridcell][data-date] a {
  display: block;
  margin: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-decoration: none;
}
.calendar [role=gridcell][data-date] > div:last-child {
  display: none;
}
.calendar-day-number, .calendar-event {
  display: block;
}
.calendar-day-number {
  color: #222;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.2;
}
.calendar-event {
  box-sizing: border-box;
  overflow: hidden;
  width: 100%;
  height: 20px;
  padding: 0.3rem 0.6rem;
  border-radius: 3px;
  background: #0055a4;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  text-align: left;
  text-overflow: ellipsis;
  line-height: 1.2;
  white-space: nowrap;
}
.calendar-event.color01 {
  background: var(--color-01);
}
.calendar-event.color02 {
  background: var(--color-02);
}
.calendar-event.color03 {
  background: var(--color-03);
}
.calendar-event.color04 {
  background: var(--color-04);
}
.calendar-event.color05 {
  background: var(--color-05);
}
.calendar-list {
  flex: 0 0 52rem;
  overflow: hidden;
  min-height: 87.9rem;
  border: 1px solid #d9dde2;
  border-radius: 0.8rem;
  background: #fff;
}
.calendar-list-head {
  display: flex;
  align-items: center;
  min-height: 8.4rem;
  padding: clamp(20px, 1.9029126214rem + 0.2588996764vw, 2.4rem) clamp(20px, 1.7087378641rem + 0.7766990291vw, 3.2rem);
  border-bottom: 1px solid #d9dde2;
}
.calendar-list-head strong,
.calendar-list-head span {
  color: #111;
  font-size: clamp(17px, 1.5300970874rem + 0.4530744337vw, 2.4rem);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
}
.calendar-list-head span {
  margin-left: 0.8rem;
  font-weight: 400;
}
.calendar-list-nav {
  display: flex;
  margin-left: auto;
  gap: 0.4rem;
}
.calendar-list-body {
  display: flex;
  flex-direction: column;
  padding: clamp(24px, 2.2058252427rem + 0.5177993528vw, 3.2rem);
  gap: 12px;
}
.calendar-list-body > li {
  color: #111;
  font-size: clamp(16px, 1.5029126214rem + 0.2588996764vw, 2rem);
  font-weight: 400;
  line-height: 1.5;
}
.calendar-list-body > li > a {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  color: inherit;
}
.calendar-list-body > li > a:hover .calendar-list-title {
  text-decoration: underline;
  text-underline-offset: 0.3rem;
}
.calendar-list-title {
  flex: 1;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.calendar-list-empty {
  color: #777 !important;
  font-size: 1.8rem !important;
}
@media (max-width: 1280px) {
  .calendar-board {
    gap: 2.4rem;
  }
  .calendar-list {
    flex-basis: 40rem;
  }
}
@media (max-width: 1024px) {
  .calendar-board {
    flex-direction: column;
  }
  .calendar {
    flex: 0 1 auto;
    width: auto;
    border-radius: 0;
    margin: 0 calc(-1 * var(--space-inner-x));
  }
  .calendar-list {
    flex-basis: auto;
    min-height: auto;
  }
  .calendar [role=gridcell][data-date] {
    height: 100%;
  }
}
@media (max-width: 768px) {
  .calendar-head {
    padding: 1.6rem 1.2rem 1.2rem;
    height: auto;
  }
  .calendar-list-head {
    min-height: 7.2rem;
    padding: 20px 24px;
  }
  .calendar-list-head > span {
    display: none;
  }
  .calendar-week {
    gap: 0.2rem;
  }
  .calendar [role=row] {
    gap: 0.2rem;
  }
  .calendar [role=gridcell][data-date] {
    min-height: 60px !important;
  }
  .calendar [role=gridcell][data-date] > div:first-child {
    padding: 4px 0;
  }
  .calendar [role=gridcell][data-date] .fc-qp.fc-d7,
  .calendar [role=gridcell][data-date] .fc-qp.fc-d7 > :first-child > div,
  .calendar [role=gridcell][data-date] .fc-qp.fc-d7 > :first-child,
  .calendar [role=gridcell][data-date] > div:nth-child(2) > div:first-child {
    min-height: auto !important;
    height: auto !important;
  }
  .calendar [role=gridcell][data-date] > div:nth-child(2) > div:first-child {
    height: calc(18px + 0.4rem) !important;
  }
  .calendar-more-label {
    display: none;
  }
  .calendar-event {
    height: 6px;
  }
  .calendar-event-title {
    display: none;
  }
}

/* ==========================================================================
게시판 스타일
========================================================================== */
.board {
  /* ==========================================================================
  	게시판 공통 컴포넌트 : 아이콘
  ========================================================================== */
}
.board-icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}
.board-icon:before {
  font-family: "remixicon";
}
.board-icon.reply {
  font-size: 1.4rem;
  font-weight: 700;
  color: #777;
}
.board-icon.reply:before {
  content: "\f309";
}
.board-icon.secret:before {
  content: "\eece";
}
.board-icon.new {
  width: 1.6rem;
  border-radius: 50%;
  background-color: var(--primary);
  font-size: 1.2rem;
  font-weight: 700;
  color: #fff;
  line-height: 1;
  aspect-ratio: 1/1;
}
.board {
  /* ==========================================================================
  	게시판 공통 컴포넌트 : 인풋
  ========================================================================== */
}
.board-input {
  display: flex;
  position: relative;
}
.board-input:has(.board-btn-search) {
  gap: 1.2rem;
}
.board-input select,
.board-input input[type*=text],
.board-input input[type*=tel],
.board-input input[type*=email],
.board-input input[type*=number],
.board-input input[type*=date] {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  width: 100%;
  height: clamp(48px, 4.6058252427rem + 0.5177993528vw, 5.6rem);
  padding: 0 1.6rem;
  font-size: clamp(13px, 1.227184466rem + 0.1941747573vw, 1.6rem);
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  background-color: #fff;
}
.board-input select::placeholder,
.board-input input[type*=text]::placeholder,
.board-input input[type*=tel]::placeholder,
.board-input input[type*=email]::placeholder,
.board-input input[type*=number]::placeholder,
.board-input input[type*=date]::placeholder {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  color: #757575;
}
.board-input input[type*=date] {
  padding-right: 4rem;
}
.board-input input[type*=date]::-webkit-calendar-picker-indicator {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}
.board-input.select {
  width: 12rem;
}
.board-input.select select {
  padding: 0 3.2rem 0 1.6rem;
  background: url(/resources/images/mps/layout/ico_arrow-down-select.png) no-repeat right 12px center/6px;
}
.board-input.text input[type=text] {
  padding: 0 4.8rem 0 1.6rem;
}
.board-input.text:has(.board-btn.search) {
  gap: 0.8rem;
}
.board-input.text:has(.board-btn.search) .board-btn.search {
  height: 5.6rem;
}
.board-input.date {
  position: relative;
  flex: 1;
}
.board-input.date:not(.has-value) input[type=date] {
  color: transparent;
}
.board-input.date:not(.has-value) input[type=date]::-webkit-datetime-edit {
  color: transparent;
}
.board-input.date.has-value .board-date-placeholder {
  display: none;
}
.board-input.date::after {
  content: "\eb27";
  position: absolute;
  right: 1.2rem;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--icon);
  font-size: clamp(16px, 1.5029126214rem + 0.2588996764vw, 2rem);
  color: #9e9e9e;
  pointer-events: none;
}
.board-input.date .board-date-placeholder {
  position: absolute;
  top: 50%;
  left: 1.6rem;
  max-width: calc(100% - 5.6rem);
  overflow: hidden;
  color: #757575;
  font-size: clamp(13px, 1.227184466rem + 0.1941747573vw, 1.6rem);
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
  transform: translateY(-50%);
}
.board-input-group {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
.board-input-group.checkbox {
  flex-wrap: wrap;
  gap: 12px clamp(12px, 1.1029126214rem + 0.2588996764vw, 1.6rem);
}
@media (max-width: 768px) {
  .board-input-group.checkbox {
    width: 100%;
    background: #f3f4f5;
    border-radius: 4px;
    padding: 12px;
  }
}
@media (max-width: 460px) {
  .board-input-group:not(.date) {
    flex-wrap: wrap;
    width: 100%;
  }
}
.board {
  /* ==========================================================================
  	게시판 공통 컴포넌트 : 체크박스
  ========================================================================== */
}
.board-checkbox {
  display: block;
  position: relative;
}
.board-checkbox label {
  display: flex;
  position: relative;
  font-size: clamp(13px, 1.227184466rem + 0.1941747573vw, 1.6rem);
  cursor: pointer;
  gap: 4px;
  color: #111;
}
.board-checkbox label:before {
  content: "";
  width: 18px;
  height: 18px;
  border: 1px solid #9e9e9e;
  border-radius: 2px;
  background: #fff;
  font-family: var(--icon);
  flex-shrink: 0;
  transform: translateY(clamp(-0.5px, -0.0985436893rem + 0.1294498382vw, 0.15rem));
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0;
  line-height: 1;
  text-align: center;
  font-size: 14px;
}
.board-checkbox:has(input[type=checkbox]:checked) label:before {
  content: "\eb7b";
  background: var(--blue);
  border-color: var(--blue);
}
.board-checkbox input[type=checkbox] {
  position: absolute;
  width: 0;
  height: 0;
  font-size: 0;
  opacity: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}
.board {
  /* ==========================================================================
  	게시판 공통 컴포넌트 : 버튼
  ========================================================================== */
}
.board-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}
.board-btns.left {
  justify-content: flex-start;
}
.board-btns.center {
  justify-content: center;
}
.board-btns.right {
  justify-content: flex-end;
}
.board-btn {
  display: inline-flex;
  align-items: center;
}
.board-btn:not(.text) {
  line-height: 1;
}
.board-btn.small {
  height: 3.2rem;
  padding: 0 1.2rem;
  font-size: 1.4rem;
  gap: 0.4rem;
}
.board-btn.medium {
  height: 4rem;
  padding: 0 1.6rem;
  font-size: 1.6rem;
  gap: 0.6rem;
}
.board-btn.large {
  height: 4.8rem;
  padding: 0 2rem;
  font-size: 1.8rem;
  gap: 0.8rem;
}
.board-btn.xlarge {
  height: 5.6rem;
  padding: 0 2.4rem;
  font-size: clamp(14px, 1.3029126214rem + 0.2588996764vw, 1.8rem);
  gap: 0.8rem;
  border-radius: 0.4rem;
}
.board-btn.text {
  height: auto !important;
}
.board-btn.text.small {
  padding: 0 0.2rem;
}
.board-btn.text.medium {
  padding: 0 0.4rem;
}
.board-btn.text.large {
  padding: 0 0.6rem;
}
.board-btn.text.xlarge {
  padding: 0 0.8rem;
}
.board-btn.text:hover {
  background-color: #f6f6f6;
}
.board-btn.list, .board-btn.view {
  background-color: var(--primary);
  color: #fff;
}
.board-btn.write {
  background-color: var(--primary);
  color: #fff;
}
.board-btn.modify {
  background-color: var(--color-success);
  color: #fff;
}
.board-btn.delete {
  background-color: var(--color-error);
  color: #fff;
}
.board-btn.reply {
  background-color: var(--color-warning);
  color: #fff;
}
.board-btn-search {
  background-color: var(--primary);
  color: #fff;
}
.board-btn.search {
  position: absolute;
  right: 0;
  justify-content: center;
  aspect-ratio: 1/1;
}
.board-btn.search i {
  font-size: 2rem;
}
.board-btn-reset {
  gap: 0.8rem;
  color: #424242;
  font-size: clamp(13px, 1.227184466rem + 0.1941747573vw, 1.6rem);
}
.board-btn-reset:hover {
  background-color: transparent !important;
  opacity: 0.9;
}
.board-btn-reset i {
  color: #9e9e9e;
  font-size: clamp(18px, 1.7514563107rem + 0.1294498382vw, 2rem);
}
@media (max-width: 768px) {
  .board-btn.xlarge {
    height: 48px;
  }
}
.board {
  /* ==========================================================================
  	게시판 공통 컴포넌트 : 카테고리
  ========================================================================== */
}
.board-category {
  display: inline-flex;
  flex-shrink: 0;
  padding: 0.8rem 1.2rem;
  border: 1px solid transparent;
  font-size: clamp(13px, 1.227184466rem + 0.1941747573vw, 1.6rem);
  font-weight: 500;
  color: #333;
  line-height: 1;
  /* Category Colors : color01 ~ color05 */
}
.board-category.color01 {
  color: var(--color-01);
  padding: 0;
}
.board-category.color02 {
  color: var(--color-02);
  padding: 0;
}
.board-category.color03 {
  color: var(--color-03);
  padding: 0;
}
.board-category.color04 {
  color: var(--color-04);
  padding: 0;
}
.board-category.color05 {
  color: var(--color-05);
  padding: 0;
}
.board-category.border {
  background-color: #fff !important;
  border-color: #e0e0e0;
}
.board-category.border[data-category=wait] {
  color: var(--gray-50);
  border-color: var(--gray-50);
}
.board-category.border[data-category=receipt] {
  color: var(--color-success);
  border-color: var(--color-success);
}
.board-category.border[data-category=progress] {
  color: var(--color-warning);
  border-color: var(--color-warning);
}
.board-category.border[data-category=complete] {
  color: var(--primary);
  border-color: var(--primary);
}
.board-category.border[data-category=refusal] {
  color: var(--color-error);
  border-color: var(--color-error);
}
.board-category.fill {
  align-items: center;
  height: 25px;
  font-size: clamp(12px, 1.1514563107rem + 0.1294498382vw, 1.4rem);
  border-radius: 3px;
  padding: 0.4rem 0.6rem !important;
  line-height: 1.1;
}
.board-category.fill.color01 {
  background: var(--color-01);
  color: #fff;
  font-weight: 600;
}
.board-category.fill.color02 {
  background: var(--color-02);
  color: #fff;
  font-weight: 600;
}
.board-category.fill.color03 {
  background: var(--color-03);
  color: #fff;
  font-weight: 600;
}
.board-category.fill.color04 {
  background: var(--color-04);
  color: #fff;
  font-weight: 600;
}
.board-category.fill.color05 {
  background: var(--color-05);
  color: #fff;
  font-weight: 600;
}
.board-category.fill[data-category=wait] {
  background-color: var(--gray-50);
  color: #fff;
}
.board-category.fill[data-category=receipt] {
  background-color: var(--color-success);
  color: #fff;
}
.board-category.fill[data-category=progress] {
  background-color: var(--color-warning);
  color: #fff;
}
.board-category.fill[data-category=complete] {
  background-color: var(--primary);
  color: #fff;
}
.board-category.fill[data-category=refusal] {
  background-color: var(--color-error);
  color: #fff;
}
.board {
  /* ==========================================================================
  	게시판 공통 컴포넌트 : 컬럼
  ========================================================================== */
}
.board-column.info {
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
  gap: 0.8rem calc(1.6rem + 1px);
}
.board-column.info > li {
  display: inline-flex;
  position: relative;
  gap: 0.4rem;
  color: #424242;
  font-size: clamp(13px, 1.227184466rem + 0.1941747573vw, 1.6rem);
  line-height: 150%;
  letter-spacing: -0.01em;
}
.board-column.info > li b {
  color: var(--red);
}
.board-column.info > li:before {
  flex-shrink: 0;
}
.board-column.info > li:not(:last-child):after {
  position: absolute;
  top: 50%;
  left: calc(100% + 0.8rem);
  transform: translateY(-50%);
  width: 1px;
  height: 1rem;
  background-color: #bdbdbd;
  content: "";
}
.board-column.info.icon > li:before {
  color: #9e9e9e;
  font-size: clamp(16px, 1.5029126214rem + 0.2588996764vw, 2rem);
  font-family: "remixicon";
  font-weight: 400;
}
.board-column.info.icon > li.writer:before {
  content: "\f264";
}
.board-column.info.icon > li.date:before {
  content: "\f20f";
}
.board-column.info.icon > li.hit:before {
  content: "\ecb5";
}
.board-column.info.icon > li.place:before {
  content: "\ef14";
}
.board-column.info.view {
  gap: 0.8rem 3.2rem;
}
.board-column.info.view > li {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-size: clamp(15px, 1.427184466rem + 0.1941747573vw, 1.8rem);
  color: #424242;
  line-height: 150%;
  letter-spacing: -0.01em;
}
.board-column.info.view > li::after {
  left: calc(100% + 1.6rem);
}
.board-column.info.view > li > em {
  color: #222;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.board-column.info.label > li {
  gap: 0.8rem;
}
.board-column.info.label > li:before {
  font-weight: 500;
  content: attr(aria-label);
}
.board-column.info[data-dir=col] {
  flex-direction: column;
  gap: 4px;
}
.board {
  /* ==========================================================================
  	게시판 공통 컴포넌트 : 페이지네이션
  ========================================================================== */
}
.board-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.4rem;
}
.board-pagination a,
.board-pagination button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 4rem;
  border: 1px solid #e0e0e0;
  border-radius: 50%;
  text-align: center;
  aspect-ratio: 1/1;
}
.board-pagination a:hover, .board-pagination a:focus-visible,
.board-pagination button:hover,
.board-pagination button:focus-visible {
  border-color: #222;
}
.board-pagination-numbers {
  display: flex;
  padding: 0 0.8rem;
  gap: 0.4rem;
}
.board-pagination-numbers > a.active,
.board-pagination-numbers > button.active {
  background-color: #222;
  color: #fff;
  border-color: #222;
}
.board {
  /* ==========================================================================
  	게시판 공통 컴포넌트 : 페이지네이션, 버튼 간격 정의
  ========================================================================== */
}
.board-list + .board-btns, .board-view + .board-btns, .board-pagination + .board-btns {
  margin-top: 4rem;
}
.board-list + .board-pagination, .board-view + .board-pagination, .board-btns + .board-pagination {
  margin-top: 4rem;
}
.board {
  /* ==========================================================================
  	게시판 리스트
  ========================================================================== */
}
.board-list {
  margin-top: 4rem;
  border-top: 2px solid #333;
  border-bottom: 1px solid #e0e0e0;
}
.board-list:has(.board-list-nodata) {
  border-top: 0;
  border-bottom: 0;
  padding: 0 !important;
}
.board-list {
  /* ==========================================================================
  	게시판 리스트 : NODATA 
  ========================================================================== */
}
.board-list-nodata {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  padding: 8rem 0 !important;
  border: 0 !important;
  border-top: 2px solid #000 !important;
  border-bottom: 1px solid #dedede !important;
  row-gap: 2rem !important;
}
.board-list-nodata > img[src*=nodata] {
  width: 7.2rem;
}
.board-list-nodata > strong {
  font-size: 2.4rem;
  font-weight: 700;
}
.board-list-nodata:before, .board-list-nodata:after {
  display: none;
}
.board-list {
  /* ==========================================================================
  	게시판 리스트 : 상단 영역
  ========================================================================== */
}
.board-list-top {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  gap: 24px;
}
.board-list-top:not(:has(.board-list-view-mode)) {
  flex-direction: row;
}
.board-list-top:has(.board-list-search-group.extend) {
  row-gap: 4rem;
}
.board-list-search {
  margin-left: auto;
}
.board-list-search:has(.board-list-search-group.extend) {
  width: 100%;
  margin-left: 0;
}
.board-list-search .board-input label {
  display: none;
}
.board-list-search-group.default {
  display: flex;
  margin-left: auto;
  gap: 1.2rem;
}
.board-list-search-group.extend {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: clamp(12px, 0.7145631068rem + 1.2944983819vw, 3.2rem);
  min-width: 0;
  width: 100%;
  max-width: 100%;
  border-radius: 1.2rem;
  background: #f3f4f5;
  padding: 2rem;
}
.board-list-search-group.extend .board-input,
.board-list-search-group.extend .board-input-group,
.board-list-search-group.extend input {
  min-width: 0;
  max-width: 100%;
}
.board-list-search-group.extend .board-checkbox,
.board-list-search-group.extend .board-checkbox label {
  min-width: 0;
  overflow-wrap: anywhere;
}
.board-list-util {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}
.board-list-util:has(> :nth-child(2)) {
  width: 100%;
}
.board-list-view-mode {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.board-list-view-mode > li {
  position: relative;
}
.board-list-view-mode > li:has([class*=on]) {
  z-index: 1;
}
.board-list-view-mode > li + li {
  margin-left: -1px;
}
.board-list-view-mode > li > button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 4rem;
  border: 1px solid #e0e0e0;
  font-size: 1.8rem;
  line-height: 1;
  aspect-ratio: 1/1;
}
.board-list-view-mode > li > button[class*=on], .board-list-view-mode > li > button[class*=active] {
  background-color: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
.board-list {
  /* ==========================================================================
  	게시판 리스트 : 테이블형
  ========================================================================== */
}
.board-list[data-type*=table] .viewSubject {
  display: flex;
  align-items: center;
  position: relative;
  gap: 0.8rem;
}
.board-list[data-type*=table] .viewSubject > a {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  color: #111;
  font-size: clamp(17px, 1.5300970874rem + 0.4530744337vw, 2.4rem);
  font-weight: 600;
  line-height: 150%; /* 3.6rem */
  letter-spacing: -0.02em;
}
.board-list[data-type*=table] .viewFiles {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 5.6rem;
  height: 5.6rem;
  border-radius: 10rem;
  border: 1px solid #e0e0e0;
  background: #fff;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.board-list[data-type*=table] .viewFiles::before {
  display: block;
  width: clamp(16px, 1.5029126214rem + 0.2588996764vw, 2rem);
  height: clamp(16px, 1.5029126214rem + 0.2588996764vw, 2rem);
  background: #424242;
  mask: url("/resources/images/common/icon/icon_link.svg") no-repeat center/contain;
  -webkit-mask: url("/resources/images/common/icon/icon_link.svg") no-repeat center/contain;
  content: "";
  transition: background-color 0.2s ease;
}
.board-list[data-type*=table] .viewFiles img {
  display: none;
}
.board-list[data-type*=table] .viewFiles:hover, .board-list[data-type*=table] .viewFiles:focus-visible, .board-list[data-type*=table] .viewFiles.is-active, .board-list[data-type*=table] .viewFiles:has(+ .board-attach) {
  border-color: var(--dark-blue);
  background: var(--dark-blue);
}
.board-list[data-type*=table] .viewFiles:hover::before, .board-list[data-type*=table] .viewFiles:focus-visible::before, .board-list[data-type*=table] .viewFiles.is-active::before, .board-list[data-type*=table] .viewFiles:has(+ .board-attach)::before {
  background: #fff;
}
.board-list[data-type*=table] .board-column.notice td {
  font-weight: 500;
  color: #000;
}
.board-list[data-type*=table] .board-column.reply .board-column.subject {
  padding-left: 4rem;
}
.board-list[data-type*=table] .board-column.number, .board-list[data-type*=table] .board-column.subject {
  text-align: left;
}
.board-list[data-type*=table] table {
  width: 100%;
}
.board-list[data-type*=table] table th,
.board-list[data-type*=table] table td {
  padding: 3.2rem 2rem;
  text-align: center;
}
.board-list[data-type*=table] table thead {
  display: none;
}
.board-list[data-type*=table] table thead th {
  background-color: #f5f5f5;
  font-weight: 600;
  color: #000;
}
.board-list[data-type*=table] table tbody td {
  position: relative;
  border-bottom: 1px solid #dedede;
  background-color: #fff;
  color: #757575;
  font-size: clamp(15px, 1.427184466rem + 0.1941747573vw, 1.8rem);
  font-weight: 400;
  line-height: 150%; /* 2.4rem */
  letter-spacing: -0.01em;
}
.board-list[data-type*=table] table tbody tr:last-child td {
  border-bottom: 0;
}
.board-list[data-type*=table] table:has(.board-list-nodata) colgroup,
.board-list[data-type*=table] table:has(.board-list-nodata) th {
  display: none;
}
@media (max-width: 768px) {
  .board-list[data-type*=table][data-type*=default] table colgroup,
  .board-list[data-type*=table][data-type*=default] table thead, .board-list[data-type*=table][data-type*=column] table colgroup,
  .board-list[data-type*=table][data-type*=column] table thead {
    display: none;
  }
  .board-list[data-type*=table][data-type*=default] table tbody, .board-list[data-type*=table][data-type*=column] table tbody {
    width: 100%;
  }
  .board-list[data-type*=table][data-type*=default] table tbody tr, .board-list[data-type*=table][data-type*=column] table tbody tr {
    display: flex;
    padding: 16px 0;
  }
  .board-list[data-type*=table][data-type*=default] table tbody tr:not(:first-child), .board-list[data-type*=table][data-type*=column] table tbody tr:not(:first-child) {
    border-top: 1px solid #e0e0e0;
  }
  .board-list[data-type*=table][data-type*=default] table tbody td, .board-list[data-type*=table][data-type*=column] table tbody td {
    padding: 0;
    border-bottom: 0;
  }
  .board-list[data-type*=table][data-type*=default] .board-column.reply .board-column.subject, .board-list[data-type*=table][data-type*=column] .board-column.reply .board-column.subject {
    padding-left: 0;
  }
  .board-list[data-type*=table][data-type*=default] .board-attach, .board-list[data-type*=table][data-type*=column] .board-attach {
    position: fixed;
    top: auto;
    bottom: 0;
    left: 0;
    z-index: 15;
    width: 100%;
    min-width: 100%;
    min-height: 280px;
    max-height: calc(100dvh - 4rem);
    background: #fff;
    overflow-y: auto;
    border-radius: 16px 16px 0 0;
    border: none;
  }
  .board-list[data-type*=table][data-type*=default] table tbody {
    display: block;
  }
  .board-list[data-type*=table][data-type*=default] table tbody tr {
    position: relative;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px calc(1.6rem + 1px);
    padding-right: 56px;
  }
  .board-list[data-type*=table][data-type*=default] table tbody tr:has(.board-list-nodata) {
    padding: 0 !important;
  }
  .board-list[data-type*=table][data-type*=default] table tbody tr:hover th,
  .board-list[data-type*=table][data-type*=default] table tbody tr:hover td {
    background: inherit;
  }
  .board-list[data-type*=table][data-type*=default] table tbody td.board-column.number {
    display: none;
  }
  .board-list[data-type*=table][data-type*=default] table tbody td.board-column.subject {
    width: 100%;
  }
  .board-list[data-type*=table][data-type*=default] table tbody td.board-column.subject ~ td:not(:last-child):not(:has(~ .board-column.attach)):after {
    position: absolute;
    top: 50%;
    left: calc(100% + 0.8rem);
    transform: translateY(-50%);
    width: 1px;
    height: 1.2rem;
    background-color: #c0c0c0;
    content: "";
  }
  .board-list[data-type*=table][data-type*=default] table tbody td.board-column.category:before {
    display: none;
  }
  .board-list[data-type*=table][data-type*=default] table tbody td.board-column.attach {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
  }
  .board-list[data-type*=table][data-type*=column] table tbody tr {
    flex-direction: column;
    row-gap: 0.8rem;
  }
  .board-list[data-type*=table][data-type*=column] table tbody td {
    display: flex;
    text-align: left;
    gap: 0.4rem;
  }
  .board-list[data-type*=table][data-type*=column] table tbody td:before {
    flex-shrink: 0;
    width: 10rem;
    font-weight: 500;
    color: #000;
    content: attr(aria-label);
  }
  .board-list[data-type*=table] .viewFiles {
    width: 32px;
    height: 32px;
  }
}
@media (max-width: 1024px) {
  .board-list[data-type*=table][data-type*=scroll] {
    overflow-x: scroll;
  }
  .board-list[data-type*=table][data-type*=scroll] table {
    min-width: 1024px;
  }
}
.board-list[data-type*=gall] {
  padding: 0;
  margin-top: clamp(32px, 2.8116504854rem + 1.0355987055vw, 4.8rem);
  border-top: none;
  border-bottom: none;
}
.board-list[data-type*=gall] li {
  min-width: 0;
}
.board-list[data-type*=gall] li > a {
  row-gap: clamp(16px, 1.5029126214rem + 0.2588996764vw, 2rem) !important;
}
.board-list[data-type*=gall] .board-category {
  align-self: flex-start;
  margin-top: -0.8rem;
}
.board-list[data-type*=gall] .board-column.img {
  position: relative;
  width: 100%;
  background-color: #f5f5f5;
  aspect-ratio: 16/9;
  border-radius: 1.2rem;
  overflow: hidden;
}
.board-list[data-type*=gall] .board-column.img > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.board-list[data-type*=gall] .board-column.img > img[src*=noimg] {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 7.6rem;
  width: calc(100% - 8rem);
  height: auto;
}
.board-list[data-type*=gall] .board-column.desc {
  display: flex;
  flex-direction: column;
  min-width: 0;
  row-gap: 12px;
}
.board-list[data-type*=gall] .board-column.subject {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: clamp(17px, 1.627184466rem + 0.1941747573vw, 2rem);
  font-weight: 500;
  line-height: 140%; /* 2.8rem */
  letter-spacing: -0.02em;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.board-list[data-type*=gall] .board-column.text {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.board-list[data-type*=gall] .board-column.info > li {
  color: #757575;
}
.board-list[data-type*=gall] > ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(32px, 2.4233009709rem + 2.071197411vw, 6.4rem) clamp(24px, 2.0116504854rem + 1.0355987055vw, 4rem);
}
.board-list[data-type*=gall] > ul[data-cols="2"] {
  grid-template-columns: repeat(2, 1fr);
}
.board-list[data-type*=gall] > ul[data-cols="3"] {
  grid-template-columns: repeat(3, 1fr);
}
.board-list[data-type*=gall] > ul[data-cols="4"] {
  grid-template-columns: repeat(4, 1fr);
}
.board-list[data-type*=gall] > ul[data-cols="5"] {
  grid-template-columns: repeat(5, 1fr);
}
.board-list[data-type*=gall] > ul:has(.board-list-nodata) {
  grid-template-columns: repeat(1, 1fr) !important;
}
.board-list[data-type*=gall] > ul > li > a {
  display: flex;
}
@media (max-width: 1280px) {
  .board-list[data-type*=gall] > ul[data-cols="5"] {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (max-width: 1024px) {
  .board-list[data-type*=gall] > ul[data-cols="4"] {
    grid-template-columns: repeat(3, 1fr);
  }
  .board-list[data-type*=gall] > ul[data-cols="5"] {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (max-width: 768px) {
  .board-list[data-type*=gall] > ul[data-cols="3"], .board-list[data-type*=gall] > ul[data-cols="4"], .board-list[data-type*=gall] > ul[data-cols="5"] {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 480px) {
  .board-list[data-type*=gall] > ul[data-cols="2"], .board-list[data-type*=gall] > ul[data-cols="3"], .board-list[data-type*=gall] > ul[data-cols="4"], .board-list[data-type*=gall] > ul[data-cols="5"] {
    grid-template-columns: repeat(1, 1fr);
  }
}
.board-list[data-type*=gall][data-type*=default] ul li > a {
  flex-direction: column;
  row-gap: 2.4rem;
}
.board-list[data-type*=gall][data-type*=col] > ul {
  grid-template-columns: repeat(1, 1fr);
}
.board-list[data-type*=gall][data-type*=col] > ul > li + li {
  padding-top: 2.4rem;
  border-top: 1px solid #e0e0e0;
}
.board-list[data-type*=gall][data-type*=col] > ul > li > a {
  gap: 2.4rem;
}
.board-list[data-type*=gall][data-type*=col] > ul > li > a .board-column.img {
  flex-shrink: 0;
  width: 32rem;
}
.board-list[data-type*=gall][data-type*=col] > ul > li > a .board-column.desc {
  flex: 1;
}
@media (max-width: 1024px) {
  .board-list[data-type*=gall][data-type*=col] > ul > li > a .board-column.img {
    width: 24rem;
  }
}
@media (max-width: 480px) {
  .board-list[data-type*=gall][data-type*=col] > ul > li > a {
    flex-direction: column;
  }
  .board-list[data-type*=gall][data-type*=col] > ul > li > a.board-column.img {
    width: 100%;
  }
}
.board-list[data-type*=gall][data-type*=video] .board-column.img:before {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.25) url(/resources/images/common/bbs/icon-video.svg) no-repeat 50% 50%;
  background-size: 7.6rem;
  content: "";
}
.board-list[data-type*=gall][data-type*=pdf] > ul > li > a {
  flex-direction: column;
  row-gap: 2.4rem;
}
.board-list[data-type*=gall][data-type*=pdf] .board-column.img {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6.9rem 2rem;
  aspect-ratio: auto;
  background: #f3f4f5;
}
.board-list[data-type*=gall][data-type*=pdf] .board-column.img img {
  width: 20rem;
  max-width: 100%;
  height: auto;
  aspect-ratio: 200/282;
  margin: auto;
}
.board-list[data-type*=gall][data-type*=pdf] .board-column.subject {
  text-align: center;
}
.board-list[data-type*=box] {
  padding: 0;
  border: 0;
}
.board-list[data-type*=box] > ul {
  display: flex;
  flex-direction: column;
  row-gap: 1.6rem;
}
.board-list[data-type*=box] > ul > li {
  display: flex;
  flex-direction: column;
  position: relative;
}
.board-list[data-type*=box] > ul > li:before, .board-list[data-type*=box] > ul > li:after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
}
.board-list[data-type*=box] > ul > li:before {
  border: 1px solid #e0e0e0;
}
.board-list[data-type*=box] > ul > li:after {
  opacity: 0;
  border: 2px solid var(--primary);
}
.board-list[data-type*=box] > ul > li:not(.board-list-nodata):hover:after, .board-list[data-type*=box] > ul > li:not(.board-list-nodata).active:after {
  opacity: 1;
}
.board-list[data-type*=box] > ul > li > * {
  position: relative;
  z-index: 1;
}
.board-list[data-type*=box] .board-column.subject {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding: 3.2rem 6.4rem;
  padding-left: 3.2rem;
  gap: 1.2rem;
}
.board-list[data-type*=box] .board-column.subject .board-category {
  align-self: flex-start;
}
.board-list[data-type*=box] .board-column.subject .board-column.info, .board-list[data-type*=box] .board-column.subject .board-column.text {
  width: 100%;
}
.board-list[data-type*=box] .board-column.desc {
  display: none;
  padding: 3.2rem;
  padding-top: 0;
}
.board-list[data-type*=box] .board-column:after {
  position: absolute;
  top: 3.2rem;
  right: 3.2rem;
  font-family: "remixicon";
  font-size: 2.4rem;
  color: #000;
  line-height: 1;
}
.board-list[data-type*=box][data-type*=accordion] > ul > li.active .board-column.subject:after {
  transform: rotate(180deg);
}
.board-list[data-type*=box][data-type*=accordion] .board-column.subject:after {
  content: "\ea4e";
}
.board-list[data-type*=box][data-type*=accordion] .board-attach {
  padding-top: 2.4rem;
  margin-top: 2.4rem;
  border-top: 1px solid #e0e0e0;
}
.board-list[data-type*=box][data-type*=accordion] .board-attach-list {
  display: flex;
  flex-direction: column;
  padding: 2rem;
  margin-top: 1.2rem;
  background-color: #f5f5f5;
  row-gap: 0.4rem;
}
.board-list[data-type*=box][data-type*=accordion] .board-attach-list > li > a {
  display: flex;
  align-items: center;
  gap: 1.2rem;
}
.board-list[data-type*=box][data-type*=link] .board-column.subject:after {
  content: "\ea6c";
}
.board-list[data-type*=box][data-type*=link] .board-column.subject[target=_blank]:after {
  content: "\ecaf";
}
.board-list[data-type*=box][data-type*=faq] .board-column.subject {
  padding-left: 6.4rem;
}
.board-list[data-type*=box][data-type*=faq] .board-column.subject:before {
  position: absolute;
  top: 3.2rem;
  left: 3.2rem;
  font-weight: 700;
  color: var(--primary);
  content: "Q";
}
.board-list[data-type*=box][data-type*=faq] .board-column.subject:has(.board-category):before {
  top: 3.4rem;
}
.board-list[data-type*=box][data-type*=faq] .board-column.desc {
  display: none;
  padding-left: 6.4rem;
}
.board-list[data-type*=box][data-type*=faq] .board-column.desc:before {
  position: absolute;
  top: 0rem;
  left: 3.2rem;
  font-weight: 700;
  color: var(--color-success);
  content: "A";
}
@media (max-width: 768px) {
  .board-list-search {
    width: 100%;
  }
  .board-list-search-group.default {
    width: 100%;
  }
  .board-list-search-group.default .board-input.text {
    flex: 1;
  }
  .board-list-search-group.extend {
    padding: 0;
    background: transparent;
  }
  .board-list-search-group.extend .board-input.text {
    width: 100%;
  }
  .board-list-search-group.extend .board-input.text .board-btn-search {
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    padding: 0;
    overflow: hidden;
    background: transparent;
  }
  .board-list-search-group.extend .board-input.text .board-btn-search:before {
    content: "\f0d1";
    color: var(--dark-blue);
    font-family: var(--icon);
    font-size: 16px;
  }
  .board-list-search-group.extend .board-input.text .board-btn-search span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .board-list-search-group.extend .board-input-group {
    width: 100%;
  }
}
.board {
  /* ==========================================================================
  	게시판 뷰
  ========================================================================== */
}
.board-view {
  margin-top: clamp(64px, 6.0116504854rem + 1.0355987055vw, 8rem);
}
.board-view + .board-btns {
  margin-top: clamp(48px, 4.4116504854rem + 1.0355987055vw, 6.4rem);
}
.board-view-menu {
  margin-bottom: clamp(12px, 1.1029126214rem + 0.2588996764vw, 1.6rem);
}
.board-view-menu-prev {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #1263aa;
  font-size: clamp(17px, 1.627184466rem + 0.1941747573vw, 2rem);
  font-weight: 600;
  line-height: 150%;
  letter-spacing: -0.02em;
}
.board-view-menu-prev i {
  font-weight: 400;
  font-size: clamp(20px, 1.9029126214rem + 0.2588996764vw, 2.4rem);
}
.board-view-top {
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 1.1029126214rem + 0.2588996764vw, 1.6rem);
}
.board-view-top .board-column.subject {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  font-size: clamp(24px, 1.9145631068rem + 1.2944983819vw, 4.4rem);
  font-weight: 700;
  line-height: 130%;
  letter-spacing: -0.02em;
  color: #111;
  gap: 0.4rem 1.2rem;
}
.board-view-top.left {
  align-items: flex-start;
}
.board-view-top.center {
  align-items: center;
}
.board-view-top.right {
  align-items: flex-end;
}
.board-view-content {
  padding: clamp(48px, 4.4116504854rem + 1.0355987055vw, 6.4rem) 0 clamp(64px, 6.0116504854rem + 1.0355987055vw, 8rem);
  border-top: 2px solid #333;
  margin-top: clamp(32px, 2.4233009709rem + 2.071197411vw, 6.4rem);
  color: #424242;
  font-size: clamp(15px, 1.427184466rem + 0.1941747573vw, 1.8rem);
}
.board-view.schedule-view .board-view-content {
  padding-bottom: clamp(48px, 4.4116504854rem + 1.0355987055vw, 6.4rem);
}
.board-view.schedule-view .schedule-view-wrap {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: clamp(24px, 2.2058252427rem + 0.5177993528vw, 3.2rem);
}
.board-view.schedule-view .schedule-view-image {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1 1 0;
  overflow: hidden;
  min-width: 0;
  height: 74rem;
  border-radius: 1.2rem;
  background: #f3f4f5;
}
.board-view.schedule-view .schedule-view-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.board-view.schedule-view .schedule-view-detail {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  min-width: 0;
  gap: clamp(24px, 2.2058252427rem + 0.5177993528vw, 3.2rem);
}
.board-view.schedule-view .schedule-view-card {
  overflow: hidden;
  width: 100%;
  border: 1px solid #e0e0e0;
  border-radius: 1.2rem;
  background: #fff;
}
.board-view.schedule-view .schedule-view-title {
  display: inline-flex;
  align-items: center;
  gap: clamp(8px, 0.7029126214rem + 0.2588996764vw, 1.2rem);
  width: 100%;
  padding: clamp(24px, 2.2058252427rem + 0.5177993528vw, 3.2rem) clamp(24px, 2.2058252427rem + 0.5177993528vw, 3.2rem);
  border-bottom: 1px solid #e0e0e0;
  color: #111;
  font-size: clamp(17px, 1.5300970874rem + 0.4530744337vw, 2.4rem);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
}
.board-view.schedule-view .schedule-view-title .board-category {
  font-size: clamp(13px, 1.227184466rem + 0.1941747573vw, 1.6rem);
  height: 31px;
  padding: 6px 8px;
}
.board-view.schedule-view .schedule-view-info {
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 1.1029126214rem + 0.2588996764vw, 1.6rem);
  padding: clamp(24px, 2.2058252427rem + 0.5177993528vw, 3.2rem);
}
.board-view.schedule-view .schedule-view-info > div {
  display: flex;
  align-items: center;
  width: 100%;
  gap: clamp(8px, 0.7029126214rem + 0.2588996764vw, 1.2rem);
}
.board-view.schedule-view .schedule-view-info dt {
  display: flex;
  align-items: center;
  flex: 0 0 13.2rem;
  gap: clamp(8px, 0.7029126214rem + 0.2588996764vw, 1.2rem);
  color: #111;
  font-size: clamp(16px, 1.5514563107rem + 0.1294498382vw, 1.8rem);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: -0.02em;
}
.board-view.schedule-view .schedule-view-info dt i {
  flex-shrink: 0;
  color: #9e9e9e;
  font-size: clamp(16px, 1.5029126214rem + 0.2588996764vw, 2rem);
  font-weight: 400;
  line-height: 1;
}
.board-view.schedule-view .schedule-view-info dt span {
  display: block;
  width: 10rem;
}
.board-view.schedule-view .schedule-view-info dd {
  flex: 1 1 auto;
  min-width: 0;
  color: #424242;
  font-size: clamp(16px, 1.5514563107rem + 0.1294498382vw, 1.8rem);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  word-break: auto-phrase;
  text-wrap: balance;
}
.board-view.schedule-view .schedule-view-content {
  color: #424242;
  font-size: clamp(16px, 1.5514563107rem + 0.1294498382vw, 1.8rem);
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: -0.01em;
  word-break: auto-phrase;
  text-wrap: balance;
}
.board-view.schedule-view .schedule-view-content p {
  margin-bottom: 2.4rem;
}
.board-view.schedule-view .schedule-view-content p:last-child {
  margin-bottom: 0;
}
@media (max-width: 1024px) {
  .board-view.schedule-view .schedule-view-wrap {
    flex-direction: column;
  }
  .board-view.schedule-view .schedule-view-image, .board-view.schedule-view .schedule-view-detail {
    flex-basis: auto;
    width: 100%;
  }
  .board-view.schedule-view .schedule-view-image {
    height: auto;
    min-height: 320px;
    aspect-ratio: 16/10;
  }
}
@media (max-width: 768px) {
  .board-view.schedule-view .board-view-content {
    padding-top: 48px;
    margin-top: 48px;
  }
  .board-view.schedule-view .schedule-view-image {
    border-radius: 8px;
  }
  .board-view.schedule-view .schedule-view-info > div {
    align-items: flex-start;
  }
  .board-view.schedule-view .schedule-view-info dt {
    flex-basis: 84px;
  }
  .board-view.schedule-view .schedule-view-info dt span {
    width: auto;
  }
}
.board-view-video, .board-view-thumb {
  max-width: 80rem;
  margin: 0 auto;
}
.board-view-video:has(+ *), .board-view-thumb:has(+ *) {
  margin-bottom: 6.4rem;
}
.board-view-video {
  width: 100%;
  background-color: #000;
  aspect-ratio: 16/9;
}
.board-view-video iframe,
.board-view-video video {
  width: 100%;
  height: 100%;
}
.board-view-thumb {
  opacity: 0;
  overflow: hidden;
  transition: 0.5s opacity;
}
.board-view-thumb [data-action*=move-] {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  transform: translatey(-50%);
  z-index: 2;
}
.board-view-thumb [data-action*=move-][data-action*=-prev] {
  left: 0;
}
.board-view-thumb [data-action*=move-][data-action*=-next] {
  right: 0;
}
.board-view-thumb-main {
  position: relative;
}
.board-view-thumb-main > [data-action*=move-] {
  width: 5.6rem;
  height: 5.6rem;
  background-color: rgba(0, 0, 0, 0.4);
}
.board-view-thumb-main > [data-action*=move-] i {
  font-size: 2.4rem;
  color: #fff;
}
.board-view-thumb-main .swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  background-color: #fafafa;
  text-align: center;
  aspect-ratio: 16/9;
}
.board-view-thumb-main .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.board-view-thumb-main .swiper-slide img.horizon {
  width: 100%;
  height: auto;
}
.board-view-thumb-main .swiper-slide img.vertical {
  width: auto;
  height: 100%;
}
.board-view-thumb-list {
  position: relative;
  margin: 8px -4px 0;
}
.board-view-thumb-list * {
  box-sizing: border-box;
}
.board-view-thumb-list .swiper-slide {
  width: 12.5%;
  padding: 0 4px;
}
.board-view-thumb-list .swiper-slide button {
  display: block;
  position: relative;
  width: 100%;
  padding-top: 66.6666666667%;
}
.board-view-thumb-list .swiper-slide button:before {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  border: 2px solid rgba(0, 0, 0, 0);
  background-color: rgba(0, 0, 0, 0.4);
  transition: 0.5s;
  content: "";
}
.board-view-thumb-list .swiper-slide button img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.board-view-thumb-list .swiper-slide-thumb-active button:before {
  background-color: rgba(0, 0, 0, 0);
  border-color: rgb(0, 0, 0);
}
@media (max-width: 1024px) {
  .board-view-thumb-list .swiper-slide {
    width: 16.6666666667%;
  }
}
@media (max-width: 768px) {
  .board-view-thumb-list .swiper-slide {
    width: 25%;
  }
}
@media (max-width: 360px) {
  .board-view-thumb-list .swiper-slide {
    width: 33.3333333333%;
  }
}
.board-view-thumb-list-center[data-length="1"] .swiper-wrapper, .board-view-thumb-list-center[data-length="2"] .swiper-wrapper, .board-view-thumb-list-center[data-length="3"] .swiper-wrapper {
  justify-content: center;
}
@media (min-widtn: 361px) {
  .board-view-thumb-list-center[data-length="4"] .swiper-wrapper {
    justify-content: center;
  }
}
@media (min-width: 769px) {
  .board-view-thumb-list-center[data-length="5"] .swiper-wrapper {
    justify-content: center;
  }
}
@media (min-width: 1025px) {
  .board-view-thumb-list-center[data-length="6"] .swiper-wrapper, .board-view-thumb-list-center[data-length="7"] .swiper-wrapper {
    justify-content: center;
  }
}
.board-view-thumb-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 8.2rem;
  height: 3.2rem;
  margin: 2.4rem auto 0;
  border-radius: 3.2rem;
  background-color: #9e9e9e;
  color: #fff;
  column-gap: 0.5rem;
}
.board-view-reply {
  margin-top: 9.6rem;
  border-top: 1px solid #e0e0e0;
}
.board-view-reply-top {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1.6rem 2rem;
  background-color: #f5f5f5;
  row-gap: 1.2rem;
}
.board-view-reply-top > strong {
  font-size: 1.8rem;
  color: #000;
}
.board-view-reply-content {
  padding-top: 4.8rem;
}
.board-view-bottom {
  margin-top: clamp(48px, 4.4116504854rem + 1.0355987055vw, 6.4rem);
}
.board-view-attach + .board-btns {
  margin-top: clamp(48px, 4.4116504854rem + 1.0355987055vw, 6.4rem);
}
.board-view-attach > dt {
  color: #111;
  font-size: clamp(17px, 1.5300970874rem + 0.4530744337vw, 2.4rem);
  font-weight: 700;
  line-height: 150%;
  letter-spacing: -0.02em;
  margin-bottom: 1.6rem;
}
.board-view-attach-list {
  display: flex;
  flex-direction: column;
  row-gap: 0.4rem;
  padding: clamp(16px, 1.2116504854rem + 1.0355987055vw, 3.2rem);
  border-radius: 1.2rem;
  border: 1px solid var(--black-300-border-e-0-e-0-e-0, #e0e0e0);
}
.board-view-attach-list > li {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.4rem 0.8rem;
  padding: 0.8rem;
}
.board-view-attach-list > li .name {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-size: clamp(13px, 1.227184466rem + 0.1941747573vw, 1.6rem);
  font-weight: 500;
  line-height: 150%;
  letter-spacing: -0.01em;
}
.board-view-attach-list > li .name > img {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
}
.board-view-attach-list > li .name > span {
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: #424242;
  text-overflow: ellipsis;
  word-break: break-all;
  text-align: left;
}
.board-view-attach-list > li .name > small {
  color: var(--black-500-sub-text-inactive-9-e-9-e-9-e, #9e9e9e);
  font-size: clamp(13px, 1.227184466rem + 0.1941747573vw, 1.6rem);
  font-weight: 400;
}
.board-view-page {
  padding: 1.2rem 0;
  border-top: 1px solid var(--black-300-border-e-0-e-0-e-0, #e0e0e0);
  border-bottom: 1px solid var(--black-300-border-e-0-e-0-e-0, #e0e0e0);
}
.board-view-page > li {
  display: flex;
  padding: 1.6rem 2.4rem;
  border-radius: 0.8rem;
  color: #424242;
  font-size: clamp(13px, 1.227184466rem + 0.1941747573vw, 1.6rem);
  font-weight: 500;
  line-height: 150%;
  letter-spacing: -0.01em;
}
.board-view-page > li:hover {
  background: var(--black-50-background-fafafa, #fafafa);
}
.board-view-page-category {
  flex: 0 0 clamp(76px, 7.3087378641rem + 0.7766990291vw, 8.8rem);
  display: flex;
  align-items: center;
  gap: 12px;
}
.board-view-page-category .icon {
  flex-shrink: 0;
  width: 11px;
  height: 7px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.board-view-page-category .icon.icon-arrow-up {
  background-image: url("/resources/images/common/icon/icon-arrow-up.svg");
}
.board-view-page-category .icon.icon-arrow-down {
  background-image: url("/resources/images/common/icon/icon-arrow-down.svg");
}
.board-view-page-title {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  word-break: break-all;
}
.board-view-page-title .nodata {
  color: var(--black-600-sub-text-757575, #757575);
}

*:has(> .swiper) {
  min-width: 0;
}

/* 신청 및 문의 폼 */
.academy:has(> .academy-hero) {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8rem;
  width: 100%;
  min-width: 0;
  color: #111;
}
.academy-hero {
  display: flex;
  align-self: center;
  width: min(180rem, 100vw - 12rem);
  overflow: hidden;
  border-radius: var(--br-sm);
  background: var(--second);
}
.academy-hero-content, .academy-hero-image {
  flex: 1 1 50%;
  min-width: 0;
}
.academy-hero-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3.2rem;
  padding: 8rem clamp(48px, 2.5669902913rem + 5.9546925566vw, 14rem);
  color: var(--white);
}
.academy-hero-description {
  line-height: 1.7;
}
.academy-hero-notice {
  font-weight: 600;
}
.academy-hero-image {
  position: relative;
  align-self: stretch;
  min-height: 48rem;
}
.academy-hero-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.3);
}
.academy-hero-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.academy-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6.4rem;
  width: 100%;
  max-width: var(--layout);
}
.academy-steps {
  display: flex;
  align-items: center;
  gap: 2rem;
  width: 100%;
  max-width: 85.2rem;
}
.academy-steps li {
  display: flex;
  flex: 1 1 0;
  align-items: center;
  gap: 2rem;
  color: #424242;
}
.academy-steps li::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: #8a8a8a;
}
.academy-steps li:last-child {
  flex: 0 0 auto;
}
.academy-steps li:last-child::after {
  display: none;
}
.academy-steps li span {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 5.6rem;
  width: 5.6rem;
  height: 5.6rem;
  border: 1px solid #424242;
  border-radius: 50%;
  font-family: var(--font-en);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: -0.03em;
}
.academy-steps li.active span {
  border-color: var(--second);
  background: var(--second);
  color: var(--white);
}
.academy-form {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6.4rem;
  width: 100%;
}
.academy-form-fields {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  width: 100%;
  max-width: 86rem;
}
.academy-form-row {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  width: 100%;
}
.academy-form-row > .subtext1 {
  flex: 0 0 24rem;
  color: #111;
  font-weight: 600;
}
.academy-form-control {
  flex: 1 1 0;
  min-width: 0;
}
.academy-form-control.select {
  width: auto;
}
.academy-form-control select,
.academy-form-control input[type*=text],
.academy-form-control input[type*=tel] {
  height: 5.6rem;
  font-size: clamp(14px, 1.3029126214rem + 0.2588996764vw, 1.8rem);
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #222;
}
.academy-form-control select:focus-visible,
.academy-form-control input[type*=text]:focus-visible,
.academy-form-control input[type*=tel]:focus-visible {
  border-color: #1263aa;
  outline: none;
}
.academy-form-group {
  display: flex;
  flex: 1 1 0;
  align-items: center;
  gap: 0.8rem;
  min-width: 0;
}
.academy-form-code, .academy-form-email-id {
  flex: 0 0 20rem;
}
.academy-form-email-id input {
  padding-right: 4rem;
}
.academy-form-email-id > span {
  position: absolute;
  top: 50%;
  right: 1.6rem;
  color: #222;
  font-size: clamp(14px, 1.3029126214rem + 0.2588996764vw, 1.8rem);
  line-height: 1;
  transform: translateY(-50%);
  pointer-events: none;
}
.academy-form-domain {
  min-width: 14rem;
}
@media (max-width: 1600px) {
  .academy-hero {
    width: 100%;
  }
}
@media (max-width: 1024px) {
  .academy:has(> .academy-hero) {
    gap: 6.4rem;
  }
  .academy-hero {
    flex-direction: column-reverse;
  }
  .academy-hero-content {
    padding: clamp(32px, 2.4233009709rem + 2.071197411vw, 6.4rem) clamp(24px, 1.8174757282rem + 1.5533980583vw, 4.8rem);
  }
  .academy-hero-image {
    flex-basis: auto;
  }
}
@media (max-width: 768px) {
  .academy:has(> .academy-hero) {
    gap: 4.8rem;
  }
  .academy-hero-content {
    gap: 2.4rem;
  }
  .academy-hero-image {
    min-height: 200px;
  }
  .academy-content, .academy-form {
    gap: 4rem;
  }
  .academy-steps {
    gap: 0.8rem;
  }
  .academy-steps li {
    gap: 0.8rem;
  }
  .academy-steps li span {
    flex-basis: 4rem;
    width: 4rem;
    height: 4rem;
    font-size: 1.4rem;
  }
  .academy-form-fields {
    gap: 2rem;
  }
  .academy-form-row {
    flex-direction: column;
    align-items: stretch;
    gap: 0.8rem;
  }
  .academy-form-row > .subtext1 {
    flex-basis: auto;
  }
  .academy-form-control {
    flex-basis: auto;
    width: 100%;
  }
  .academy-form-control select,
  .academy-form-control input[type*=text],
  .academy-form-control input[type*=tel] {
    height: 4.8rem;
  }
  .academy-form-code, .academy-form-email-id {
    flex: 0 0 16rem;
    width: 16rem;
  }
  .academy-form-domain {
    min-width: 12rem;
  }
}
@media (max-width: 480px) {
  .academy-form-group {
    flex-wrap: wrap;
  }
  .academy-form-group-phone .academy-application-form-control:last-child {
    flex: 1 1 calc(100% - 16.8rem);
  }
  .academy-form-group-email .academy-application-form-email-id,
  .academy-form-group-email > .academy-application-form-control:nth-child(2) {
    flex: 1 1 calc(50% - 0.4rem);
    width: auto;
  }
  .academy-form-group-email .academy-application-form-domain {
    flex: 1 1 100%;
  }
}

/* 준비중 페이지 */
.error {
  display: flex;
  flex-direction: column;
  gap: clamp(32px, 2.4233009709rem + 2.071197411vw, 6.4rem);
  align-items: center;
  text-align: center;
  width: 100%;
  padding: clamp(40px, 3.0291262136rem + 2.5889967638vw, 8rem) clamp(24px, 1.8174757282rem + 1.5533980583vw, 4.8rem);
  border: 1px solid var(--black-300);
  border-radius: var(--br-sm);
}
.error-image {
  display: flex;
  justify-content: center;
  align-items: center;
}
.error-image img {
  display: block;
  width: 30rem;
}
.error-message {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(24px, 1.8174757282rem + 1.5533980583vw, 4.8rem);
}
.error-message-title {
  color: var(--black-950);
  font-weight: 600;
  line-height: 160%;
}
.error-message-title > strong {
  font-weight: 700;
}
.error-message-desc {
  color: var(--black-950);
  line-height: 160%;
}
.error-buttons {
  display: flex;
  justify-content: center;
  gap: 0.8rem;
}
@media (max-width: 768px) {
  .error-image img {
    width: 60%;
  }
}

/* swiper slider */
.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
  display: block;
  width: 100%;
}
.swiper-wrapper {
  width: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
  transform: translate3d(0px, 0, 0);
}
.swiper-pointer-events {
  touch-action: pan-y;
}
.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
  display: block;
  justify-content: center;
}
.swiper-scrollbar {
  background: var(--gray-0);
  display: none;
}
.swiper-scrollbar-drag {
  background: var(--primary-60);
}
.swiper-button {
  display: flex;
  gap: 0;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  border-radius: 4rem;
  border: 1px solid #e4e4e4;
  background: #fff;
  margin-top: initial;
  font-size: 2.4rem;
  position: absolute;
  top: 50%;
  z-index: 1;
  transition: var(--trs-base);
}
.swiper-button:hover {
  background: var(--secondary-5);
}
.swiper-button i::after {
  width: 2.4rem;
  height: 2.4rem;
}
.swiper-button-disabled {
  opacity: 0.7;
  cursor: auto;
  pointer-events: none;
}
.swiper-button-prev {
  width: 2.4rem;
  height: 2.4rem;
}
.swiper-button-prev i::after {
  transform: rotate(180deg);
}
.swiper-button-prev .swiper-navigation-icon {
  transform: rotateY(180deg);
}
.swiper-button-next {
  width: 2.4rem;
  height: 2.4rem;
}
.swiper-indicator {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
.swiper-navigation {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
.swiper-navigation button {
  display: flex;
  align-items: center;
  justify-content: center;
}
.swiper-navigation-icon {
  width: 1.4rem;
  height: 1.4rem;
}
.swiper-navigation-icon path {
  fill: var(--gray-90);
}
.swiper-controller button {
  display: none;
  font-size: 2.4rem;
}
.swiper-controller button.active {
  display: flex !important;
}
.swiper-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
}
.swiper-pagination-bullets {
  flex-wrap: wrap;
}
.swiper-pagination-bullet {
  width: 2.5rem;
  height: 2.5rem;
  padding: 0.7rem;
  cursor: pointer;
  overflow: hidden;
}
.swiper-pagination-bullet::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: var(--gray-30);
  border-radius: 0.5rem;
  transition: 0.2s;
}
.swiper-pagination-bullet-active {
  width: 2.7rem;
  padding-left: 0.2rem;
  padding-right: 0.2rem;
}
.swiper-pagination-bullet-active::before {
  background: var(--primary-50);
  border-color: transparent;
}
.swiper-pagination-current {
  color: var(--primary-60);
}
.swiper-3d {
  perspective: 1200px;
}
.swiper-3d .swiper-cube-shadow,
.swiper-3d .swiper-slide {
  transform-style: preserve-3d;
}
.swiper-3d .swiper-css-mode .swiper-wrapper {
  perspective: 1200px;
}
.swiper-3d .swiper-wrapper {
  transform-style: preserve-3d;
}
.swiper-fade .swiper-free-mode .swiper-slide {
  transition-timing-function: ease-out;
}
.swiper-fade .swiper-slide {
  pointer-events: none;
  transition-property: opacity;
}
.swiper-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-fade .swiper-slide-active,
.swiper-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-autoheight {
  height: auto;
}
.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}
.swiper-autoheight .swiper-slide {
  height: auto;
}
.swiper-backface-hidden .swiper-slide {
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.swiper-initialized {
  overflow: hidden;
}
.swiper-initialized [id*=swiper-wrapper] {
  display: flex;
}
.swiper-initialized [id*=swiper-wrapper] > * {
  flex-shrink: 0;
}
.swiper-initialized.swiper-vertical,
.swiper-initialized.swiper-vertical [id*=swiper-wrapper],
.swiper-initialized.swiper-vertical [id*=swiper-wrapper] > * {
  height: 100%;
}
.swiper-initialized.swiper-vertical [id*=swiper-wrapper] {
  flex-direction: column;
}

@media (max-width: 768px) {
  .swiper-scrollbar {
    display: block;
  }
}
/*-------------------------------------------------
통합검색
-------------------------------------------------*/
.total-search .keyword {
  color: var(--point);
}
.total-search .krds-tab-area .tab.is-draggable {
  width: calc(100% + var(--space-inner-x));
  margin-left: 0;
}
.total-search .krds-tab-area .tab-scroll-controls {
  left: 0;
  right: 0;
}

.total-search-top-box {
  padding: 5.3rem 4rem;
  border: 1rem solid #f4f5f8;
  margin-bottom: 4rem;
}
.total-search-top-box .sch-input {
  position: relative;
}
.total-search-top-box .sch-input .ico-search {
  position: absolute;
  top: 50%;
  right: 1.6rem;
  transform: translateY(-50%);
  background: url(/resources/images/mps/layout/ico_sch.svg) no-repeat center center;
  width: 2.4rem;
  height: 2.4rem;
}

.search-list-top {
  margin: clamp(40px, 3.4174757282rem + 1.5533980583vw, 6.4rem) 0 clamp(60px, 4.5436893204rem + 3.8834951456vw, 12rem);
  display: flex;
  justify-content: center;
  align-items: center;
}
.search-list-top-info {
  color: var(--black-500-sub-text-inactive-9-e-9-e-9-e, #9e9e9e);
  font-size: clamp(28px, 2.6058252427rem + 0.5177993528vw, 3.6rem);
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.03em;
  text-align: center;
}
.search-list-top-info .point {
  color: #111;
}

.search-list-top .sch-info {
  display: flex;
  gap: 2rem;
  font-size: 1.9rem;
  font-weight: 700;
}

.search-list-top .sch-sort {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 2rem;
}
.search-list-top .sch-sort li {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 1rem;
}

#search_result .group {
  position: relative;
  margin-top: clamp(60px, 5.5145631068rem + 1.2944983819vw, 8rem);
}

#search_result .group-header {
  display: flex;
  gap: 1.6rem;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 3.2rem;
}

#search_result .group h3 {
  font-size: clamp(20px, 1.8058252427rem + 0.5177993528vw, 2.8rem);
  color: #111;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 1.2rem;
  margin-bottom: 0;
  border-bottom: 0;
}

#search_result .group h3 span {
  font-size: 2.4rem;
  font-weight: 500;
  color: var(--point);
}

.thumb,
.total-search-list {
  border-top: 2px solid #222;
}

.thumb > li,
.total-search-item {
  padding: 3.2rem 0;
  border-bottom: 1px solid #e0e0e0;
}

.total-search-list:not(.total-search-list.bul) .board-list-nodata {
  border-top: none !important;
}

.total-search-item:has(.info-img) {
  display: flex;
  align-items: center;
  gap: 2.4rem;
}

.total-search-item .info-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.total-search-item .info-img {
  flex-shrink: 0;
  aspect-ratio: 280/158;
  width: 28rem;
  height: auto;
  border-radius: 0.8rem;
  overflow: hidden;
}

.total-search-item .info-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.total-search-item .info-body {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  font-size: 1.8rem;
  align-items: flex-start;
}

.total-search-item .info-top {
  display: flex;
  font-size: 1.5rem;
}

.total-search-item .info-body .tit {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: #111;
  font-size: clamp(17px, 1.5300970874rem + 0.4530744337vw, 2.4rem);
  font-weight: 600;
  line-height: 150%;
  word-break: break-all;
  letter-spacing: -0.02em;
}

.total-search-item .info-txt {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.total-search-item .info-body .txt {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: var(--black-800-sub-title-424242, #424242);
  text-overflow: ellipsis;
  font-size: clamp(14px, 1.3029126214rem + 0.2588996764vw, 1.8rem);
  font-weight: 400;
  line-height: 150%;
  letter-spacing: -0.02em;
  word-break: break-all;
}

.total-search-item .file img {
  width: 2rem;
}

.total-search-item .info-menu {
  color: #424242;
  font-size: clamp(15px, 1.3786407767rem + 0.3236245955vw, 2rem);
  font-weight: 400;
  line-height: 150%;
  letter-spacing: -0.02em;
}

.total-search-item .info-btm {
  flex-wrap: wrap;
  display: flex;
  flex-wrap: wrap;
  gap: 2.4rem;
}

.total-search-item .info-btm > * {
  position: relative;
  color: var(--black-600-sub-text-757575, #757575);
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 150%; /* 2.4rem */
  letter-spacing: -0.01em;
}

.total-search-item .info-btm > .menu {
  color: #222;
  font-weight: 500;
}

.total-search-item .info-btm > *::after {
  display: block;
  content: "";
  width: 1px;
  height: 1.2rem;
  border-right: 1px solid #bdbdbd;
  position: absolute;
  left: calc(100% + 1.2rem);
  top: 50%;
  transform: translateY(-50%);
}

.total-search-item .info-btm > *:last-child::after {
  display: none;
}

.total-search-list.bul {
  border-top: none;
}

.total-search-list.bul > li {
  padding-left: 2rem;
  position: relative;
  color: #424242;
  font-size: clamp(15px, 1.3786407767rem + 0.3236245955vw, 2rem);
  font-weight: 400;
  line-height: 150%;
  letter-spacing: -0.02em;
}
.total-search-list.bul > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: clamp(9px, 0.8757281553rem + 0.0647249191vw, 1rem);
  width: clamp(6px, 0.5514563107rem + 0.1294498382vw, 0.8rem);
  height: clamp(6px, 0.5514563107rem + 0.1294498382vw, 0.8rem);
  background: #d9d9d9;
  border-radius: 50%;
}
.total-search-list.bul > li + li {
  margin-top: 1.6rem;
}

.file-link {
  display: flex;
  align-items: center;
  gap: 1.2rem;
}
.file-link > i {
  flex-shrink: 0;
  width: 2rem;
}
.file-link > i img {
  width: 100%;
}

.board-category-tabs {
  width: calc(100% + var(--space-inner-x));
  margin-bottom: 3.2rem;
  overflow: hidden;
  touch-action: pan-y;
}
.board-category-tabs.is-draggable {
  cursor: grab;
}

.board-category-tabs__track {
  display: flex;
  align-items: center;
  width: max-content;
  gap: 0.8rem;
  will-change: transform;
  user-select: none;
}

.board-category-tabs__item {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  height: 4.8rem;
  padding: 0 1.6rem;
  border: 1px solid #e0e0e0;
  border-radius: 4rem;
  background: #fff;
  color: #616161;
  font-size: clamp(14px, 1.3029126214rem + 0.2588996764vw, 1.8rem);
  line-height: 1.5;
  letter-spacing: -0.02em;
  white-space: nowrap;
  transition: border-color 0.2s, background-color 0.2s, color 0.2s;
}
.board-category-tabs__item:hover, .board-category-tabs__item:focus-visible {
  border-color: #222;
  color: #222;
}
.board-category-tabs__item.active {
  border-color: #222;
  background: #222;
  color: #fff;
}

.comp-msg-wrap {
  text-align: center;
  font-size: clamp(18px, 1.654368932rem + 0.3883495146vw, 2.4rem);
}

@media (max-width: 1280px) {
  .total-search-item .info-img {
    width: 24rem;
  }
}
@media (max-width: 1024px) {
  .total-search-item .info-img {
    width: 20rem;
  }
}
@media (max-width: 768px) {
  .tab-conts-wrap > .search-list-top {
    flex-direction: column;
  }
  .total-search-item .info-img {
    display: none;
  }
}
/*-------------------------------------------------
로그인
-------------------------------------------------*/
.conts-area {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: 4rem;
}

.sec-tit {
  font-size: 2.4rem;
}
.sec-tit .step-now {
  display: block;
  margin-bottom: 0.8rem;
  font-size: 1.7rem;
  color: #464c53;
}
.sec-tit .step-now strong {
  color: #0b50d0;
}

.text-point-primary {
  color: #0b50d0;
}

.fieldset-msg {
  margin-bottom: 2.4rem;
  position: relative;
  padding-left: 3.2rem;
  color: #0b50d0;
  font-size: 1.9rem;
}
.fieldset-msg::before {
  content: "";
  position: absolute;
  top: 0.2rem;
  left: 0;
  width: 2.4rem;
  height: 2.4rem;
  background-color: transparent !important;
  background-image: url(/resources/images/mps/member/ico_outline_chk.svg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}

.txt-box.bg-white {
  padding: 4rem;
  border: 1px solid #b1b8be;
  border-radius: 1.2rem;
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}

.box-sec {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}

.krds-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
  white-space: nowrap;
}
.krds-btn.xlarge {
  height: 6.4rem;
  padding: 0 2.4rem;
  border-radius: 1.2rem;
  font-size: 1.9rem;
}
.krds-btn.large {
  height: 5.6rem;
  padding: 0 1.6rem;
  border-radius: 0.8rem;
  font-size: 1.7rem;
}
.krds-btn.primary {
  background: #256ef4;
  color: #fff;
  border: 1px solid transparent;
}
.krds-btn.primary:hover {
  background: #0b50d0;
}
.krds-btn.secondary {
  background: #ecf2fe;
  color: #0b50d0;
  border: 1px solid #256ef4;
}
.krds-btn.secondary:hover {
  background: #d8e5fd;
}
.krds-btn.tertiary {
  background: transparent;
  color: #58616a;
  border: 1px solid #58616a;
}
.krds-btn.tertiary:hover {
  background: #f4f5f6;
}
.krds-btn.icon.medium {
  width: 2.4rem;
  height: 2.4rem;
}
.krds-btn.text, .krds-btn.link {
  display: inline-block;
  white-space: normal;
  height: auto;
  text-align: left;
}
.krds-btn.text.medium, .krds-btn.link.medium {
  padding: 0.2rem;
}

.krds-info-list.decimal > li {
  position: relative;
  padding-left: 3.2rem;
}
.krds-info-list.decimal > li::before {
  position: absolute;
  content: "";
  width: 0.6rem;
  height: 0.6rem;
  background-color: #464c53;
  border-radius: 50%;
  top: 1rem;
  left: 0.8rem;
}

.svg-icon {
  font-size: 2rem;
}
.svg-icon::before {
  font-size: 2.4rem;
  font-family: "remixicon";
}
.svg-icon.ico-call::before {
  content: "\efec";
}
.svg-icon.ico-pw-visible::before {
  content: "\ecb7";
}
.svg-icon.ico-pw-visible-on::before {
  content: "\ecb5";
}

.input-group {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  width: 100%;
  gap: 1.6rem;
}

.krds-input,
.krds-form-select {
  border: 1px solid #58616a;
  border-radius: 0.8rem;
  padding: 0 1.6rem;
  width: 100%;
  height: 5.6rem;
  position: relative;
  font-size: 1.9rem;
  transition: 0.3s;
}
.krds-input[readonly],
.krds-form-select[readonly] {
  background-color: #cdd1d5;
  border-color: #b1b8be;
}

.krds-input-item {
  position: relative;
}

.krds-form-select {
  background-image: url(/resources/images/mps/member/ico_angle.svg);
  background-repeat: no-repeat;
  background-position: center right 1.6rem;
}

.form-group-row {
  display: flex;
  gap: 1.6rem;
}
.form-group-row .form-group {
  flex: 1;
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  width: 100%;
}
.form-group .form-conts {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}
.form-group .form-conts.btn-ico-wrap {
  position: relative;
}
.form-group .form-conts.btn-ico-wrap .krds-btn {
  position: absolute;
  top: 50%;
  right: 2rem;
  transform: translateY(-50%);
}
.form-group .form-conts .krds-input-item {
  position: relative;
}
.form-group .form-conts .krds-input-item button:has([class*=ri-eye]) {
  position: absolute;
  top: 50%;
  right: 2rem;
  transform: translateY(-50%);
}
.form-group .form-hint {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: 0.4rem;
  font-size: 1.4rem;
  color: #464c53;
}
.form-group .form-hint:empty {
  display: none;
}
.form-group .form-hint.error::before, .form-group .form-hint.success::before {
  display: none;
}
.form-group .form-hint.error {
  color: var(--color-error);
}
.form-group .form-hint.success {
  color: var(--color-success);
}
.form-group .form-hint::before {
  content: "\eca1";
  font-family: "remixicon";
}

.link-group {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
}
.link-group > li + li::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  margin: 0 0.8rem;
  width: 1px;
  height: 1.6rem;
  background-color: #8a949e;
}

.page-btn-wrap {
  display: flex;
  gap: 1.6rem;
  margin-top: 4rem;
}
.page-btn-wrap.both {
  justify-content: space-between;
}

.tab-conts {
  display: none;
}

.tab-conts.active {
  display: flex;
  flex-direction: column;
}

.login-type-tab .tab-conts {
  gap: 4rem;
}

.login-type-tab .login-wrap .fieldset {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: 2.4rem;
}
.login-type-tab .login-info-wrap {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: 2.4rem;
  padding: 0;
}
.login-type-tab .login-info-wrap .tit {
  font-weight: 700;
}
.login-type-tab .login-info-wrap .btn-wrap {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  width: 100%;
}
.login-type-tab .login-info-wrap .btn-wrap .krds-btn {
  width: 100%;
}

.login-form-area {
  display: flex;
  gap: 8rem;
  padding: 4rem;
  border-top: 1px solid #8a949e;
  border-bottom: 1px solid #8a949e;
}
.login-form-area > div {
  flex: 1;
}

.krds-step-wrap {
  display: flex;
  margin-bottom: 6.4rem;
}
.krds-step-wrap > li {
  flex: 1;
  position: relative;
}
.krds-step-wrap > li::after {
  position: absolute;
  top: 0.85rem;
  left: 0.1rem;
  content: "";
  width: 100%;
  height: 0.3rem;
}
.krds-step-wrap > li:last-child::after {
  display: none;
}
.krds-step-wrap > li > span {
  display: flex;
  flex-direction: column;
  position: relative;
  padding-top: 3.2rem;
  padding-right: 3.2rem;
}
.krds-step-wrap > li > span::after {
  position: absolute;
  width: 2rem;
  height: 2rem;
  background: #256ef4;
  border-radius: 50%;
  top: 0.85rem;
  left: 0.1rem;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.krds-step-wrap > li > span::before {
  position: absolute;
  width: 2rem;
  height: 2rem;
  background: #256ef4;
  border-radius: 50%;
  top: 0.85rem;
  left: 0.1rem;
}
.krds-step-wrap > li.active::after {
  background: #cdd1d5;
}
.krds-step-wrap > li.active > span::after {
  position: absolute;
  width: 2rem;
  height: 2rem;
  background: #256ef4;
  border-radius: 50%;
  top: 0;
  left: 0.1rem;
  z-index: 1;
  content: "";
  border: 0.3rem solid #256ef4;
  box-shadow: inset 0 0 0 0.2rem #fff;
}
.krds-step-wrap > li.done::after {
  background: #6d7882;
}
.krds-step-wrap > li.done > span::after {
  content: "\eb7b";
  position: absolute;
  font-family: "remixicon";
  font-size: 1.2rem;
  color: #fff;
  top: 0;
  background: #6d7882;
}

/*-------------------------------------------------
회원정보 관련
-------------------------------------------------*/
.member_box {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
.member_box .login_area form {
  display: flex;
  gap: 1.6rem;
}
.member_box .login_input input {
  border: 1px solid #58616a;
  border-radius: 0.8rem;
  padding: 0 1.6rem;
  width: 100%;
  height: 5.6rem;
  position: relative;
  font-size: 1.9rem;
  transition: 0.3s;
}
.member_box .btn_login .btn_colorType02 {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
  white-space: nowrap;
  height: 5.6rem;
  font-size: 1.7rem;
  padding: 0px 1.6rem;
  border-radius: 0.8rem;
  color: #fff;
  background: #256ef4;
  border: 1px solid transparent;
}
.member_box .btn_login .btn_colorType02:hover {
  background: #0b50d0;
}

.member_info {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  margin-bottom: 2rem;
}

.btn-area,
.btn-area_center {
  margin-top: 2rem;
  display: flex;
  gap: 1rem;
}

.btn-area_center {
  justify-content: center;
}

.btn-type01,
.btn-type02 {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
  white-space: nowrap;
  height: 5.6rem;
  font-size: 1.7rem;
  padding: 0px 1.6rem;
  border-radius: 0.8rem;
}

.btn-type02 {
  color: #fff;
  background: #256ef4;
  border: 1px solid transparent;
}
.btn-type02:hover {
  background: #0b50d0;
}

.btn-type01 {
  color: #58616a;
  background: transparent;
  border: 1px solid #58616a;
}
.btn-type01:hover {
  background: #f4f5f6;
}

form .tstyle-view {
  width: 100%;
  border-top: 1px solid #cdd1d5;
}
form .tstyle-view .col-sm-2 {
  width: 20%;
}
form .tstyle-view .col-sm-10 {
  width: 80%;
}
form .tstyle-view th,
form .tstyle-view td {
  padding: 1.6rem;
}
form .tstyle-view thead th, form .tstyle-view tbody th {
  background-color: #f5f5f5;
  font-weight: 600;
  color: #000;
  border-bottom: 1px solid #cdd1d5;
}
form .tstyle-view tbody td {
  position: relative;
  border-bottom: 1px solid #dedede;
  background-color: #fff;
  color: #616161;
}
form .input-small {
  border: 1px solid #58616a;
  border-radius: 0.8rem;
  padding: 0 1.6rem;
  width: 100%;
  height: 5.6rem;
  position: relative;
  font-size: 1.9rem;
  transition: 0.3s;
}
form .block_smallTxt {
  font-size: 1.4rem;
  color: #464c53;
  margin-bottom: 0.8rem;
}

.completion {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
.completion .congratulate {
  width: 100%;
  height: 100%;
  background-image: url(/resources/images/mps/member/ico_congratulate.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
.completion .btn-area {
  margin-top: 2rem;
  display: flex;
  gap: 1rem;
  justify-content: center;
}

/* 개인정보 재동의 시작 */
h2.h-tit {
  font-size: 2.8rem;
}

.d-tit {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  margin: 3.2rem 0 2rem;
}
.d-tit strong {
  font-size: 2.4rem;
  color: var(--gray-90);
  font-weight: 700;
}
.result-box {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
.result-box-title {
  background-color: var(--gray-5);
  border-radius: 1.2rem;
  padding: 2.4rem;
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
.result-box-container {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
.result-box-container .flex-column {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
.result-box .form-tit {
  font-weight: 700;
}

.btn-wrap {
  display: flex;
  gap: 1rem;
}

/* 개인정보 재동의 끝 */
@media (max-width: 768px) {
  .conts-area {
    align-items: inherit;
  }
  .login-form-area {
    flex-direction: column;
  }
}
/*-------------------------------------------------
스크롤 진입 애니메이션

JS: resources/js/mps/modules/subAnimation.js
상태: [data-animation="fade-up"] + .is-visible
-------------------------------------------------*/
[data-animation=fade-up] {
  --animation-delay: 0ms;
  --animation-distance: 4rem;
  --animation-duration: 800ms;
  visibility: hidden;
  opacity: 0;
  translate: 0 var(--animation-distance);
  transition: opacity var(--animation-duration) ease-out var(--animation-delay), translate var(--animation-duration) cubic-bezier(0.22, 1, 0.36, 1) var(--animation-delay), visibility 0s linear calc(var(--animation-delay) + var(--animation-duration));
  will-change: auto;
}
[data-animation=fade-up].is-visible {
  visibility: visible;
  opacity: 1;
  translate: 0 0;
  will-change: opacity, translate;
  transition: opacity var(--animation-duration) ease-out var(--animation-delay), translate var(--animation-duration) cubic-bezier(0.22, 1, 0.36, 1) var(--animation-delay), visibility 0s linear 0s;
}
[data-animation=fade-up].is-animation-complete {
  will-change: auto;
}

@media (prefers-reduced-motion: reduce) {
  [data-animation=fade-up] {
    visibility: visible;
    opacity: 1;
    translate: none;
    transition: none;
    will-change: auto;
  }
}
.btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  width: fit-content;
  height: 5.2rem;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: var(--lh-md);
  letter-spacing: -0.02em;
  border-radius: var(--br-xxs);
  padding: 1.2rem 3.2rem;
}
.btn > i {
  font-size: 2rem;
  font-weight: 400;
  line-height: 1;
}
.btn.white {
  border: 1px solid var(--white);
  color: var(--white);
}
.btn.white.blue {
  color: #003768;
  background: var(--white);
}
.btn.white:hover {
  background: var(--white);
  color: var(--primary);
}
.btn.navy {
  height: 4.8rem;
  padding: 0 1.6rem;
  font-size: 1.6rem;
  border: 1px solid #04132b;
  color: #04132b;
}
.btn.navy > i {
  font-size: 1.6rem;
}
.btn.navy:hover {
  background: var(--white);
  color: #04132b;
}
.btn.download {
  height: 4.8rem;
  padding: 0 1.6rem;
  font-size: 1.6rem;
  background: var(--white);
  border: 1px solid var(--dark-blue);
  color: var(--dark-blue);
}
.btn.download > i {
  font-size: 1.6rem;
}
.btn.download:hover {
  background: var(--dark-blue);
  color: var(--white);
}
.btn.sm {
  height: 4rem;
  padding: 0 2rem;
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: normal;
}
.btn.sm > i {
  font-size: 1.6rem;
}
.btn.md {
  height: 6.4rem;
  padding: 0 2.4rem;
}
.btn.lg {
  height: 5.6rem;
  padding: 0 2.4rem;
  font-size: 1.8rem;
}
.btn.primary-fill {
  background: #00326e;
  color: var(--white);
}
.btn.primary-fill:hover, .btn.primary-fill:focus-visible {
  background: var(--primary);
  color: var(--white);
}
.btn.icon {
  width: fit-content;
  height: auto;
  padding: 0;
}
.btn.icon i {
  color: var(--primary);
  font-size: clamp(20px, 1.7087378641rem + 0.7766990291vw, 3.2rem);
}
.btn-top {
  position: fixed;
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(4px, 0.3757281553rem + 0.0647249191vw, 0.5rem);
  right: clamp(12px, -7.2rem + 10.9375vw, 4rem);
  bottom: var(--btn-top-bottom, clamp(12px, -7.2rem + 10.9375vw, 4rem));
  width: clamp(44px, 4.0116504854rem + 1.0355987055vw, 6rem);
  height: clamp(44px, 4.0116504854rem + 1.0355987055vw, 6rem);
  border: 1px solid #bbb;
  border-radius: 50%;
  background: #fff;
  filter: drop-shadow(0 4px 16px rgba(0, 0, 0, 0.1));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(2rem);
  transition: opacity 0.35s ease, transform 0.35s ease, visibility 0s linear 0.35s;
}
.btn-top.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition-delay: 0s;
}
.btn-top:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 3px;
}
.btn-top-icon {
  display: block;
  width: clamp(10px, 0.9742718447rem + 0.0686084142vw, 1.106rem);
  max-width: none;
  pointer-events: none;
}
.btn-top-label {
  color: #333;
  font-family: var(--font-en);
  font-size: clamp(11px, 0.9786407767rem + 0.3236245955vw, 1.6rem);
  font-weight: 500;
  line-height: normal;
  word-break: auto-phrase;
  text-wrap: balance;
  overflow-wrap: anywhere;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .btn .btn-top {
    transition: none;
  }
}
@media print {
  .btn .btn-top {
    display: none;
  }
}
@media (max-width: 768px) {
  .btn {
    gap: 4px;
    height: auto;
    min-height: 40px;
    font-size: 14px;
    padding: 4px 16px;
  }
  .btn > i {
    font-size: 16px;
  }
  .btn.more {
    flex-shrink: 0;
    gap: 4px;
    height: 36px;
    padding: 5px 12px;
    font-size: 13px;
  }
  .btn.more > i {
    font-size: 12px;
  }
  .btn.md {
    height: 36px;
    font-size: 14px;
    padding: 0 16px;
  }
  .btn.md > i {
    font-size: 16px;
  }
  .btn.lg {
    height: 40px;
    font-size: 14px;
    padding: 0 16px;
  }
}

/*-------------------------------------------------
탭
-------------------------------------------------*/
.krds-tab-area {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 3.2rem;
  margin-bottom: clamp(32px, 3.0058252427rem + 0.5177993528vw, 4rem);
}
.krds-tab-area .tab {
  position: relative;
  justify-content: center;
  width: 100%;
  overflow: hidden;
  touch-action: pan-y;
  padding-bottom: 4px;
}
.krds-tab-area .tab:has(> .tab-scroll-viewport) {
  overflow: visible;
  padding-bottom: 0;
}
.krds-tab-area .tab.is-draggable {
  cursor: grab;
  width: calc(100% + var(--space-inner-x) * 2);
  padding-bottom: 2px;
  margin-left: calc(var(--space-inner-x) * -1);
}
.krds-tab-area .tab.is-draggable > .tab-scroll-viewport {
  padding-bottom: 2px;
}
.krds-tab-area .tab.is-draggable:has(> .tab-scroll-viewport) {
  padding-bottom: 0;
}
.krds-tab-area .tab ul {
  display: flex;
  flex: 0 0 auto;
  position: relative;
  width: max-content;
  gap: clamp(20px, 1.7087378641rem + 0.7766990291vw, 3.2rem);
  will-change: transform;
  user-select: none;
  z-index: 1 !important;
}
.krds-tab-area .tab ul li {
  position: relative;
}
.krds-tab-area .tab ul li a,
.krds-tab-area .tab ul li button {
  position: relative;
  padding-bottom: 0.6rem;
  color: #9e9e9e;
  position: relative;
  font-size: clamp(17px, 1.5300970874rem + 0.4530744337vw, 2.4rem);
  font-weight: 600;
  text-align: center;
  line-height: 150%; /* 3.6rem */
  letter-spacing: -0.02em;
  white-space: nowrap;
}
.krds-tab-area .tab.fill ul li.active a, .krds-tab-area .tab.fill ul li.active button {
  color: var(--point);
  font-weight: 700;
}
.krds-tab-area .tab.fill ul li.active a:after, .krds-tab-area .tab.fill ul li.active button:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: var(--point);
}
.krds-tab-area:has(.tab.check:not(.inline)) {
  overflow: visible;
}
.krds-tab-area.type02 {
  margin-bottom: 2.4rem;
}
.krds-tab-area .tab-scroll-viewport {
  position: relative;
  display: flex;
  justify-content: center;
  width: 100%;
  overflow: hidden;
  touch-action: pan-y;
  padding-bottom: 4px;
}
.krds-tab-area .tab-scroll-controls {
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  transform: translateY(-50%);
  z-index: 2;
  height: 4rem;
  pointer-events: none;
}
.krds-tab-area .tab-scroll-controls::before, .krds-tab-area .tab-scroll-controls::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -0.8rem;
  bottom: -0.8rem;
  width: 9.6rem;
  pointer-events: none;
}
.krds-tab-area .tab-scroll-controls::before {
  left: 0;
  background: linear-gradient(90deg, var(--white) 32%, rgba(255, 255, 255, 0.88) 62%, rgba(255, 255, 255, 0) 100%);
}
.krds-tab-area .tab-scroll-controls::after {
  right: 0;
  background: linear-gradient(270deg, var(--white) 32%, rgba(255, 255, 255, 0.88) 62%, rgba(255, 255, 255, 0) 100%);
}
.krds-tab-area .tab-scroll-controls:has(.is-previous[hidden])::before, .krds-tab-area .tab-scroll-controls:has(.is-next[hidden])::after {
  display: none;
}
.krds-tab-area .tab-scroll-controls[hidden] {
  display: none;
}
.krds-tab-area .tab-scroll-button {
  position: absolute;
  top: 0;
  pointer-events: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: clamp(32px, 3.0058252427rem + 0.5177993528vw, 4rem);
  height: clamp(32px, 3.0058252427rem + 0.5177993528vw, 4rem);
  border: 1px solid var(--black-300);
  border-radius: 50%;
  background: var(--white);
  color: var(--dark-blue);
  font-size: clamp(20px, 1.9029126214rem + 0.2588996764vw, 2.4rem);
  transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}
.krds-tab-area .tab-scroll-button[hidden] {
  display: none;
}
.krds-tab-area .tab-scroll-button:hover:not(:disabled) {
  border-color: var(--primary);
  background: var(--black-100);
}
.krds-tab-area .tab-scroll-button:disabled {
  cursor: default;
  opacity: 0.35;
}
.krds-tab-area .tab-scroll-button.is-previous {
  left: 0;
}
.krds-tab-area .tab-scroll-button.is-next {
  right: 0.8rem;
}

.contents-tab {
  margin-bottom: clamp(40px, 3.4174757282rem + 1.5533980583vw, 6.4rem);
}
.contents-tab .tab.fill ul li.active a,
.contents-tab .tab.fill ul li.active button {
  color: var(--blue);
}
.contents-tab .tab.fill ul li.active a:after,
.contents-tab .tab.fill ul li.active button:after {
  background: var(--blue);
}

.bul1 > li {
  position: relative;
  padding-left: 14px;
  font-size: clamp(14px, 1.3029126214rem + 0.2588996764vw, 1.8rem);
  line-height: 1.5;
  letter-spacing: -0.02em;
}
.bul1 > li:before {
  content: "";
  position: absolute;
  top: clamp(8px, 0.7757281553rem + 0.0647249191vw, 0.9rem);
  left: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #424242;
}

/*-------------------------------------------------
콘텐츠
-------------------------------------------------*/
.display1,
.display2,
.page-title,
.title1,
.title2,
.title3,
.title4 {
  font-weight: 700;
}

.display1,
.display2 {
  line-height: 120%;
  letter-spacing: -0.03em;
}

.page-title,
.title1,
.title2,
.title3,
.title4,
.body1 {
  line-height: 140%;
  letter-spacing: -0.02em;
}

.body1,
.body2,
.body3,
.subtext1,
.subtext2 {
  font-weight: 400;
}

.body2,
.body3,
.subtext1,
.subtext2 {
  line-height: 150%;
  letter-spacing: -0.02em;
}

.display1 {
  font-size: clamp(44px, 3.1378640777rem + 3.3656957929vw, 9.6rem);
}

.display2 {
  font-size: clamp(40px, 3.0291262136rem + 2.5889967638vw, 8rem);
}

.page-title {
  font-size: clamp(32px, 2.4233009709rem + 2.071197411vw, 6.4rem);
}

.title1 {
  font-size: clamp(28px, 2.1203883495rem + 1.8122977346vw, 5.6rem);
}

.title2 {
  font-size: clamp(24px, 1.9145631068rem + 1.2944983819vw, 4.4rem);
}

.title3 {
  font-size: clamp(22px, 1.8601941748rem + 0.9061488673vw, 3.6rem);
}

.title4 {
  font-size: clamp(20px, 1.8058252427rem + 0.5177993528vw, 2.8rem);
}

.body1 {
  font-size: clamp(17px, 1.5300970874rem + 0.4530744337vw, 2.4rem);
}

.body2 {
  font-size: clamp(16px, 1.454368932rem + 0.3883495146vw, 2.2rem);
}
.body2 + .body2 {
  margin-top: 3.2rem;
}

.body3 {
  font-size: clamp(15px, 1.3786407767rem + 0.3236245955vw, 2rem);
}

.subtext1 {
  font-size: clamp(14px, 1.3029126214rem + 0.2588996764vw, 1.8rem);
}

.subtext2 {
  font-size: clamp(13px, 1.227184466rem + 0.1941747573vw, 1.6rem);
}

.p {
  color: #616161;
  font-size: clamp(15px, 1.3786407767rem + 0.3236245955vw, 2rem);
  line-height: 170%;
  letter-spacing: -0.02em;
}
.p + .p {
  margin-top: 3.2rem;
}
.p.md {
  font-size: 2.2rem;
}
.p.gray-800 {
  color: var(--black-800);
}

.contents-bg {
  position: relative;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--viewport-client-width, 100vw) - clamp(40px, 2.0582524272rem + 5.1779935275vw, 12rem));
  height: calc(100dvh - var(--header-height) - clamp(20px, 1.0291262136rem + 2.5889967638vw, 6rem));
  overflow: hidden;
  border-radius: var(--br-md);
  transform: translateX(-50%);
  padding: 20px clamp(20px, 1.0291262136rem + 2.5889967638vw, 6rem);
  z-index: 1;
}
.contents-bg-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3.4rem;
  padding-bottom: 4.8rem;
  color: #fff;
  text-align: center;
}
.contents-bg[data-bg=purpose] {
  background: url("/resources/images/mps/sub/purpose-bg.webp") no-repeat center center/cover;
}
.contents-bg[data-bg=overview] {
  background: url("/resources/images/mps/sub/overview-bg.webp") no-repeat center/cover;
}
.contents-bg[data-bg=academy] {
  background: url("/resources/images/mps/sub/academy-bg.webp") no-repeat center/cover;
}
.contents-section {
  position: relative;
  display: flex;
  align-items: start;
  row-gap: 40px;
}
.contents-section.sticky .contents-section-title {
  position: -webkit-sticky;
  position: sticky;
  top: 10rem;
}
.contents-section-list {
  display: flex;
  flex-direction: column;
  gap: clamp(60px, 4.5436893204rem + 3.8834951456vw, 12rem);
}
.contents-section-title {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  width: clamp(240px, 20.1165048544rem + 10.355987055vw, 40rem);
}
.contents-section-title > .p {
  font-weight: 500;
  line-height: 160%;
  word-break: break-all;
}
.contents-section-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.contents-section-group[data-num="2"], .contents-section-group[data-num="3"] {
  display: grid;
  gap: 20px;
  width: 100%;
}
.contents-section-group[data-num="2"] > *, .contents-section-group[data-num="3"] > * {
  min-width: 0;
  width: 100%;
}
.contents-section-group[data-num="2"] {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.contents-section-group[data-num="3"] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.contents-article {
  padding: clamp(60px, 3.572815534rem + 6.4724919094vw, 16rem) 0;
}
.contents-article-box {
  --article-column-min: 76rem;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(50%, var(--article-column-min)), 1fr));
}
.contents-article-box.column-sm {
  --article-column-min: 50rem;
}
.contents-article-box.column-md {
  --article-column-min: 60rem;
}
.contents-article-box.column-lg {
  --article-column-min: 76rem;
}
.contents-article-box.column-xl {
  --article-column-min: 100rem;
  grid-template-columns: minmax(0, 1fr) minmax(0, min(100%, var(--article-column-min)));
}
.contents-article-half {
  grid-column: -2/-1;
  min-width: 0;
}

/*-------------------------------------------------
인사말
-------------------------------------------------*/
.greeting .p {
  color: var(--black-900);
}
.greeting .sign {
  font-weight: 600;
}

/*-------------------------------------------------
센터 개요
-------------------------------------------------*/
.center-overview {
  --overview-dark: #082036;
  --overview-intro-overlap: clamp(160px, 13.2815533981rem + 7.2491909385vw, 27.2rem);
}
.center-overview-intro {
  position: relative;
  isolation: isolate;
  left: 50%;
  width: var(--viewport-client-width, 100vw);
  margin-top: calc(-1 * var(--overview-intro-overlap));
  color: var(--white);
  transform: translateX(-50%);
}
.center-overview-intro::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, rgba(8, 32, 54, 0) 0%, var(--overview-dark) 10%, var(--overview-dark) 90%);
  content: "";
  opacity: var(--overview-bg-progress, 0);
  transition: opacity 0.15s linear;
}
@media (prefers-reduced-motion: reduce) {
  .center-overview-intro {
    transition: none;
  }
}
.center-overview-intro-inner {
  width: min(var(--layout), 100% - var(--space-inner-x) * 2);
  margin: 0 auto;
  padding: calc(var(--overview-intro-overlap) + clamp(100px, 8.5436893204rem + 3.8834951456vw, 16rem)) 0 clamp(100px, 8.5436893204rem + 3.8834951456vw, 16rem);
}
.center-overview-lead, .center-overview-description {
  text-align: center;
}
.center-overview-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(24px, 1.5262135922rem + 2.3300970874vw, 6rem);
  margin: clamp(72px, 6.0349514563rem + 3.1067961165vw, 12rem) 0;
}
.center-overview-pair-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.center-overview-pair-item > .page-title {
  position: relative;
  z-index: 1;
  margin-bottom: -4rem;
  font-family: var(--font-en);
  letter-spacing: 0.02em;
}
.center-overview-pair-item--reverse {
  align-items: flex-end;
}
.center-overview-pair-item--reverse > .page-title {
  margin-top: -4rem;
  margin-bottom: 0;
  text-align: right;
}
.center-overview-pair-image {
  position: relative;
  width: 100%;
  aspect-ratio: 73/56;
  overflow: hidden;
  border-radius: 1.2rem;
}
.center-overview-pair-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.center-overview-pair-image:before {
  content: "";
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(8, 32, 54, 0.4) 0%, rgba(8, 32, 54, 0) 30%);
}
.center-overview-functions {
  width: 100%;
  padding: clamp(80px, 6.0582524272rem + 5.1779935275vw, 16rem) 0;
}
.center-overview-heading {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  width: 100%;
  margin-bottom: clamp(40px, 3.4174757282rem + 1.5533980583vw, 6.4rem);
}
.center-overview-slider-wrap {
  min-width: 0;
  width: var(--overview-slider-width, 100%);
}
.center-overview-slider {
  width: 100%;
  margin-right: 0;
  margin-left: 0;
  overflow: hidden;
  overscroll-behavior-x: contain;
  padding-bottom: 5.1rem;
}
.center-overview-slide {
  position: relative;
  width: min(48rem, 100vw - 4rem);
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 1.2rem;
}
.center-overview-slide::after {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  content: "";
}
.center-overview-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.center-overview-slide .title4 {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  width: 80%;
  color: var(--white);
  text-align: center;
  transform: translate(-50%, -50%);
}
.center-overview-scrollbar {
  display: block !important;
  position: relative;
  top: auto !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 3px !important;
  border-bottom: 1px solid #eee;
  border-radius: 0 !important;
  background: var(--white) !important;
}
.center-overview-scrollbar .swiper-scrollbar-drag {
  position: absolute;
  top: 50%;
  height: 100%;
  border-radius: 0;
  background: var(--overview-dark);
}
.center-overview-support {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: clamp(40px, 3.0291262136rem + 2.5889967638vw, 8rem);
}
.center-overview-support-image {
  aspect-ratio: 72/48;
  overflow: hidden;
  border-radius: 1.2rem;
}
.center-overview-support-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.center-overview-support-text {
  line-height: 1.7;
}
.center-overview-support-text p + p {
  margin-top: 2.4rem;
}
.center-overview-support-text strong {
  font-weight: 600;
}

/*-------------------------------------------------
설립 배경 및 목적
-------------------------------------------------*/
.purpose-bg {
  position: relative;
  left: 50%;
  width: var(--viewport-client-width, 100vw);
  height: clamp(500px, 46.6019417476rem + 9.0614886731vw, 64rem);
  transform: translateX(-50%);
  overflow: hidden;
}
.purpose-bg-image {
  width: 100%;
  height: 100%;
  background: url("/resources/images/mps/sub/purpose-bg02.webp") no-repeat center var(--purpose-bg-position, 0%)/max(100vw, 192rem) auto;
  background-attachment: scroll;
}
.purpose-function-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 2.4rem;
  row-gap: 6.4rem;
  margin-top: clamp(32px, 2.4233009709rem + 2.071197411vw, 6.4rem);
}
.purpose-function-item {
  overflow: hidden;
  border-radius: var(--br-sm);
}
.purpose-function-item.empty {
  background: transparent;
}
.purpose-function-image {
  position: relative;
  height: clamp(240px, 21.0388349515rem + 7.8964401294vw, 36.2rem);
  overflow: hidden;
  border-radius: var(--br-sm);
}
.purpose-function-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.purpose-function-image .title3 {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  color: var(--white);
  font-family: var(--font-en);
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  transform: translate(-50%, -50%);
}
.purpose-function-text {
  color: var(--black-950);
  font-weight: 600;
  word-break: keep-all;
  padding: clamp(16px, 1.4058252427rem + 0.5177993528vw, 2.4rem) clamp(10px, 0.9514563107rem + 0.1294498382vw, 1.2rem) 0;
}
.purpose-vision {
  position: relative;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--viewport-client-width, 100vw);
  height: 100vh;
  overflow: hidden;
  background: url("/resources/images/mps/sub/purpose-bg03.webp") no-repeat center center/cover;
  color: var(--white);
  transform: translateX(-50%);
}
.purpose-vision-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(24px, 2.2058252427rem + 0.5177993528vw, 3.2rem);
  width: 100%;
  padding: var(--space-inner-x);
  text-align: center;
}
.purpose-vision-content .title4,
.purpose-vision-content .title1 {
  color: inherit;
  font-weight: 700;
}
.purpose-vision-content .title4 {
  font-size: clamp(24px, 2.2058252427rem + 0.5177993528vw, 3.2rem);
}
.purpose-vision-content .title1 {
  line-height: 1.5;
  letter-spacing: -0.02em;
  word-break: keep-all;
}
.purpose-roadmap {
  position: relative;
  left: 50%;
  display: flex;
  flex-direction: column;
  gap: clamp(100px, 8.5436893204rem + 3.8834951456vw, 16rem);
  width: var(--viewport-client-width, 100vw);
  padding: clamp(100px, 8.5436893204rem + 3.8834951456vw, 16rem) var(--space-inner-x);
  background: linear-gradient(180deg, #092137 0%, #05182b 100%);
  color: var(--white);
  transform: translateX(-50%);
}
.purpose-roadmap-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(40px, 3.4174757282rem + 1.5533980583vw, 6.4rem);
  width: min(100%, var(--layout));
  margin: 0 auto;
}
.purpose-roadmap-section > .title1 {
  color: inherit;
  text-align: center;
}
.purpose-roadmap-scroll {
  width: 100%;
  overflow-x: auto;
  scrollbar-color: rgba(255, 255, 255, 0.35) rgba(255, 255, 255, 0.08);
  scrollbar-width: thin;
}
.purpose-roadmap-scroll::-webkit-scrollbar {
  height: 0.6rem;
}
.purpose-roadmap-scroll::-webkit-scrollbar-track {
  border-radius: 0.6rem;
  background: rgba(255, 255, 255, 0.08);
}
.purpose-roadmap-scroll::-webkit-scrollbar-thumb {
  border-radius: 0.6rem;
  background: rgba(255, 255, 255, 0.35);
}
.purpose-roadmap-timeline {
  position: relative;
  min-width: 90rem;
  padding: 12rem 0 6rem;
}
.purpose-roadmap-years {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  pointer-events: none;
}
.purpose-roadmap-years li {
  height: 100%;
  padding: 0.4rem 1rem;
  border-left: 1px dashed rgba(255, 255, 255, 0.2);
}
.purpose-roadmap-years span {
  color: rgba(255, 255, 255, 0.4);
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.03em;
}
.purpose-roadmap-phases {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 6.4rem;
}
.purpose-roadmap-phase {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}
.purpose-roadmap-phase .title4 {
  color: inherit;
}
.purpose-roadmap-phase .body3 {
  color: rgba(255, 255, 255, 0.8);
  font-weight: 500;
  line-height: 1.5;
}
.purpose-roadmap-phase--short {
  width: 50%;
}
.purpose-roadmap-phase--short .purpose-roadmap-bar {
  background: #3389d5;
}
.purpose-roadmap-phase--long .purpose-roadmap-bar {
  background: linear-gradient(90deg, #8c32b8 0%, #8c32b8 83.555%, rgba(140, 50, 184, 0) 100%);
}
.purpose-roadmap-bar {
  display: block;
  width: 100%;
  height: 1rem;
  border-radius: 1rem;
}
.purpose-roadmap-tasks {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2.4rem;
  width: 100%;
}
.purpose-roadmap-tasks > li {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2.4rem;
  min-width: 0;
  padding: clamp(48px, 4.0233009709rem + 2.071197411vw, 8rem) clamp(28px, 2.3145631068rem + 1.2944983819vw, 4.8rem);
  border-radius: var(--br-md);
  background: #0d2a46;
}
.purpose-roadmap-tasks .title4 {
  color: #459fef;
}
.purpose-roadmap-tasks .body3 {
  color: rgba(255, 255, 255, 0.8);
  font-weight: 500;
  line-height: 1.5;
}
.purpose-roadmap-number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.2rem;
  height: 3.2rem;
  border-radius: var(--br-xxs);
  background: rgba(69, 159, 239, 0.2);
  color: #459fef;
  font-family: var(--font-en);
  font-size: clamp(14px, 1.3029126214rem + 0.2588996764vw, 1.8rem);
  font-style: italic;
  font-weight: 500;
  line-height: 1;
  text-indent: -3px;
}

/*-------------------------------------------------
CI 소개
-------------------------------------------------*/
.ci-download-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}
.ci-image {
  min-width: 0;
  width: 100%;
  border-radius: var(--br-md);
  background: #f1f4f7;
}
.ci-image.large {
  display: flex;
  align-items: center;
  justify-content: center;
  container: ci-wordmark-box/inline-size;
  padding: clamp(40px, 2.9077669903rem + 2.9126213592vw, 8.5rem) clamp(20px, 1.5145631068rem + 1.2944983819vw, 4rem) clamp(50px, 3.9563106796rem + 2.783171521vw, 9.3rem);
}
.ci-image.max {
  display: flex;
  justify-content: center;
  align-items: center;
  height: clamp(320px, 30.0582524272rem + 5.1779935275vw, 40rem);
  border-radius: var(--br-md);
}
.ci-image.max.bg {
  background: url("/resources/images/mps/sub/ci-bg.jpg") no-repeat center center/cover;
  color: #fff;
  font-size: clamp(24px, 2.0116504854rem + 1.0355987055vw, 4rem);
  font-family: var(--font-en);
  font-weight: 700;
  line-height: 140%;
  letter-spacing: -0.02em;
  text-align: center;
  padding: 20px;
}
.ci-image.max .mobile {
  display: none;
}
.ci-wordmark {
  position: relative;
  container-type: inline-size;
  min-width: 0;
  width: min(100%, 101.3rem);
  aspect-ratio: 1013/422;
  margin: 0 auto;
}
.ci-wordmark-note {
  position: absolute;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  min-width: 0;
  color: var(--black-700);
}
.ci-wordmark-note > .subtext2 {
  color: inherit;
  line-height: 1.5;
}
.ci-wordmark-note > strong.body3 {
  color: var(--black-950);
  font-weight: 600;
  line-height: 1.3;
}
.ci-wordmark-note::before, .ci-wordmark-note::after {
  position: absolute;
  content: "";
  pointer-events: none;
}
.ci-wordmark-note--korea {
  top: 0.4739%;
  left: 4.689%;
  width: 24.4817%;
}
.ci-wordmark-note--korea::before {
  top: 1.382cqw;
  left: 13.3268cqw;
  width: 16.4857cqw;
  height: 13.5242cqw;
  background: repeating-linear-gradient(to right, var(--black-950) 0 3.33px, transparent 3.33px 6.66px) top left/100% 1px no-repeat, repeating-linear-gradient(to bottom, var(--black-950) 0 3.33px, transparent 3.33px 6.66px) top right/1px 100% no-repeat;
}
.ci-wordmark-note--korea::after {
  top: 14.6594cqw;
  left: 29.5656cqw;
  width: 0.4936cqw;
  height: 0.4936cqw;
  border-radius: 50%;
  background: var(--black-950);
}
.ci-wordmark-note--shipbuilding {
  top: 0.4739%;
  right: 6.8608%;
  width: 27.542%;
}
.ci-wordmark-note--shipbuilding::before {
  top: 1.382cqw;
  left: -9.1807cqw;
  width: 7.6012cqw;
  height: 11.6486cqw;
  background: repeating-linear-gradient(to right, var(--black-950) 0 3.33px, transparent 3.33px 6.66px) top left/100% 1px no-repeat, repeating-linear-gradient(to bottom, var(--black-950) 0 3.33px, transparent 3.33px 6.66px) top left/1px 100% no-repeat;
}
.ci-wordmark-note--shipbuilding::after {
  top: 12.7838cqw;
  left: -9.4274cqw;
  width: 0.4936cqw;
  height: 0.4936cqw;
  border-radius: 50%;
  background: var(--black-950);
}
.ci-wordmark-note--us {
  top: 78.673%;
  left: 52.6654%;
  width: 35.538%;
}
.ci-wordmark-note--us > .body3 {
  width: 36.0316cqw;
}
.ci-wordmark-note--us::before {
  top: -3.6525cqw;
  left: -15.696cqw;
  width: 14.1165cqw;
  height: 5.1333cqw;
  background: repeating-linear-gradient(to bottom, var(--black-950) 0 3.33px, transparent 3.33px 6.66px) top left/1px 100% no-repeat, repeating-linear-gradient(to right, var(--black-950) 0 3.33px, transparent 3.33px 6.66px) bottom left/100% 1px no-repeat;
}
.ci-wordmark-note--us::after {
  top: -3.8993cqw;
  left: -15.9427cqw;
  width: 0.4936cqw;
  height: 0.4936cqw;
  border-radius: 50%;
  background: var(--black-950);
}
.ci-wordmark-logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 40rem;
  aspect-ratio: 400/143;
}
.ci-wordmark-logo > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.ci-text {
  color: var(--black-800);
}
.ci-text .body1 {
  font-weight: 700;
}
.ci-text .p,
.ci-text .body3,
.ci-text .body1 {
  display: block;
}
.ci-text-list > li {
  display: flex;
  gap: clamp(8px, 0.7029126214rem + 0.2588996764vw, 1.2rem);
}
.ci-text-list > li + li {
  margin-top: clamp(4px, 0.3029126214rem + 0.2588996764vw, 0.8rem);
}
.ci-text-list strong.body3 {
  flex-shrink: 0;
  width: 50px;
  font-weight: 600;
}
.ci-text-list .body3,
.ci-text-list .p {
  line-height: 150%;
}
.ci-shape {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 28rem;
  border-radius: var(--br-md);
  padding: clamp(20px, 1.6116504854rem + 1.0355987055vw, 3.6rem) clamp(20px, 1.5145631068rem + 1.2944983819vw, 4rem);
}
.ci-shape .body2,
.ci-shape .subtext2 {
  color: #fff;
}
.ci-shape .body2 {
  font-weight: 700;
}
.ci-shape .subtext2 {
  text-transform: uppercase;
}
.ci-shape.red {
  background: var(--red);
}
.ci-shape.deep-blue {
  background: var(--blue);
}
.ci-shape.black {
  background: var(--black);
}
.ci-shape-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/*-------------------------------------------------
조직도
-------------------------------------------------*/
.organization {
  --organization-line: var(--black-300);
  --organization-node-width: 24.8rem;
  --organization-row-gap: clamp(32px, 1.5495145631rem + 4.4012944984vw, 10rem);
  --organization-team-gap: clamp(64px, 5.6233009709rem + 2.071197411vw, 9.6rem);
  --organization-branch-height: clamp(30px, 2.5145631068rem + 1.2944983819vw, 5rem);
  width: min(100%, 80rem);
  margin: 0 auto;
  color: var(--black-800);
}
.organization-node, .organization-center, .organization-side-node, .organization-leader, .organization-team {
  border-radius: var(--br-md);
  word-break: keep-all;
}
.organization-governance {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.organization-governance-wrap {
  position: relative;
}
.organization-governance-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.organization-node {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 6.6rem;
  padding: 2rem 4rem;
  font-size: clamp(15px, 1.3786407767rem + 0.3236245955vw, 2rem);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  text-align: center;
}
.organization-node--governance {
  width: var(--organization-node-width);
  background: var(--cool-gray);
  color: var(--white);
}
.organization-side-node {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-width: 15.7rem;
  height: 100%;
  padding: 1.2rem 2rem;
  background: #f1f4f7;
  font-size: clamp(14px, 1.3029126214rem + 0.2588996764vw, 1.8rem);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
}
.organization-connector {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 4rem;
}
.organization-connector--committee {
  align-items: stretch;
  width: 80rem;
  max-width: calc(100vw - 4rem);
  height: 63px;
}
.organization-vertical-line {
  flex: 0 0 1px;
  height: 100%;
  background: var(--organization-line);
}
.organization-committee-branch, .organization-connector-spacer {
  flex: 0 0 calc(50% - 0.5px);
}
.organization-committee-branch {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.organization-branch-line {
  flex: 0 0 18rem;
  height: 1px;
  background: var(--organization-line);
}
.organization-center {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 8.8rem;
  padding: 2.4rem 4rem;
  background: var(--deep-blue);
  color: var(--white);
  font-size: clamp(17px, 1.5300970874rem + 0.4530744337vw, 2.4rem);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  text-align: center;
}
.organization-leaders {
  position: relative;
  display: flex;
  gap: var(--organization-row-gap);
  padding-top: clamp(30px, 2.5145631068rem + 1.2944983819vw, 5rem);
}
.organization-leaders::before {
  position: absolute;
  top: 0;
  left: 50%;
  height: calc(clamp(30px, 2.5145631068rem + 1.2944983819vw, 5rem) + 10.6rem + 1px);
  border-left: 1px solid var(--organization-line);
  content: "";
}
.organization-leaders::after {
  position: absolute;
  top: 50%;
  left: 50%;
  height: calc(50% + var(--organization-team-gap) - var(--organization-branch-height));
  border-left: 1px solid var(--organization-line);
  content: "";
}
.organization-leader {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  min-height: 10.6rem;
  width: calc((100% - (var(--organization-count) - 1) * var(--organization-row-gap)) / var(--organization-count));
  padding: 2.4rem 2rem;
  background: #f1f4f7;
  text-align: center;
}
.organization-leader:first-child::after {
  position: absolute;
  top: 50%;
  left: 100%;
  width: var(--organization-row-gap);
  border-top: 1px solid var(--organization-line);
  content: "";
}
.organization-leader strong {
  font-size: clamp(17px, 1.627184466rem + 0.1941747573vw, 2rem);
  font-weight: 600;
  line-height: 1.3;
}
.organization-leader span {
  font-size: clamp(14px, 1.3029126214rem + 0.2588996764vw, 1.8rem);
  line-height: 1.5;
  letter-spacing: -0.02em;
}
.organization-teams {
  position: relative;
  display: flex;
  align-items: stretch;
  gap: var(--organization-row-gap);
  margin-top: var(--organization-team-gap);
}
.organization-teams::before {
  position: absolute;
  bottom: 100%;
  left: calc((100% - (var(--organization-count) - 1) * var(--organization-row-gap)) / var(--organization-count) / 2);
  width: calc(100% - (100% - (var(--organization-count) - 1) * var(--organization-row-gap)) / var(--organization-count));
  height: var(--organization-branch-height);
  border: solid var(--organization-line);
  border-width: 1px 1px 0;
  content: "";
}
.organization-team {
  position: relative;
  overflow: hidden;
  min-width: 0;
  width: calc((100% - (var(--organization-count) - 1) * var(--organization-row-gap)) / var(--organization-count));
  border: 1px solid var(--color-01);
  background: var(--white);
}
.organization-team::before {
  position: absolute;
  bottom: calc(100% + 1px);
  left: 50%;
  height: clamp(30px, 2.5145631068rem + 1.2944983819vw, 5rem);
  border-left: 1px solid var(--organization-line);
  content: "";
}
.organization-team-title {
  display: block;
  padding: 2rem;
  background: var(--color-01);
  color: var(--white);
  font-size: clamp(17px, 1.627184466rem + 0.1941747573vw, 2rem);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
  text-align: center;
}
.organization-team-duty {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: 2.4rem 1.6rem 2.4rem 3rem;
}

/*-------------------------------------------------
오시는 길
-------------------------------------------------*/
.location-map {
  position: relative;
  left: 50%;
  width: min(100vw, 100vw - var(--space-inner-x) * 2);
  height: clamp(320px, 28.1165048544rem + 10.355987055vw, 48rem);
  overflow: hidden;
  border-radius: var(--br-sm);
  transform: translateX(-50%);
}
.location-map > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.location-marker {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
  color: var(--black-950);
  text-align: center;
  transform: translate(-50%, -50%);
}
.location-marker > img {
  width: 6.4rem;
}
.location-marker .body3 {
  color: #000;
  font-weight: 600;
  line-height: 1.3;
  text-shadow: -2px -2px 0 #fff, 0 -2px 0 #fff, 2px -2px 0 #fff, -2px 0 0 #fff, 2px 0 0 #fff, -2px 2px 0 #fff, 0 2px 0 #fff, 2px 2px 0 #fff;
}
.location-info {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.4rem;
  padding-top: clamp(48px, 4.0233009709rem + 2.071197411vw, 8rem);
}
.location-info > .title3 {
  color: var(--black-950);
}
.location-details {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2.4rem;
}
.location-details dl {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  width: 100%;
}
.location-details dl > div {
  display: grid;
  grid-template-columns: 16rem minmax(0, 1fr);
  align-items: start;
}
.location-details dl dt,
.location-details dl dd {
  color: var(--black-800);
}
.location-details dl dt {
  font-weight: 700;
}
.location-details dl dd {
  min-width: 0;
}
.location-details dl dd p {
  font-weight: 500;
  padding-inline-end: 2.6rem;
}
.location-copy {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  margin-left: 0.6rem;
  margin-right: -2.6rem;
  color: var(--black-400);
  vertical-align: baseline;
  transform: translateY(0.3rem);
}
.location-copy::before {
  width: 100%;
  height: 100%;
  background: currentColor;
  content: "";
  mask: url("/resources/images/common/icon/icon_tabler-icon-copy.png") no-repeat center/contain;
  -webkit-mask: url("/resources/images/common/icon/icon_tabler-icon-copy.png") no-repeat center/contain;
}
.location-copy img {
  display: none;
}
.location-copy:hover, .location-copy:focus-visible {
  color: var(--primary);
}
.location-copy.is-tooltip-visible {
  color: var(--primary-50);
}
.location-copy:focus-visible, .location-copy:focus {
  box-shadow: none;
  outline: none;
  border: none;
}
.location-route {
  background: #00326e;
  color: var(--white);
}
.location-route:hover, .location-route:focus-visible {
  background: var(--primary);
  color: var(--white);
}

/*-------------------------------------------------
아카데미 소개
-------------------------------------------------*/
.academy-application-notice-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.4rem;
  width: 100%;
  padding: 4.8rem 2.4rem;
  border-radius: 1.2rem;
  background: var(--black-100);
  text-align: center;
}
.academy-application-notice-wrap > .title3 {
  color: var(--black-900);
}
.academy-application-notice {
  color: var(--black-800);
  line-height: 1.7;
}
.academy-application-notice a {
  color: var(--deep-blue);
  font-weight: 600;
}
.academy-intro {
  padding-bottom: clamp(40px, 2.0582524272rem + 5.1779935275vw, 12rem);
}
.academy-intro .contents-article-box {
  margin-top: clamp(40px, 2.0582524272rem + 5.1779935275vw, 12rem);
}
.academy-lead {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}
.academy-lead .title2 {
  color: var(--black-900);
  font-weight: 500;
  line-height: 1.4;
}
.academy-eyebrow {
  color: var(--point);
  font-size: clamp(16px, 1.4058252427rem + 0.5177993528vw, 2.4rem);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
}
.academy-text .body2 {
  color: var(--black-950);
  line-height: 1.7;
}
.academy-section .title1 {
  color: var(--black-950);
  font-weight: 700;
  line-height: 1.3;
}
.academy-programs {
  padding-top: clamp(40px, 3.0291262136rem + 2.5889967638vw, 8rem);
  border-top: 1px solid var(--black-300);
  padding-bottom: 0;
}
.academy-program {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2.4rem;
}
.academy-program-list {
  display: flex;
  flex-direction: column;
  gap: clamp(48px, 4.4116504854rem + 1.0355987055vw, 6.4rem);
}
.academy-program .title4 {
  color: var(--black-950);
  font-weight: 700;
  line-height: 1.4;
}
.academy-growth {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  overflow: hidden;
  padding: 0;
  border-radius: var(--br-md);
  background: #f3f4f5;
}
.academy-growth::before {
  grid-row: 1;
  grid-column: 1/-1;
  width: 100%;
  aspect-ratio: 1520/700;
  content: "";
  pointer-events: none;
}
.academy-growth-wrap {
  padding: 0;
}
.academy-growth > img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.academy-growth-panel {
  position: relative;
  z-index: 1;
  grid-row: 1;
  grid-column: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: clamp(32px, 2.8116504854rem + 1.0355987055vw, 4.8rem);
  min-width: 0;
  width: 100%;
  padding: clamp(24px, 1.4291262136rem + 2.5889967638vw, 6.4rem);
  background: rgba(0, 0, 0, 0.3);
  color: var(--white);
  backdrop-filter: blur(40px);
}
.academy-growth-panel .title1,
.academy-growth-panel .body2 {
  color: inherit;
}
.academy > .btn-wrap {
  display: flex;
  justify-content: center;
  margin-top: clamp(40px, 2.0582524272rem + 5.1779935275vw, 12rem);
}

/*-------------------------------------------------
관련 사이트
-------------------------------------------------*/
.related-sites {
  display: flex;
  flex-direction: column;
  gap: clamp(64px, 5.040776699rem + 3.6245954693vw, 12rem);
  margin-top: clamp(48px, 4.0233009709rem + 2.071197411vw, 8rem);
  animation: related-sites-fade 0.3s ease;
}
.related-sites[hidden] {
  display: none;
}
.related-sites-section {
  display: flex;
  flex-direction: column;
  gap: 3.2rem;
}
.related-sites-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 2rem;
  row-gap: 4.8rem;
}
.related-sites-link {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  min-width: 0;
  color: var(--black-950);
}
.related-sites-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 24.3rem;
  overflow: hidden;
  border-radius: var(--br-md);
  background: #f7f8f9;
  transition: box-shadow var(--trs);
  padding: 0 2rem;
}
.related-sites-logo img {
  max-width: 100%;
  object-fit: contain;
}
.related-sites-name {
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.02em;
  text-align: center;
}

/*-------------------------------------------------
이메일무단수집거부
-------------------------------------------------*/
.email {
  display: flex;
  flex-direction: column;
  gap: clamp(48px, 4.0233009709rem + 2.071197411vw, 8rem);
}
.email-notice {
  display: flex;
  align-items: center;
  gap: clamp(20px, 1.7087378641rem + 0.7766990291vw, 3.2rem);
  padding: clamp(32px, 2.8116504854rem + 1.0355987055vw, 4.8rem) clamp(24px, 1.4291262136rem + 2.5889967638vw, 6.4rem);
  border-radius: var(--br-sm);
  background: #f7f8f9;
}
.email-notice-icon {
  flex: 0 0 10rem;
  width: 10rem;
  height: 7.6rem;
}
.email-notice-icon img {
  display: block;
  width: 100%;
  height: 100%;
}
.email-notice-text {
  min-width: 0;
  color: var(--black-950);
  word-break: keep-all;
}
.email-content {
  display: flex;
  flex-direction: column;
  gap: clamp(48px, 4.2174757282rem + 1.5533980583vw, 7.2rem);
}
.email-section {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(24px, 2.2058252427rem + 0.5177993528vw, 3.2rem);
  width: 100%;
}
.email-section .title4 {
  color: var(--black-950);
}
.email-penalty {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  width: 100%;
}
.email-penalty-title {
  color: var(--deep-blue);
  font-weight: 500;
}
.email-list {
  width: 100%;
  color: var(--black-800);
}
.email-list > li + li {
  margin-top: 0.4rem;
}

@keyframes related-sites-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@media (prefers-reduced-motion: reduce) {
  .related-sites {
    animation: none;
  }
}
@media (max-width: 1400px) {
  .ci-wordmark {
    display: grid;
    container-type: normal;
    grid-template-areas: "logo" "korea" "shipbuilding" "us";
    grid-template-columns: minmax(0, 1fr);
    aspect-ratio: auto;
    gap: 3.2rem;
  }
  .ci-wordmark-note {
    position: relative;
    inset: auto;
    align-items: flex-start;
    width: 100%;
    text-align: left;
  }
  .ci-wordmark-note::before, .ci-wordmark-note::after {
    display: none;
  }
  .ci-wordmark-note > .subtext2 br {
    display: none;
  }
  .ci-wordmark-note--korea {
    grid-area: korea;
  }
  .ci-wordmark-note--shipbuilding {
    grid-area: shipbuilding;
  }
  .ci-wordmark-note--us {
    grid-area: us;
  }
  .ci-wordmark-logo {
    position: relative;
    inset: auto;
    grid-area: logo;
    justify-self: center;
    transform: none;
    width: min(100%, 38rem);
  }
}
@media (max-width: 1280px) {
  .email-notice {
    align-items: flex-start;
  }
  .email-notice-icon {
    flex-basis: 8rem;
    width: 8rem;
    height: 6.1rem;
  }
  .email-notice-text {
    word-break: auto-phrase;
    text-wrap: balance;
  }
  .email-notice-text br {
    display: none;
  }
}
@media (max-width: 1024px) {
  .contents-section {
    flex-wrap: wrap;
  }
  .contents-section .contents-section-title {
    position: static !important;
    width: 100%;
  }
  .contents-section .contents-section-body {
    flex: none;
    width: 100%;
  }
  .academy-lead .title1 br {
    display: none;
  }
  .academy-growth {
    display: flex;
    flex-direction: column;
  }
  .academy-growth::before {
    display: none;
  }
  .academy-growth > img {
    position: static;
    flex: none;
    height: auto;
    aspect-ratio: 1520/700;
  }
  .academy-growth-panel {
    position: relative;
    inset: auto;
    width: 100%;
    background: var(--primary);
    backdrop-filter: none;
  }
  .center-overview-intro-inner {
    width: calc(100% - var(--space-inner-x) * 2);
  }
  .center-overview-pair {
    gap: 2rem;
  }
  .center-overview-functions {
    min-height: auto;
  }
  .center-overview-slide {
    width: min(42rem, 100vw - 6rem);
  }
  .center-overview-support {
    grid-template-columns: minmax(0, 1fr);
  }
  .contents-article-box {
    grid-template-columns: 1fr;
    margin-top: clamp(40px, 3.4174757282rem + 1.5533980583vw, 6.4rem);
  }
  .contents-article-box.column-xl {
    grid-template-columns: 1fr;
  }
  .contents-article-half {
    grid-column: 1;
  }
  .purpose-function-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .purpose-function-item.empty {
    display: none;
  }
  .purpose-function-image {
    height: clamp(240px, 14.4580152672rem + 25.4452926209vw, 34rem);
  }
  .location-info {
    grid-template-columns: minmax(0, 1fr);
    gap: 4rem;
  }
  .location-details {
    align-items: flex-start;
  }
  .related-sites-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .content-section {
    flex-direction: column;
  }
  .content-section-title {
    position: static !important;
    width: 100%;
  }
  .content-section-body {
    width: 100%;
  }
}
@media (max-width: 768px) {
  .purpose-bg-image {
    background-size: max(100vw, 192rem) auto;
  }
  .center-overview-lead br, .center-overview-description br, .center-overview-heading br {
    display: none;
  }
  .center-overview-pair {
    grid-template-columns: minmax(0, 1fr);
    gap: 7.2rem;
  }
  .center-overview-pair-item > .title1 {
    margin-bottom: -2rem;
  }
  .center-overview-pair-item--reverse > .title1 {
    margin-top: -2rem;
  }
  .center-overview-slider {
    padding-bottom: 3.2rem;
  }
  .center-overview-slide {
    width: min(32rem, 100vw - 6rem);
  }
  .purpose-function-list {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 3.2rem;
  }
  .purpose-function-text br {
    display: none;
  }
  .location-map {
    width: calc(100% + var(--space-inner-x) * 2);
    border-radius: 0;
  }
  .location-marker {
    width: calc(100% - 4rem);
  }
  .location-marker > i {
    font-size: 4.8rem;
  }
  .location-marker > strong {
    white-space: normal;
  }
  .location-details dl > div {
    grid-template-columns: 10rem minmax(0, 1fr);
  }
  .related-sites-section {
    gap: 2.4rem;
  }
  .related-sites-logo {
    height: clamp(160px, 10.2748091603rem + 15.2671755725vw, 22rem);
  }
  .organization {
    --organization-node-width: min(100%, 24.8rem);
    --organization-team-gap: 30px;
    padding-inline: 0.4rem;
  }
  .organization-side-node {
    min-width: auto;
    height: 48px;
    padding-inline: 2.4rem;
  }
  .organization-branch-line {
    flex: auto;
    flex-basis: 50%;
  }
  .organization-leaders, .organization-teams {
    flex-direction: column;
    gap: 2.4rem;
  }
  .organization-leaders::before {
    bottom: 0;
    height: auto;
  }
  .organization-leaders::after {
    display: none;
  }
  .organization-leader {
    width: 100%;
  }
  .organization-leader:first-child::after {
    top: 100%;
    left: 50%;
    width: 0;
    height: 2.4rem;
    border-top: 0;
    border-left: 1px solid var(--organization-line);
  }
  .organization-teams::before {
    display: none;
  }
  .organization-team {
    overflow: visible;
    width: 100%;
  }
  .organization-team:not(:first-child)::before {
    bottom: calc(100% + 1px);
    height: 24px;
  }
  .organization-team-title {
    border-radius: calc(var(--br-md) - 1px) calc(var(--br-md) - 1px) 0 0;
  }
  .ci-shape {
    min-height: 20rem;
  }
  .contents-section-group[data-num="3"] {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .purpose-vision-content .title1 br {
    display: none;
  }
  .purpose-roadmap-tasks {
    grid-template-columns: minmax(0, 1fr);
  }
  .purpose-roadmap-tasks > li {
    padding: 4rem 2.4rem;
  }
  .email-notice {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
}
@media (max-width: 480px) {
  .related-sites-list {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 3.2rem;
  }
  .content-section-group[data-num="2"] {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .content-section-group[data-num="3"] {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}