/* ══════════════════════════════════════════════════════════════
   zlgoon clone — globals.css
   폰트 · 디자인 토큰 · 리셋 · 부트스트랩 축소 유틸리티 · 텍스트 클래스
   원본: html{font-size:0.852083vw} rem 뷰포트 스케일 (1920→16.36px)
   ══════════════════════════════════════════════════════════════ */

@font-face {
  font-family: 'Pretendard Variable';
  src: url('../font/PretendardVariable.woff2') format('woff2-variations');
  font-weight: 45 920;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-family-pretendard: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
  --font-weight-regular: 400;
  --font-weight-semi-bold: 600;
  --font-weight-bold: 700;

  --color-primary: #C82014;
  --color-secondary: #FFD3D3;
  --color-black: #000000;
  --color-dark-1: #171717;
  --color-dark-2: #272727;
  --color-dark-3: #4B4B4B;
  --color-dark-4: #696969;
  --color-grey-1: #919191;
  --color-grey-2: #BBBBBB;
  --color-grey-3: #E1E1E1;
  --color-grey-4: #EBEBEB;
  --color-grey-5: #F5F5F5;
  --color-white: #FFFFFF;
  --color-body: #111111;
  --color-gray-back: #FAFAFA;

  --font-size-70: 4.375rem;
  --font-size-60: 3.5rem;
  --font-size-50: 3.125rem;
  --font-size-42: 2.325rem;
  --font-size-40: 2.125rem;
  --font-size-38: 2.085rem;
  --font-size-34: 1.925rem;
  --font-size-30: 1.875rem;
  --font-size-28: 1.75rem;
  --font-size-26: 1.625rem;
  --font-size-24: 1.5rem;
  --font-size-22: 1.475rem;
  --font-size-20: 1.25rem;
  --font-size-18: 1rem;
  --font-size-14: 0.875rem;
}

/* ── 스케일 ── */
html { font-size: 0.852083vw; }
@media (max-width: 1024px) { html { font-size: 1.552083vw; } }
@media (max-width: 359px)  { html { font-size: 8px; } }

/* ── 리셋 ── */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font-family-pretendard);
  font-size: 1rem;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: var(--color-body);
  background: #FFFFFF;
  overflow-x: hidden;
  word-break: keep-all;
}
h1, h2, h3, h4, p, ul, ol, li, figure { margin: 0; padding: 0; }
ul, ol { list-style: none; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; background: none; border: 0; cursor: pointer; color: inherit; padding: 0; }
img { max-width: 100%; height: auto; vertical-align: top; border: 0; }
em, i { font-style: normal; }

/* ── 컨테이너 (원본: width 100%, padding 0 4rem) ── */
.container {
  position: relative;
  width: 100%;
  max-width: 100%;
  padding-left: 4rem;
  padding-right: 4rem;
  margin: 0 auto;
}
@media (max-width: 1024px) {
  .container { padding-left: 2.2rem; padding-right: 2.2rem; }
}

/* ── 부트스트랩 축소 유틸리티 (본문 마크업에서 사용하는 것만) ──
   순서 규약: 기본 숨김(d-none 계열)이 반응형 표시(d-lg-*/d-md-*)보다 먼저 와야 함 */
.d-none { display: none; }
.d-flex { display: flex; }
.flex-wrap { flex-wrap: wrap; }
.flex-row-reverse { flex-direction: row-reverse; }
.justify-content-between { justify-content: space-between; }
.justify-content-center { justify-content: center; }
.justify-content-end { justify-content: flex-end; }
.align-items-center { align-items: center; }
.align-items-end { align-items: flex-end; }
.text-center { text-align: center; }
.text-white { color: #FFFFFF !important; }
.text-black { color: #111111 !important; }
.black-color { color: #111111; }
.w-100 { width: 100%; }
.w-50 { width: 50%; }
.ml-auto { margin-left: auto; }
.block { display: block; }
.font-weight-bold { font-weight: 700; }
.m-0 { margin: 0 !important; }

/* 행/컬럼: 원본은 .row 하위 col만 거터 존재 */
.row { display: flex; flex-wrap: wrap; margin-left: -0.818rem; margin-right: -0.818rem; }
.row > [class*='col-'] { padding-left: 0.818rem; padding-right: 0.818rem; }
.col-12 { flex: 0 0 100%; max-width: 100%; }
@media (max-width: 767px) {
  .d-md-none { display: none; }
}
@media (min-width: 768px) {
  .col-md-8 { flex: 0 0 66.6667%; max-width: 66.6667%; }
  .d-md-inline-block { display: inline-block; }
}
@media (min-width: 992px) {
  .col-lg-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
  .col-lg-5 { flex: 0 0 41.6667%; max-width: 41.6667%; }
  .col-lg-6 { flex: 0 0 50%; max-width: 50%; }
  .col-lg-7 { flex: 0 0 58.3333%; max-width: 58.3333%; }
  .d-lg-flex { display: flex; }
  .d-lg-block { display: block; }
  .d-lg-none { display: none !important; }
  .mt-lg-0 { margin-top: 0 !important; }
  .pl-lg-5 { padding-left: 3rem !important; }
}
/* d-flex 하위 col-lg-6은 원본처럼 거터 없이 50% (bootstrap 비-.row 컨텍스트) */
.d-flex > .col-lg-6 { padding-left: 0; padding-right: 0; }
.d-flex > .col-lg-6.pl-lg-5 { padding-left: 3rem; }

.mt-4 { margin-top: 2.4rem; }
.mt-5 { margin-top: 3rem; }
.mb-5 { margin-bottom: 3rem; }

/* 반응형 표시 토글 (원본 규약: dt_on=데스크톱 전용 br, m_on=모바일 전용 br) */
.m_on { display: none; }
@media (max-width: 1024px) {
  .dt_on { display: none; }
  .m_on { display: inline; }
  .m-block { display: block; }
}

/* ── 텍스트 스타일 클래스 (원본 pretendard-*) ── */
.pretendard-60-bold { font-size: var(--font-size-60); font-weight: var(--font-weight-bold); line-height: 1.4; padding: 0; }
.pretendard-50-bold { font-size: var(--font-size-50); font-weight: var(--font-weight-bold); line-height: 4rem; padding: 0; }
.pretendard-42-bold { font-size: var(--font-size-42); font-weight: var(--font-weight-bold); }
.pretendard-40-semi-bold { font-size: var(--font-size-40); font-weight: var(--font-weight-semi-bold); line-height: var(--font-size-40); }
.pretendard-40-regular { font-size: var(--font-size-40); font-weight: var(--font-weight-regular); }
.pretendard-34-semi-bold { font-size: var(--font-size-34); font-weight: var(--font-weight-semi-bold); }
.pretendard-30-bold { font-size: var(--font-size-30); font-weight: var(--font-weight-bold); line-height: var(--font-size-50); }
.pretendard-30-regular { font-size: var(--font-size-30); font-weight: var(--font-weight-regular); line-height: 1.5; padding: 0; }
.pretendard-24-semi-bold { font-size: var(--font-size-24); font-weight: var(--font-weight-semi-bold); }
.pretendard-22-regular { font-size: var(--font-size-22); font-weight: var(--font-weight-regular); }
.pretendard-20-regular { font-size: var(--font-size-20); font-weight: var(--font-weight-regular); }
@media (max-width: 600px) {
  .pretendard-60-bold { line-height: 1.45; }
  .pretendard-50-bold { line-height: 1.32; }
}

/* ── 섹션 리듬 ── */
.sect { position: relative; }
#main-sec02, #main-sec05 { padding-top: 12rem; padding-bottom: 12rem; }
#main-sec03 { padding-top: 14rem; padding-bottom: 11.5rem; }
#main-sec06 { padding-top: 12rem; padding-bottom: 8rem; background: var(--color-dark-1); }
#main-sec07 { padding-top: 12rem; padding-bottom: 14rem; }

/* ── 스크롤 리빌 (원본 AOS fade-up 대체. no-JS 시 항상 보임) ── */
html.js [data-aos] {
  opacity: 0;
  transform: translateY(2.8rem);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
html.js [data-aos].aos-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html.js [data-aos] { opacity: 1; transform: none; transition: none; }
}