/* service/commercial/retail.html — 페이지 전용 보정
 * 원본 반입 CSS(css/base.css + css/style-4.css)가 .path-custom/.service__title-wr/
 * .com__section-01~08/.service__swiper-vertical/.service__review 를 이미 정의한다.
 * 이 파일은 반응형 잔여 격차만 최소 보정한다(R5 — 전면 재작성 금지).
 *
 * COMMON 이슈 임시 완화(이 페이지 스코프만) — css/style-*.css 전체에
 * body{opacity:0;transition:opacity .4s;} 가 있다(원본 lenis/gsap 페이지-로드 리빌 게이트,
 * 전 페이지 공통 — service/index.html 빌드에서 최초 발견, guardrails.md 기록됨). 재구현
 * JS(main.js)가 아직 이 게이트를 풀지 않아 정적 재현 시 body 가 영구 opacity:0 으로 남아
 * 전체 화면이 백지로 렌더된다. main.js 의 site-wide 배선이 근본대응(COMMON 요청 누적 —
 * notes 참고). 이 페이지는 요청 전까지 최소 완화만 적용.
 */
body { opacity: 1 !important; }

/* com__section-07 리뷰 스와이퍼(.swiper) — 원본 df-bannermanager+swiper 런타임 JS 는
 * R18/R25 상 별도 반입 대상(선별 반입) 이나 이 페이지 쓰기범위(js/ 불가)에서는 초기화 스크립트를
 * 추가할 수 없다(COMMON: main.js 에 swiper 초기화 배선 필요 — notes 참고). 정적 폴백으로
 * 원본 .swiper-wrapper 를 가로 스크롤 가능한 네이티브 스크롤 컨테이너로 최소 보정해 4개 슬라이드가
 * 전부 접근 가능하도록만 한다(카드 폭/간격은 원본 반입 CSS 수치 그대로, 새 규칙 추가 없음).
 */
.com__section-07 .service__contents-wr .swiper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.com__section-07 .service__contents-wr .swiper-wrapper {
    display: flex;
}
.com__section-07 .service__contents-wr .swiper-slide {
    flex: 0 0 auto;
    width: 310px;
    margin-right: 20px;
}
@media all and (max-width: 767px) {
    .com__section-07 .service__contents-wr .swiper-slide {
        width: 240px;
    }
}