body.sub {
  background: #121212;
  color: #fff;
}

input {
	appearance: auto;
}

body.sub #wrap {
  background: url('../_img/sub/bg-sub-wrap2.png') no-repeat top center/cover;
}

/* --- page wrap backgrounds --- */
.sub-company-wrap {
  background: url('../_img/sub/sub01-visual.png') no-repeat top center/100% auto;
}

.sub-show-wrap {
  overflow-x: clip;
}

.sub-show-wrap .text-gradient {
  background: linear-gradient(to right, var(--color-second), var(--color-primary));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}


/* show — 상단 비주얼은 .bg-show 섹션에 적용 (wrap 배경 없음) */
.bg-show.sub-section01 {
  background: url('../_img/sub/sub03-visual.png') no-repeat center/cover;
}


/* sec01 slogan — 비전·보드멤버·협력사·CI/BI·뉴스 등 공통 */
.sub-hero-inner {
  display: flex;
  justify-content: flex-end;
  width: 100%;
}
.sub-hero-title {
  font-size: clamp(28px, 4vw, 52px);
  font-weight: 700;
  line-height: 1.2;
  color: #f7f8fa;
  margin-bottom: 2.5rem;
}
.sub-hero-quote {
  display: flex;
  gap: 1.429em;
  align-items: center;
  font-size: clamp(18px, 2vw, 28px);
}
.sub-hero-quote-bar {
  flex-shrink: 0;
  width: 4px;
  height: 2.143em;
  background: linear-gradient(to bottom, var(--color-second), var(--color-primary));
}
.sub-hero-quote p {
  font-size: 1em;
  font-weight: 700;
  line-height: 1.2;
  color: #f7f8fa;
  margin-bottom: 0;
}

/* COVI 소개( introduction ) — hero-quote 예외 */
.sub-hero-quote--intro {
  align-items: flex-start;
  margin-top: 2.5rem;
  font-size: clamp(16px, 2vw, 28px);
}
.sub-hero-quote--intro .sub-hero-quote-bar {
  height: 3.571em;
}
.sub-hero-quote--intro p {
  line-height: 1.5;
}

/* 2줄 인용문 — bar 높이 확대 (100px ÷ 28px) */
.sub-hero-quote--lg .sub-hero-quote-bar {
  height: 3.571em;
}
.sub-hero-quote--lg p {
  line-height: 1.5;
}

/* quote marks — 따옴표 감싸기 공통 */
.sub-quote-wrap {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 1.375rem;
  max-width: 43.625rem;
  margin: 0 auto;
  padding: 0 2rem;
}
.sub-quote-mark {
  flex-shrink: 0;
  width: 2rem;
  height: 1.25rem;
  object-fit: contain;
  margin-top: 5px;
}
.sub-quote-txt {
  font-size: clamp(22px, 3vw, 40px);
  font-weight: 700;
  line-height: 1.5;
  color: #f7f8fa;
  text-align: center;
  margin-bottom: 0;
}

/* feature visual 옆 인용 — cont-box 중앙 정렬과 구분 */
.sub-quote-wrap--side {
  justify-content: flex-start;
  gap: 5rem;
  max-width: none;
  margin: 0;
  padding: 0;
  flex: 1;
  min-width: 0;
}
.sub-quote-wrap--side .sub-quote-mark {
  margin-top: 0.3125rem;
}
.sub-quote-txt--side {
  font-size: clamp(18px, 1.8vw, 24px);
  text-align: left;
}
.sub-quote-mark-left--flip {
  transform: rotate(180deg);
}

/* section head — 섹션 타이틀+설명 공통 */
.sub-section-stack {
  display: flex;
  flex-direction: column;
  gap: 3.75rem;
}
.sub-section-head {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.sub-sec-title {
  font-size: clamp(25px, 3.5vw, 40px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}
.sub-sec-desc {
  font-size: clamp(14px, 1.5vw, 20px);
  font-weight: 400;
  line-height: 1.5;
  color: #fff;
}

/* glass card — 그라데이션 카드 공통 베이스 */
.sub-glass-card {
  position: relative;
  border-radius: 20px;
  background: linear-gradient(to bottom, rgba(247, 248, 250, 0.04), rgba(31, 118, 194, 0.04));
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
  border: 1px solid transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.sub-glass-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 20px;
  padding: 1px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.03) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0.1) 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  pointer-events: none;
}
.sub-glass-card.no-before::before {
  display: none;
}

/* svg icon — background-image i 태그 */
.ico-svg {
  flex-shrink: 0;
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-style: normal;
  /* transition: filter 0.25s ease; */
}
.ico-svg-location {
  background-image: url('../_img/sub/ico-board-card-location.svg');
}
.ico-svg-location-gray {
  background-image: url('../_img/sub/ico-svg-location-gray.svg');
}
.ico-svg-calendar {
  background-image: url('../_img/sub/ico-board-card-calendar.svg');
}
.ico-svg-calendar-gray {
  background-image: url('../_img/sub/ico-svg-calendar-gray.svg');
}
.ico-svg-more-arrow-gray {
  background-image: url('../_img/sub/ico-svg-more-arrow-gray.svg');
}

.ico-png-chart-gray {
  background-image: url('../_img/sub/ico_funding_chart.png');
}

.ico-png-target-gray {
  background-image: url('../_img/sub/ico_funding_target.png');
}

/* member card — 프로필형 멤버 카드 (2열 그리드) */
.sub-member-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2.5rem;
}
.sub-member-card {
  display: flex;
  align-items: stretch;
  min-height: 22.5rem;
  overflow: hidden;
}
.sub-member-card-img {
  position: relative;
  flex-shrink: 0;
  width: 20rem;
  max-width: 40%;
}
.sub-member-card-img::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.2);
  pointer-events: none;
}
.sub-member-card-img img {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sub-member-card-body {
  position: relative;
  z-index: 1;
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1rem;
  padding: 1.25rem 3.75rem;
}
.sub-member-card-head {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.sub-member-card-role {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 400;
  line-height: 1.3;
  background: linear-gradient(to bottom, var(--color-second), var(--color-primary));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.sub-member-card-name {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.5rem;
}
.sub-member-card-name strong {
  font-size: clamp(20px, 1.8vw, 24px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}
.sub-member-card-name-en {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.3;
  color: #999;
}
.sub-member-card-divider {
  width: 100%;
  height: 1px;
  margin: 0;
  border: none;
  background: rgba(255, 255, 255, 0.4);
}
.sub-member-card-desc {
  font-size: clamp(14px, 1.2vw, 16px);
  font-weight: 500;
  line-height: 1.5;
  color: #f7f8fa;
  margin-bottom: 0;
}

/* benefit card — 아이콘+텍스트 혜택 카드 (3열 그리드) */
.sub-benefit-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2.5rem;
}
.sub-benefit-card {
  display: flex;
  align-items: center;
  gap: 2.5rem;
  height: 100%;
  padding: 1.25rem 2.5rem;
}
.sub-benefit-card-icon {
  position: relative;
  z-index: 1;
  flex-shrink: 0;
  width: 5rem;
  height: 5rem;
}
.sub-benefit-card-icon--circle {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: linear-gradient(to bottom, rgba(106, 54, 201, 0.2), rgba(254, 58, 139, 0.2));
}
.sub-benefit-card-icon--circle img {
  width: 2.5rem;
  height: 2.5rem;
}
.sub-benefit-card-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sub-benefit-card-txt {
  position: relative;
  z-index: 1;
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.sub-benefit-card-title {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0;
}
.sub-benefit-card-desc {
  font-size: clamp(14px, 1.2vw, 16px);
  font-weight: 400;
  line-height: 1.5;
  color: #f7f8fa;
  margin-bottom: 0;
}
.sub-benefit-list--2col {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.sub-benefit-list--stack {
  gap: 2.5rem;
}
.sub-benefit-card--stack {
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 2.5rem;
  padding: 5rem 3.75rem;
}
.sub-benefit-card--stack .sub-benefit-card-head {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  width: 100%;
}
.sub-benefit-card--stack .sub-benefit-card-title {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  color: #fff;
}
.sub-benefit-card--stack .sub-benefit-card-desc {
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.5;
  color: #f7f8fa;
}
.sub-benefit-card-title--lg {
  font-size: clamp(18px, 1.8vw, 24px);
}
.sub-benefit-card-desc--muted {
  font-weight: 700;
  color: #999;
}

/* split grid — 2열 섹션 분할 */
.sub-split-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.5rem;
}
.sub-split-col {
  display: flex;
  flex-direction: column;
  gap: 3.75rem;
  min-width: 0;
}

/* funding card — 투자금 항목별 배분 */
.sub-funding-card {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding: 2.5rem;
}
.sub-funding-card-title {
  position: relative;
  z-index: 1;
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0;
}
.sub-funding-card-divider {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 1px;
  background: rgba(255, 255, 255, 0.4);
}
.sub-funding-list {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.sub-funding-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.25rem;
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: 700;
  line-height: 1.5;
}
.sub-funding-row dt {
  flex: 1;
  min-width: 0;
  color: #999;
}
.sub-funding-row dd {
  flex-shrink: 0;
  color: #1f76c2;
  margin-bottom: 0;
}
.sub-funding-row--muted dt,
.sub-funding-row--muted dd {
  color: #999;
}

/* exit card — ROI exit 시나리오 */
.sub-exit-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.5rem;
  flex: 1;
  list-style: none;
}
.sub-exit-list li {
  list-style: none;
}
.sub-exit-card {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  height: 100%;
  padding: 2.5rem;
}
.sub-exit-card-label {
  position: relative;
  z-index: 1;
  font-size: clamp(14px, 1.2vw, 16px);
  font-weight: 600;
  line-height: 1.3;
  color: #999;
  margin-bottom: 0;
}
.sub-exit-card-roi {
  position: relative;
  z-index: 1;
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 700;
  line-height: 1.3;
  color: var(--color-primary);
  margin-bottom: 0;
}
.sub-exit-card-desc {
  position: relative;
  z-index: 1;
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #f7f8fa;
  margin-bottom: 0;
}

/* download banner — IR 자료 다운로드 */
.sub-glass-card--pink {
  background: linear-gradient(to bottom, rgba(254, 58, 139, 0.1), rgba(152, 35, 83, 0.1));
}
.sub-download-banner {
  min-height: 10rem;
  border-radius: 0;
}
.sub-download-banner-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.5rem;
  padding: 2.5rem 0;
}
.sub-download-banner-txt {
  flex: 1;
  min-width: 0;
  max-width: 36.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.sub-download-banner-title {
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0;
}
.sub-download-banner-desc {
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #999;
  margin-bottom: 0;
}
.btn_download.sub-download-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 12.25rem;
  padding: 1.25rem 2.5rem;
  border-radius: 20px;
  background: linear-gradient(to bottom, rgba(254, 58, 139, 0.8), rgba(106, 54, 201, 0.8));
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.2;
  color: #f7f8fa;
  text-align: center;
  text-decoration: none;
  transition: opacity 0.25s ease;
}
.btn_download.sub-download-btn:hover {
  opacity: 0.85;
}

/* contact list — 투자 문의 KPI */
.sub-section-stack--center {
  align-items: center;
}
.sub-section-stack--center .sub-section-head {
  align-items: center;
  text-align: center;
}
.sub-contact-list {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  width: 100%;
}
.sub-contact-item {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
  text-align: center;
}
.sub-contact-icon {
  width: 2.5rem;
  height: 2.5rem;
}
.sub-contact-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sub-contact-txt {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.sub-contact-label {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.2;
  color: var(--color-primary);
  margin-bottom: 0;
}
.sub-contact-value {
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 700;
  line-height: 1.8;
  color: #f7f8fa;
  margin-bottom: 0;
}
.sub-contact-sub {
  font-size: clamp(14px, 1.2vw, 16px);
  font-weight: 400;
  line-height: 1.8;
  color: #f7f8fa;
  margin-bottom: 0;
}
.sub-contact-divider {
  flex-shrink: 0;
  width: 1px;
  height: 6.25rem;
  background: rgba(255, 255, 255, 0.4);
}

/* feature visual — 이미지 + 사이드 인용문 */
.sub-feature-visual {
  display: flex;
  align-items: center;
  gap: 5rem;
}
.sub-feature-visual-img {
  flex-shrink: 0;
  width: 40%;
  max-width: 35rem;
}
.sub-feature-visual-img img {
  display: block;
  width: 100%;
  opacity: 0.8;
}

/* partner logo — 협력사 로고 (5+4, flex wrap) */
.sub-partner-list {
  --partner-gap: 2.5rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--partner-gap);
  list-style: none;
}
.sub-partner-list li {
  flex: 0 0 calc((100% - 4 * var(--partner-gap)) / 5);
  max-width: calc((100% - 4 * var(--partner-gap)) / 5);
  min-width: 0;
  list-style: none;
}
.sub-partner-card {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 1.25rem 2.5rem;
}
.sub-partner-card img {
  display: block;
  width: 12.5rem;
  max-width: 100%;
  height: auto;
}

/* tab menu — 탭 전환 UI */
.sub-tab-wrap {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
.sub-tab-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 2.5rem;
  border-bottom: 1px solid #666;
}
.sub-tab-btn {
  position: relative;
  padding: 1rem 0;
  border: 0;
  background: transparent;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1;
  color: #999;
  cursor: pointer;
}
.sub-tab-btn::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 100%;
  height: 2px;
  background: var(--color-primary);
  opacity: 0;
}
.sub-tab-btn.is-active {
  color: var(--color-primary);
}
.sub-tab-btn.is-active::after {
  opacity: 1;
}
.sub-tab-panel {
  display: none;
}
.sub-tab-panel.is-active {
  display: block;
}
.sub-tab-panel-desc {
  padding: 1.25rem 2rem;
  border-radius: 1.5rem;
  background: linear-gradient(rgba(247, 248, 250, 0.04), rgba(31, 118, 194, 0.04));
  backdrop-filter: blur(7px);
  border: 1px solid transparent;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.5;
  color: #fff;
  margin-bottom: 2.5rem;
}

/* video card — 오디션 영상 그리드 */
.sub-video-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 2.5rem;
  list-style: none;
}
.sub-video-list li {
  list-style: none;
  padding: 0 0 1.125rem;
  border-radius: 1rem;
  background: linear-gradient(rgba(247, 248, 250, 0.04), rgba(31, 118, 194, 0.04));
  backdrop-filter: blur(7px);
  border: 1px solid transparent;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #fff;
  margin-bottom: 2.5rem;

}
.sub-video-card {
  display: flex;
  flex-direction: column;
  gap: 0;
  color: inherit;
  text-decoration: none;
}
.sub-video-card-thumb {
  position: relative;
  width: 100%;
  aspect-ratio: 13 / 9;
  border-radius: 1rem 1rem 0 0;
  overflow: hidden;
  background: #263453;
}
.sub-video-card-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sub-video-card-play {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 3rem;
  height: 3rem;
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  transform: translate(-50%, -50%);
  background: url("../_img/sub/ico_play.png") no-repeat center / cover;
}
.sub-video-card-info {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: flex-start;
  width: 100%;
  padding: 2.5rem;
}
.sub-video-card-info .sub-video-card-platform {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
  color: #f7f8fa;
}
.sub-video-card-info .sub-video-card-title {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  color: #fff;
}
.sub-video-card-info .sub-video-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.5;
  color: #999;
}
.sub-track-note {
  padding-top: 2.5rem;
  /* border-top: 1px solid #666; */
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.5;
  color: #999;
  text-align: center;
  margin-bottom: 0;
  display: flex;
  align-items: center;
}

.sub-track-note::before,
.sub-track-note::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #ccc;
}

.sub-track-note span {
  padding: 0 12px; /* 선과 텍스트 사이 공백 */
}

/* partner logo grid — 575↓ 3열 / 576~1200 5열 / 1201↑ 9·7·9 */
.sub-partner-logo-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 1.5rem;
  row-gap: 1rem;
  justify-content: center;
  list-style: none;
}
.sub-partner-logo-grid li {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 5rem;
  padding: 1rem 0;
  list-style: none;
}
.sub-partner-logo-grid img {
  display: block;
  width: 100%;
  max-width: 8rem;
  height: 3rem;
  object-fit: contain;
}

/* CI/BI — 2열 아이덴티티 + 다운로드 */
.sub-ci-bi-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 5rem;
}
.sub-ci-bi-col {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  min-width: 0;
}
.sub-ci-bi-card {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 17.5rem;
  padding: 5rem 3.75rem;
}
.sub-ci-bi-card img {
  display: block;
  width: 12.5rem;
  height: 5rem;
  object-fit: contain;
}
.sub-ci-bi-btn-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2.5rem;
}

/* board card — 뉴스·일정 게시판 리스트 */
.sub-board-list {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
.sub-board-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2.5rem;
  border-radius: 28px;
  padding: 2.5rem 5rem;
}
.sub-board-card-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  max-width: 62.5rem;
}
.sub-board-card-badge {
  position: relative;
  z-index: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  align-self: flex-start;
  padding: 0.75rem 1.25rem;
  border: 1px solid transparent;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.05);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
  color: var(--color-primary);
}
.sub-board-card-badge::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 20px;
  padding: 2px;
  background: linear-gradient(to right, var(--color-primary), var(--color-second));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  pointer-events: none;
}
.sub-board-card-badge::before {
  content: "";
  position: relative;
  z-index: 1;
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--color-primary);
}
.sub-board-card-title {
  font-size: clamp(20px, 2vw, 28px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0;
}
.sub-board-card-title a {
  color: inherit;
  text-decoration: none;
}
.sub-board-card-title a:hover {
  color: var(--color-primary);
}
.sub-board-card-info {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.sub-board-card-desc {
  display: block;
  font-size: clamp(16px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #999;
  margin-bottom: 0;
  text-decoration: none;
}
.sub-board-card-desc:hover {
  color: #bbb;
}
.sub-board-card--news .sub-board-card-desc {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.sub-board-card-side {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 15rem;
  min-height: 11.25rem;
  padding: 1.25rem;
  border-radius: 20px;
  background: linear-gradient(to bottom, rgba(254, 58, 139, 0.8), rgba(106, 54, 201, 0.8));
  color: #f7f8fa;
  text-align: center;
}
.sub-board-card-side--lg {
  gap: 1.25rem;
  width: 17.5rem;
  min-height: 15rem;
}
.sub-board-card--blue .sub-board-card-badge {
  color: #1f76c2;
}
.sub-board-card--blue .sub-board-card-badge::before {
  background: #1f76c2;
}
.sub-board-card--blue .sub-board-card-badge::after {
  background: linear-gradient(to right, #1f76c2, var(--color-second));
}
.sub-board-card--blue .sub-board-card-side {
  background: linear-gradient(to bottom, rgba(31, 118, 194, 0.8), rgba(106, 54, 201, 0.8));
}
.sub-board-card--event .sub-board-card-desc {
  display: block;
  overflow: visible;
  -webkit-line-clamp: unset;
}
.sub-board-card-meta {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.sub-board-card-meta li {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: clamp(16px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #f7f8fa;
}
.sub-board-card-meta .ico-svg {
  margin-top: 0.125rem;
}
.sub-board-card-date {
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1.2;
}
.sub-board-card-date-day {
  font-size: clamp(36px, 4vw, 48px);
  font-weight: 700;
}
.sub-board-card-date-ym {
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 400;
}
.sub-board-card-date-month {
  font-size: clamp(36px, 4vw, 48px);
  font-weight: 700;
  color: #f7f8fa;
}
.sub-board-card-date-year {
  font-size: clamp(22px, 2.5vw, 28px);
  font-weight: 400;
  color: #f7f8fa;
}
.sub-board-card-date--year-only {
  font-size: clamp(36px, 4vw, 48px);
  font-weight: 700;
  line-height: 1.2;
}
.sub-board-card-side-divider {
  display: block;
  width: calc(100% - 1.5rem);
  height: 1px;
  background: rgba(255, 255, 255, 0.4);
}
.sub-board-card-side-loc {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-size: clamp(16px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #fff;
  margin-bottom: 0;
  text-align: center;
}
.sub-board-card-side-loc .ico-svg {
  flex-shrink: 0;
}

/* board card — compact (예정된 라이브) */
.sub-board-card--compact {
  padding: 2.5rem 2.5rem 2.5rem 3.75rem;
}
.sub-board-card--compact .sub-board-card-body {
  max-width: 22.5rem;
  gap: 2rem;
}
.sub-board-card-side--sm {
  gap: 1.25rem;
  width: 11.25rem;
  min-height: 15rem;
}
.sub-board-card-date--dday {
  font-size: clamp(36px, 4vw, 48px);
  font-weight: 700;
  line-height: 1.2;
  color: #f7f8fa;
}

/* board swiper — 일정형 슬라이더 */
.sub-board-swiper-wrap {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1.75rem;
  width: 100%;
  max-width: 100%;
}
.sub-board-swiper {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}
.sub-board-swiper .swiper-slide {
  height: auto;
}
.sub-board-swiper .sub-board-card {
  position: relative;
  z-index: 1;
  width: 100%;
}
.sub-board-swiper--peek .swiper-slide {
  width: 100%;
  box-sizing: border-box;
}
.sub-board-swiper--pair {
  overflow: hidden;
}
.sub-board-swiper-pagination {
  align-self: center;
  position: static;
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  width: auto;
}
.sub-board-swiper-pagination .swiper-pagination-bullet {
  width: 0.5rem;
  height: 0.5rem;
  margin: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  opacity: 1;
  transition: width 0.25s ease, background 0.25s ease;
}
.sub-board-swiper-pagination .swiper-pagination-bullet-active {
  /* width: 2rem;
  border-radius: 0.25rem; */
  background: var(--color-primary);
}

/* show hero — 공연·라이브 sec01 */
.sub-show-hero {
  max-width: 51.6875rem;
}
.sub-show-hero-title {
  font-size: clamp(28px, 4vw, 52px);
  font-weight: 800;
  line-height: 1.2;
  color: #f7f8fa;
  margin-bottom: 2.5rem;
}
.sub-show-hero-accent {
  color: var(--color-primary);
}
.sub-show-hero-desc {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 400;
  line-height: 1.4;
  color: #fff;
  margin-bottom: 0;
}

/* schedule card — 공연 일정 그리드 */
.sub-schedule-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2.5rem;
}
.sub-schedule-item {
  min-width: 0;
}
.sub-schedule-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: 20px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: background 0.25s ease, border-color 0.25s ease;
}
.sub-schedule-list:not(.not-link) .sub-schedule-card:hover {
  background: linear-gradient(135deg, var(--color-primary), var(--color-second));
  border: 1px solid #ccc;
}
.sub-schedule-list:not(.not-link) .sub-schedule-card:hover .sub-schedule-card-meta li {
  color: #fff;
}
.sub-schedule-list:not(.not-link) .sub-schedule-card:hover .sub-schedule-card-status {
  border-color: #fff;
  color: #fff;
}
.sub-schedule-list:not(.not-link) .sub-schedule-card:hover .ico-svg {
  filter: brightness(0) invert(1);
}
.sub-schedule-list:not(.not-link) .sub-schedule-card.sub-glass-card:hover::before {
  opacity: 0;
}
.sub-schedule-list.not-link a {
  pointer-events: none;
}
.sub-schedule-list.not-link .sub-schedule-card-arrow {
  display: none;
}
.sub-schedule-card-thumb {
  position: relative;
  flex-shrink: 0;
  height: 15rem;
  overflow: hidden;
}
.sub-schedule-card-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.2);
  pointer-events: none;
}
.sub-schedule-card-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sub-schedule-card-body {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  flex: 1;
  padding: 2.5rem;
}
.sub-schedule-card-text {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.sub-schedule-card-cate {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.3;
  color: #f7f8fa;
}
.sub-schedule-card-title {
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0;
}
.sub-schedule-card-meta {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.sub-schedule-card-meta li {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: clamp(16px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #999;
}
.sub-schedule-card-meta .ico-svg {
  margin-top: 0.125rem;
}
.sub-schedule-card-divider {
  display: block;
  width: 100%;
  height: 1px;
  background: rgba(255, 255, 255, 0.4);
}
.sub-schedule-card-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: auto;
}
.sub-schedule-card-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  border: 2px solid;
  border-radius: 20px;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
}
.sub-schedule-item--done .sub-schedule-card-status {
  border-color: #999;
  color: #999;
}
.sub-schedule-item--plan .sub-schedule-card-status {
  border-color: var(--color-second);
  color: var(--color-second);
}
.sub-schedule-item--upcoming .sub-schedule-card-status {
  border-color: var(--color-primary);
  color: var(--color-primary);
}
.sub-schedule-card-arrow {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
}

/* history — 검증된 실행 이력 */
.sub-history-list {
  display: flex;
  gap: 7.5rem;
}
.sub-history-item {
  flex: 1;
  min-width: 0;
  padding-left: 2.5rem;
  border-left: 2px solid #999;
}
.sub-history-meta {
  display: block;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.3;
  color: #999;
  margin-bottom: 0.5rem;
}
.sub-history-title {
  font-size: clamp(18px, 2vw, 20px);
  font-weight: 700;
  line-height: 1.5;
  color: #fff;
  margin-bottom: 0.5rem;
}
.sub-history-desc {
  font-size: clamp(16px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #999;
  margin-bottom: 0;
}

/* live stage — 영상 + 채팅 (1080×720 비율, 채팅 높이 = 영상 높이) */
.sub-live-stage {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.sub-live-stage::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 20px;
  padding: 1px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.03) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0.1) 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  pointer-events: none;
  z-index: 3;
}
.sub-live-player {
  position: relative;
  margin-right: 32.5rem;
  min-width: 0;
}
.sub-live-player-media {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: calc(720 / 1080 * 100%); /* 1080×720 (3:2) */
  background: #000;
}
.sub-live-player-media img,
.sub-live-player-media video,
.sub-live-player-media iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  border: 0;
  display: block;
}
.sub-live-player-info {
  position: absolute;
  top: 2.5rem;
  left: 2.5rem;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.sub-live-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  background: var(--color-primary);
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 700;
  line-height: 1;
  color: #fff;
}
.sub-live-viewers {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 500;
  line-height: 1;
  color: #fff;
  margin-bottom: 0;
}
.ico-svg-live-eye {
  width: 2rem;
  height: 2rem;
  background-image: url('../_img/sub/ico-svg-live-eye.svg');
}
.ico-svg-live-count {
  width: 1.09375rem;
  height: 1.09375rem;
  background-image: url('../_img/sub/ico-svg-live-count.svg');
}
.ico-svg-live-send {
  width: 2.5rem;
  height: 2.5rem;
  background-image: url('../_img/sub/ico-svg-live-send.svg');
}
.sub-live-chat {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: 32.5rem;
  height: 100%;
  min-height: 0;
  padding: 2.5rem;
  overflow: hidden;
}
.sub-live-chat-head {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0;
}
.sub-live-chat-title {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.4;
  color: #fff;
  margin-bottom: 0;
}
.sub-live-chat-count {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  border: 1px solid #999;
  border-radius: 1.25rem;
  font-size: clamp(16px, 1.5vw, 18px);
  font-weight: 500;
  line-height: 1.4;
  color: #fff;
  margin-bottom: 0;
}
.sub-live-chat-list {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  flex: 1;
  min-height: 0;
  margin: 2.5rem 0;
  padding-right: 10px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.3) transparent;
}
.sub-live-chat-list::-webkit-scrollbar {
  width: 4px;
}
.sub-live-chat-list::-webkit-scrollbar-track {
  background: transparent;
}
.sub-live-chat-list::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.3);
  border-radius: 999px;
}
.sub-live-chat-list::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.5);
}
.sub-live-chat-msg {
  display: flex;
  gap: 1rem;
}
.sub-live-chat-profile {
  flex-shrink: 0;
  width: 3.75rem;
  height: 3.75rem;
  border-radius: 50%;
  overflow: hidden;
  /* background-color: #fff; */
}
.sub-live-chat-profile img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sub-live-chat-body {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
}
.sub-live-chat-user {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}
.sub-live-chat-txt {
  font-size: clamp(16px, 1.5vw, 18px);
  font-weight: 400;
  line-height: 1.4;
  color: #fff;
  margin-bottom: 0;
}
.sub-live-chat-form {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: auto;
  padding: 1.25rem 2.5rem;
  border-radius: 3.125rem;
}
.sub-live-chat-form::before {
  border-radius: 3.125rem;
}
.sub-live-chat-input {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 700;
  line-height: 1;
  color: #fff;
}
.sub-live-chat-input::placeholder {
  color: #fff;
}
.sub-live-chat-send {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

/* SUB COMMON — RESPONSIVE */

/* ========================
   COVI 소개
   ======================== */
.sub-introduction-section.sub-section01 {
  position: relative;
}
.sub-introduction-section.sub-section01 .visual-wrap {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;
}
.sub-introduction-section.sub-section01 .visual-bg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.sub-introduction-section.sub-section01 .inner-lg {
  position: relative;
  z-index: 1;
  width: 100%;
  padding-top: 16.25rem;
  padding-bottom: 7.125rem;
}
.sub-introduction-section.sub-section01 .hero-wrap {
  margin-left: auto;
  max-width: 52rem;
}
.sub-introduction-section.sub-section01 .hero-title {
  font-size: clamp(28px, 4vw, 52px);
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 2.5rem;
}
.sub-introduction-section.sub-section01 .hero-title .point-num {
  font-size: clamp(36px, 5vw, 72px);
  font-weight: 800;
  color: var(--color-primary);
}
.sub-introduction-section.sub-section01 .hero-title .point-unit {
  font-size: clamp(28px, 3.5vw, 52px);
  font-weight: 800;
  color: var(--color-primary);
}
.sub-introduction-section.sub-section01 .hero-desc p {
  font-size: clamp(14px, 1.5vw, 20px);
  line-height: 1.4;
  margin-bottom: 1rem;
}
.sub-introduction-section.sub-section01 .hero-desc strong {
  font-size: clamp(16px, 1.8vw, 24px);
  font-weight: 700;
}

/* --- sec02 : 우리가 믿는 가치 --- */
.sub-introduction-section.sub-section02 {
  max-width: 120rem;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 3.75rem;
  padding-bottom: 7.5rem;
  overflow-x: clip;
}
.sub-introduction-section.sub-section02 .inner-lg {
  overflow: visible;
}
.sub-introduction-section.sub-section02 .value-wrap {
  display: flex;
  align-items: flex-start;
}
.sub-introduction-section.sub-section02 .value-content {
  flex: 1;
  flex-shrink: 0;
  min-width: 0;
  padding-right: clamp(20px, 4.167vw, 5rem);
}
.sub-introduction-section.sub-section02 .title-wrap {
  margin-bottom: 3.75rem;
}
.sub-introduction-section.sub-section02 .title-wrap h3 {
  font-size: clamp(25px, 3.5vw, 40px);
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 1.25rem;
}
.sub-introduction-section.sub-section02 .text-gradient {
  background: linear-gradient(to right, var(--color-second), var(--color-primary));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.sub-introduction-section.sub-section02 .sub-desc {
  font-size: clamp(14px, 1.5vw, 20px);
  line-height: 1.5;
  color: #fff;
}
.sub-introduction-section.sub-section02 .value-card-list {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  margin-bottom: 2.5rem;
}
.sub-introduction-section.sub-section02 .value-card-list li {
  width: calc(25% - 0.9375rem);
  min-width: 8.75rem;
}
.sub-introduction-section.sub-section02 .card-inner {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  height: 15rem;
  padding: 1.5rem;
  border-radius: 20px;
  background: linear-gradient(to bottom, rgba(247, 248, 250, 0.04), rgba(31, 118, 194, 0.04));
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border: 1px solid transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.sub-introduction-section.sub-section02 .card-inner::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 20px;
  padding: 1px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.03) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0.1) 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  pointer-events: none;
}
.sub-introduction-section.sub-section02 .icon-wrap {
  width: 5rem;
  height: 5rem;
}
.sub-introduction-section.sub-section02 .icon-wrap img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sub-introduction-section.sub-section02 .card-txt {
  font-size: clamp(14px, 1.2vw, 20px);
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}
.sub-introduction-section.sub-section02 .value-desc p {
  font-size: clamp(13px, 1.2vw, 18px);
  line-height: 1.5;
  color: #fff;
}
.sub-introduction-section.sub-section02 .value-img {
  flex-shrink: 0;
  width: 61.75rem;
  max-width: 63%;
  margin-right: calc(50% - min(50vw, 60rem));
}
.sub-introduction-section.sub-section02 .value-img img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: left bottom;
  opacity: 0.8;
}

/* --- sec03 : COVI 생태계 구조 --- */
.sub-introduction-section.sub-section03 {
  padding-top: 0;
  padding-bottom: 0;
}
.sub-introduction-section.sub-section03 .sec-title {
  font-size: clamp(25px, 3.5vw, 40px);
  font-weight: 700;
  line-height: 1.3;
  color: #f7f8fa;
  margin-bottom: 5rem;
}
.sub-introduction-section.sub-section03 .ecosystem-img img {
  display: block;
  width: auto;
  max-width: 100%;
  margin: 0 auto;
  height: auto;
}

/* --- sec04 : quote banner --- */
.sub-introduction-section.sub-section04 > .inner-lg {
  position: relative;
  z-index: 1;
  padding-top: 7.5rem;
  padding-bottom: 7.5rem;
}
.sub-introduction-section.sub-section04 .cont-box {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  border-radius: 2.5rem;
  min-height: 25rem;
  background: linear-gradient(rgba(106, 54, 201, 0.24) 0%, rgba(106, 54, 201, 0.4) 100%), rgba(0, 0, 0, 0.6);
}
.sub-introduction-section.sub-section04 .cont-box::before,
.sub-introduction-section.sub-section04 .cont-box::after {
  content: "";
  position: absolute;
  bottom: 0;
  z-index: 0;
  width: 18.75rem;
  height: 22.625rem;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center bottom;
  pointer-events: none;
}
.sub-introduction-section.sub-section04 .cont-box::before {
  left: 0;
  background-image: url("../_img/sub/bg-introduction-sec04-01.png");
}
.sub-introduction-section.sub-section04 .cont-box::after {
  right: 0;
  background-image: url("../_img/sub/bg-introduction-sec04-02.png");
}
/* ========================
   COVI 소개 — RESPONSIVE
   ======================== */

/* ========================
   비전 및 핵심가치
   ======================== */

/* --- sec01 : slogan --- */
.sub-vision-section.sub-section01 .inner-lg {
  padding-top: 16.25rem;
  padding-bottom: 7.5rem;
}

/* --- sec02 : 비전 --- */
.sub-vision-section.sub-section02 {
  padding-top: 0;
  padding-bottom: 0;
}
.sub-vision-section.sub-section02 .vision-wrap {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
.sub-vision-section.sub-section02 .sec-title {
  font-size: clamp(25px, 3.5vw, 40px);
  font-weight: 700;
  line-height: 1.3;
  color: #f7f8fa;
}
.sub-vision-section.sub-section02 .vision-desc p {
  font-size: clamp(14px, 1.5vw, 20px);
  line-height: 1.4;
  margin-bottom: 0;
}
.sub-vision-section.sub-section02 .vision-desc p + p {
  margin-top: 0;
}
.sub-vision-section.sub-section02 .vision-desc strong {
  font-size: clamp(16px, 1.8vw, 24px);
  font-weight: 700;
}

/* --- sec03 : 3대 핵심 가치 --- */
.sub-vision-section.sub-section03 {
  position: relative;
  padding-top: 7.5rem;
  padding-bottom: 7.5rem;
  overflow: hidden;
}
.sub-vision-section.sub-section03::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url('../_img/sub/bg-vision-sec03-01.png') no-repeat center bottom / cover;
  opacity: 0.4;
  pointer-events: none;
}
.sub-vision-section.sub-section03 .inner-lg {
  position: relative;
  z-index: 1;
}
.sub-vision-section.sub-section03 .sec-title {
  font-size: clamp(25px, 3.5vw, 40px);
  font-weight: 700;
  line-height: 1.3;
  color: #f7f8fa;
  margin-bottom: 2.5rem;
}
.sub-vision-section.sub-section03 .value-card-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.5rem;
}
.sub-vision-section.sub-section03 .card-inner {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  height: 100%;
  padding: 5rem 3.75rem;
  border-radius: 20px;
  background: linear-gradient(to bottom, rgba(247, 248, 250, 0.04), rgba(31, 118, 194, 0.04));
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border: 1px solid transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.sub-vision-section.sub-section03 .card-inner::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 20px;
  padding: 1px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.03) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0.1) 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  pointer-events: none;
}
.sub-vision-section.sub-section03 .card-head {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  padding: 0 1.25rem;
}
.sub-vision-section.sub-section03 .icon-wrap {
  width: 5rem;
  height: 5rem;
}
.sub-vision-section.sub-section03 .icon-wrap img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sub-vision-section.sub-section03 .card-title {
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}
.sub-vision-section.sub-section03 .card-desc {
  font-size: clamp(14px, 1.5vw, 20px);
  font-weight: 500;
  line-height: 1.5;
  color: #f7f8fa;
  padding-left: 1.25rem;
  list-style: disc;
}
.sub-vision-section.sub-section03 .card-desc li + li {
  margin-top: 0;
}

/* ========================
   비전 및 핵심가치 — RESPONSIVE
   ======================== */

/* ========================
   보드멤버 (padding only)
   ======================== */

.sub-board-section.sub-section01 .inner-lg {
  padding-top: 16.25rem;
  padding-bottom: 7.5rem;
}
.sub-board-section.sub-section02 {
  padding-top: 0;
  padding-bottom: 7.5rem;
}
.sub-board-section.sub-section03 {
  padding-top: 0;
  padding-bottom: 7.5rem;
}

/* ========================
   협력사 (padding only)
   ======================== */

.sub-partners-section.sub-section01 .inner-lg {
  padding-top: 16.25rem;
  padding-bottom: 7.5rem;
}
.sub-partners-section.sub-section02 {
  padding-top: 0;
  padding-bottom: 7.5rem;
}

/* ========================
   CI/BI (padding only)
   ======================== */

.sub-ci-bi-section.sub-section01 .inner-lg {
  padding-top: 16.25rem;
  padding-bottom: 7.5rem;
}
.sub-ci-bi-section.sub-section02 {
  padding-top: 0;
  padding-bottom: 0;
}
.sub-ci-bi-section.sub-section03 {
  padding-top: 5rem;
  padding-bottom: 7.5rem;
}

/* ========================
   SERVICE — product pages (공통 컴포넌트)
   ======================== */

.sub-service-wrap {
  overflow-x: clip;
}

.sub-service-wrap .text-gradient {
  background: linear-gradient(to right, var(--color-second), var(--color-primary));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* hero */
.sub-service-hero {
  position: relative;
  display: flex;
  align-items: flex-start;
  width: 100%;
}
.sub-service-hero-body {
  flex-shrink: 0;
  min-width: 0;
  position: relative;
  z-index: 2;
}
.sub-service-hero-title {
  font-size: clamp(32px, 4vw, 52px);
  font-weight: 800;
  line-height: 1.2;
  color: #f7f8fa;
  margin-bottom: 2.5rem;
}
.sub-service-hero-desc {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 400;
  line-height: 1.4;
  color: #fff;
  margin-bottom: 2.5rem;
}
.sub-service-hero-body .sub-hero-quote {
  margin-bottom: 2.5rem;
}
.sub-service-hero-media {
  flex-shrink: 0;
}
.sub-service-hero-media img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* hero — sec01 페이지별 (Figma 1920px → vw, desktop absolute) */
.sub-service-section.sub-section01 .sub-hero-inner,
.sub-starpic-section.sub-section01 .sub-hero-inner,
.sub-punkvism-section.sub-section01 .sub-hero-inner,
.sub-podoal-section.sub-section01 .sub-hero-inner,
.sub-my1pick-section.sub-section01 .sub-hero-inner {
  justify-content: flex-start;
}

.sub-service-section.sub-section01,
.sub-starpic-section.sub-section01,
.sub-punkvism-section.sub-section01,
.sub-podoal-section.sub-section01,
.sub-my1pick-section.sub-section01 {
  overflow: visible;
}

.sub-service-section.sub-section01,
.sub-starpic-section.sub-section01,
.sub-punkvism-section.sub-section01,
.sub-podoal-section.sub-section01,
.sub-my1pick-section.sub-section01{
  position: relative;
  z-index: 2;
}
.sub-service-section.sub-section02,
.sub-starpic-section.sub-section02,
.sub-punkvism-section.sub-section02,
.sub-podoal-section.sub-section02,
.sub-my1pick-section.sub-section02{
  position: relative;
  z-index: 1;
}

/* kpi bar */

.sub-service-kpi,
.sub-dividend-kpi {
  background: linear-gradient(to bottom, rgba(254, 58, 139, 0.1), rgba(152, 35, 83, 0.1));
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  padding: 2.5rem 0;
  position: relative;
  z-index: 1;
}

.sub-service-kpi-list,
.sub-dividend-kpi-list {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.5rem;
  list-style: none;
}
.sub-service-kpi-item,
.sub-dividend-kpi-item {
  flex: 0 1 15.625rem;
  text-align: center;
  color: #f7f8fa;
}
.sub-service-kpi-item + .sub-service-kpi-item,
.sub-dividend-kpi-item + .sub-dividend-kpi-item {
  border-left: 1px solid rgba(255, 255, 255, 0.4);
  padding-left: 2.5rem;
}
.sub-service-kpi-value,
.sub-dividend-kpi-value {
  display: block;
  font-size: clamp(32px, 4vw, 40px);
  font-weight: 700;
  line-height: 1.8;
  color: var(--color-primary);
}
.sub-service-kpi-label,
.sub-dividend-kpi-label {
  display: block;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.8;
}
.sub-dividend-kpi-item > .sub-dividend-kpi-label:last-of-type {
  color: #999;
}

/* evolution — AS-IS / TO-BE */
.sub-service-evolution {
  position: relative;
  overflow: hidden;
}
.sub-service-evolution-bg {
  position: absolute;
  left: 0;
  top: 5%;
  z-index: 0;
  pointer-events: none;
}
.sub-service-evolution .inner-lg {
  position: relative;
  z-index: 1;
}
.sub-service-compare {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sub-service-compare-arrow {
  z-index: 2;
  width: 7rem;
  pointer-events: none;
}
.sub-service-compare-arrow img {
  display: block;
  width: 100%;
  height: auto;
}
.sub-service-compare-card {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  flex: 0 1 50%;
  max-width: 37.8rem;
  padding: 2rem 4.5rem;
  border-radius: 20px;
}
.sub-service-compare-card--tobe {
  gap: 3.75rem;
  max-width: 45.3rem;
  padding: 3.6rem 7.2rem;
}
.sub-service-compare-head {
  padding-bottom: 1.25rem;
  border-bottom: 1px solid #999;
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}
.sub-service-compare-card--tobe .sub-service-compare-head {
  color: var(--color-primary);
}
.sub-service-compare-list {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  list-style: none;
}
.sub-service-compare-card--tobe .sub-service-compare-list {
  gap: 3.75rem;
}
.sub-service-compare-item {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}
.sub-service-compare-icon {
  flex-shrink: 0;
  width: 5rem;
  height: 5rem;
  object-fit: contain;
}
.sub-service-compare-card--tobe .sub-service-compare-icon {
  width: 5.75rem;
  height: 5.75rem;
}
.sub-service-compare-body strong {
  display: block;
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0.25rem;
}
.sub-service-compare-body p {
  font-size: clamp(16px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #999;
  margin-bottom: 0;
}

/* audience role cards */
.sub-service-audience-list {
  display: flex;
  flex-wrap: wrap;
  gap: 5rem;
  list-style: none;
}
.sub-service-audience-list > li {
  flex: 1;
}
.sub-service-audience-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  flex: 1 1 18rem;
  min-width: min(100%, 30rem);
  min-height: 43.75rem;
  padding: 3.75rem 5rem;
  border-radius: 20px;
  overflow: hidden;
}
.sub-service-audience-card--fan {
  border-color: var(--color-primary);
}
.sub-service-audience-card--creator {
  border-color: var(--color-second);
}
.sub-service-audience-card--investor {
  border-color: #1f76c2;
}
.sub-service-audience-card-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: bottom;
  opacity: 0.8;
  pointer-events: none;
}
.sub-service-audience-card > *:not(.sub-service-audience-card-bg) {
  position: relative;
  z-index: 1;
}
.sub-service-audience-icon {
  width: 5rem;
  height: 5rem;
  object-fit: contain;
}
.sub-service-audience-head {
  padding-bottom: 1.25rem;
  border-bottom-width: 1px;
  border-bottom-style: solid;
}
.sub-service-audience-card--fan .sub-service-audience-head {
  border-bottom-color: var(--color-primary);
}
.sub-service-audience-card--creator .sub-service-audience-head {
  border-bottom-color: var(--color-second);
}
.sub-service-audience-card--investor .sub-service-audience-head {
  border-bottom-color: #1f76c2;
}
.sub-service-audience-role {
  display: block;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.3;
  color: #f7f8fa;
  margin-bottom: 0.625rem;
}
.sub-service-audience-title {
  font-size: clamp(16px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0;
}
.sub-service-audience-desc {
  font-size: clamp(16px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 2;
  color: #f7f8fa;
  padding-left: 1.25rem;
  list-style: disc;
}

/* roadmap phases */
.sub-service-roadmap-list {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
}
.sub-service-roadmap-item {
  flex: 1 1 12rem;
  min-width: min(100%, 10rem);
  padding: 2.5rem 1.25rem 0 0;
  border-top: 2px solid #999;
}
.sub-service-roadmap-item--pink {
  border-top-color: var(--color-primary);
}
.sub-service-roadmap-item--pink .sub-service-roadmap-phase {
  color: var(--color-primary);
}
.sub-service-roadmap-item--violet {
  border-top-color: var(--color-second);
}
.sub-service-roadmap-item--violet .sub-service-roadmap-phase {
  color: var(--color-second);
}
.sub-service-roadmap-dot {
  display: block;
  width: 0.875rem;
  height: 0.875rem;
  border-radius: 50%;
  background: #999;
  margin-bottom: 1.25rem;
}
.sub-service-roadmap-item--pink .sub-service-roadmap-dot {
  background: var(--color-primary);
}
.sub-service-roadmap-item--violet .sub-service-roadmap-dot {
  background: var(--color-second);
}
.sub-service-roadmap-label {
  display: block;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.3;
  color: #999;
  margin-bottom: 0.5rem;
}
.sub-service-roadmap-phase {
  display: block;
  font-size: clamp(16px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0.5rem;
}
.sub-service-roadmap-desc {
  font-size: clamp(16px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 2;
  color: #f7f8fa;
  padding-left: 2rem;
  list-style: disc;
}

/* ========================
   뉴스 및 미디어 (padding only)
   ======================== */

.sub-news-section.sub-section01 .inner-lg {
  padding-top: 16.25rem;
  padding-bottom: 7.5rem;
}
.sub-news-section.sub-section02 {
  padding-top: 0;
  padding-bottom: 7.5rem;
}

/* ========================
   진행중인 공연 (padding only)
   Desktop: sec01 160/120 · sec02 120/120 · sec03 0/0 · sec04 120/120
   sec01 .inner-lg padding-top = 160px + header 높이
   ======================== */

.sub-ongoing-section.sub-section01 .inner-lg {
  padding-top: 16.25rem; /* 160px + header 100px */
  padding-bottom: 7.5rem; /* 120px */
}
.sub-ongoing-section.sub-section02 {
  padding-top: 7.5rem; /* 120px */
  padding-bottom: 7.5rem;
}
.sub-ongoing-section.sub-section03 {
  padding-top: 7.5rem;
  padding-bottom: 0;
}
.sub-ongoing-section.sub-section02 + .sub-ongoing-section.sub-section03 {
  padding-top: 0;
}
.sub-ongoing-section.sub-section04 {
  padding-top: 7.5rem;
  padding-bottom: 7.5rem;
}

/* ========================
   온라인 생중계 (padding only)
   Desktop: sec01 160/120 · sec02 120/120 · sec03 0/120
   sec01 .inner-lg padding-top = 160px + header 높이
   ======================== */

.sub-live-section.sub-section01 .inner-lg {
  padding-top: 16.25rem; /* 160px + header 100px */
  padding-bottom: 7.5rem; /* 120px */
}
.sub-live-section.sub-section02 {
  padding-top: 7.5rem; /* 120px */
  padding-bottom: 7.5rem;
}
.sub-live-section.sub-section03 {
  padding-top: 0;
  padding-bottom: 7.5rem; /* 120px */
}

/* ========================
   서비스 (padding only)
   Desktop: sec01 160/120 · sec02 0/0 · sec03 120/120 · sec04 0/0 · sec05 120/120
   sec01 .inner-lg padding-top = 160px + header 높이
   ======================== */

.sub-service-section.sub-section01 .inner-lg,
.sub-starpic-section.sub-section01 .inner-lg,
.sub-punkvism-section.sub-section01 .inner-lg,
.sub-podoal-section.sub-section01 .inner-lg,
.sub-my1pick-section.sub-section01 .inner-lg {
  padding-top: 16.25rem; /* 160px + header 100px */
  padding-bottom: 7.5rem; /* 120px */
}
.sub-service-section.sub-section03,
.sub-starpic-section.sub-section03,
.sub-punkvism-section.sub-section03,
.sub-podoal-section.sub-section03,
.sub-my1pick-section.sub-section03 {
  padding-top: 7.5rem;
  padding-bottom: 7.5rem;
}
.sub-service-section.sub-section04,
.sub-starpic-section.sub-section04,
.sub-punkvism-section.sub-section04,
.sub-podoal-section.sub-section04,
.sub-my1pick-section.sub-section04 {
  padding-top: 0;
  padding-bottom: 0;
}
.sub-service-section.sub-section05,
.sub-starpic-section.sub-section05,
.sub-punkvism-section.sub-section05,
.sub-podoal-section.sub-section05,
.sub-my1pick-section.sub-section05 {
  padding-top: 7.5rem;
  padding-bottom: 10rem;
}

/* 온라인 생중계 - 리뉴얼 */
.label-title-box {
  display: flex;
}
.label-title {
  display: flex;
  gap: 0.5rem;
  padding: 0.375rem 1rem;
  border: 0.125rem solid #FF3B8C;
  border-radius: 1.5rem;
  max-width: 100%;
}
.ico-label-title {
  display: block;
  width: 2rem;
  height: 2rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
}
.ico-label-title-check {
  background-image: url('../_img/sub/ico_deco_check.png');
}
.ico-label-title-wave-circle {
  background-image: url('../_img/sub/ico_deco_wave_circle.png');
}
.label-title-text {
  display: block;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.4;
  color: #FF3B8C;
  padding: 0.1875rem 0;
}

.live-conts-wrap {
  display: flex;
  align-items: center;
  gap: 0 6.25rem;
}
.live-conts-wrap.reverse {
  flex-direction: row-reverse;
}
.live-conts-wrap figure {
  display: block;
  margin: 0;
  padding: 0;
  font-size: 0;
  text-align: center;
  flex-shrink: 0;
  flex: auto;
}
.live-conts-wrap figure img {
  width: auto;
  max-width: 100%;
}
.live-conts-inner {
  flex: auto;
  min-width: 0;
}
.live-conts-txt {
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1.3;
  margin-top: 2.5rem;
}
.live-conts-desc {
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.4;
  margin-top: 2.5rem;
}
.live-conts-grid {
  display: flex;
  margin: 0 -2.5rem;
}
.live-conts-grid-item {
  position: relative;
  flex: 1;
  padding: 0 2.5rem;
  margin-top: 2.5rem;
}
.live-conts-grid-item + .live-conts-grid-item::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  width: 1px;
  height: 6.25rem;
  margin-top: -3.125rem;
  background: rgba(255, 255, 255, 0.4);
}
.live-conts-grid-item .inbox {
  max-width: 18.125rem;
  margin: 0 auto;
}
.live-conts-grid-item:first-child .inbox {
  margin: 0;
}
.live-conts-grid-item:last-child .inbox {
  margin-right: 0;
}
.live-conts-grid-item img {
  display: block;
  width: 2.5rem;
}
.live-conts-grid-item h6 {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.5;
  color: #FF3B8C;
  margin-top: 1.25rem;
}
.live-conts-grid-item p {
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.5;
  color: #999;
}
.sub-live-section.sub-section04 {
  padding-bottom: 7.5rem;
}
.horizontal-msg {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 0 5rem;
}
.horizontal-msg::before,
.horizontal-msg::after {
  content: '';
  display: block;
  height: 1px;
  flex: auto;
  background-color: rgba(153,153,153,.4);
}
.horizontal-msg p {
  flex-shrink: 0;
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.5;
  color: #999;
  padding: 0 20px;
  max-width: calc(100% - 40px);
}

@media (min-width: 992px) and (max-width: 1200px) {
  .live-conts-grid {
    flex-wrap: wrap;
  }
  .live-conts-grid-item {
    flex: 0 0 50%;
  }
  .live-conts-grid-item .inbox,
  .live-conts-grid-item:first-child .inbox,
  .live-conts-grid-item:last-child .inbox {
    margin: 0;
  }
  .live-conts-grid-item:nth-child(odd)::before {
    display: none;
  }
}
@media (max-width: 991px) {
  .live-conts-wrap {
    display: block;
  }
  .live-conts-inner {
    margin-top: 2.5rem;
  }
  .horizontal-msg {
    gap: 0 2.5rem;
  }
}
@media (max-width: 767px) {
  .live-conts-txt {
    font-size: 20px;
    margin-top: 20px;
  }
  .live-conts-desc {
    font-size: 14px;
    margin-top: 20px;
  }
  .live-conts-grid {
    display: block;
  }
  .live-conts-grid-item .inbox,
  .live-conts-grid-item:first-child .inbox,
  .live-conts-grid-item:last-child .inbox {
    margin: 0;
    max-width: none;
  }
  .live-conts-grid-item::before {
    display: none;
  }

  .sub-live-section.sub-section04 {
    padding-bottom: 5rem;
  }

  .horizontal-msg {
    gap: 0;
  }
}

/* RWA 펀딩 */
.sub-rwa-wrap{
  background: url('../_img/sub/sub04-visual.png') no-repeat top center/100% auto;
}

.sub-rwa_funding-wrap.sub-section01 {
  /* background: url('../_img/sub/sub04-visual.png') no-repeat top center/100% auto; */
}

/* .sub-guide-wrap {  background: url('../_img/sub/sub04-visual.png') no-repeat top center/100% auto;} */

.sub-guide-section.sub-section01 {
  position: relative;
  z-index: 2;
  overflow: visible;
}

.sub-guide-section.sub-section02{
  position: relative;
  z-index: 1;
}

.sub-guide-section.sub-section01 .sub-hero-inner {
  justify-content: flex-start;
}

.sub-guide-hero {
  position: relative;
  display: flex;
  align-items: flex-start;
  width: 100%;
}
.sub-guide-hero-body {
  min-width: 0;
  position: relative;
  z-index: 2;
}
.sub-guide-hero-title {
  font-size: clamp(32px, 4vw, 52px);
  font-weight: 800;
  line-height: 1.2;
  color: #f7f8fa;
  margin-bottom: 2.5rem;
}
.sub-guide-hero-desc {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 400;
  line-height: 1.4;
  color: #fff;
  margin-bottom: 2.5rem;
}
.sub-guide-hero-desc .fs_large {
  font-size: 1.2em;
  font-weight: 500;
}

.sub-guide-kpi {
  background: transparent;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  padding: 2.5rem 0;
  position: relative;
  z-index: 1;
}

.sub-guide-kpi-list {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.5rem;
  list-style: none;
}

.sub-guide-kpi-item {
  flex: 0 1 15.625rem;
  text-align: center;
  color: #f7f8fa;
}
.sub-guide-kpi-item + .sub-guide-kpi-item {
  border-left: 1px solid rgba(255, 255, 255, 0.4);
  padding-left: 2.5rem;
}
.sub-guide-kpi-value {
  display: block;
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 700;
  line-height: 1.8;
  color: var(--color-primary);
}
.sub-guide-kpi-label {
  display: block;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.8;
}

.tokenprocess_detail{
  text-align: center;
}

.tokenprocess{
  display: flex;
  justify-content: center;
  text-align: center;
  padding: 0 2.5rem;
  border-radius: 28px;
  border: 1px solid transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  background: linear-gradient(to bottom, rgba(247, 248, 250, 0.04), rgba(31, 118, 194, 0.04));
}

.tokenprocess_item{
  position: relative;
  width: 23.75rem;
  padding: 3.75rem 0;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.tokenprocess_line{
  position: absolute;
  top: 95px; /* 원 위치에 맞춤 */
  height: 2px;
  background: rgba(255,255,255,0.2);
  z-index: 2;
  width: 100%;
}

.tokenprocess_item .icon_wrap{
  width: 5rem;
  height: 5rem;
  margin: 0 auto;
  z-index: 3;
}

.tokenprocess_item img{
  width: 100%;
  height: 100%;
  margin: 0 auto;
  border-radius: 50%;
  background-color: #000;
}

.tokenprocess_item span{
  display: block;
  font-size: 1rem;
  color: #999;
}

.tokenprocess_item strong{
  display: block;
  font-size: 1.5rem;
  color: #1F76C2;
  font-weight: bold;
  margin: 1.5rem 0;
}

.tokenprocess_item p{
  font-size: 1.1rem;
  line-height: 2;
  letter-spacing: 1.5;
}

.sub-guide-section.sub-section01 .sub-guide-hero-title {
    max-width: 18.923em; /* 984px ÷ 52px */
  }
  .sub-guide-section.sub-section01 .sub-guide-hero-desc {
    max-width: 41.35em; /* 827px ÷ 20px */
  }
  .sub-guide-section.sub-section01 .sub-hero-quote--lg p {
    max-width: 33.571em; /* 940px ÷ 28px */
  }
  .sub-guide-section.sub-section01 .sub-guide-hero-media {
    top: -6.25vw;
    width: 18.020833vw; /* 346 / 1920 */
  }

  .sub-guide-section.sub-section01 .sub-guide-hero-body{
    padding-top: 0;
  }
  .sub-guide-section.sub-section01 .sub-guide-hero-title,
  .sub-guide-section.sub-section01 .sub-guide-hero-desc,
  .sub-guide-section.sub-section01 .sub-hero-quote--lg,
  .sub-guide-section.sub-section01 .sub-hero-quote--lg p {
    max-width: none;
  }

.sub-guide-section.sub-section01 .inner-lg{
  padding-top: 16.25rem; /* 160px + header 100px */
  padding-bottom: 7.5rem; /* 120px */
}

.sub-guide-section.sub-section02,
.sub-guide-section.sub-section03,
.sub-guide-section.sub-section04
{
  padding-top: 7.5rem;
  padding-bottom: 7.5rem;
}

.platform{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2.5rem;
}

.platform img{
  width: 5rem;
  height: 5rem;
}

.platform li{
  width: 100%;
  border-radius: 28px;
  border: 1px solid transparent;
  background: linear-gradient(to bottom, rgba(247, 248, 250, 0.04), rgba(31, 118, 194, 0.04));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  display: flex;
  gap: 2.5rem;
  padding: 2.5rem;
  align-items: center;
}

.platform li p{
  font-size: 1.1rem;
  color: #999;
  line-height: 1.5;
}

.platform li p strong{
  display: block;
  font-size: 1.5rem;
  color: #fff;
  margin-bottom: 0.8rem;
}

.funding_flow_wrap{
    position:relative;
    width:100%;
    padding-top:40px;
}

.progressbar{
    position:absolute;
    top:20px;
    left:50%;
    transform: translateX(-50%);
    width:95%;
    height:4px;
    background:#333;
    overflow:hidden;
    z-index:1;
}

.progressbar .bar{
    position:absolute;
    top:0;
    left:0;
    width:0;
    height:100%;
    background:#FE3A8B;
    transition: width .5s ease;
}

.funding_flow{
    position:relative;
    z-index:2;
    width:95%;
    display:flex;
    justify-content:space-between;
    margin:0 auto;
}

.funding_flow li{
    display:flex;
    flex:1;
    gap:1.125rem;
    padding:2.5rem 1rem;
    opacity:.3;
    transition:all .4s ease;
}

.funding_flow li.active{
    opacity:1;
    transform:translateY(0);
}

.funding_flow li p{
    color:#999;
    font-size:1.125rem;
    line-height:1.5;
    transition:.4s;
}

.funding_flow li.active p{
    color:#fff;
}

.funding_flow li p span{
    font-size:1rem;
}

.funding_flow li.active p span{
  color: #FE3A8B;
}

.flow_number{
    display:flex;
    width:2.5rem;
    height:2.5rem;
    min-width:2.5rem;
    border-radius:50%;
    border:3px solid #999;
    align-items:center;
    justify-content:center;
    color:#999;
    background:#1a1a1a;
    transition:all .4s ease;
    font-size: 1.25rem;
}

.funding_flow li.active .flow_number{
    border-color:#FE3A8B;
    background: transparent;
    color:#fff;
}

.sub-funding-section.sub-section01 {
  position: relative;
  z-index: 2;
  overflow: visible;
}

.sub-funding-section.sub-section02{
  position: relative;
  z-index: 1;
  /* padding-top: 7.5rem; */
  padding-bottom: 7.5rem;
}

.sub-funding-section.sub-section01 .sub-hero-inner {
  justify-content: flex-start;
}

.sub-funding-section.sub-section01 .sub-funding-hero-title {
    max-width: 18.923em; /* 984px ÷ 52px */
  }
  .sub-funding-section.sub-section01 .sub-funding-hero-desc {
    max-width: 41.35em; /* 827px ÷ 20px */
  }
  .sub-funding-section.sub-section01 .sub-hero-quote--lg p {
    max-width: 33.571em; /* 940px ÷ 28px */
  }
  .sub-funding-section.sub-section01 .sub-funding-hero-media {
    top: -6.25vw;
    width: 18.020833vw; /* 346 / 1920 */
  }

  .sub-funding-section.sub-section01 .sub-funding-hero-body{
    padding-top: 0;
  }
  .sub-funding-section.sub-section01 .sub-funding-hero-title,
  .sub-funding-section.sub-section01 .sub-funding-hero-desc,
  .sub-funding-section.sub-section01 .sub-hero-quote--lg,
  .sub-funding-section.sub-section01 .sub-hero-quote--lg p {
    max-width: none;
  }

.sub-funding-section.sub-section01 .inner-lg{
  padding-top: 16.25rem; /* 160px + header 100px */
  padding-bottom: 18.6rem; /* 120px */
}

.sub-funding-section.sub-section02,
.sub-funding-section.sub-section03,
.sub-funding-section.sub-section04
{
  /* padding-top: 7.5rem; */
  padding-bottom: 7.5rem;
}

/* ========================
   ir.html
   ======================== */
.sub-customer-section.sub-section02 {
  padding-top: 7.5rem;
  padding-bottom: 7.5rem;
}
.sub-customer-section.sub-section03 {
  padding-top: 0;
  padding-bottom: 0;
}
.sub-customer-section.sub-section04 {
  padding-top: 7.5rem;
  padding-bottom: 7.5rem;
}

/* customer — sec01 hero */
.sub-customer-section.sub-section01 {
  position: relative;
  overflow: hidden;
  background: url("../_img/sub/bg-customer-sec01.jpg") no-repeat center/cover;
}
.sub-customer-section.sub-section01::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(0, 0, 0, 0.8) 32%, rgba(0, 0, 0, 0) 64%);
  pointer-events: none;
}
.sub-customer-section.sub-section01 .inner-lg {
  position: relative;
  z-index: 1;
  padding-top: 16.25rem;
  padding-bottom: 10rem;
}
.sub-customer-title-wrap {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  max-width: 60rem;
}
.sub-customer-title {
  font-size: clamp(28px, 4vw, 52px);
  font-weight: 800;
  line-height: 1.2;
  color: #f7f8fa;
  margin-bottom: 0;
}
.sub-customer-title-wrap > span {
  max-width: 41.35em;
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 400;
  line-height: 1.4;
  color: #fff;
}
.sub-customer-desc {
  display: flex;
  gap: 1.429em;
  align-items: center;
  margin: 0;
  font-size: clamp(20px, 2vw, 28px);
  font-weight: 700;
  line-height: 1.5;
  color: #fff;
}
.sub-customer-desc::before {
  content: "";
  flex-shrink: 0;
  width: 0.25rem;
  height: 3.571em;
  background: linear-gradient(to bottom, var(--color-second), var(--color-primary));
}

/* customer — sec02 */
.sub-customer-stack {
  display: flex;
  flex-direction: column;
  gap: 7.5rem;
}
.sub-customer-block {
  display: flex;
  flex-direction: column;
  gap: 3.75rem;
}
.sub-customer-head {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.sub-customer-sec-title {
  font-size: clamp(25px, 3.5vw, 40px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0;
}
.sub-customer-card-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.5rem;
  list-style: none;
}
.sub-customer-card-list li {
  list-style: none;
}
.sub-customer-card {
  display: flex;
  align-items: center;
  gap: 2.5rem;
  height: 100%;
  padding: 2.5rem;
}
.sub-customer-card-icon {
  position: relative;
  z-index: 1;
  flex-shrink: 0;
  width: 5rem;
  height: 5rem;
}
.sub-customer-card-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sub-customer-card-txt {
  position: relative;
  z-index: 1;
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.sub-customer-card-title {
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0;
}
.sub-customer-card-desc {
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #999;
  margin-bottom: 0;
}
.sub-customer-split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.5rem;
}
.sub-customer-split-col {
  display: flex;
  flex-direction: column;
  gap: 3.75rem;
  min-width: 0;
}
.sub-customer-funding {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding: 2.5rem;
}
.sub-customer-funding-title {
  position: relative;
  z-index: 1;
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0;
}
.sub-customer-funding-divider {
  display: block;
  position: relative;
  z-index: 1;
  width: 100%;
  height: 1px;
  background: rgba(255, 255, 255, 0.4);
}
.sub-customer-funding-list {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0;
}
.sub-customer-funding-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.25rem;
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: 700;
  line-height: 1.5;
}
.sub-customer-funding-row dt {
  flex: 1;
  min-width: 0;
  color: #999;
}
.sub-customer-funding-row dd {
  flex-shrink: 0;
  color: #1f76c2;
  margin-bottom: 0;
}
.sub-customer-funding-row--muted dt,
.sub-customer-funding-row--muted dd {
  color: #999;
}
.sub-customer-exit-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.5rem;
  flex: 1;
  list-style: none;
}
.sub-customer-exit-list li {
  list-style: none;
}
.sub-customer-exit-card {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  height: 100%;
  padding: 2.5rem;
}
.sub-customer-exit-label {
  position: relative;
  z-index: 1;
  font-size: clamp(14px, 1.2vw, 16px);
  font-weight: 600;
  line-height: 1.3;
  color: #999;
  margin-bottom: 0;
}
.sub-customer-exit-roi {
  position: relative;
  z-index: 1;
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 700;
  line-height: 1.3;
  color: var(--color-primary);
  margin-bottom: 0;
}
.sub-customer-exit-desc {
  position: relative;
  z-index: 1;
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #f7f8fa;
  margin-bottom: 0;
}

/* customer — sec03 */
.sub-customer-download {
  min-height: 10rem;
  border-radius: 0;
  padding: 2.5rem 0;
}
.sub-customer-download.sub-glass-card::before {
  border-radius: 0;
  inset: 0 -1px;
}
.sub-customer-download-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.5rem;
}
.sub-customer-download-icon {
  flex-shrink: 0;
  width: 5rem;
  height: 5rem;
}
.sub-customer-download-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sub-customer-download-txt {
  flex: 1;
  min-width: 0;
  max-width: 36rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.sub-customer-download-title {
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0;
}
.sub-customer-download-desc {
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #999;
  margin-bottom: 0;
}
.sub-customer-download-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 12rem;
  padding: 1.25rem 2.5rem;
  border-radius: 20px;
  background: linear-gradient(to bottom, rgba(254, 58, 139, 0.8), rgba(106, 54, 201, 0.8));
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.2;
  color: #f7f8fa;
  text-align: center;
  text-decoration: none;
  transition: opacity 0.25s ease;
}
.sub-customer-download-btn:hover {
  opacity: 0.85;
}

/* customer — sec04 */
.sub-customer-inquiry {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  align-items: center;
}
.sub-customer-head--center {
  align-items: center;
  text-align: center;
  width: 100%;
}
.sub-customer-inquiry-list {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  width: 100%;
  list-style: none;
}
.sub-customer-inquiry-item {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
  text-align: center;
  list-style: none;
}
.sub-customer-inquiry-icon {
  width: 2.5rem;
  height: 2.5rem;
}
.sub-customer-inquiry-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sub-customer-inquiry-txt {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.sub-customer-inquiry-label {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.2;
  color: var(--color-primary);
  margin-bottom: 0;
}
.sub-customer-inquiry-value {
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 700;
  line-height: 1.8;
  color: #f7f8fa;
  margin-bottom: 0;
}
.sub-customer-inquiry-sub {
  font-size: clamp(14px, 1.2vw, 16px);
  font-weight: 400;
  line-height: 1.8;
  color: #f7f8fa;
  margin-bottom: 0;
}
.sub-customer-inquiry-divider {
  flex-shrink: 0;
  width: 1px;
  height: 6rem;
  background: rgba(255, 255, 255, 0.4);
  list-style: none;
}

/* customer — reservation form */
.sub-customer-form-wrap {
  display: flex;
  justify-content: center;
  width: 100%;
}
.sub-customer-form {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  width: 100%;
  max-width: 41.5625rem;
  padding: 3rem;
  box-shadow: 0 0.25rem 1.25rem rgba(0, 0, 0, 0.08);
}
.sub-customer-form-fields {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  width: 100%;
}
.sub-customer-form-field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
}
.sub-customer-form-label {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.25;
  color: #f7f8fa;
}
.sub-customer-form-required {
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.25;
  color: #ef4444;
}
.sub-customer-form-input {
  width: 100%;
  padding: 0.8125rem 1.0625rem;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  background: transparent;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #f7f8fa;
}
.sub-customer-form-input::placeholder {
  color: #999;
}
.sub-customer-form-input:focus {
  outline: none;
  border-color: var(--color-primary);
}
.sub-customer-form-agree {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  width: 100%;
  padding: 1.5625rem;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
}
.sub-customer-form-check {
  display: flex;
  gap: 0.625rem;
  align-items: flex-start;
  width: 100%;
}
.sub-customer-form-checkbox {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  margin-top: 0.125rem;
  border: 1px solid #767676;
  border-radius: 0.15625rem;
  background: #f7f8fa;
  accent-color: var(--color-primary);
}
.sub-customer-form-check-label {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}
.sub-customer-form-check-txt {
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.6;
  color: #f7f8fa;
}
.sub-customer-form-link {
  font-weight: 600;
  color: #e11d48;
  text-decoration: underline;
  text-underline-offset: 0.125rem;
}
.sub-customer-form-check-note {
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.5;
  color: #999;
}
.sub-customer-form-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 2.6875rem;
  padding: 0.75rem 1.25rem;
  border: 0;
  border-radius: 0.5rem;
  background: linear-gradient(to right, #ff3b8c 33.173%, rgba(106, 54, 201, 0.6) 100%);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5;
  color: #f7f8fa;
  cursor: pointer;
  transition: opacity 0.25s ease;
}
.sub-customer-form-submit:hover {
  opacity: 0.85;
}

/* location.html — sec02 */
.sub-location-wrap .sub-customer-section.sub-section02 {
  padding-top: 2.5rem;
  padding-bottom: 7.5rem;
}
.sub-customer-location {
  display: flex;
  gap: 3.75rem;
  align-items: stretch;
  width: 100%;
}
.sub-customer-location-map {
  flex: 1 1 57%;
  min-width: 0;
  height: clamp(20rem, 40vw, 30rem);
  border: 1px solid #ccc;
  overflow: hidden;
}
.sub-customer-location-map .root_daum_roughmap,
.sub-customer-location-map .wrap_map {
  width: 100% !important;
  height: 100% !important;
}
.location-info {
  flex: 1 1 39rem;
  max-width: 39rem;
  width: 100%;
  min-width: 0;
}
.location-info-list {
  display: flex;
  flex-direction: column;
  width: 100%;
  list-style: none;
}
.location-info-item {
  display: flex;
  gap: 3.125rem;
  align-items: center;
  padding: 1.25rem 0;
}
.location-info-icon {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 5rem;
  height: 5rem;
  border-radius: 5rem;
  background: linear-gradient(to bottom, rgba(106, 54, 201, 0.1), rgba(254, 58, 139, 0.1));
}
.location-info-icon img {
  display: block;
  width: 5rem;
  height: 5rem;
  object-fit: contain;
}
.location-info-txt {
  flex: 1;
  min-width: 0;
}
.location-info-label {
  margin-bottom: 0;
  font-size: clamp(18px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.6;
  color: #f7f8fa;
}
.location-info-value {
  margin-bottom: 0;
  font-size: clamp(16px, 1.2vw, 18px);
  font-weight: 400;
  line-height: 1.6;
  color: #f7f8fa;
}

/* ========================
   dividend.html
   ======================== */
.sub-dividend-section.sub-section01 {
  position: relative;
  z-index: 2;
}
.sub-dividend-section.sub-section01 .sub-dividend-kpi-wrap {
  padding-top: 14rem;
  padding-bottom: 13rem;
}

.sub-dividend-section.sub-section02 {
  position: relative;
  z-index: 1;
  padding-bottom: 10rem;
}

.sub-dividend-kpi-title {
  text-align: center;
  font-size: clamp(32px, 4vw, 52px);
  font-weight: 800;
  line-height: 1.2;
  color: #f7f8fa;
  margin-bottom: 2.5rem;
}

.sub-dividend-kpi-item:nth-of-type(1) .sub-dividend-kpi-value {
  color: #ff3b8c;
}
.sub-dividend-kpi-item:nth-of-type(2) .sub-dividend-kpi-value {
  color: #1f76c2;
}
.sub-dividend-kpi-item:nth-of-type(3) .sub-dividend-kpi-value {
  color: #6a36c9;
}

/* portal grid — 스테이킹 · 투자요약 · DAO Pass 3열 */
.sub-dividend-portal {
  display: grid;
  grid-template-columns: 17rem minmax(0, 1fr) minmax(0, 1fr);
  gap: 2.5rem;
  align-items: stretch;
  min-height: 48rem;
}

/* staking panel */
.sub-dividend-staking {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  padding: 2.5rem;
  border: 1px solid #999;
  border-radius: 1rem;
}
.sub-dividend-staking-title {
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1;
  color: #f7f8fa;
}
.sub-dividend-staking-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  list-style: none;
}
.sub-dividend-staking-list li {
  list-style: none;
}
.sub-dividend-staking-card {
  position: relative;
  padding: 2rem 2.5rem;
}
.sub-dividend-staking-card--active {
  background: linear-gradient(to bottom, rgba(247, 248, 250, 0.4), rgba(31, 118, 194, 0.4));
}
.sub-dividend-staking-badge {
  position: absolute;
  top: 0;
  left: 0;
  padding: 0.8rem 1.2rem;
  border-radius: 3rem;
  background: #1f76c2;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  color: #fff;
}
.sub-dividend-staking-kpi {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  text-align: center;
}
.sub-dividend-staking-term {
  font-size: 1rem;
  font-weight: 400;
  line-height: 2;
  color: #f7f8fa;
}
.sub-dividend-staking-rate {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  color: var(--color-primary);
}
.sub-dividend-staking-label {
  font-size: 1rem;
  font-weight: 400;
  line-height: 2;
  color: #999;
}
.sub-dividend-staking-form {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  margin-top: auto;
}
.sub-dividend-staking-input-wrap {
  display: block;
  width: 100%;
}
.sub-dividend-staking-input {
  width: 100%;
  padding: 1rem 2rem;
  border: 1px solid #999;
  border-radius: 1rem;
  background: transparent;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1;
  color: #f7f8fa;
}
.sub-dividend-staking-input::placeholder {
  color: #999;
}
.sub-dividend-staking-btn-wrap {
  display: flex;
  gap: 2rem;
  justify-content: center;
}
.sub-dividend-staking-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 5rem;
  padding: 1rem 2rem;
  border-radius: 1rem;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0;
  color: #f7f8fa;
  cursor: pointer;
  text-align: center;
}

/* invest panel */
.sub-dividend-invest {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding: 4rem 2.5rem;
  border-radius: 1rem;
}
.sub-dividend-invest-title {
  position: relative;
  z-index: 1;
  font-size: 2rem;
  font-weight: 800;
  line-height: 1;
  color: #f7f8fa;
}
.sub-dividend-invest-body {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
}
.sub-dividend-invest-group {
  padding: 2rem 0;
  border-bottom: 1px solid #666;
}
.sub-dividend-invest-group:last-of-type {
  border-bottom: 0;
}
.sub-dividend-invest-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 2rem;
}
.sub-dividend-invest-group .sub-dividend-invest-row + .sub-dividend-invest-row {
  margin-top: 1rem;
}
.sub-dividend-invest-row--single {
  margin-top: 2rem;
  font-size: 1rem;
}
.sub-dividend-invest-label {
  flex-shrink: 0;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
  color: #999;
}
.sub-dividend-invest-value {
  min-width: 0;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  color: #f7f8fa;
  text-align: right;
}
.sub-dividend-invest-value--blue {
  color: #1f76c2;
}

/* tier panel — DAO Pass */
.sub-dividend-tier {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 2rem;
  padding: 4rem 2.5rem;
  border-radius: 1rem;
  background: linear-gradient(to bottom, rgba(106, 54, 201, 0.6), rgba(254, 58, 139, 0.6));
}
.sub-dividend-tier-body {
  display: flex;
  flex-direction: column;
  gap: 4rem;
}
.sub-dividend-tier-title {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  color: #f7f8fa;
}
.sub-dividend-tier-info {
  padding-top: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid #999;
}
.sub-dividend-tier-head {
  display: flex;
  align-items: center;
  gap: 2rem;
}
.sub-dividend-tier-icon {
  flex-shrink: 0;
  display: block;
  width: 3rem;
  height: 3rem;
}
.sub-dividend-tier-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sub-dividend-tier-name {
  font-size: 2rem;
  font-weight: 800;
  line-height: 1;
  color: var(--color-primary);
}
.sub-dividend-tier-desc {
  margin-top: 2rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  color: #f7f8fa;
}
.sub-dividend-tier-benefit-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  list-style: none;
}
.sub-dividend-tier-benefit-list li {
  position: relative;
  padding-left: 1rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 2;
  color: #f7f8fa;
  list-style: none;
}
.sub-dividend-tier-benefit-list li::before {
  content: "·";
  position: absolute;
  left: 0;
}
.sub-dividend-tier-progress {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.sub-dividend-tier-progress-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 2rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 2;
  color: #f7f8fa;
}
.sub-dividend-tier-progress-bar {
  position: relative;
  width: 100%;
  height: 0.25rem;
  background: #f7f8fa;
  overflow: hidden;
}
.sub-dividend-tier-progress-fill {
  display: block;
  height: 100%;
  width: 75%;
  background: linear-gradient(to right, var(--color-second), var(--color-primary));
}
.sub-dividend-tier-progress-note {
  font-size: 1rem;
  font-weight: 700;
  line-height: 2;
  color: #f7f8fa;
}

/* 수익배당 투자내역 리뉴얼 */
.sub-dividend-re-section.sub-section01 {
  padding-top: 16.25rem;
  padding-bottom: 7.5rem;
}
.sub-dividend-re-imgwrap {
  text-align: center;
  font-size: 0;
}
.sub-dividend-re-imgwrap img {
  width: auto;
  height: auto;
  max-width: 100%;
}
.sub-dividend-re-section.sub-section02 {
  padding-bottom: 7.5rem;
}
@media (max-width: 767px) {
  .sub-dividend-re-section.sub-section01 {
    padding-top: 13.4375rem;
    padding-bottom: 5rem;
  }
  .sub-dividend-re-section.sub-section02 {
    padding-bottom: 5rem;
  }
}

/* ========================
   global.html
   ======================== */
.sub-global-section.sub-section01 .inner-lg {
  padding-top: 16.25rem; /* 160px + header 100px */
  padding-bottom: 7.5rem; /* 120px */
}

.sub-global-hero {
  max-width: 51.6875rem;
}
.sub-global-hero-title {
  font-size: clamp(28px, 4vw, 52px);
  font-weight: 800;
  line-height: 1.2;
  color: #f7f8fa;
  margin-bottom: 2.5rem;
}
.sub-global-hero-accent {
  color: var(--color-primary);
}
.sub-global-hero-desc {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 400;
  line-height: 1.4;
  color: #fff;
  margin-bottom: 0;
}

.sub-global-section.sub-section02 {
  padding-top: 7.5rem;
  padding-bottom: 7.5rem;
}
.sub-global-section.sub-section03 {
  padding-top: 0;
  padding-bottom: 7.5rem;
}
.sub-global-section.sub-section04 {
  padding-top: 0;
  padding-bottom: 7.5rem;
}
.sub-global-section.sub-section04 .sub-section-stack {
  gap: 5rem;
}


.sub-structure-section.sub-section01{
  background: url("../_img/sub/bg-tech-sec01.png") no-repeat center/cover;
}

.sub-structure-section.sub-section01 .inner-lg {
  padding-top: 16.25rem;
  padding-bottom: 7.5rem;
}
.sub-structure-title-wrap {
  max-width: 51.6875rem;
  margin-left: auto;
}
.sub-structure-title {
  font-size: clamp(28px, 4vw, 52px);
  font-weight: 800;
  line-height: 1.2;
  color: #f7f8fa;
  margin-bottom: 2.5rem;
}

.sub-structure-desc {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 400;
  line-height: 1.4;
  color: #fff;
  margin-bottom: 0;
}


.sub-structure-section.sub-section02,
.sub-structure-section.sub-section03 {
  padding-top: 0;
  padding-bottom: 7.5rem;
}
.sub-structure-section.sub-section02{
  padding-top: 7.5rem;
}
.sub-structure-section.sub-section02 .sub-section-stack,
.sub-structure-section.sub-section03 .sub-section-stack {
  gap: 3.75rem;
}

/* sec02 — 통합 기술 아키텍처 */
.sub-structure-arch {
  display: flex;
  align-items: stretch;
  gap: 1.25rem;
}
.sub-structure-arch-main {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 1.25rem;
  min-width: 0;
}
.sub-structure-arch-side {
  flex: 0 0 23.75rem;
  max-width: 23.75rem;
}
.sub-structure-arch-layer {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding: 1.25rem;
  border: 2px solid transparent;
  border-radius: 12px;
}
.sub-structure-arch-layer--blue {
  border-color: #1f76c2;
}
.sub-structure-arch-layer--pink {
  border-color: var(--color-primary);
}
.sub-structure-arch-layer--violet {
  border-color: var(--color-second);
}
.sub-structure-arch-layer--grey {
  border-color: #999;
}
.sub-structure-arch-layer--light {
  border-color: #f7f8fa;
}
.sub-structure-arch-layer-title {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0;
}
.sub-structure-arch-card-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  list-style: none;
}
.sub-structure-arch-card-list--row3,
.sub-structure-arch-card-list--row2 {
  flex-direction: row;
  align-items: stretch;
  justify-content: space-between;
  gap: 1.25rem;
}
.sub-structure-arch-card-list--row3 > li {
  flex: 1 1 0;
  min-width: 0;
}
.sub-structure-arch-card-list--row2 > li {
  flex: 1 1 0;
  min-width: 0;
}
.sub-structure-arch-card-list--stack {
  flex: 1;
  justify-content: space-between;
  gap: 1.25rem;
}
.sub-structure-arch-card-list--stack > li {
  flex: 1 1 0;
}
.sub-structure-arch-card {
  display: flex;
  align-items: center;
  gap: 2.5rem;
  height: 100%;
  padding: 1.25rem 2.5rem;
  border-radius: 20px;
}
.sub-structure-arch-card--text {
  align-items: flex-start;
}
.sub-structure-arch-card--infra {
  justify-content: space-between;
  width: 100%;
}
.sub-structure-arch-card-icon {
  flex-shrink: 0;
  width: 5rem;
  height: 5rem;
}
.sub-structure-arch-card-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sub-structure-arch-card-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.sub-structure-arch-card-title {
  display: block;
  font-size: clamp(18px, 1.5vw, 24px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}
.sub-structure-arch-card-desc {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #f7f8fa;
  margin-bottom: 0;
}
.sub-structure-arch-card-tags {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  list-style: none;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #f7f8fa;
}
.sub-structure-arch-card-tags--grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 1rem;
  row-gap: 0.5rem;
}
.sub-structure-arch-infra-list {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  width: 100%;
  list-style: none;
}
.sub-structure-arch-infra-list > li {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  min-width: 0;
}
.sub-structure-arch-infra-name {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #fff;
}

/* sec03 — 서비스 연결 흐름 */
.sub-structure-flow-list {
  display: flex;
  gap: 0;
  padding: 2.5rem;
  list-style: none;
}
.sub-structure-flow-step {
  display: flex;
  flex: 1 1 0;
  gap: 1.25rem;
  align-items: flex-start;
  min-width: 0;
  padding-top: 2.5rem;
  border-top: 2px solid transparent;
}
.sub-structure-flow-step--pink {
  border-top-color: var(--color-primary);
}
.sub-structure-flow-step--pink .sub-structure-flow-step-label {
  color: var(--color-primary);
}
.sub-structure-flow-step--violet {
  border-top-color: var(--color-second);
}
.sub-structure-flow-step--violet .sub-structure-flow-step-label {
  color: var(--color-second);
}
.sub-structure-flow-step--blue {
  border-top-color: #1f76c2;
}
.sub-structure-flow-step--blue .sub-structure-flow-step-label {
  color: #1f76c2;
}
.sub-structure-flow-step-icon {
  position: relative;
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
}

.sub-structure-flow-step--pink .sub-structure-flow-step-icon {
  border: 2px solid var(--color-primary);
}
.sub-structure-flow-step--violet .sub-structure-flow-step-icon {
  border: 2px solid var(--color-second);
}
.sub-structure-flow-step--blue .sub-structure-flow-step-icon {
  border: 2px solid #1f76c2;
}

.sub-structure-flow-step-num {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 2;
  color: #f7f8fa;
}
.sub-structure-flow-step-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
}
.sub-structure-flow-step-label {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5;
}
.sub-structure-flow-step-title {
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.5;
  color: #fff;
  margin-bottom: 0;
}
.sub-structure-flow-step--violet .sub-structure-flow-step-title {
  color: #f7f8fa;
  font-weight: 600;
}

/* ========================
   blockchain.html
   ======================== */
.sub-tech-wrap.sub-blockchain-wrap .text-gradient {
  background: linear-gradient(to right, var(--color-second), var(--color-primary));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.sub-blockchain-section.sub-section02 {
  padding-top: 7.5rem;
  padding-bottom: 7.5rem;
}

.sub-blockchain-evolution {
  position: relative;
  overflow: hidden;
}
.sub-blockchain-evolution-bg {
  position: absolute;
  left: 0;
  top: 5%;
  z-index: 0;
  pointer-events: none;
}
.sub-blockchain-evolution .inner-lg {
  position: relative;
  z-index: 1;
}
.sub-blockchain-compare {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sub-blockchain-compare-arrow {
  z-index: 2;
  width: 7rem;
  pointer-events: none;
}
.sub-blockchain-compare-arrow img {
  display: block;
  width: 100%;
  height: auto;
}
.sub-blockchain-compare-card {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  flex: 0 1 50%;
  max-width: 37.8rem;
  padding: 2rem 4.5rem;
  border-radius: 20px;
}
.sub-blockchain-compare-card--tobe {
  gap: 3.75rem;
  max-width: 45.3rem;
  padding: 3.6rem 7.2rem;
}
.sub-blockchain-compare-head {
  padding-bottom: 1.25rem;
  border-bottom: 1px solid #999;
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}
.sub-blockchain-compare-card--tobe .sub-blockchain-compare-head {
  color: var(--color-primary);
}
.sub-blockchain-compare-list {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  list-style: none;
}
.sub-blockchain-compare-card--tobe .sub-blockchain-compare-list {
  gap: 3.75rem;
}
.sub-blockchain-compare-item {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}
.sub-blockchain-compare-icon {
  flex-shrink: 0;
  width: 5rem;
  height: 5rem;
  object-fit: contain;
}
.sub-blockchain-compare-card--tobe .sub-blockchain-compare-icon {
  width: 5.75rem;
  height: 5.75rem;
}
.sub-blockchain-compare-body strong {
  display: block;
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0.25rem;
}
.sub-blockchain-compare-body p {
  font-size: clamp(16px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #999;
  margin-bottom: 0;
}

/* ========================
   ai.html
   ======================== */
.sub-ai-engine-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.5rem;
  list-style: none;
}
.sub-ai-engine-list > li {
  min-width: 0;
}
.sub-ai-engine-list > li:nth-child(5) {
  grid-column: 1 / -1;
  justify-self: center;
  width: calc(50% - 1.25rem);
}
.sub-ai-engine-card {
  display: flex;
  align-items: center;
  gap: 2.5rem;
  width: 100%;
  min-height: 11rem;
  padding: 2rem;
  border-radius: 12px;
}
.sub-ai-engine-card--wide {
  min-width: 0;
}
.sub-ai-engine-icon {
  flex-shrink: 0;
  width: 5rem;
  height: 5rem;
}
.sub-ai-engine-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sub-ai-engine-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 1.25rem;
  width: auto;
  max-width: 100%;
  min-width: 0;
}
.sub-ai-engine-body--md {
  max-width: 21.25rem;
}
.sub-ai-engine-body--lg {
  max-width: 30rem;
}
.sub-ai-engine-title {
  display: block;
  font-size: clamp(20px, 1.5vw, 24px);
  font-weight: 800;
  line-height: 1.2;
  color: #f7f8fa;
}
.sub-ai-engine-desc {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 400;
  line-height: 1.2;
  color: #f7f8fa;
  margin-bottom: 0;
}
.sub-ai-engine-service {
  font-size: clamp(16px, 1.2vw, 18px);
  font-weight: 700;
  line-height: 1.2;
  color: #1f76c2;
  margin-bottom: 0;
}

@media (min-width: 1001px) {
  .sub-ai-engine-list {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .sub-ai-engine-list > li:nth-child(1) {
    grid-column: 1 / 3;
  }
  .sub-ai-engine-list > li:nth-child(2) {
    grid-column: 3 / 5;
  }
  .sub-ai-engine-list > li:nth-child(3) {
    grid-column: 5 / 7;
  }
  .sub-ai-engine-list > li:nth-child(4) {
    grid-column: 2 / 4;
  }
  .sub-ai-engine-list > li:nth-child(5) {
    grid-column: 4 / 6;
    width: auto;
    justify-self: stretch;
  }
}

.sub-roadmap-section.sub-section01 {
  padding-top: 10rem;
  padding-bottom: 7.5rem;
}
.sub-roadmap-phase-grid {
  display: flex;
  align-items: stretch;
  gap: 3.8rem;
}
.sub-roadmap-phase-intro {
  display: flex;
  flex: 1 1 36.25rem;
  flex-direction: column;
  justify-content: space-between;
  gap: 2.5rem;
  min-width: 0;
}
.sub-roadmap-phase-head {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
.sub-roadmap-phase-label {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-primary);
  margin-bottom: 0.3rem;
}
.sub-roadmap-phase-title {
  font-size: clamp(28px, 4vw, 52px);
  font-weight: 800;
  line-height: 1.2;
  color: #f7f8fa;
  margin-bottom: 0;
}
.sub-roadmap-phase-desc {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 400;
  line-height: 1.4;
  color: #fff;
  margin-bottom: 0;
}
.sub-roadmap-feature-list {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  list-style: none;
}
.sub-roadmap-feature-item {
  padding-left: 2.5rem;
  border-left: 2px solid #999;
}
.sub-roadmap-feature-title {
  display: block;
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.5;
  color: #fff;
  margin-bottom: 0.5rem;
}
.sub-roadmap-feature-desc {
  font-size: clamp(16px, 1.2vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #999;
  margin-bottom: 0;
}
.sub-roadmap-btn-wrap {
  width: 100%;
}
.sub-roadmap-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 1.3rem;
  border-radius: 8px;
  background: var(--color-second);
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1;
  color: #f7f8fa;
}
.sub-roadmap-phase-visual {
  display: flex;
  flex: 1 1 60rem;
  flex-direction: column;
  gap: 2.5rem;
  max-width: 60rem;
  min-width: 0;
}
.sub-roadmap-visual {
  position: relative;
  overflow: hidden;
  min-height: 37.5rem;
  border-radius: 20px;
}
.sub-roadmap-visual-caption {
  position: absolute;
  top: 3rem;
  left: 50%;
  z-index: 1;
  width: 50%;
  min-width: 17.5rem;
  text-align: center;
  transform: translateX(-50%);
}
.sub-roadmap-visual-caption-sub {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.8;
  color: #fff;
  margin-bottom: 0;
}
.sub-roadmap-visual-caption-title {
  font-size: clamp(20px, 2vw, 28px);
  font-weight: 700;
  line-height: 1.8;
  color: #fff;
  margin-bottom: 0;
}
.sub-roadmap-visual-img {
  width: 100%;
  height: 100%;
  min-height: 37.5rem;
}
.sub-roadmap-visual-img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sub-roadmap-kpi {
  padding: 2.5rem;
  border-radius: 20px;
}
.sub-roadmap-kpi-list {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.3rem;
  list-style: none;
}
.sub-roadmap-kpi-item {
  display: flex;
  flex: 1 1 12.5rem;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
  min-width: 0;
}
.sub-roadmap-kpi-item + .sub-roadmap-kpi-item {
  padding-left: 1.3rem;
  border-left: 1px solid rgba(255, 255, 255, 0.4);
}
.sub-roadmap-kpi-icon {
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
}
.sub-roadmap-kpi-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sub-roadmap-kpi-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.sub-roadmap-kpi-value {
  font-size: clamp(22px, 2vw, 28px);
  font-weight: 700;
  line-height: 1.8;
  color: var(--color-primary);
}
.sub-roadmap-kpi-label {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.8;
  color: #f7f8fa;
}

/* sec02 — 로드맵 단계 */
.sub-roadmap-section.sub-section02 {
  padding-top: 0;
  padding-bottom: 8rem;
}
.sub-roadmap-step-list {
  display: flex;
  align-items: flex-start;
  list-style: none;
}

.sub-roadmap-step-item {
  display: flex;
  flex: 1 1 0;
  gap: 1rem;
  min-width: 0;
  max-width: 25rem;  
  border-top: 2px solid #999;
}
.sub-roadmap-step-item a{
  display: flex;
  flex: 1 1 0;
  gap: 1rem;
  min-width: 0;
  max-width: 25rem;
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.sub-roadmap-step-item--active {
  border-top-color: var(--color-primary);
}
.sub-roadmap-step-icon {
  position: relative;
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
}
.sub-roadmap-step-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sub-roadmap-step-num {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  font-weight: 700;
  line-height: 2;
  color: #999;
  border-radius: 50%;
}
.sub-roadmap-step-item--active .sub-roadmap-step-num {
  color: #f7f8fa;
  border: 2px solid var(--color-primary);
}


.sub-roadmap-step-body {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-width: 0;
}
.sub-roadmap-step-label {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
  color: #999;
}
.sub-roadmap-step-item--active .sub-roadmap-step-label {
  color: var(--color-primary);
}
.sub-roadmap-step-title {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  color: #999;
}
.sub-roadmap-step-item--active .sub-roadmap-step-title {
  color: #fff;
}


/* ========================
   RESPONSIVE
   ======================== */

@media (min-width: 576px) {
.sub-partner-logo-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    column-gap: 2rem;
    row-gap: 1.5rem;
  }
  .sub-partner-logo-grid li {
    min-height: 5.5rem;
    padding: 1.125rem 0;
  }
  .sub-partner-logo-grid img {
    max-width: 9rem;
    height: 3.5rem;
  }
}

@media (min-width: 1201px) {
.sub-partner-logo-grid {
    grid-template-columns: repeat(9, minmax(0, 1fr));
    column-gap: 2.5rem;
    row-gap: 1.25rem;
  }
  .sub-partner-logo-grid li {
    min-height: 6.5rem;
    padding: 1.25rem 0;
  }
  .sub-partner-logo-grid li:nth-child(-n + 9) {
    grid-row: 1;
  }
  .sub-partner-logo-grid li:nth-child(n + 10):nth-child(-n + 16) {
    grid-row: 2;
  }
  .sub-partner-logo-grid li:nth-child(10) {
    grid-column: 2;
  }
  .sub-partner-logo-grid li:nth-child(11) {
    grid-column: 3;
  }
  .sub-partner-logo-grid li:nth-child(12) {
    grid-column: 4;
  }
  .sub-partner-logo-grid li:nth-child(13) {
    grid-column: 5;
  }
  .sub-partner-logo-grid li:nth-child(14) {
    grid-column: 6;
  }
  .sub-partner-logo-grid li:nth-child(15) {
    grid-column: 7;
  }
  .sub-partner-logo-grid li:nth-child(16) {
    grid-column: 8;
  }
  .sub-partner-logo-grid li:nth-child(n + 17) {
    grid-row: 3;
  }
  .sub-partner-logo-grid img {
    max-width: 10rem;
    height: 4rem;
  }
}

@media (min-width: 1401px) {
.sub-service-hero-media {
    position: absolute;
    right: 0;
    z-index: 10;
  }  

  #my1pick_mockup.sub-service-hero-media{
    top: -6.875vw;
    width: 37.239583vw; /* 715 / 1920 */
  }

  /* STARPIC — mockup 346px */
  .sub-service-section.sub-section01 .sub-service-hero-title {
    max-width: 18.923em; /* 984px ÷ 52px */
  }
  .sub-service-section.sub-section01 .sub-service-hero-desc {
    max-width: 41.35em; /* 827px ÷ 20px */
  }
  .sub-service-section.sub-section01 .sub-hero-quote--lg p {
    max-width: 33.571em; /* 940px ÷ 28px */
  }
  .sub-service-section.sub-section01 .sub-service-hero-media {
    top: -6.25vw;
    width: 18.020833vw; /* 346 / 1920 */
  }

  #punkvism-hero-media{
    top: -6vw;
    width: 48.5vw;
  }

  #punkvism-hero-media.sub-service-hero-media {
    position: absolute;
    right: -20rem;
    z-index: 10;
  }
}

@media (max-width: 1800px) {
.sub-introduction-section.sub-section02 .value-content {
    padding-right: 50px;
  }
  .sub-introduction-section.sub-section02 .value-img {
    max-width: 50%;
  }
}

@media (max-width: 1400px) {
.sub-schedule-list {
    grid-template-columns: repeat(2, 1fr);
  }
  .sub-history-list {
    gap: 3.75rem;
  }

.sub-member-card-body {
    padding-right: 2.5rem;
    padding-left: 2.5rem;
  }
  .sub-benefit-card {
    padding-right: 2rem;
    padding-left: 2rem;
    gap: 2rem;
  }
  .sub-feature-visual {
    gap: 3.75rem;
  }
  .sub-quote-wrap--side {
    gap: 3.75rem;
  }

.sub-introduction-section.sub-section02 .value-content {
    width: 60%;
    padding-right: 30px;
  }
  .sub-introduction-section.sub-section02 .value-img {
    width: 40%;
    margin-right: 0;
  }

.sub-service-hero {
    flex-direction: column;
    align-items: flex-start;
    gap: 3.75rem;
    min-height: 0;
    padding-left: 0;
  }
  .sub-service-hero-media {
    position: static;
    top: auto;
    right: auto;
    width: 100%;
    max-width: 21.625rem;
  }

  #punkvism-section.sub-section01 .inner-lg{
    padding-bottom: 3rem;
  }

  #punkvism-hero-media.sub-service-hero-media{
    max-width: 45rem;
  }

  .sub-punkvism-section.sub-section01 .sub-service-hero-media,
  .sub-my1pick-section.sub-section01 .sub-service-hero-media {
    max-width: 44.6875rem;
  }
  .sub-service-section.sub-section01 .sub-service-hero-body,
  .sub-starpic-section.sub-section01 .sub-service-hero-body,
  .sub-punkvism-section.sub-section01 .sub-service-hero-body,
  .sub-podoal-section.sub-section01 .sub-service-hero-body,
  .sub-my1pick-section.sub-section01 .sub-service-hero-body {
    padding-top: 0;
  }
  .sub-service-section.sub-section01 .sub-service-hero-title,
  .sub-starpic-section.sub-section01 .sub-service-hero-title,
  .sub-punkvism-section.sub-section01 .sub-service-hero-title,
  .sub-podoal-section.sub-section01 .sub-service-hero-title,
  .sub-my1pick-section.sub-section01 .sub-service-hero-title,
  .sub-service-section.sub-section01 .sub-service-hero-desc,
  .sub-starpic-section.sub-section01 .sub-service-hero-desc,
  .sub-punkvism-section.sub-section01 .sub-service-hero-desc,
  .sub-podoal-section.sub-section01 .sub-service-hero-desc,
  .sub-my1pick-section.sub-section01 .sub-service-hero-desc,
  .sub-service-section.sub-section01 .sub-hero-quote--lg,
  .sub-starpic-section.sub-section01 .sub-hero-quote--lg,
  .sub-punkvism-section.sub-section01 .sub-hero-quote--lg,
  .sub-podoal-section.sub-section01 .sub-hero-quote--lg,
  .sub-my1pick-section.sub-section01 .sub-hero-quote--lg,
  .sub-service-section.sub-section01 .sub-hero-quote--lg p,
  .sub-starpic-section.sub-section01 .sub-hero-quote--lg p,
  .sub-punkvism-section.sub-section01 .sub-hero-quote--lg p,
  .sub-podoal-section.sub-section01 .sub-hero-quote--lg p,
  .sub-my1pick-section.sub-section01 .sub-hero-quote--lg p {
    max-width: none;
  }
  .sub-service-hero-media {
    align-self: center;
  }
  .sub-service-compare {
    display: block;
  }
  .sub-service-compare-arrow {
    transform: rotate(90deg);
    margin: 0.8rem auto;
  }
  .sub-service-compare-card,
  .sub-service-compare-card--tobe {
    max-width: none;
    padding: 2.5rem;
  }
  .sub-blockchain-compare {
    display: block;
  }
  .sub-blockchain-compare-arrow {
    transform: rotate(90deg);
    margin: 0.8rem auto;
  }
  .sub-blockchain-compare-card,
  .sub-blockchain-compare-card--tobe {
    max-width: none;
    padding: 2.5rem;
  }
  .sub-structure-arch {
    flex-direction: column;
  }
  .sub-structure-arch-side {
    flex: none;
    max-width: none;
    width: 100%;
  }
  
  .sub-structure-arch-card-list--row3 > li,
  .sub-structure-arch-card-list--row2 > li {
    flex: 1 1 calc(50% - 0.625rem);
  }
  .sub-structure-flow-list {
    flex-wrap: wrap;
    gap: 2rem;
    padding: 2rem;
  }
  .sub-structure-flow-step {
    flex: 1 1 calc(50% - 1rem);
  }

  .sub-structure-flow-step:last-of-type {
    flex: 0 1 calc(50% - 1rem);
  }
  .sub-service-audience-list {
    padding: 3.75rem 2rem;
  }
  .sub-service-audience-card {
    min-height: 37rem;
    padding: 2rem 2rem;
  }
  .sub-service-roadmap-item {
    flex: 1 1 1rem;
    padding: 2.5rem 1rem 0 0;
  }

  .sub-structure-arch-card-list {
    flex-direction: row;
  }
}

@media (max-width: 1280px) {
.sub-introduction-section.sub-section01 .hero-wrap {
    max-width: 100%;
  }
}

@media (max-width: 1200px) {
  /* customer · roadmap */
  .sub-customer-section.sub-section01 .inner-lg {
    padding-top: 15rem;
  }
  .sub-customer-section.sub-section01 {
    min-height: 40rem;
  }
  .sub-roadmap-section.sub-section01 {
    padding-top: 9.5rem;
  }
  .sub-roadmap-phase-grid {
    flex-direction: column;
    gap: 3rem;
  }
  .sub-roadmap-phase-visual {
    flex: none;
    max-width: none;
    width: 100%;
  }
  .sub-roadmap-step-list {
    flex-wrap: wrap;
    gap: 0 2rem;
  }
  .sub-roadmap-step-item {
    flex: 1 1 calc(50% - 1rem);
    max-width: none;
  }


.sub-board-swiper .sub-board-card {
    flex-direction: row;
    align-items: center;
  }
  .sub-board-swiper .sub-board-card-side {
    width: 17.5rem;
    max-width: none;
    margin: 0;
  }
  .sub-board-swiper .sub-board-card-side--sm {
    width: 11.25rem;
  }
  .sub-live-player {
    margin-right: 0;
  }
  .sub-live-chat {
    position: static;
    width: 100%;
    height: auto;
    max-height: 28rem;
    overflow: hidden;
  }
  .sub-live-chat-list {
    margin: 1.5rem 0;
  }

.sub-member-list {
    gap: 2rem;
  }
  .sub-member-card {
    min-height: 13.5rem;
  }
  .sub-member-card-img {
    width: 16rem;
  }
  .sub-member-card-body {
    padding-right: 2rem;
    padding-left: 2rem;
  }
  .sub-benefit-list {
    display: block;
  }
  .sub-benefit-card {
    padding: 1.25rem 1.75rem;
    gap: 1.5rem;
  }
  .sub-benefit-card--stack {
    padding: 3.75rem 2.5rem;
    gap: 2rem;
  }
  .sub-benefit-card--stack .sub-benefit-card-head {
    gap: 2rem;
    display: flex;
    flex-direction: row;
  }
  .sub-benefit-card--stack .sub-benefit-card-desc {
    font-size: 1.125rem;
  }

  .sub-benefit-list--stack li + li{
    margin-top: 2rem;
  }
  .sub-feature-visual {
    gap: 3rem;
  }
  .sub-quote-wrap--side {
    gap: 2.5rem;
  }
  .sub-partner-list li {
    flex: 0 0 calc((100% - 2 * var(--partner-gap)) / 3);
    max-width: calc((100% - 2 * var(--partner-gap)) / 3);
  }
  .sub-video-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem;
  }

.sub-introduction-section.sub-section02 .value-wrap {
    flex-direction: column;
  }
  .sub-introduction-section.sub-section02 .value-content {
    width: 100%;
    padding-right: 0;
  }
  .sub-introduction-section.sub-section02 .value-img {
    width: 100%;
    max-width: 100%;
    margin-top: 3.125rem;
  }
  .sub-introduction-section.sub-section02 .value-img img {
    object-position: center;
  }

.sub-introduction-section.sub-section01 .inner-lg {
    padding-top: 15rem;
  }

.sub-vision-section.sub-section01 .inner-lg {
    padding-top: 15rem;
  }
  .sub-vision-section.sub-section03 .value-card-list {
    gap: 1.25rem;
  }
  .sub-vision-section.sub-section03 .card-inner {
    gap: 1.25rem;
    padding: 2.5rem 1.75rem;
  }
  .sub-vision-section.sub-section03 .card-head {
    gap: 1.25rem;
  }

.sub-board-section.sub-section01 .inner-lg {
    padding-top: 15rem;
  }

.sub-partners-section.sub-section01 .inner-lg {
    padding-top: 15rem;
  }

.sub-ci-bi-section.sub-section01 .inner-lg {
    padding-top: 15rem;
  }

.sub-news-section.sub-section01 .inner-lg {
    padding-top: 15rem;
  }

.sub-ongoing-section.sub-section01 .inner-lg {
    padding-top: 15rem; /* 160px + header 80px */
  }

.sub-live-section.sub-section01 .inner-lg {
    padding-top: 15rem; /* 160px + header 80px */
  }

.sub-service-section.sub-section01 .inner-lg,
  .sub-starpic-section.sub-section01 .inner-lg,
  .sub-punkvism-section.sub-section01 .inner-lg,
  .sub-podoal-section.sub-section01 .inner-lg,
  .sub-my1pick-section.sub-section01 .inner-lg {
    padding-top: 15rem;
  }

  .tokenprocess_item span{
    font-size: 0.8rem;
  }
  .tokenprocess_item strong{
    font-size: 1.25rem;
  }
  .tokenprocess_item p{
    font-size: 0.9rem;
  }
  .platform li p{
    font-size: 0.8rem;
  }

  .platform li p strong{
    font-size: 1.25rem;
  }

  .funding_flow li p{
    font-size: 0.8rem;
  }
  .funding_flow li p span{
    font-size: 1rem;
  }
  .flow_number{
    font-size: 1.1rem;
  }  

  .sub-benefit-list--2col,
  .sub-split-grid,
  .sub-exit-list {
    gap: 1.25rem;
  }
  .sub-global-section.sub-section01 .inner-lg {
      padding-top: 15rem; /* 160px + header 80px */
    }

  .sub-ai-engine-card {
    flex-direction: column;
  }
}

@media (max-width: 1000px) {
.sub-dividend-portal {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .sub-dividend-staking {
    grid-column: 1 / -1;
    max-width: none;
    width: 100%;
  }
  .sub-dividend-staking-list {
    flex-direction: row;
    gap: 1rem;
  }
  .sub-dividend-staking-list li {
    flex: 1;
    min-width: 0;
  }
  .sub-dividend-staking-card {
    height: 100%;
  }
  .sub-dividend-staking-form {
    flex-direction: row;
    align-items: center;
    gap: 2rem;
    width: 100%;
  }
  .sub-dividend-staking-input-wrap {
    flex: 1;
    min-width: 0;
  }
  .sub-dividend-staking-btn-wrap {
    flex-shrink: 0;
  }
  
  .sub-structure-arch-card {
    flex-direction: column;
  }


  .sub-structure-arch-infra-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
    width: 100%;
    list-style: none;
  }
  .sub-structure-arch-card-list--stack {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
    width: 100%;
    list-style: none;
  }

  .sub-structure-arch-card-tags--grid {
    grid-template-columns: none;
  }

  .sub-customer-exit-list {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    flex: 1;
    list-style: none;
  }
  .sub-customer-split {
    align-items: stretch;
  }
  .sub-customer-split-col {
    display: flex;
    flex-direction: column;
    gap: 3.75rem;
  }
  .sub-customer-funding {
    flex: 1;
  }
  .sub-customer-exit-list li {
    flex: 1;
    display: flex;
    min-height: 0;
  }
  .sub-customer-exit-card {
    flex: 1;
    width: 100%;
  }

  .sub-customer-inquiry-list {
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 2.5rem;
    column-gap: 1.25rem;
  }
  .sub-customer-inquiry-item {
    display: flex;
    flex: 0 0 calc((100% - 1.25rem) / 2);
  }
  .sub-customer-inquiry-divider {
    display: none;
  }

  .sub-customer-location {
    flex-direction: column;
    gap: 2.5rem;
  }
  .sub-customer-location-map {
    flex: none;
    width: 100%;
    min-height: 22.5rem;
  }
  .location-info {
    flex: none;
    max-width: none;
    width: 100%;
  }
}

@media (max-width: 920px) {
.sub-member-list {
    gap: 1.5rem;
  }
  .sub-member-card-img {
    width: 14rem;
  }
  .sub-member-card-body {
    padding: 1.25rem 1.5rem;
  }
  .sub-benefit-card {
    padding: 2.5rem 1.5rem;
    gap: 1.25rem;
  }
  .sub-feature-visual {
    flex-direction: column;
    align-items: center;
    gap: 2.5rem;
  }
  .sub-feature-visual-img {
    width: 100%;
  }
  .sub-quote-wrap--side {
    gap: 2rem;
  }
  .sub-ci-bi-grid {
    gap: 3rem;
  }
  .sub-board-card {
    flex-direction: column;
    align-items: stretch;
    padding: 2rem 2.5rem;
  }
  .sub-board-card-side {
    width: 100%;
    max-width: 15rem;
    margin: 0 auto;
  }
  .sub-board-card-side--lg {
    max-width: 17.5rem;
  }

.sub-introduction-section.sub-section02 .value-card-list li {
    width: calc(50% - 0.625rem);
  }

.sub-split-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
.sub-service-audience-card {
    min-height: 42rem;
    padding: 1rem 1rem;
  }

  .progressbar{
    top: 5%;
    left: 10%;
    transform-origin:left center;
    transform:rotate(90deg);
    width: 48rem;
  }

  .funding_flow{
      position:relative;
      z-index:2;
      width:95%;
      flex-direction: column;
      align-items: center;
      margin:0 auto;
  }

  .funding_flow li{
      display:flex;
      flex:1;
      gap:1.125rem;
      padding:2.5rem 1rem;
      opacity:.3;
      transition:all .4s ease;
      width: 25rem;      
  }

  .funding_flow li.active{
      opacity:1;
      transform:translateY(0);
  }

  .funding_flow li p{
      color:#999;
      font-size:1.125rem;
      line-height:1.5;
      transition:.4s;
  }

  .funding_flow li.active p{
      color:#fff;
  }

  .funding_flow li p span{
      font-size:1rem;
  }

  .funding_flow li.active p span{
    color: #FE3A8B;
  }

  .flow_number{
      display:flex;
      width:2.5rem;
      height:2.5rem;
      min-width:2.5rem;
      border-radius:50%;
      border:3px solid #999;
      align-items:center;
      justify-content:center;
      color:#999;
      background:#1a1a1a;
      transition:all .4s ease;
      font-size: 1.25rem;
  }

  .funding_flow li.active .flow_number{
      border-color:#FE3A8B;
      background: transparent;
      color:#fff;
  }
}

@media (max-width: 767px) {
  /* customer · roadmap · ai */
  .sub-customer-section.sub-section01 .inner-lg {
    padding-top: 13.75rem;
    padding-bottom: 5rem;
  }
  .sub-customer-section.sub-section01 {
    min-height: 36rem;
  }
  .sub-customer-desc {
    align-items: flex-start;
  }
  .sub-customer-card-list,
  .sub-customer-split {
    grid-template-columns: 1fr;
  }
  .sub-customer-funding,
  .sub-customer-exit-list {
    flex: none;
  }
  .sub-customer-exit-list li {
    flex: none;
    display: block;
  }
  .sub-customer-exit-card {
    flex: none;
    height: auto;
  }
  .sub-customer-stack {
    gap: 5rem;
  }
  .sub-customer-download-inner {
    flex-direction: column;
    text-align: center;
  }
  .sub-customer-download-txt {
    align-items: center;
  }
  .sub-customer-form {
    padding: 2rem 1.5rem;
  }
  .location-info-item {
    gap: 2rem;
  }
  .sub-roadmap-section.sub-section01 {
    padding-top: 8.4rem;
    padding-bottom: 5rem;
  }
  .sub-roadmap-phase-intro {
    gap: 2rem;
  }
  .sub-roadmap-phase-head {
    gap: 2rem;
  }
  .sub-roadmap-feature-list {
    gap: 2rem;
  }
  .sub-roadmap-feature-item {
    padding-left: 1.5rem;
  }
  .sub-roadmap-visual {
    min-height: 25rem;
  }
  .sub-roadmap-visual-img {
    min-height: 25rem;
  }
  .sub-roadmap-visual-caption {
    top: 2rem;
    width: calc(100% - 3rem);
    min-width: 0;
  }
  .sub-roadmap-kpi {
    padding: 2rem 1.5rem;
  }
  .sub-roadmap-kpi-list {
    flex-wrap: wrap;
    gap: 2rem 0;
  }
  .sub-roadmap-kpi-item {
    flex: 1 1 50%;
    padding-left: 0;
    border-left: 0;
  }
  .sub-roadmap-kpi-item:nth-of-type(3) {
    border: none;
  }
  .sub-roadmap-section.sub-section02 {
    padding-bottom: 5rem;
  }
  .sub-roadmap-step-list {
    flex-direction: column;
    gap: 0;
  }
  .sub-roadmap-step-item {
    flex: none;
    width: 100%;
    max-width: none;
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  .sub-ai-engine-list {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }
  .sub-ai-engine-list > li:nth-child(5) {
    width: 100%;
  }
  .sub-ai-engine-card,
  .sub-ai-engine-card--wide {
    min-height: 0;
    padding: 1.5rem;
    gap: 1.5rem;
    flex-direction: column;
  }

.sub-hero-inner {
    display: block;
  }

.sub-schedule-list {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .sub-history-list {
    flex-direction: column;
    gap: 2.5rem;
  }
  .sub-history-item {
    padding-left: 1.25rem;
  }
  .sub-board-swiper--peek .sub-board-card,
  .sub-board-swiper--pair .sub-board-card {
    flex-direction: column;
    align-items: stretch;
    padding: 2rem 1.5rem;
  }
  .sub-board-swiper .sub-board-card-side,
  .sub-board-swiper .sub-board-card-side--lg,
  .sub-board-swiper .sub-board-card-side--sm {
    width: 100%;
    max-width: 17.5rem;
    margin: 0 auto;
  }
  .sub-board-card--compact {
    padding: 2rem 1.5rem;
  }
  .sub-board-card--compact .sub-board-card-body {
    max-width: none;
  }
  .sub-schedule-card-body {
    padding: 1.5rem;
  }

.sub-member-list {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
  .sub-member-card {
    min-height: 22.5rem;
  }
  .sub-member-card-img {
    width: 20rem;
  }
  .sub-member-card-body {
    padding: 1.25rem 2.5rem;
  }
  .sub-section-stack {
    gap: 3.75rem;
  }
  .sub-benefit-list {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .sub-benefit-card {
    padding: 1.25rem 2rem;
    gap: 1.5rem;
  }
  .sub-benefit-card--stack {
    padding: 3rem 4rem;
    gap: 2rem;
  }
  .sub-benefit-card--stack .sub-benefit-card-head {
    gap: 2rem;
  }
  .sub-benefit-card--stack .sub-benefit-card-title {
    font-size: 1.25rem;
  }
  .sub-benefit-card--stack .sub-benefit-card-desc {
    font-size: 1rem;
  }
  .sub-quote-wrap--side {
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
  }
  .sub-quote-wrap--side .sub-quote-mark {
    margin-top: 0;
  }
  .sub-quote-txt--side {
    text-align: center;
  }
  .sub-ci-bi-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
  .sub-board-card {
    padding: 1.5rem 1.25rem;
  }
  .sub-ci-bi-btn-wrap {
    gap: 1.25rem;
  }
  .sub-video-list {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .sub-tab-menu {
    gap: 1.5rem;
  }

.sub-introduction-section.sub-section01 .inner-lg {
    padding-top: 13.4375rem;
    padding-bottom: 5rem;
  }
  .sub-introduction-section.sub-section02 {
    padding-top: 2.5rem;
    padding-bottom: 5rem;
  }
  .sub-introduction-section.sub-section03 .sec-title {
    margin-bottom: 3rem;
  }
  .sub-introduction-section.sub-section04 > .inner-lg {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
  .sub-introduction-section.sub-section04 .cont-box {
    min-height: 22rem;
  }
  .sub-introduction-section.sub-section04 .cont-box::before,
  .sub-introduction-section.sub-section04 .cont-box::after {
    width: 16.575rem;
    height: 20rem;
  }

.sub-vision-section.sub-section01 .inner-lg {
    padding-top: 13.4375rem;
    padding-bottom: 5rem;
  }
  .sub-vision-section.sub-section03 {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
  .sub-vision-section.sub-section03 .value-card-list {
    grid-template-columns: 1fr;
    max-width: 40rem;
    width: 100%;
    margin: 0 auto;
  }
  .sub-vision-section.sub-section03 .card-inner {
    padding: 3.75rem 2.5rem;
  }

.sub-board-section.sub-section01 .inner-lg {
    padding-top: 13.4375rem;
    padding-bottom: 5rem;
  }
  .sub-board-section.sub-section02,
  .sub-board-section.sub-section03 {
    padding-bottom: 5rem;
  }

.sub-partners-section.sub-section01 .inner-lg {
    padding-top: 13.4375rem;
    padding-bottom: 5rem;
  }
  .sub-partners-section.sub-section02 {
    padding-bottom: 5rem;
  }

.sub-ci-bi-section.sub-section01 .inner-lg {
    padding-top: 13.4375rem;
    padding-bottom: 5rem;
  }
  .sub-ci-bi-section.sub-section03 {
    padding-top: 3.75rem;
    padding-bottom: 5rem;
  }

.sub-service-kpi-list,
  .sub-dividend-kpi-list {
    flex-direction: column;
    gap: 1.5rem;
  }

  .sub-service-kpi-item,
  .sub-dividend-kpi-item {
    flex: 0 1 1.5rem;
    text-align: center;
    color: #f7f8fa;
  }
  
  .sub-service-kpi-item + .sub-service-kpi-item,
  .sub-dividend-kpi-item + .sub-dividend-kpi-item {
    border-left: 0;
    padding-left: 0;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.4);
  }
  .sub-service-evolution-bg {
    left: -40%;
    width: 80%;
    opacity: 0.6;
  }
  .sub-blockchain-evolution-bg {
    left: -40%;
    width: 80%;
    opacity: 0.6;
  }
  .sub-structure-arch-card-list--row3,
  .sub-structure-arch-card-list--row2 {
    flex-direction: row;
  }
  .sub-structure-arch-card-list--row3 > li,
  .sub-structure-arch-card-list--row2 > li {
    /* flex: none; */
    width: 100%;
  }
  .sub-structure-arch-card {
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    /* flex-direction: row; */
  }
  .sub-structure-arch-infra-list {
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 1.5rem 2rem;
  }
  .sub-structure-arch-infra-list > li {
    /* flex: 1 1 calc(50% - 1rem); */
    width: 100%;
  }
  .sub-structure-flow-list {
    flex-direction: column;
    gap: 2rem;
    padding: 1.5rem;
  }
  .sub-structure-flow-step {
    flex: none;
    width: 100%;
  }
  .sub-structure-section.sub-section02,
  .sub-structure-section.sub-section03 {
    padding-bottom: 5rem;
  }
  .sub-structure-section.sub-section02 .sub-section-stack,
  .sub-structure-section.sub-section03 .sub-section-stack {
    gap: 3rem;
  }
  .sub-service-roadmap-list {
    flex-wrap: wrap;
  }
  
  .sub-service-roadmap-item {
    flex: 1 1 45%;
    padding: 2.5rem;
  }

  .sub-service-audience-list {
    flex-direction: column;
  }
  
  .sub-service-audience-card {
    min-height: 27rem;
    padding: 3rem 3rem;
  }

.sub-news-section.sub-section01 .inner-lg {
    padding-top: 13.4375rem;
    padding-bottom: 5rem;
  }
  .sub-news-section.sub-section02 {
    padding-bottom: 5rem;
  }

.sub-ongoing-section.sub-section01 .inner-lg {
    padding-top: 13.4375rem; /* 160px + header 55px */
    padding-bottom: 5rem;
  }
  .sub-ongoing-section.sub-section02,
  .sub-ongoing-section.sub-section04 {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
  .sub-ongoing-section.sub-section03 {
    padding-top: 5rem;
  }
  .sub-ongoing-section.sub-section02 + .sub-ongoing-section.sub-section03 {
    padding-top: 0;
  }

.sub-live-section.sub-section01 .inner-lg {
    padding-top: 13.4375rem; /* 160px + header 55px */
    padding-bottom: 5rem;
  }
  .sub-live-section.sub-section02 {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
  .sub-live-section.sub-section03 {
    padding-bottom: 5rem;
  }

.sub-service-section.sub-section01 .inner-lg,
.sub-starpic-section.sub-section01 .inner-lg,
.sub-punkvism-section.sub-section01 .inner-lg,
.sub-podoal-section.sub-section01 .inner-lg,
.sub-my1pick-section.sub-section01 .inner-lg {
  padding-top: 13.4375rem;
  padding-bottom: 5rem;
}
  .sub-service-section.sub-section03,
  .sub-starpic-section.sub-section03,
  .sub-punkvism-section.sub-section03,
  .sub-podoal-section.sub-section03,
  .sub-my1pick-section.sub-section03,
  .sub-blockchain-section.sub-section02 {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
  .sub-service-section.sub-section05,
  .sub-starpic-section.sub-section05,
  .sub-punkvism-section.sub-section05,
  .sub-podoal-section.sub-section05,
  .sub-my1pick-section.sub-section05 {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }

.sub-funding-section.sub-section01 .inner-lg{
    padding-top: 13.4375rem;
    padding-bottom: 5rem;
  }

  .sub-funding-section.sub-section02{
    padding-top: 5rem;
    padding-bottom: 3rem;
  }

  .sub-guide-section.sub-section01 .inner-lg{
    padding-top: 13.4375rem;
    padding-bottom: 5rem;
  }

  .sub-guide-hero-body{
    margin: 0 auto;
  }

  .sub-guide-section.sub-section02{
    padding-top: 5rem;
    padding-bottom: 3rem;
  }

  .sub-guide-kpi-list{
    flex-direction: column;
    gap: 1.5rem;
  }

  .sub-guide-kpi-item{
    flex: 0 1 1.5rem;
  }

  .sub-guide-kpi-item + .sub-guide-kpi-item {
    border: 0;
    padding: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.4);
    padding-top: 2.5rem;
  }

  .tokenprocess {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }

  .tokenprocess_line{
    display: none;
  }

  .tokenprocess_item {
    width: 100%;
  }

  .tokenprocess_item span{
    font-size: 1rem;
  }
  .tokenprocess_item strong{
    font-size: 1.5rem;
  }
  .tokenprocess_item p{
    font-size: 1.2rem;
  }

.platform{
  display: block;
}

.platform li{
  width: 100%;
  border-radius: 28px;
  border: 1px solid transparent;
  background: linear-gradient(to bottom, rgba(247, 248, 250, 0.04), rgba(31, 118, 194, 0.04));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  display: flex;
  gap: 2.5rem;
  padding: 2.5rem;
  align-items: center;
}

.platform li + li{
  margin-top: 2rem;
}

.platform li img{
  width: 5rem;
  height: 5rem;
}

.platform li p{
  font-size: 1.1rem;
  color: #999;
  line-height: 1.5;
}

.platform li p strong{
  display: block;
  font-size: 1.5rem;
  color: #fff;
  margin-bottom: 0.8rem;
}


.sub-dividend-portal {
    grid-template-columns: 1fr;
  }
  .sub-dividend-staking {
    grid-column: auto;
  }

.sub-global-section.sub-section04 .sub-section-stack {
    gap: 3rem;
  }

.sub-global-section.sub-section01 .inner-lg {
    padding-top: 13.4375rem; /* 160px + header 55px */
    padding-bottom: 5rem;
  }
  .sub-global-section.sub-section02,
  .sub-global-section.sub-section03,
  .sub-global-section.sub-section04 {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
  .sub-global-section.sub-section03,
  .sub-global-section.sub-section04 {
    padding-top: 0;
  }

}

@media (max-width: 575px) {
.sub-partner-list {
    --partner-gap: 1.25rem;
    justify-content: flex-start;
  }
  .sub-partner-list li {
    flex: 0 0 calc((100% - var(--partner-gap)) / 2);
    max-width: calc((100% - var(--partner-gap)) / 2);
  }

  .sub-ci-bi-btn-wrap a {
    width: 18rem;
    max-width: 100%;
  }

  .sub-structure-arch-card-list {
    flex-direction: column;
  }

  .sub-structure-arch-card-tags--grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

}

@media (max-width: 480px) {
  /* customer · roadmap */
  .sub-customer-section.sub-section01 .inner-lg {
    padding-top: 12.5rem;
    padding-bottom: 4rem;
  }
  .sub-customer-section.sub-section01 {
    min-height: 32rem;
  }
  .sub-roadmap-section.sub-section01 {
    padding-top: 7.4rem;
    padding-bottom: 3.8rem;
  }
  .sub-roadmap-kpi-item {
    flex: 1 1 100%;
  }
  .sub-roadmap-kpi-item:nth-child(n + 2) {
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.4);
  }
  .sub-roadmap-kpi-item:nth-child(n + 3) {
    padding-top: 1.5rem;
  }
  .sub-roadmap-section.sub-section02 {
    padding-bottom: 4rem;
  }
  .sub-customer-inquiry-item {
    flex: 0 0 100%;
  }
  .sub-customer-form {
    padding: 1.5rem 1.25rem;
    gap: 2rem;
  }
  .sub-customer-form-agree {
    padding: 1.25rem;
  }
  .sub-location-wrap .sub-customer-section.sub-section02 {
    padding-top: 2rem;
    padding-bottom: 5rem;
  }
  .location-info-item {
    gap: 1.5rem;
    padding: 1rem 0;
  }
  .location-info-icon {
    width: 4rem;
    height: 4rem;
  }
  .location-info-icon img {
    width: 1.75rem;
    height: 1.75rem;
  }


.sub-quote-wrap {
    flex-direction: column;
    align-items: center;
    padding: 3rem 1.25rem;
  }
  .sub-quote-mark {
    margin-top: 0;
  }

.sub-member-list {
    gap: 1.875rem;
  }
  .sub-member-card-img {
    width: 11.25rem;
  }
  .sub-member-card-body {
    padding: 1.25rem 1.5rem;
  }
  .sub-section-stack {
    gap: 3rem;
  }
  .sub-benefit-card {
    padding: 1.25rem 1.5rem;
  }
  .sub-benefit-card--stack {
    padding: 2.5rem 1.5rem;
  }

  .sub-benefit-card--stack .sub-benefit-card-head{
    flex-direction: column;
    align-items: center;
  }

  .sub-benefit-card-txt{
    text-align: center;

  }

.sub-introduction-section.sub-section01 .inner-lg {
    padding-top: 11.875rem;
    padding-bottom: 3.75rem;
  }
  .sub-introduction-section.sub-section02 {
    padding-top: 1.875rem;
    padding-bottom: 3.75rem;
  }
  .sub-introduction-section.sub-section02 .value-card-list li {
    width: calc(50% - 0.625rem);
  }
  .sub-introduction-section.sub-section02 .card-inner {
    height: 12rem;
    gap: 1rem;
  }
  .sub-introduction-section.sub-section02 .icon-wrap {
    width: 3.75rem;
    height: 3.75rem;
  }
  .sub-introduction-section.sub-section04 > .inner-lg {
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
  }
  .sub-introduction-section.sub-section04 .cont-box {
    border-radius: 1.25rem;
  }
  .sub-introduction-section.sub-section04 .cont-box {
    min-height: 17.5rem;
  }
  .sub-introduction-section.sub-section04 .cont-box::before,
  .sub-introduction-section.sub-section04 .cont-box::after {
    width: 13.26rem;
    height: 16rem;
  }

.sub-vision-section.sub-section01 .inner-lg {
    padding-top: 11.875rem;
    padding-bottom: 3.75rem;
  }
  .sub-vision-section.sub-section03 {
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
  }
  .sub-vision-section.sub-section03 .card-inner {
    padding: 2.5rem 1.5rem;
    gap: 1.875rem;
  }
  .sub-vision-section.sub-section03 .card-head {
    gap: 1.875rem;
    padding: 0;
  }
  .sub-vision-section.sub-section03 .icon-wrap {
    width: 3.75rem;
    height: 3.75rem;
  }

.sub-board-section.sub-section01 .inner-lg {
    padding-top: 11.875rem;
    padding-bottom: 3.75rem;
  }
  .sub-board-section.sub-section02,
  .sub-board-section.sub-section03 {
    padding-bottom: 3.75rem;
  }

.sub-partners-section.sub-section01 .inner-lg {
    padding-top: 11.875rem;
    padding-bottom: 3.75rem;
  }
  .sub-partners-section.sub-section02 {
    padding-bottom: 3.75rem;
  }

.sub-ci-bi-section.sub-section01 .inner-lg {
    padding-top: 11.875rem;
    padding-bottom: 3.75rem;
  }
  .sub-ci-bi-section.sub-section03 {
    padding-top: 2.5rem;
    padding-bottom: 3.75rem;
  }

.sub-service-audience-card {
    min-height: 35rem;
    padding: 2rem 2rem;
  }

  .sub-service-roadmap-list {
    flex-direction: column;
  }

.sub-news-section.sub-section01 .inner-lg {
    padding-top: 11.875rem;
    padding-bottom: 3.75rem;
  }
  .sub-news-section.sub-section02 {
    padding-bottom: 3.75rem;
  }

.sub-ongoing-section.sub-section01 .inner-lg {
    padding-top: 11.875rem;
    padding-bottom: 3.75rem;
  }
  .sub-ongoing-section.sub-section02,
  .sub-ongoing-section.sub-section04 {
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
  }

.sub-live-section.sub-section01 .inner-lg {
    padding-top: 11.875rem;
    padding-bottom: 3.75rem;
  }
  .sub-live-section.sub-section02 {
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
  }
  .sub-live-section.sub-section03 {
    padding-bottom: 3.75rem;
  }

.sub-service-section.sub-section01 .inner-lg,
  .sub-starpic-section.sub-section01 .inner-lg,
  .sub-punkvism-section.sub-section01 .inner-lg,
  .sub-podoal-section.sub-section01 .inner-lg,
  .sub-my1pick-section.sub-section01 .inner-lg {
    padding-top: 11.875rem;
    padding-bottom: 3.75rem;
  }
  .sub-service-section.sub-section03,
  .sub-starpic-section.sub-section03,
  .sub-punkvism-section.sub-section03,
  .sub-podoal-section.sub-section03,
  .sub-my1pick-section.sub-section03,
  .sub-blockchain-section.sub-section02 {
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
  }
  .sub-structure-section.sub-section02,
  .sub-structure-section.sub-section03 {
    padding-bottom: 3.75rem;
  }
  .sub-structure-section.sub-section02 .sub-section-stack,
  .sub-structure-section.sub-section03 .sub-section-stack {
    gap: 2.5rem;
  }
  .sub-service-section.sub-section05,
  .sub-starpic-section.sub-section05,
  .sub-punkvism-section.sub-section05,
  .sub-podoal-section.sub-section05,
  .sub-my1pick-section.sub-section05 {
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
  }

.sub-funding-section.sub-section01 .inner-lg{
    padding-top: 11.875rem;
    padding-bottom: 3.75rem;
  }

  .sub-guide-section.sub-section01 .inner-lg{
    padding-top: 11.875rem;
    padding-bottom: 3.75rem;
  }

  .sub-starpic-section.sub-section02 {
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
  }

  .tokenprocess_detail{
    text-align: left;
    margin: 0;
    flex: 1;
  }

  .tokenprocess_line{
    display: block;
    position: absolute;
    top: 0; /* 원 위치에 맞춤 */
    left: 4rem;
    height: 100%;
    background: rgba(255,255,255,0.2);
    z-index: 2;
    width: 2px;
    /* transform: rotate(90deg); */
  }

  .tokenprocess {
    display: block;
    padding: 3rem 2.5rem;
  }

  .tokenprocess_item{
    display: flex;
    align-items: flex-start;
    gap: 2.5rem;
    flex-direction: row;
    padding: 3.75rem 1.5rem;
  }

  .tokenprocess_item .icon_wrap{
    margin: 0;
    flex-shrink: 0;
  }

  /* .progressbar {
    left: 5%;
  } */

  .funding_flow li{
    width: 20rem;
  }


.sub-dividend-staking-list {
    flex-direction: column;
  }
  .sub-dividend-staking-list li {
    flex: none;
    width: 100%;
  }
  .sub-dividend-staking-card {
    height: auto;
  }
  .sub-dividend-staking-form {
    flex-direction: column;
    align-items: stretch;
  }
  .sub-dividend-staking-input-wrap {
    flex: none;
    width: 100%;
  }
  .sub-dividend-staking-btn-wrap {
    justify-content: center;
  }

.sub-global-section.sub-section04 .sub-section-stack {
    gap: 2.5rem;
  }

.sub-global-section.sub-section01 .inner-lg {
    padding-top: 11.875rem;
    padding-bottom: 3.75rem;
  }
  .sub-global-section.sub-section02,
  .sub-global-section.sub-section03,
  .sub-global-section.sub-section04 {
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
  }
  .sub-global-section.sub-section03,
  .sub-global-section.sub-section04 {
    padding-top: 0;
  }

  .sub-structure-arch-infra-list {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    width: 100%;
    list-style: none;
  }

  .sub-structure-arch-card-list--stack {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    width: 100%;
    list-style: none;
  }

  .sub-roadmap-kpi-item:nth-of-type(2),
  .sub-roadmap-kpi-item:nth-of-type(4) {
    border-left: none;
  }
}

@media (max-width: 420px) {
.mb-420-none {
    display: none;
  }
}

/* 투자 참여 가이드 - 다운로드 추가 */
.sub-guide-download {
  min-height: 10rem;
  border-radius: 0;
  padding: 2.5rem 0;
}
.sub-guide-download.sub-glass-card::before {
  border-radius: 0;
  inset: 0 -1px;
}
.sub-guide-download > .inner-lg {
  display: flex;
  flex-direction: column;
  /* gap: 0 12.5rem; */
  gap: 2.5rem;
}
.sub-guide-download-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.5rem;
  flex: 1;
}
/* .sub-guide-download-inner + .sub-guide-download-inner::before {
  content: '';
  position: absolute;
  top: 0;
  left: -6.25rem;
  width: 1px;
  height: 100%;
  background: rgba(255,255,255,0.4);
} */
.sub-guide-download-icon {
  flex-shrink: 0;
  width: 5rem;
  height: 5rem;
}
.sub-guide-download-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sub-guide-download-txt {
  flex: 1;
  min-width: 0;
  /* max-width: 36rem; */
  max-width: none;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.sub-guide-download-title {
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0;
}
.sub-guide-download-desc {
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  color: #999;
  margin-bottom: 0;
}
.sub-guide-download-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 12rem;
  padding: 1.25rem 2.5rem;
  border-radius: 20px;
  background: linear-gradient(to bottom, rgba(254, 58, 139, 0.8), rgba(106, 54, 201, 0.8));
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.2;
  color: #f7f8fa;
  text-align: center;
  text-decoration: none;
  transition: opacity 0.25s ease;
}
.sub-guide-download-btn:hover {
  opacity: 0.85;
}
@media (max-width: 1600px) {
  .sub-guide-download > .inner-lg {
    flex-direction: column;
    gap: 2.5rem;
  }
  .sub-guide-download-inner + .sub-guide-download-inner::before {
    display: none;
  }
  .sub-guide-download-txt {
    max-width: none;
  }
}
@media (max-width: 767px) {
  .sub-guide-download-inner {
    flex-direction: column;
    text-align: center;
  }
  .sub-guide-download-txt {
    align-items: center;
  }
}