/* ==========================================================================
   pages/sub.css — 내부 서브페이지 공통 컴포넌트
   ========================================================================== */

body.theme-pink   { --theme-weak: var(--color-brand-red-weak); --theme-solid: var(--color-brand-red-solid); }
body.theme-purple { --theme-weak: #EFE9FE; --theme-solid: #7242EA; }
body.theme-blue   { --theme-weak: #C9E2FF; --theme-solid: #3182F6; }
body.theme-mint   { --theme-weak: #BCE9E9; --theme-solid: #12A594; }
body.theme-gray   { --theme-weak: #F5F5F5; --theme-solid: var(--color-neutral-800); }

body.theme-purple .page-hero,
body.theme-purple .cta-band { background: var(--color-deep-purple-100, #D7C8FB); }

.page-content { padding-block: clamp(40px, 6vw, 64px); }

/* ── 브레드크럼 ────────────────────────────────────────── */
.breadcrumb {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  margin-bottom: min(40px, 2.0833vw);
  color: var(--color-neutral-900);
  font-size: 16px;
  font-weight: 500;
  line-height: 100%;
}
.breadcrumb a { color: inherit; text-decoration: none; }
.breadcrumb a:hover { color: var(--color-neutral-700); }
.breadcrumb__home { display: inline-flex; }
.breadcrumb__sep { display: inline-flex; }

/* ── 히어로 (브레드크럼 + 제목 + 설명 + 캐릭터) ─────────── */
.page-hero {
  position: relative;
  background: var(--theme-weak, var(--color-brand-red-weak));
  height: clamp(240px, 11.6071vw + 121.14px, 344px);
  display: flex;
  align-items: center;
}
.page-hero__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-24);
  width: 100%;
  padding-right: calc(clamp(240px, 11.6071vw + 121.14px, 344px) + var(--space-24));
}
.page-hero__title {
  margin: 0;
  color: var(--color-neutral-900);
  font-size: min(60px, 3.125vw);
  font-weight: var(--font-weight-bold);
  line-height: 1.3;
  letter-spacing: -0.02em;
}
.page-hero__desc {
  margin: min(16px, 0.8333vw) 0 0;
  color: var(--color-neutral-900);
  font-size: clamp(15px, 0.558vw + 9.29px, 20px);
  font-weight: var(--font-weight-medium);
  line-height: 1.5;
}
.page-hero__char {
  position: absolute;
  top: 50%;
  right: calc((100vw - var(--header-w)) / 2);
  transform: translateY(-50%);
  width: clamp(240px, 11.6071vw + 121.14px, 264px);
  height: clamp(240px, 11.6071vw + 121.14px, 265px);
}

@keyframes page-hero-rise {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes page-hero-rise-char {
  from { opacity: 0; transform: translateY(-50%) translateY(20px); }
  to { opacity: 1; transform: translateY(-50%) translateY(0); }
}
.js-enabled .page-hero__desc {
  opacity: 0;
  animation: page-hero-rise .6s cubic-bezier(.33, 1, .68, 1) forwards;
}
.js-enabled .page-hero__char {
  opacity: 0;
  animation: page-hero-rise-char .6s cubic-bezier(.33, 1, .68, 1) .15s forwards;
}
@media (prefers-reduced-motion: reduce) {
  .js-enabled .page-hero__desc,
  .js-enabled .page-hero__char { animation: none; opacity: 1; }
}

@media (max-width: 63.99rem) {
  .page-hero { min-height: auto; }
  .page-hero__inner { align-items: flex-start; padding-right: 0; }
  .page-hero__char { position: static; transform: none; width: 64px; height: 64px; }
  .js-enabled .page-hero__char { animation-name: page-hero-rise; }
}

/* ── 서브 탭(같은 카테고리 하위 페이지 이동) ────────────── */
.page-tabs {
  position: -webkit-sticky;
  position: sticky;
  top: var(--header-h);
  z-index: var(--z-sticky);
  background: var(--color-white);
  border-bottom: 1px solid var(--border);
}
.page-tabs[data-tabs-reveal] { display: none; position: fixed; top: var(--header-h); left: 0; right: 0; }
.page-tabs[data-tabs-reveal].is-visible { display: block; }
.page-tabs[data-tabs-reveal], .page-section .page-tabs[data-tabs-reveal] { border-bottom: 1px solid var(--border); }
.page-section .page-tabs[data-tabs-reveal]::after { content: none; }
.page-section .page-tabs { border-bottom: none; }
.page-section .page-tabs::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 100vw;
  margin-left: -50vw;
  height: 1px;
  background: var(--border);
}
.page-tabs__list {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  height: clamp(52px, 1.5625vw + 36px, 66px);
  overflow-x: auto; scrollbar-width: none;
}
.page-tabs__list::-webkit-scrollbar { display: none; }
.page-tabs__list > li { display: flex; }
.page-tabs__list > li.page-tabs__title,
.page-tabs__list > li:has(> .page-tabs__title) { position: sticky; left: 0; z-index: 1; background: var(--page-tabs-bg, var(--color-white)); }
@media (min-width: 64rem) {
  .page-tabs:has(.page-tabs__title):not(.page-tabs--category, [data-tabs-reveal], .page-section .page-tabs) { border-bottom-color: transparent; }
  .page-tabs:has(.page-tabs__title):not(.page-tabs--category, [data-tabs-reveal], .page-section .page-tabs)::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: -1px; z-index: 2; height: 1px; background: var(--border); pointer-events: none;
  }
}
.page-section .page-tabs .page-tabs__list { justify-content: safe center; }
.page-tabs__link {
  display: inline-flex;
  align-items: center;
  padding: 0 clamp(8px, 1.3393vw - 5.71px, 20px);
  color: var(--color-neutral-700);
  font-size: clamp(15px, 0.1116vw + 13.86px, 16px);
  font-weight: var(--font-weight-medium);
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
}
.page-tabs__link[aria-current="page"] {
  color: var(--color-neutral-900);
  font-weight: var(--font-weight-bold);
  border-bottom-color: var(--color-neutral-900);
}
.page-tabs__title {
  display: inline-flex;
  align-items: center;
  background: var(--page-tabs-bg, var(--color-white));
  padding: 0 calc(clamp(8px, 1.3393vw - 5.71px, 20px) + clamp(16px, 2.6786vw - 11.43px, 40px)) 0 clamp(8px, 1.3393vw - 5.71px, 20px);
  color: var(--color-neutral-900);
  font-size: clamp(16px, 0.4464vw + 11.43px, 20px);
  font-weight: var(--font-weight-bold);
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
}

.page-tabs--category {
  --page-tabs-bg: var(--color-bg-gray);
  background: var(--color-bg-gray);
  border-bottom: none;
}
.page-tabs__list { --tab-fade-left: 0px; }
.page-tabs__list[data-more-right]:not([data-more-left]) { -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 48px), transparent); }
.page-tabs__list[data-more-left]:not([data-more-right]) { -webkit-mask-image: linear-gradient(to right, #000 var(--tab-fade-left), transparent var(--tab-fade-left), #000 calc(var(--tab-fade-left) + 48px)); mask-image: linear-gradient(to right, #000 var(--tab-fade-left), transparent var(--tab-fade-left), #000 calc(var(--tab-fade-left) + 48px)); }
.page-tabs__list[data-more-left][data-more-right] { -webkit-mask-image: linear-gradient(to right, #000 var(--tab-fade-left), transparent var(--tab-fade-left), #000 calc(var(--tab-fade-left) + 48px), #000 calc(100% - 48px), transparent); mask-image: linear-gradient(to right, #000 var(--tab-fade-left), transparent var(--tab-fade-left), #000 calc(var(--tab-fade-left) + 48px), #000 calc(100% - 48px), transparent); }

/* ── 섹션 공통 ─────────────────────────────────────────── */
.page-section {
  padding-top: min(80px, 4.1667vw);
  padding-bottom: min(160px, 8.3333vw);
}
.page-section--tint { background: var(--theme-weak, var(--color-neutral-100)); }
body.theme-purple .page-section.partner-section { background: var(--color-deep-purple-50, #F0EAFE); }
body.theme-blue .page-section.partner-section { background: var(--color-blue-50, #E8F3FF); }
.page-section__head { text-align: left; margin-bottom: min(48px, 2.5vw); }
.page-section__title {
  color: var(--color-neutral-900);
  font-size: clamp(26px, 1.5625vw + 10px, 40px);
  font-weight: var(--font-weight-bold);
  line-height: 1.4;
}
/* [Mod] 261019 partner-section 제목 — PC 1920: 32, 1024: 24 비율 축소(모바일은 아래 미디어쿼리 값 유지) */
.partner-section .page-section__title { font-size: clamp(24px, 0.8929vw + 14.86px, 32px); }
.page-section__title mark { background: none; color: var(--theme-solid, var(--color-brand-red-solid)); }
.page-section__desc {
  margin-top: var(--space-16);
  color: var(--color-neutral-700);
  font-size: clamp(15px, 0.3348vw + 11.572px, 18px);
  font-weight: var(--font-weight-medium);
  line-height: 1.6;
}

/* ── 통계 카드 (엘페이·엘포인트 등) ───────────────────── */
.stat-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, min(308px, 16.0417vw));
  justify-content: center;
  gap: var(--space-16);
  margin-top: min(56px, 2.9167vw);
}
.stat-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--theme-weak);
  border-radius: var(--radius-16);
  padding: clamp(20px, 1.7857vw + 1.71px, 36px) clamp(12px, 1.3393vw - 1.71px, 24px);
  text-align: center;
}
.stat-card__label { color: var(--color-neutral-600); font-size: clamp(14px, 0.2232vw + 11.72px, 16px); }
.stat-card__value { margin-top: var(--space-4); font-size: clamp(22px, 0.6696vw + 15.14px, 28px); font-weight: var(--font-weight-bold); color: var(--color-neutral-900); font-variant-numeric: tabular-nums; }
@media (max-width: 63.99rem) {
  .stat-cards { grid-template-columns: repeat(2, 1fr); }
  .stat-card { height: auto; padding: var(--space-16); }
  .stat-card__value { font-size: 1.375rem; }
}

/* ── 피처 로우 (이미지 ↔ 텍스트 교차 반복) ─────────────── */
.feature-rows { display: grid; gap: min(200px, 10.4167vw); margin-top: 0; }
.page-section__head ~ .feature-rows { margin-top: min(120px, 6.25vw); }
.feature-row { display: grid; grid-template-columns: 1fr 1fr; gap: min(76px, 3.9583vw); align-items: center; }
.feature-row--reverse .feature-row__media { order: 2; }
.feature-row:not(.feature-row--reverse) .feature-row__media { justify-self: end; }
.feature-row__media {
  width: min(632px, 32.9167vw);
  height: min(400px, 20.8333vw);
  background: var(--color-neutral-100);
  border-radius: var(--radius-16);
  overflow: hidden;
}
.feature-row__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* [Mod] 261019 피처 제목 전체 페이지 — PC 1920: 40, 1024: 28 비율 축소(모바일은 아래 미디어쿼리 값 유지) */
.feature-row__title {
  color: var(--color-neutral-900);
  font-size: clamp(28px, 1.3393vw + 14.29px, 40px);
  font-weight: var(--font-weight-bold);
  line-height: 1.4;
}
.feature-row__desc {
  word-break: keep-all;
  text-wrap: balance;
  margin-top: var(--space-16);
  color: var(--color-neutral-700);
  font-size: clamp(16px, 0.9375vw, 18px);
  font-weight: var(--font-weight-medium);
  line-height: 1.6;
}
.feature-row__content { --slide-up-delay: 150ms; }
br.br-narrow { display: none; }
br.br-mo { display: none; }
@media (max-width: 79.99rem) { br.br-narrow { display: inline; } }
br.br-xs { display: none; }
@media (max-width: 28.125rem) { br.br-xs { display: inline; } }
.feature-row--reverse .feature-row__content { text-align: right; }
@media (max-width: 63.99rem) {
  .feature-row, .feature-row--reverse { grid-template-columns: 1fr; text-align: center; }
  .feature-row--reverse .feature-row__media { order: 0; }
  .feature-row--reverse .feature-row__content { text-align: center; }
}

/* ── 파트너사 로고 그리드 ──────────────────────────────── */
.partner-section { background: var(--color-bg-gray); padding-block: clamp(40px, 6vw, 72px); }
.partner-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: var(--space-16);
  margin-top: var(--space-32);
}
.partner-tile { background: var(--color-white); border-radius: var(--radius-16); padding: var(--space-16) var(--space-8); text-align: center; }
.partner-tile__logo {
  width: 40px; height: 40px; margin-inline: auto;
  border-radius: var(--radius-full);
  background: var(--color-neutral-100);
  display: grid; place-items: center;
  font-size: 11px; font-weight: var(--font-weight-bold); color: var(--color-neutral-500);
}
.partner-tile__logo img { display: block; width: min(88px, 4.5833vw); height: min(88px, 4.5833vw); object-fit: contain; }
.partner-tile__name {
  margin-top: var(--space-8);
  color: var(--color-neutral-900);
  text-align: center;
  font-size: clamp(12px, 0.7292vw, 14px);
  font-weight: var(--font-weight-semibold);
  line-height: 1;
}
@media (max-width: 63.99rem) {
  .partner-grid { grid-template-columns: repeat(4, 1fr); gap: var(--space-12); }
  .partner-tile { padding: var(--space-12) var(--space-4); }
  .partner-tile__name { font-size: 11px; }
}

/* ── FAQ 아코디언 ──────────────────────────────────────── */
.faq { border-top: 1px solid var(--color-neutral-900); border-bottom: 1px solid var(--color-neutral-900); margin-top: min(20px, 1.0417vw); }
dl.faq { margin-bottom: 0; }
.faq__q-wrap { margin: 0; }
dd.faq__a { margin: 0; }
.faq__item { border-bottom: 1px solid var(--border); }
.faq__item:last-child { border-bottom: 0; }
.faq__q {
  width: 100%; display: flex; align-items: center; gap: var(--space-12);
  padding: clamp(20px, 0.558vw + 14.29px, 25px) 0;
  background: none; border: 0; text-align: left;
  font-weight: var(--font-weight-semibold); color: var(--color-neutral-900); cursor: pointer;
}
.faq__q-mark,
.faq__a-mark {
  flex: 0 0 auto;
  color: var(--color-neutral-900);
  font-size: clamp(14px, 0.9375vw, 18px);
  font-weight: var(--font-weight-bold);
  line-height: 1.6;
}
.faq__q-text {
  flex: 1 1 auto;
  color: var(--color-neutral-900);
  font-size: clamp(16px, 0.9375vw, 18px);
  font-weight: var(--font-weight-bold);
  line-height: 1.6;
}
.faq__icon { flex: 0 0 auto; transition: transform var(--dur-base) var(--ease-out); margin-top: 2px; }
.faq__q[aria-expanded="true"] .faq__icon { transform: rotate(180deg); }
.faq__a { max-height: 0; overflow: hidden; transition: max-height var(--dur-base) var(--ease-out); }
.faq__a-inner { display: flex; gap: var(--space-12); padding-bottom: var(--space-20); }
.faq__a-text {
  color: var(--color-neutral-900);
  font-size: clamp(16px, 0.9375vw, 18px);
  font-weight: var(--font-weight-medium);
  line-height: 1.6;
}

/* ── 하단 CTA 밴드 ─────────────────────────────────────── */
.cta-band { background: var(--theme-weak); padding-block: clamp(32px, 5vw, 56px); }
.cta-band__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--space-24); }
.cta-band__title {
  color: var(--color-neutral-900);
  font-size: clamp(24px, 1.6667vw, 32px);
  font-weight: var(--font-weight-bold);
  line-height: 1.4;
}
.cta-band__btn {
  display: inline-flex; align-items: center; gap: var(--space-8);
  margin-top: min(24px, 1.25vw);
  background: var(--theme-solid, var(--color-deep-purple-500)); color: var(--color-white);
  padding: min(16px, 0.8333vw) min(20px, 1.0417vw);
  border-radius: var(--radius-full);
  text-decoration: none;
  font-size: clamp(14px, 0.8333vw, 16px);
  font-weight: var(--font-weight-bold);
  line-height: 1;
}
.cta-band__inner .culture-cta__img { flex: 0 0 auto; width: clamp(200px, 14.5833vw, 280px); height: clamp(134px, 9.7917vw, 188px); }
@media (max-width: 63.99rem) {
  .cta-band__inner { flex-direction: column; text-align: center; }
  .cta-band__inner .culture-cta__img { width: 96px; }
}

/* ── 리스트형 카드(뉴스 등) ────────────────────────────── */
.list-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-32); margin-top: var(--space-40); }
.list-card { display: grid; gap: var(--space-16); text-decoration: none; }
.list-card__thumb { width: 100%; aspect-ratio: 4/3; background: var(--color-neutral-100); border-radius: var(--radius-16); }
.list-card__meta { display: flex; gap: var(--space-8); color: var(--color-neutral-500); font-size: var(--font-size-body-5); }
.list-card__title { color: var(--color-neutral-900); font-weight: var(--font-weight-bold); line-height: 1.5; }
.list-card__tags { display: flex; flex-wrap: wrap; gap: var(--space-8); }
.list-card__tag { font-size: var(--font-size-body-5); color: var(--color-neutral-500); background: var(--color-neutral-100); border-radius: var(--radius-full); padding: 4px 10px; }
@media (max-width: 63.99rem) { .list-cards { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 40rem) { .list-cards { grid-template-columns: 1fr; } }

/* ── 페이지네이션 ──────────────────────────────────────── */
.pagination { display: flex; align-items: center; justify-content: center; gap: var(--space-8); margin-top: var(--space-40); }
.pagination__btn, .pagination__num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: var(--radius-full);
  color: var(--color-neutral-500); text-decoration: none; font-size: var(--font-size-body-4);
  background: none; border: 0; cursor: pointer;
}
.pagination__num[aria-current="page"] { background: var(--color-neutral-900); color: var(--color-white); font-weight: var(--font-weight-bold); }

/* ── 일반 표 ───────────────────────────────────────────── */
.table-scroll { overflow-x: auto; margin-top: var(--space-24); }
.table-scroll .data-table { margin-top: 0; }
.data-table { width: 100%; min-width: 480px; border-collapse: collapse; margin-top: var(--space-24); }
.data-table caption { caption-side: top; text-align: left; font-size: var(--font-size-body-5); color: var(--color-neutral-500); padding-bottom: var(--space-8); }
.data-table th, .data-table td { padding: var(--space-16); text-align: center; border-bottom: 1px solid var(--border); font-size: var(--font-size-body-4); }
.data-table thead th { background: var(--color-neutral-100); color: var(--color-neutral-700); font-weight: var(--font-weight-semibold); }
.data-table tbody tr:last-child.data-table__total td { font-weight: var(--font-weight-bold); }

/* ── 도넛 차트 자리(주주구성 등) ───────────────────────── */
.donut-figure { background: var(--color-neutral-100); border-radius: var(--radius-16); padding: clamp(24px, 4vw, 40px); margin-top: var(--space-24); aspect-ratio: 16/7; }
@media (max-width: 63.99rem) { .donut-figure { aspect-ratio: 1/1; } }

/* ── 연혁 타임라인 ─────────────────────────────────────── */
.history-split { --history-gap: 0px; display: grid; grid-template-columns: minmax(0, 590fr) minmax(0, 690fr); column-gap: var(--history-gap); align-items: start; margin: min(100px, 5.2083vw) 0 0; }
.history-stage { position: sticky; top: calc(var(--header-h) + min(118px, 6.1458vw)); width: 100%; aspect-ratio: 590 / 374; margin-top: min(118px, 6.1458vw); }
.history-stage__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius-16); background: var(--color-neutral-100); display: none; }
.history-stage__img.is-prev { display: block; z-index: 1; }
.history-stage__img.is-active { display: block; z-index: 2; }
.history-stage.is-ready .history-stage__img.is-active { animation: history-stage-wipe 0.6s cubic-bezier(0.33, 1, 0.68, 1) both; }
@keyframes history-stage-wipe {
  from { clip-path: inset(100% 0 0 0); }
  to { clip-path: inset(0 0 0 0); }
}
/* [Mod] 261020 */
.history-timeline { list-style: none; margin: 0; padding: 0; position: relative; display: flex; flex-direction: column; gap: min(160px, 8.3333vw); }
.history-timeline::before { content: ""; position: absolute; left: 40px; top: 0; bottom: 0; width: 1px; background: var(--border); }
.history-year { position: relative; min-height: min(518px, 26.9792vw); padding-left: 40px; scroll-margin-top: calc(var(--header-h) + 68px); }
.history-year--noimg { min-height: 0; }
@media (min-width: 64rem) {
  .js-enabled .history-year.slide-up { opacity: 1; transform: none; transition: none; }
}
#history-top { scroll-margin-top: var(--header-h); }
.history-year__dot { --hd: clamp(12px, 0.8929vw + 2.86px, 20px); position: absolute; left: calc(40px - var(--hd) / 2); top: calc(min(60px, 3.125vw) * 0.65 - var(--hd) / 2); width: var(--hd); height: var(--hd); border-radius: 50%; background: var(--color-brand-red-solid); }
.history-year__body { margin-left: 30px; display: flow-root; }
.history-year:first-child .history-year__dot { top: 0; }
.history-year:first-child .history-year__num { margin-top: calc(clamp(12px, 0.8929vw + 2.86px, 20px) / 2 - min(60px, 3.125vw) * 0.65); }
.history-year__num {
  margin: 0 0 24px;
  color: var(--color-neutral-900);
  font-size: min(60px, 3.125vw);
  font-weight: var(--font-weight-bold);
  line-height: 1.3;
  letter-spacing: -0.02em;
}
ul.history-year__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
  color: var(--color-neutral-900);
  font-size: clamp(15px, 0.3348vw + 11.572px, 18px);
  font-weight: var(--font-weight-medium);
  line-height: 1.6;
}

ul.history-year__list li { position: relative; padding-left: 24px;}
ul.history-year__list li::before {
  content: "";
  position: absolute;
  left: 14px;
  top: calc(0.8em - 2px);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--color-neutral-900);
}
.history-year__item--bold { font-weight: var(--font-weight-bold); }
.history-year__subs { display: flex; flex-direction: column; gap: min(60px, 3.125vw); margin-top: var(--space-24); }
.history-year__subnum {
  margin: 0 0 6px;
  color: var(--color-neutral-900);
  font-size: clamp(20px, 0.8929vw + 10.86px, 28px);
  font-weight: var(--font-weight-bold);
  line-height: 1.4;
}
@media (max-width: 63.99rem) {
  .history-split { grid-template-columns: minmax(0, 1fr); column-gap: 0; }
  .history-stage { position: static; }
  .history-timeline::before { left: 4px; }
  .history-year { padding-left: 20px; }
  .history-year__dot { left: calc(4px - var(--hd) / 2); }
  .history-year__dot { top: calc(min(60px, 3.125vw) * 0.65 - var(--hd) / 2); }
  .history-year__body { margin-left: 0; }
}

/* ── 준법경영/ESG 카드 그리드 ──────────────────────────── */
/* ── ESG 카드 3열 (환경 · 사회 · 지배구조) ─────────────── */
.esg-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: min(16px, 0.8333vw); margin-top: clamp(48px, 4.1667vw, 80px); }
.esg-card__media { aspect-ratio: 416 / 260; border-radius: var(--radius-16); background: var(--color-neutral-100); }
.esg-card__title { margin: 24px 0 0; padding-left: min(20px, 1.0417vw); color: var(--color-neutral-900); font-size: clamp(22px, 1.116vw + 10.57px, 32px); font-weight: var(--font-weight-bold); line-height: 1.4; }
ul.esg-card__list { list-style: none; margin: 16px 0 0; padding: 0 0 0 min(20px, 1.0417vw); display: grid; gap: clamp(4px, 0.2232vw + 1.71px, 6px); color: var(--color-neutral-900); font-size: clamp(15px, 0.558vw + 9.29px, 20px); font-weight: var(--font-weight-medium); line-height: 1.3; }
.esg-card__list li { position: relative; padding-left: clamp(10px, 0.2232vw + 7.72px, 12px); }
.esg-card__list li::before { content: ""; position: absolute; left: 0; top: calc(0.65em - 2px); width: 4px; height: 4px; border-radius: 50%; background: var(--color-neutral-900); }
@media (max-width: 63.99rem) {
  .esg-cards { grid-template-columns: minmax(0, 1fr); }
}

/* ── 준법경영 본문 (왼쪽 제목 · 오른쪽 내용) ─────────────── */
.law-intro { margin: 0; }
.law-row {
  display: grid;
  grid-template-columns: minmax(0, 400fr) minmax(0, 880fr);
  align-items: start;
  margin-top: min(160px, 8.3333vw);
}
.law-row__title {
  margin: 0;
  color: var(--color-neutral-900);
  font-size: clamp(22px, 0.6696vw + 15.14px, 28px);
  font-weight: var(--font-weight-bold);
  line-height: 1.4;
}
.law-row__body { color: var(--color-neutral-900); font-size: clamp(15px, 0.3348vw + 11.572px, 18px); line-height: 1.7; }
.law-pledge { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; color: var(--color-neutral-900); font-size: clamp(15px, 0.3348vw + 11.572px, 18px); font-weight: var(--font-weight-medium); line-height: 1.6; }
.law-pledge strong { font-weight: var(--font-weight-bold); margin-right: 4px; }
.law-values {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 287px));
  gap: 8px;
}
.law-values li {
  display: flex;
  align-items: center;
  justify-content: center;
  height: clamp(48px, 1.3393vw + 34.29px, 60px);
  border-radius: var(--radius-8);
  background: var(--color-brand-red-solid);
  color: var(--color-white);
  font-size: clamp(16px, 0.4464vw + 11.43px, 20px);
  font-weight: var(--font-weight-bold);
  line-height: 1;
}
.law-links { list-style: none; margin: min(40px, 2.0833vw) 0 0; padding: 0; display: grid; gap: 8px; justify-items: start; }
.law-link, .brand-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 16px 28px 16px 32px;
  border-radius: var(--radius-6);
  background: var(--color-neutral-100);
  color: var(--color-neutral-900);
  font-size: clamp(14px, 0.2232vw + 11.72px, 16px);
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
}
.law-link:hover, .law-link:focus-visible, .brand-link:hover, .brand-link:focus-visible { color: var(--color-neutral-900); }
.law-link img, .brand-link img { flex: 0 0 auto; width: clamp(20px, 0.4464vw + 15.43px, 24px); height: clamp(20px, 0.4464vw + 15.43px, 24px); }
.law-desc { margin: 0 0 16px; color: var(--color-neutral-900); font-size: clamp(15px, 0.3348vw + 11.572px, 18px); font-weight: var(--font-weight-medium); line-height: 1.6; }
ul.law-list { margin: 0; display: grid; gap: 12px; color: var(--color-neutral-900); font-size: clamp(15px, 0.3348vw + 11.572px, 18px); font-weight: var(--font-weight-medium); line-height: 1.6; }
.law-list--contact li { display: block; }
.law-list--contact li > strong, .law-list--contact li > span { display: block; }
.law-list--contact li > strong { margin-bottom: 4px; }
.law-list--contact strong { font-weight: var(--font-weight-bold); }
.law-list--contact .law-link { margin-top: 12px; justify-self: start; }

/* ── 브랜드 소개 (CI · BI) ─────────────────────────────── */
.brand-title { margin: 0; color: var(--color-neutral-900); font-size: clamp(36px, 2.6786vw + 8.57px, 60px); font-weight: var(--font-weight-bold); line-height: 1.3; letter-spacing: -0.02em; }
.brand-desc { margin: 24px 0 0; color: var(--color-neutral-900); font-size: clamp(15px, 0.3348vw + 11.572px, 18px); font-weight: var(--font-weight-medium); line-height: 1.6; }
.brand-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 40px 0 0; }
.brand-row { display: grid; grid-template-columns: minmax(0, 400fr) minmax(0, 880fr); align-items: start; margin-top: min(160px, 8.3333vw); }
.brand-row__title { margin: 0; color: var(--color-neutral-900); font-size: clamp(22px, 0.6696vw + 15.14px, 28px); font-weight: var(--font-weight-bold); line-height: 1.4; }
.brand-row__desc { margin: 0 0 min(40px, 2.0833vw); color: var(--color-neutral-900); font-size: clamp(15px, 0.3348vw + 11.572px, 18px); font-weight: var(--font-weight-medium); line-height: 1.6; }
.brand-subhead { margin: 0 0 12px; color: var(--color-neutral-900); font-size: 24px; font-weight: var(--font-weight-bold); line-height: 1.4; text-align: left; }
.brand-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: min(16px, 0.8333vw); }
.brand-box { position: relative; display: flex; align-items: center; justify-content: center; height: auto; aspect-ratio: 432 / 210; margin: 0; padding: 0; border-radius: var(--radius-16); background: var(--color-neutral-100); }
.brand-box--wide { grid-column: 1 / -1; aspect-ratio: 880 / 210; }
.brand-box--white { background: var(--color-white); }
.brand-box--red-ci { background: #da291c; }
.brand-box--bi-red { background: var(--color-brand-red-solid); }
.brand-box--black { background: #000; }
.brand-box__label { position: absolute; top: 20px; left: 20px; color: var(--color-neutral-900); font-size: 14px; font-weight: var(--font-weight-medium); line-height: 1.6; }
.brand-box__picture { display: contents; }
.brand-box__img { display: block; width: 100%; height: 100%; object-fit: contain; }
.brand-box--text { flex-direction: column; padding: 48px 20px 28px; aspect-ratio: auto; min-height: clamp(180px, 5.5804vw + 122.86px, 230px); }
.brand-text { margin: 0; display: grid; gap: 10px; color: #000; font-size: clamp(21px, 0.3348vw + 17.57px, 24px); font-weight: var(--font-weight-bold); line-height: 1.4; text-align: center; }
.brand-color { border-radius: var(--radius-16); padding: min(28px, 1.4583vw) min(32px, 1.6667vw); color: var(--color-white); }
.brand-color--main { margin: 0 0 40px; display: flex; flex-direction: column; justify-content: space-between; }
.brand-color--red-ci { background: #da291c; }
.brand-color--bi-red { background: var(--color-brand-red-solid); }
/* [Mod] 261019 Sub Color 견본 색 — 안내 RGB 값과 일치(Gray 84/88/90 · Black 44/42/41 · Silver 141/145/145) */
.brand-color--gray { background: #54585a; }
.brand-color--black { background: #2c2a29; }
.brand-color--silver { background: #8d9191; }
.brand-color__name { margin: 0; color: var(--color-white); font-size: clamp(19px, 0.558vw + 13.29px, 24px); font-weight: var(--font-weight-bold); line-height: 1.4; }
.brand-color__spec { margin: min(32px, 1.6667vw) 0 0; color: var(--color-white); font-size: 14px; font-weight: 600; line-height: 1.6; }
.brand-colors { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: min(16px, 0.8333vw); }
.brand-colors .brand-color { min-height: clamp(170px, 4.799vw + 120.86px, 213px); display: flex; flex-direction: column; justify-content: flex-start; }
.brand-text-sample { margin: 0; color: #000; font-size: clamp(28px, 1.3393vw + 14.29px, 40px); font-weight: var(--font-weight-bold); line-height: 1.3; text-align: center; }
.brand-misuse-row { display: grid; grid-template-columns: min(320px, 16.6667vw) minmax(0, 1fr); gap: min(16px, 0.8333vw); margin-top: min(16px, 0.8333vw); }
.brand-misuse-row .brand-box { aspect-ratio: auto; min-height: clamp(160px, 5.5804vw + 102.86px, 210px); }
.brand-box--misuse { display: flex; align-items: center; justify-content: center; padding: clamp(44px, 0.8929vw + 34.86px, 52px) clamp(12px, 0.8929vw + 2.86px, 20px) clamp(16px, 0.8929vw + 6.86px, 24px); }
.brand-misuse { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: clamp(14px, 1.1161vw + 2.57px, 24px) clamp(12px, 1.3393vw - 1.71px, 24px); }
.brand-misuse__item { margin: 0; display: grid; justify-items: center; gap: clamp(6px, 0.6696vw - 0.86px, 12px); width: max-content; }
.brand-misuse__text { margin: 0; color: var(--color-neutral-500); font-size: 24px; font-weight: var(--font-weight-bold); line-height: 1.4; text-align: center; }
.brand-misuse__caption { display: inline-flex; align-items: center; gap: 4px; color: var(--color-neutral-900); font-size: 14px; font-weight: var(--font-weight-medium); line-height: 1; text-align: center; }
.brand-misuse__caption svg { flex: 0 0 auto; width: 16px; height: 16px; }
@media (max-width: 63.99rem) {
  .law-row { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .law-values { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ── 롯데 통합 ID 기능 그리드 ──────────────────────────── */
.id-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-16); margin-top: var(--space-24); }
.id-grid__item { background: var(--color-neutral-100); border-radius: var(--radius-16); padding: var(--space-24); }
.id-grid__title { font-weight: var(--font-weight-bold); margin-bottom: var(--space-8); }
@media (max-width: 40rem) { .id-grid { grid-template-columns: 1fr; } }

/* ── 모바일상품권 금액권 ───────────────────────────────── */
.gift-denoms {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
  margin-top: clamp(32px, 4vw, 48px);
}
.gift-denom-frame {
  flex: 0 0 200px;
  width: 200px;
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-neutral-100);
  border-radius: var(--radius-16);
}
.gift-denom__img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: var(--radius-12); }
@media (max-width: 63.99rem) {
  .gift-denom-frame { flex-basis: calc(50% - 12px); width: auto; height: auto; aspect-ratio: 1 / 1; }
}
@media (max-width: 63.99rem) {
  .gift-denoms { gap: var(--space-12); }
  .gift-denom-frame { flex-basis: calc(50% - 6px); padding: var(--space-12); }
}

/* ── 마케팅 광고 서비스 허브 타일 ──────────────────────── */
.mkt-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-16); }
.mkt-tile { background: var(--theme-weak); border-radius: var(--radius-16); padding: clamp(24px, 3vw, 40px) var(--space-16); text-align: center; }
.mkt-tile__code { font-size: 1.5rem; font-weight: var(--font-weight-bold); color: var(--theme-solid); }
.mkt-tile__name { margin-top: var(--space-4); color: var(--color-neutral-600); font-size: var(--font-size-body-4); }
@media (max-width: 63.99rem) { .mkt-grid { grid-template-columns: repeat(2, 1fr); } }

/* ── RaaS 패널 ─────────────────────────────────────────── */
.raas-panel { max-width: 520px; margin: 0 auto var(--space-24); text-align: center; }
.raas-panel .feature-row__media { aspect-ratio: 16/9; margin-bottom: var(--space-16); }

/* ── 캐릭터 (LPPY FRIENDS) ─────────────────────────────── */
.char-hero { padding: clamp(64px, 6.25vw, 120px) 0 clamp(64px, 6.25vw, 120px); text-align: center; background: linear-gradient(180deg, #fdf0f3 0%, #ffffff 100%); }
.char-hero__img { display: block; width: min(680px, 35.4167vw); height: min(427px, 22.2396vw); margin: 0 auto; object-fit: contain; }
.char-hero__title { margin: min(64px, 3.3333vw) 0 0; font-family: "Nunito", var(--font-family-base); color: #f66570; font-size: clamp(44px, 2.2321vw + 21.14px, 64px); font-weight: 900; line-height: 1.42; letter-spacing: -0.01em; text-align: center; }
.char-hero__desc { margin: 16px 0 0; text-align: center; color: #333d4b; font-size: clamp(16px, 0.4464vw + 11.43px, 20px); font-weight: var(--font-weight-medium); line-height: 1.5; }
.char-hero__br-mo { display: none; }
.char-list { display: grid; gap: min(220px, 11.4583vw); }
.char-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); height: min(677px, 35.2604vw); border-radius: var(--radius-20); overflow: hidden; --char-text-bg: #ffebec; --char-media-bg: #ffd2d5; --char-accent: #f04452; }
.char-card--reverse .char-card__text { order: 2; }
.char-card--reverse .char-card__media { order: 1; }
.char-card--blue { --char-text-bg: #e7f2ff; --char-media-bg: #c6e0ff; --char-accent: #3182f6; }
.char-card--purple { --char-text-bg: #e8e0fd; --char-media-bg: #d4c6fa; --char-accent: #7b3fe4; }
.char-card--yellow { --char-text-bg: #fff7e1; --char-media-bg: #ffebb3; --char-accent: #f7a21b; }
.char-card--teal { --char-text-bg: #e9f8f7; --char-media-bg: #b6e8e7; --char-accent: #14a697; }
.char-card--orange { --char-text-bg: #fff3e0; --char-media-bg: #ffdfa6; --char-accent: #f28a0e; }
.char-card__text { display: flex; flex-direction: column; padding: min(80px, 4.1667vw); background: var(--char-text-bg); }
.char-card__media { display: flex; align-items: center; justify-content: center; background: var(--char-media-bg); }
.char-card__name { margin: 0; font-family: "Nunito", var(--font-family-base); color: var(--char-accent); font-size: min(72px, 3.75vw); font-weight: 900; line-height: normal; letter-spacing: -0.01em; }
.char-card__kor {font-family: "Cafe24 Ssurround", var(--font-family-base); color: var(--color-neutral-900); font-size: min(40px, 2.0833vw); font-weight: 700; line-height: normal; letter-spacing: -0.01em; }
.char-card__desc { margin: auto 0 0; color: var(--color-neutral-900); font-size: clamp(16px, 0.4464vw + 11.43px, 20px); font-weight: var(--font-weight-medium); line-height: 1.5; }
.char-card__tags { margin: clamp(16px, 0.8929vw + 6.86px, 24px) 0 0; color: var(--char-accent); font-size: clamp(16px, 0.4464vw + 11.43px, 20px); font-weight: var(--font-weight-bold); line-height: 1.5; }
.char-card__img { width: min(270px, 14.0625vw); height: min(408px, 21.25vw); object-fit: contain; }
.char-card--blue .char-card__img { width: min(390px, 20.3125vw); height: min(408px, 21.25vw); }
.char-card--purple .char-card__img { width: min(300px, 15.625vw); height: min(340px, 17.7083vw); }
.char-card--yellow .char-card__img { width: min(245px, 12.7604vw); height: min(255px, 13.2813vw); }
.char-card--teal .char-card__img { width: min(191px, 9.9479vw); height: min(204px, 10.625vw); }
.char-card--orange .char-card__img { width: min(165px, 8.5938vw); height: min(119px, 6.1979vw); }

/* ── 기업문화/채용 ─────────────────────────────────────── */
.culture-title { margin: 0; color: var(--color-neutral-900); font-size: clamp(26px, 1.5625vw + 10px, 40px); font-weight: var(--font-weight-bold); line-height: 1.4; }
.culture-desc { margin: clamp(12px, 0.4464vw + 7.43px, 16px) 0 0; color: var(--color-neutral-700); font-size: clamp(15px, 0.3348vw + 11.572px, 18px); font-weight: var(--font-weight-medium); line-height: 1.6; }
.page-section.culture { padding-bottom: 0; }
.culture-block + .culture-block { margin-top: min(200px, 10.4167vw); }
ul.culture-cards { list-style: none; margin: min(40px, 2.0833vw) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: min(16px, 0.8333vw); row-gap: min(8px, 0.4167vw); }
.culture-card { display: flex; flex-direction: column; height: 100%; padding: clamp(24px, 1.7857vw + 5.71px, 40px); border-radius: var(--radius-16); background: var(--color-neutral-100); }
.culture-card__icon { width: clamp(40px, 0.8929vw + 30.86px, 48px); height: clamp(40px, 0.8929vw + 30.86px, 48px); object-fit: contain; }
.culture-card__title { margin: 16px 0 0; color: var(--color-neutral-900); font-size: clamp(19px, 0.558vw + 13.29px, 24px); font-weight: var(--font-weight-bold); line-height: 1.4; }
.culture-card__desc { margin: 4px 0 0; color: var(--color-neutral-700); font-size: clamp(14px, 0.2232vw + 11.72px, 16px); font-weight: var(--font-weight-medium); line-height: 1.6; }
.culture-cta-band { margin-top: min(240px, 12.5vw); padding: min(60px, 3.125vw) 0; background: var(--color-red-50); }
.culture-cta { display: flex; align-items: center; justify-content: space-between; }
.culture-cta__title { margin: 0; color: var(--color-neutral-900); font-size: clamp(24px, 0.8929vw + 14.86px, 32px); font-weight: var(--font-weight-bold); line-height: 1.4; }
.culture-cta__btn { display: inline-flex; align-items: center; margin-top: min(16px, 0.8333vw); padding: 16px 32px; border-radius: 999999px; background: var(--color-brand-red-solid); color: var(--color-white); font-size: 16px; font-weight: var(--font-weight-bold); line-height: 1; text-decoration: none; }
.culture-cta__img { width: clamp(190px, 10.0446vw + 87.14px, 280px); height: auto; aspect-ratio: 280 / 188; object-fit: contain; }
@media (max-width: 63.99rem) {
  .char-card { grid-template-columns: minmax(0, 1fr); height: auto; }
  .char-card--reverse .char-card__text, .char-card--reverse .char-card__media { order: 0; }
  ul.culture-cards { grid-template-columns: minmax(0, 1fr); }
  .culture-cta { flex-direction: column; align-items: flex-start; gap: 24px; }
}

/* ── 캐릭터·기업문화 반응형 (PC 축소가 아닌 화면별 배치) ───────── */
@media (max-width: 63.99rem) {
  .culture .container { padding-inline: 24px; }
  .char .container { padding-inline: var(--m-gutter); }
  .char-hero__img { width: min(680px, 80vw); height: auto; aspect-ratio: 680 / 427; }
  .char-hero__title { font-size: clamp(40px, 6vw, 64px); }
  .char-card { height: auto; }
  .char-card__text { padding: 40px; }
  .char-card__name { font-size: clamp(48px, 7vw, 72px); }
  .char-card__kor { font-size: clamp(24px, 3.5vw, 40px); }
  .char-card__img { width: min(320px, 60vw); }
  .culture-title { font-size: clamp(28px, 4vw, 40px); }
  ul.culture-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .culture-cta-band { padding: 60px 0; }
  .culture-cta__title { font-size: clamp(24px, 3.5vw, 32px); }
}
@media (max-width: 63.99rem) {
  .char-card { grid-template-columns: minmax(0, 1fr); }
  .char-card--reverse .char-card__text { order: 0; }
  .char-card--reverse .char-card__media { order: 0; }
  .char-card__text { padding: 32px 24px; }
  .char-card__media { padding: 32px 0; }
  .char-card__img { width: min(240px, 60vw); }
  ul.culture-cards { grid-template-columns: minmax(0, 1fr); }
  .culture-card { padding: 28px 24px; }
  .culture-cta { flex-direction: column; align-items: flex-start; gap: 24px; }
  .culture-cta__btn { min-height: 48px; }
  .culture-cta__img { width: min(240px, 60vw); }
}

/* ── 캐릭터 카드 고정 + 내용 교체 (데스크톱, JS 사용 시) ─────── */
.js-enabled .char-showcase { display: block; height: calc(var(--n, 6) * 100vh); }
.js-enabled .char-stage { position: sticky; top: calc(var(--header-h) + (100vh - var(--header-h) - min(677px, 35.2604vw)) / 2); height: min(677px, 35.2604vw); }
.js-enabled .char-slide { position: absolute; inset: 0; height: 100%; opacity: 0; visibility: hidden; transition: opacity 0.6s var(--ease-out), visibility 0.6s; }
.js-enabled .char-slide.is-active { opacity: 1; visibility: visible; }
@media (max-width: 63.99rem) {
  .js-enabled .char-showcase { height: auto; }
  .js-enabled .char-stage { position: static; height: auto; }
  .js-enabled .char-slide { position: static; height: auto; opacity: 1; visibility: visible; }
  .js-enabled .char-slide + .char-slide { margin-top: min(120px, 10vw); }
}
/* [Mod] 261020 모션 B안 — 스크롤로 작동하는 모션은 OS 애니메이션 끄기 설정과 무관하게 실행 (reduce 예외 규칙 삭제) */

/* ── 트렌드 리포트 ─────────────────────────────────────── */
.trend-intro { padding: min(120px, 6.25vw) 0 min(120px, 6.25vw); text-align: center; }
.trend-intro__text { margin: 0; color: var(--color-neutral-900); font-size: clamp(26px, 1.5625vw + 10px, 40px); font-weight: var(--font-weight-bold); line-height: 1.4; }
.trend-archive { padding: 0 0 min(120px, 6.25vw); }
.trend-archive__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: min(40px, 2.0833vw); align-items: start; }
.trend-archive__body { display: contents; }
.trend-archive__cover { grid-column: 1; grid-row: 1; }
.trend-archive__cover-link { display: block; border-radius: var(--radius-16); overflow: hidden; }
.trend-archive__cover-link:focus-visible { outline: 2px solid var(--color-neutral-900); outline-offset: 3px; }
.trend-archive__cover-img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.trend-archive__cover-mo { display: none; }
ul.trend-list { grid-column: 2; grid-row: 1; list-style: none; margin: 0; padding: 0; border-top: 1px solid #e5e8eb; }
.trend-list__row { display: flex; align-items: center; border-bottom: 1px solid #e5e8eb; }
.trend-list__row[hidden] { display: none; }
.trend-list__item { display: flex; align-items: baseline; gap: min(12px, 0.625vw); flex: 1 1 auto; min-width: 0; padding: clamp(16px, 1.1458vw, 22px) clamp(16px, 1.0417vw, 20px); border: 0; background: transparent; color: var(--color-neutral-900); font: inherit; text-align: left; cursor: pointer; }
.trend-list__item:hover, .trend-list__row.is-active .trend-list__item { background: var(--color-neutral-100); }
.trend-list__item:focus-visible { outline: 2px solid var(--color-neutral-900); outline-offset: -2px; }
.trend-list__num { flex: 0 0 auto; color: var(--color-red-500); font-size: clamp(14px, 0.2232vw + 11.72px, 16px); font-weight: var(--font-weight-bold); line-height: 1.5; }
.trend-list__name { min-width: 0; font-size: clamp(14px, 0.2232vw + 11.72px, 16px); font-weight: var(--font-weight-medium); line-height: 1.5; word-break: keep-all; }
.trend-list__row.is-active .trend-list__name { font-weight: var(--font-weight-bold); }
.trend-list__download { display: none; }
.trend-pager { grid-column: 1 / -1; grid-row: 2; display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: min(60px, 3.125vw); }
.trend-pager[hidden] { display: none; }
.trend-pager__btn { display: flex; flex: 0 0 auto; width: 24px; height: 24px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.trend-pager__btn:disabled { cursor: default; }
.trend-pager__btn path { fill: #d1d6db; }
.trend-pager__btn:not(:disabled) path { fill: #191f28; }
.trend-pager__btn:focus-visible, .trend-pager__list button:focus-visible { outline: 2px solid var(--color-neutral-900); outline-offset: 2px; }
.trend-pager__list { display: flex; gap: 8px; margin: 0; padding: 0; list-style: none; }
.trend-pager__list button { min-width: 32px; height: 32px; padding: 0 6px; border: 0; background: transparent; color: var(--color-neutral-500); font: inherit; font-size: 16px; font-weight: var(--font-weight-medium); line-height: 1; cursor: pointer; }
.trend-pager__list button[aria-current="page"] { color: var(--color-neutral-900); font-weight: var(--font-weight-bold); }

/* ==========================================================================
   MOBILE (max-width: 63.99rem) — 모바일 시안(360) 기준 공통 서브페이지
   ========================================================================== */
@media (max-width: 63.99rem) {
  .breadcrumb { margin-bottom: 20px; font-size: calc(14 * var(--hero-s, 1px)); font-weight: var(--font-weight-medium); line-height: 1; gap: 4px; white-space: nowrap; }
  .breadcrumb a { color: #333D4B; }
  .breadcrumb__home svg, .breadcrumb__sep svg { width: 16px; height: 16px; }
  .breadcrumb__home, .breadcrumb__sep { flex-shrink: 0; }
  .breadcrumb { flex-wrap: wrap; row-gap: 8px; }
  .page-hero {
    --hero-s: min(0.27778vw, 0.050277vw + 0.8189px);
    height: auto; min-height: calc(175 * var(--hero-s));
    display: flex; align-items: center;
    padding-block: calc(20 * var(--hero-s));
  }
  .page-hero > .container { width: 100%; }
  .page-hero__inner { display: block; padding-right: 0; }
  .page-hero__title { color: var(--color-neutral-900); font-size: calc(32 * var(--hero-s)); font-weight: var(--font-weight-bold); line-height: 1.4; letter-spacing: normal; }
  .page-hero__desc { margin-top: 8px; font-size: min(4.4444vw, 0.8044vw + 13.11px); line-height: 1.6; }
  .page-hero__char { display: none; }

  /* 서브 탭: 가로 스크롤 */
  .page-tabs:not(.page-tabs--category):not([data-tabs-reveal]) { border-bottom: 0; background: linear-gradient(var(--border), var(--border)) left bottom / 100% 1px no-repeat, var(--color-white); }
  .page-section .page-tabs::after { z-index: -1; }
  .page-tabs__list { height: min(15vw, 54px); overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .page-tabs__list::-webkit-scrollbar { display: none; }
  .page-tabs__link { padding: 0 12px; font-size: min(4.4444vw, 0.8044vw + 13.11px); }
  .page-tabs .container { padding-inline: 8px; }
  .page-tabs__list > li:first-child .page-tabs__link, .page-tabs__list > .page-tabs__title + li .page-tabs__link { margin-left: 12px; }
  .page-tabs__list > .page-tabs__title { display: none; }
  .page-section .page-tabs .page-tabs__link { font-size: min(4.4444vw, 0.8044vw + 13.11px); }
  .page-section .page-tabs .page-tabs__list { justify-content: flex-start; }

  /* 섹션 공통 */
  .page-section { padding-top: min(12.5vw, 1.8962vw + 33.93px); padding-bottom: 80px; }
  .page-section__head { margin-bottom: 32px; }
  .page-section__title { color: var(--color-neutral-900); font-size: min(7.7778vw, 1.4078vw + 22.93px); font-weight: var(--font-weight-semibold); line-height: 1.4; }
  .page-section__desc { margin-top: 12px; font-size: min(4.4444vw, 0.8044vw + 13.11px); line-height: 1.6; }
  .page-section__desc br, .page-section__title br { display: none; }
  .page-section__title { word-break: keep-all; overflow-wrap: break-word; }
  .partner-section .page-section__title { font-size: min(5.5556vw, 1.0055vw + 16.38px); }
  .page-section__title--tight { letter-spacing: -0.03em; text-wrap: wrap; }

  /* 통계 카드 */
  .stat-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 32px; }
  .stat-card { height: auto; min-height: 132px; padding: 20px 12px; }
  .stat-card__label { font-size: min(3.8889vw, 0.7039vw + 11.46px); }
  .stat-card__value { font-size: min(6.6667vw, 1.2066vw + 19.66px); }

  .feature-rows { gap: min(33.3333vw, 6.0332vw + 98.27px); }
  .page-section__head ~ .feature-rows { margin-top: min(33.3333vw, 6.0332vw + 98.27px); }
  .feature-row, .feature-row--reverse { grid-template-columns: minmax(0, 1fr); gap: 24px; text-align: left; }
  .feature-row__media, .feature-row:not(.feature-row--reverse) .feature-row__media { width: 100%; height: auto; aspect-ratio: 632 / 400; justify-self: stretch; }
  .feature-row--reverse .feature-row__content { text-align: left; }
  .feature-row__title { font-size: min(7.7778vw, 1.4078vw + 22.93px); }
  .feature-row__title br { display: inline; }
  .feature-row__title br.pc-only { display: none; }
  .feature-row__title { word-break: keep-all; overflow-wrap: break-word; text-wrap: wrap; }
  .feature-row__desc { margin-top: 12px; font-size: min(4.4444vw, 0.8044vw + 13.11px); }
  .feature-row__desc br { display: none; }
  .page-section__desc br.br-keep, .page-section__desc br.br-mo { display: inline; }

  /* 파트너 타일: 3열 */
  .partner-section { padding-block: 60px; }
  .partner-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 24px; }
  .partner-tile { padding: 16px 4px; }
  .partner-tile__logo,
  .partner-tile__logo img { width: 64px; height: 64px; }
  .partner-tile__name { margin-top: 8px; font-size: 12px; line-height: 1.3; word-break: keep-all; }

  /* FAQ */
  .faq { margin-top: 16px; }
  .faq__q { padding: 20px 0; align-items: flex-start; gap: 8px; }
  .faq__q-mark, .faq__a-mark { font-size: min(4.4444vw, 0.8044vw + 13.11px); }
  .faq__q-text, .faq__a-text { font-size: min(4.4444vw, 0.8044vw + 13.11px); }
  .faq__a-inner { gap: 8px; padding-bottom: 20px; }
  .faq__icon { width: 20px; height: 20px; }
  h2.services-faq-title { font-size: min(5.5556vw, 1.0055vw + 16.38px); }

  /* 하단 CTA 밴드 */
  .cta-band { padding-block: 40px; }
  .cta-band__inner { flex-direction: column-reverse; align-items: center; gap: 20px; text-align: center; }
  .cta-band__title { font-size: 18px; }
  .cta-band__btn { margin-top: 16px; padding: 12px 20px; font-size: min(4.4444vw, 0.8044vw + 13.11px); }
  .cta-band__inner .culture-cta__img { width: 168px; height: 112px; }
}
@media (max-width: 22.4375rem) {
  .breadcrumb { column-gap: 2px; letter-spacing: -0.05em; }
}

.partner-more { display: none; }
@media (max-width: 63.99rem) {
  .partner-tile.is-m-collapsed { display: none !important; }
  .partner-more { display: flex; justify-content: center; margin-top: 24px; }
  .partner-more__btn {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 12px 20px; border: 0; border-radius: var(--radius-full);
    background: var(--color-neutral-900); color: var(--color-white);
    font: inherit; font-size: min(4.4444vw, 0.8044vw + 13.11px); font-weight: var(--font-weight-bold); line-height: 1; cursor: pointer;
  }
  .partner-more__btn:focus-visible { outline: 2px solid var(--color-neutral-900); outline-offset: 3px; }
  .partner-section:has(.partner-more) .services-more-wrap { display: none; }
}

@media (max-width: 63.99rem) {
  .data-partner-rows, .welfare-partner-rows, .finance-partner-rows, ul.point-partners {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 24px; max-width: none; width: auto;
  }
  .data-partner-rows > .partner-grid, .welfare-partner-rows > .partner-grid, .finance-partner-rows > .partner-grid { display: contents; }
  .partner-section .data-partners .partner-tile, .partner-section .welfare-partners .partner-tile, .partner-section .finance-partners .partner-tile, .partner-section .point-partners .partner-tile {
    flex: none; width: auto; height: auto; min-width: 0; padding: 16px 4px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
  }
  .partner-section .data-partners .partner-tile__logo, .partner-section .welfare-partners .partner-tile__logo, .partner-section .finance-partners .partner-tile__logo, .partner-section .point-partners .partner-tile__logo,
  .partner-section .data-partners .partner-tile__logo img, .partner-section .welfare-partners .partner-tile__logo img, .partner-section .finance-partners .partner-tile__logo img, .partner-section .point-partners .partner-tile__logo img { width: 64px; height: 64px; }
  .partner-section .welfare-partners .partner-tile__name, .partner-section .data-partners .partner-tile__name, .partner-section .finance-partners .partner-tile__name, .partner-section .point-partners .partner-tile__name { font-size: 12px; }
}

.history-year__mimg, .trend-intro__char { display: none; }

/* ==========================================================================
   MOBILE — 소개(about) 페이지들
   ========================================================================== */
@media (max-width: 63.99rem) {
  /* ESG */
  .esg-cards { gap: 60px; margin-top: 40px; }
  .esg-card__media { aspect-ratio: 320 / 200; }
  .esg-card__media img { width: 100%; height: 100%; object-fit: contain; }
  .esg-card__title { margin-top: 20px; padding-left: 8px; font-size: 22px; }
  ul.esg-card__list { margin-top: 8px; padding-left: 8px; gap: min(3.3333vw, 0.6033vw + 9.83px); color: var(--color-neutral-900); font-size: min(4.4444vw, 0.8044vw + 13.1px); font-weight: var(--font-weight-medium); line-height: 1; }
  .esg-card__list li { padding-left: 10px; }
  .esg-card__list li::before { top: calc(0.5em - 2px); }

  .law-intro { word-break: keep-all; overflow-wrap: break-word; }
  .law-intro br { display: none; }
  .law-row { grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 60px; }
  .law-row__title { padding-bottom: 16px; margin-bottom: 20px; border-bottom: 1px solid var(--color-neutral-900); color: var(--color-neutral-900); font-size: max(16px, 0.8044vw + 13.1px); font-weight: var(--font-weight-bold); line-height: 1.6; }
  .law-row__title br { display: none; }
  .law-row__body, ul.law-list { font-size: max(16px, 0.8044vw + 13.11px); }
  .law-pledge, .law-desc { color: var(--color-neutral-900); font-size: min(4.4444vw, 0.8044vw + 13.11px); font-weight: var(--font-weight-medium); line-height: 1.6; }
  .law-pledge { gap: 10px; }
  ul.law-list { gap: min(1.6667vw, 0.3017vw + 4.91px); }
  .law-values { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .law-values li { height: 46px; font-size: min(4.4444vw, 0.8044vw + 13.11px); }
  .law-values li:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .law-links { margin-top: 16px; justify-items: stretch; }
  .law-link, .brand-link { justify-content: center; padding: 14px 16px; font-size: 13px; }
  .law-link { display: flex; width: 100%; color: var(--color-neutral-900); font-size: max(16px, 0.8044vw + 13.11px); font-weight: var(--font-weight-semibold); line-height: 1; }
  .law-link img, .brand-link img { width: 20px; height: 20px; }
  .brand-link { font-size: max(16px, 0.8044vw + 13.11px); }
  .law-list--contact .law-link { justify-self: stretch; }

  /* 브랜드 CI·BI */
  .brand-title { font-size: 28px; }
  .brand-desc { margin-top: 16px; color: var(--color-neutral-900); font-size: max(16px, 0.8044vw + 13.11px); font-weight: var(--font-weight-medium); line-height: 1.6; }
  .brand-actions { flex-direction: column; margin-top: 24px; }
  .brand-row { grid-template-columns: minmax(0, 1fr); margin-top: 80px; }
  .brand-row__title { padding-bottom: 16px; margin-bottom: 20px; border-bottom: 1px solid var(--color-neutral-900); font-size: max(24px, 1.2066vw + 19.66px); }
  .brand-row__title br { display: none; }
  .brand-row__desc { margin-bottom: 24px; font-size: max(16px, 0.8044vw + 13.11px); }
  .brand-subhead { font-size: max(20px, 1.0055vw + 16.38px); }
  .brand-grid, .brand-colors { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .brand-box, .brand-box--wide { height: auto; aspect-ratio: 432 / 210; }
  .brand-box--wide { grid-column: auto; }
  .brand-box__label { top: 14px; left: 20px; color: var(--color-neutral-900); font-size: max(14px, 0.7039vw + 11.46px); font-weight: var(--font-weight-medium); line-height: 1; }
  .brand-text { font-size: min(5vw, 0.905vw + 14.74px); }
  .brand-box--text { aspect-ratio: auto; min-height: 156px; padding: 40px 16px; }
  .brand-text-sample { font-size: 24px; }
  .brand-color { padding: 20px; }
  .brand-colors .brand-color { height: auto; min-height: 140px; }
  .brand-color__name { font-size: 18px; }
  .brand-color__spec { margin-top: 16px; font-size: min(3.8889vw, 0.7039vw + 11.46px); }
  .brand-misuse-row { display: block; margin-top: 12px; padding: 20px 20px 32px; border-radius: var(--radius-16); background: var(--color-neutral-100); }
  .brand-misuse-row .brand-box { display: block; height: auto; min-height: 0; aspect-ratio: auto; padding: 0; border-radius: 0; background: none; }
  .brand-misuse-row .brand-box__label { position: static; display: block; }
  .brand-misuse-row .brand-text-sample { margin: 24px 0; color: #000; font-size: min(8.8889vw, 1.6089vw + 26.21px); font-weight: var(--font-weight-bold); line-height: 1.4; text-align: center; }
  .brand-misuse-row .brand-misuse { margin-top: 28px; }
  .brand-misuse { flex-direction: column; gap: 16px; }
  .brand-misuse__text { color: var(--color-neutral-500); font-size: min(6.6667vw, 1.2066vw + 19.66px); font-weight: var(--font-weight-bold); line-height: 1.4; text-align: center; }
  .brand-misuse__caption { color: var(--color-neutral-900); font-size: min(4.4444vw, 0.8044vw + 13.11px); font-weight: var(--font-weight-medium); line-height: 1; text-align: center; }

  /* 기업문화: 가로형 카드(아이콘 왼쪽) */
  .culture .container { padding-inline: var(--m-gutter); }
  .culture-title { color: var(--color-neutral-900); font-size: min(6.6667vw, 1.2066vw + 19.66px); font-weight: var(--font-weight-bold); line-height: 1.4; }
  .culture-desc { margin-top: 8px; font-size: min(4.4444vw, 0.8044vw + 13.11px); }
  .culture-block + .culture-block { margin-top: 80px; }
  ul.culture-cards { margin-top: 20px; grid-template-columns: minmax(0, 1fr); row-gap: 12px; }
  .culture-card { display: grid; grid-template-columns: 40px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 16px; align-items: center; padding: 18px 20px; }
  .culture-card__icon { grid-row: 1 / 3; width: 40px; height: 40px; }
  .culture-card__title { margin: 0; color: var(--color-neutral-900); font-size: min(4.4444vw, 0.8044vw + 13.1px); font-weight: var(--font-weight-bold); line-height: 1.6; align-self: end; }
  .culture-card__desc { margin: 2px 0 0; color: var(--color-neutral-700); font-size: min(3.8889vw, 0.7039vw + 11.46px); font-weight: var(--font-weight-medium); line-height: 1.5; align-self: start; }
  .culture-cta-band { margin-top: 80px; padding: 40px 0; }
  .culture-cta { flex-direction: column-reverse; align-items: center; gap: 20px; text-align: center; }
  .culture-cta__title { font-size: 18px; }
  .culture-cta__btn { margin-top: 16px; min-height: 0; padding: 12px 20px; font-size: min(4.4444vw, 0.8044vw + 13.11px); }
  .culture-cta__img { width: 168px; height: 112px; }

  .char-hero { padding: min(27.7778vw, 5.0277vw + 81.89px) 0 60px; }
  .char-hero__img { width: min(320px, 100%); }
  .char-hero__title { margin-top: 32px; color: #f66570; font-family: "Nunito", var(--font-family-base); font-size: min(8.8889vw, 1.6089vw + 26.21px); font-weight: 900; line-height: 1.42; letter-spacing: -0.01em; }
  .char-hero__desc { color: #333d4b; font-size: min(4.4444vw, 0.8044vw + 13.11px); font-weight: var(--font-weight-medium); line-height: 1.6; text-align: center; }
  .char-hero__br-mo { display: inline; }
  .char-list { gap: 40px; }
  .char-card { border-radius: var(--radius-16); }
  .char-card__media { order: -1 !important; padding: 40px 0; min-height: 200px; }
  .char-card__text { order: 0 !important; padding: 28px 20px 32px; }
  .char-card__text { display: block; }
  .char-card__name, .char-card__kor { display: inline; }
  .char-card__name { margin-right: 8px; font-size: 40px; }
  .char-card__kor { font-size: 22px; }
  .char-card__desc { display: block; }
  .char-card__desc { margin-top: 16px; font-size: min(3.8889vw, 0.7039vw + 11.46px); }
  .char-card__tags { margin-top: 12px; font-size: min(3.8889vw, 0.7039vw + 11.46px); }
  .char-card__img, .char-card--blue .char-card__img, .char-card--purple .char-card__img { width: 160px; height: 160px; }
  .char-card--yellow .char-card__img { width: 120px; height: 120px; }
  .char-card--teal .char-card__img { width: 100px; height: 100px; }
  .char-card--orange .char-card__img { width: 100px; height: 72px; }
  .js-enabled .char-slide + .char-slide { margin-top: 40px; }

  /* 트렌드 리포트 */
  .trend-intro { padding: 40px 0 60px; }
  .trend-intro__text { font-size: min(4.4444vw, 0.8044vw + 13.11px); font-weight: var(--font-weight-medium); line-height: 1.6; }
  .trend-intro__text br { display: inline; }
  .trend-intro__char { display: block; width: 160px; height: 160px; margin: 0 auto 24px; }
  .trend-archive { padding-bottom: min(22.2222vw, 4.0222vw + 65.51px); }
  .trend-archive__inner { display: block; }
  .trend-archive__body { display: block; }
  .trend-archive__cover-link { display: none; }
  .trend-archive__cover-mo { display: block; width: 100%; height: auto; aspect-ratio: 640 / 400; object-fit: cover; border-radius: var(--radius-12); }
  ul.trend-list { margin-top: 20px; }
  .trend-list__item { gap: 8px; padding: 20px 0; }
  .trend-list__item:hover, .trend-list__row.is-active .trend-list__item { background: transparent; }
  .trend-list__row.is-active .trend-list__name { font-weight: var(--font-weight-medium); }
  .trend-list__num, .trend-list__name { font-size: min(4.4444vw, 0.8044vw + 13.11px); }
  .trend-list__download { display: flex; flex: 0 0 auto; padding: 10px; margin: -10px -10px -10px 2px; border-radius: 8px; }
  .trend-list__download:focus-visible { outline: 2px solid var(--color-neutral-900); outline-offset: 2px; }
  .trend-pager { margin-top: 32px; }

  /* 연혁 */
  .history-split { margin-top: 32px; }
  .history-stage { display: none; }
  .history-timeline { gap: 80px; }
  .history-timeline::before { display: none; }
  .history-year { height: auto; padding-left: 0; }
  .history-year__dot { display: none; }
  .history-year__num { margin: 0 0 16px; font-size: min(7.7778vw, 1.4078vw + 22.93px); font-weight: var(--font-weight-bold); line-height: 1.4; letter-spacing: normal; }
  .history-year:first-child .history-year__num { margin-top: 0; }
  ul.history-year__list { font-size: min(4.4444vw, 0.8044vw + 13.11px); font-weight: var(--font-weight-medium); line-height: 1.6; gap: min(1.6667vw, 0.3017vw + 4.91px); }
  ul.history-year__list li { padding-left: 12px; }
  ul.history-year__list li::before { left: 2px; top: calc(0.8em - 2px); }
  .history-year__subs { gap: 32px; margin-top: 20px; }
  .history-year__subnum { font-size: 18px; }
  .history-year__mimg { display: block; width: 100%; height: auto; margin-top: 24px; border-radius: var(--radius-12); background: var(--color-neutral-100); }
}
/* [Mod] 261020 모션 B안 — 스크롤로 작동하는 모션은 OS 애니메이션 끄기 설정과 무관하게 실행 (no-preference 조건 삭제) */
@media (max-width: 63.99rem) {
  .js-enabled .char-showcase { height: calc(var(--n, 6) * 100vh); }
  .js-enabled .char-stage {
    position: sticky; top: var(--header-h);
    height: calc(100vh - var(--header-h)); height: calc(100svh - var(--header-h));
    display: grid; align-content: center;
    background: var(--color-white);
  }
  .js-enabled .char-slide { position: relative; grid-area: 1 / 1; opacity: 0; visibility: hidden; }
  .js-enabled .char-slide.is-active { opacity: 1; visibility: visible; }
  .js-enabled .char-slide + .char-slide { margin-top: 0; }
}
.history-jump { display: none; }
@media (max-width: 63.99rem) {
  .page-tabs[data-tabs-reveal] { --ptr-s: min(0.27778vw, 0.050277vw + 0.8189px); }
  .page-tabs[data-tabs-reveal],
  .page-tabs[data-tabs-reveal].is-visible { display: block; }
  .page-tabs[data-tabs-reveal] {
    transform: translateY(-100%); visibility: hidden;
    transition: transform 0.35s cubic-bezier(0.33, 1, 0.68, 1), visibility 0s linear 0.35s;
  }
  .page-tabs[data-tabs-reveal].is-visible {
    transform: translateY(0); visibility: visible;
    transition: transform 0.35s cubic-bezier(0.33, 1, 0.68, 1), visibility 0s;
  }
  .page-tabs[data-tabs-reveal] .container { padding-inline: var(--m-gutter); }
  .page-tabs[data-tabs-reveal] { border-bottom: 1px solid var(--border); }
  .page-tabs[data-tabs-reveal]::after { content: none; }
  .page-tabs[data-tabs-reveal] .page-tabs__list { justify-content: flex-start; height: min(15vw, 54px); overflow: hidden; }
  .page-tabs[data-tabs-reveal] .page-tabs__list > li:not(.page-tabs__title) { display: none; }
  .page-tabs[data-tabs-reveal] .page-tabs__list > .page-tabs__title { display: inline-flex; position: static; padding: 0; background: none; box-shadow: none; color: var(--color-neutral-900); font-size: calc(16 * var(--ptr-s)); font-weight: var(--font-weight-bold); line-height: 1; }
  .history-jump { display: block; margin-top: 24px; }
  .history-jump__select {
    width: 100%; height: 48px; padding: 0 44px 0 16px; border: 1px solid var(--color-neutral-200, #e5e8eb); border-radius: var(--radius-8, 8px);
    background: var(--color-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3E%3Cpath d='M5 8l5 5 5-5' stroke='%238B95A1' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 14px center / 20px no-repeat;
    color: var(--color-neutral-900); font: inherit; font-size: max(16px, min(4.4444vw, 0.8044vw + 13.11px)); font-weight: var(--font-weight-semibold);
    -webkit-appearance: none; appearance: none;
  }
}
@media (max-width: 63.99rem) and (prefers-reduced-motion: reduce) {
  .page-tabs[data-tabs-reveal],
  .page-tabs[data-tabs-reveal].is-visible { transition: none; }
}

/* ==========================================================================
   PC 파트너 타일 공통 — 모든 목록에서 타일 가로 동일, 세로는 제휴사명 2줄 기준으로 통일
   ========================================================================== */
@media (min-width: 64rem) {
  main {
    --pt-w: clamp(96px, 3.5714vw + 59.43px, 128px);
    --pt-logo: clamp(64px, 2.6786vw + 36.57px, 88px);
  }
  main .partner-grid > .partner-tile {
    flex: 0 0 var(--pt-w); width: var(--pt-w); min-width: 0; height: auto;
    display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
    padding: clamp(14px, 0.6696vw + 7.14px, 20px) 6px;
  }
  main .partner-grid > .partner-tile .partner-tile__logo,
  main .partner-grid > .partner-tile .partner-tile__logo img { width: var(--pt-logo); height: var(--pt-logo); flex: 0 0 auto; }
  main .partner-grid > .partner-tile .partner-tile__name {
    display: flex; align-items: center; justify-content: center;
    min-height: 2.6em; line-height: 1.3; word-break: keep-all;
  }
  main .welfare-partners { display: flex; flex-wrap: wrap; justify-content: center; }
  main .finance-partners { flex-wrap: wrap; }
}
@media (min-width: 64rem) and (max-width: 112.49rem) {
  main .data-partner-rows, main .welfare-partner-rows, main .finance-partner-rows { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-16); }
  main .data-partner-rows > .partner-grid, main .welfare-partner-rows > .partner-grid, main .finance-partner-rows > .partner-grid { display: contents; }
}
@media (max-width: 63.99rem) {
  main .partner-grid,
  main .data-partner-rows, main .welfare-partner-rows, main .finance-partner-rows {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px;
    width: auto; max-width: none; margin-inline: 0; flex-wrap: initial;
  }
  main .data-partner-rows > .partner-grid, main .welfare-partner-rows > .partner-grid, main .finance-partner-rows > .partner-grid { display: contents; }
  main .partner-grid:has(> .partner-tile:last-child:nth-child(-n+2)) {
    grid-template-columns: repeat(auto-fit, calc((100% - 2 * 8px) / 3)); justify-content: center;
  }
  main .partner-grid:has(> .partner-tile:last-child:nth-child(4)) {
    grid-template-columns: repeat(2, calc((100% - 2 * 8px) / 3)); justify-content: center;
  }
  main .partner-grid > .partner-tile {
    flex: none; width: auto; min-width: 0; height: auto;
    display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
    padding: 16px 4px;
  }
  main .partner-grid > .partner-tile .partner-tile__logo,
  main .partner-grid > .partner-tile .partner-tile__logo img { width: 64px; height: 64px; flex: 0 0 auto; }
  main .partner-grid > .partner-tile .partner-tile__name {
    display: flex; align-items: center; justify-content: center;
    min-height: 2.6em; margin-top: 8px; font-size: min(3.3333vw, 0.6033vw + 9.83px); line-height: 1.3; word-break: keep-all; text-align: center;
  }
  main .partner-grid > .partner-tile .partner-tile__name--tight { letter-spacing: -0.04em; }
}

/* ── [Add] 261019 오류 페이지(404 · error) ───────────────────── */
/* 내용이 짧아도 footer 가 화면 바닥에 오도록 본문이 남는 높이를 채움 */
body.error-layout { display: flex; flex-direction: column; min-height: 100vh; min-height: 100svh; }
body.error-layout > main { flex: 1 0 auto; display: flex; flex-direction: column; }
/* [Mod] 261019 본문(container)을 남는 영역의 가운데에 배치 */
.error-page { flex: 1 0 auto; display: flex; align-items: center; padding: 80px 0; text-align: center; }
.error-page > .container { width: 100%; }
.error-page__char { display: block; width: 152px; height: 152px; margin: 0 auto; }
/* [Mod] 261019 Title/T-5/20/SB — #4E5968 / 600 / 140%, 1920: 20 → 1024: 18 비율 */
.error-page__desc { margin: 24px 0 0; color: var(--color-neutral-700); text-align: center; font-size: clamp(18px, 0.2232vw + 15.71px, 20px); font-weight: var(--font-weight-semibold); line-height: 1.4; word-break: keep-all; text-wrap: wrap; }
.error-page__btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 48px; margin-top: 24px; padding: 0 20px 0 24px;
  border-radius: var(--radius-full); background: var(--color-neutral-900); color: var(--color-white);
  font-size: 15px; font-weight: var(--font-weight-semibold); text-decoration: none;
}
.error-page__btn:focus-visible { outline: 2px solid var(--color-neutral-900); outline-offset: 2px; }
@media (max-width: 63.99rem) {
  .error-page { padding: min(11.1111vw, 0.6033vw + 37.83px) 0; }
  .error-page__char { width: min(35.5556vw, 6.4354vw + 104.83px); height: auto; aspect-ratio: 1 / 1; }
  .error-page__desc { margin-top: 20px; font-size: min(5vw, 0.905vw + 14.74px); line-height: 1.4; }
  .error-page__desc br { display: block; }
  .error-page__btn { margin-top: 20px; font-size: min(4.4444vw, 0.8044vw + 13.11px); }
}