/* index.html (홈) — 페이지 전용 보정
 * 원본 반입 CSS(css/base.css + css/style-3.css)가 .main__visual/.main__section-01~10/
 * .contact-form/.main__popup 등을 이미 정의한다. 이 파일은 반응형 잔여 격차와
 * 재구현 라이브러리 부재로 인한 최소 보정만 한다(R5 — 전면 재작성 금지).
 *
 * COMMON 이슈 임시 완화(이 페이지 스코프만, guardrails.md service/index.html 최초 발견과 동일 증상) —
 * css/style-*.css 전체에 body{opacity:0;transition:opacity .4s;} 가 site-wide 로 박혀있다(원본
 * 페이지-로드 리빌 게이트). 재구현 JS(main.js)가 아직 이 게이트를 풀지 않아 정적 재현 시 body 가
 * 영구 opacity:0 으로 남아 전체 화면이 백지로 렌더된다. main.js 의 site-wide 배선(COMMON 요청)이
 * 근본대응 — 이 페이지는 요청 전까지 최소 완화만 적용.
 */
body {
  opacity: 1 !important;
}

/* COMMON 결핍(swiper 라이브러리 미반입) 임시 완화 — 원본은 Swiper.js 로 main__section-02(카드
   슬라이더)와 main__section-06(로고 마퀴 3열)을 가로 스크롤/자동 마퀴로 굴린다. 이 산출물에는
   js/vendor 에 swiper 사본이 없어(COMMON 요청 — 2.5 지시: 재구현 금지, 라이브러리 반입 필요) JS
   초기화가 걸리지 않는다. Swiper 미초기화 상태에서도 콘텐츠가 깨지지 않도록(레이아웃 붕괴 방지)
   .swiper-wrapper 를 가로 스크롤 flex 컨테이너로 최소 강등한다 — 원본 시각(카드 여러 장이 가로로
   나열)과 동일한 구조를 유지하며, 원본 클래스는 그대로 둔다(라이브러리 반입 후 이 보정은 자연히
   무력화된다 — Swiper 가 자체 인라인 스타일로 덮어씀). */
.main__section-02 .swiper,
.main__section-06 .swiper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.main__section-02 .swiper-wrapper,
.main__section-06 .swiper-wrapper {
  display: flex;
  flex-wrap: nowrap;
}
.main__section-02 .swiper-slide {
  flex: 0 0 auto;
  margin-right: 20rem;
}
.main__section-06 .swiper-slide {
  flex: 0 0 auto;
  margin-right: 60rem;
}
.main__section-02 .swiper-pagination {
  position: static;
  margin-top: 16rem;
}

/* 원본 배너매니저(df-banner-code=main-visual) 유튜브 임베드 위젯이 인라인 <style> 블록으로
   실어온 규칙(R5 — 인라인 style 블록 금지 준수를 위해 index.html 에서 이 페이지 CSS 로 옮김,
   선택자·값은 원본 그대로 — 재저작 아님). */
.df-iframe-container-20250804135322 {
  position: relative;
  display: flex;
  margin-left: auto;
  margin-right: auto;
  width: 2560px;
  max-width: 100%;
  aspect-ratio: 16 / 9;
}
.df-iframe-container-20250804135322 iframe {
  position: absolute;
  width: 100%;
  height: 100%;
}
.df-iframe-container-20250804135322 > div {
  display: flex;
  aspect-ratio: inherit;
  width: auto;
  min-width: auto;
  max-width: none;
  height: auto;
  min-height: auto;
  max-height: none;
  margin: 0;
  padding: 0;
}