@charset "UTF-8";
/* ==========================================================================
   autobase — 고객지원 반응형 (모든 @media 는 이 파일에만)
   ========================================================================== */

/* ── 1200 이하 ───────────────────────────────────────────────────────── */
@media (max-width: 1200px) {
  .sp__title { font-size: 44px; }
  .vg { gap: 32px 24px; }
  .cf { gap: 24px; }
  .cf__info { flex-basis: 320px; padding: 32px; }
  .cf__form { padding: 32px; }
}

/* ── 1024 이하 ───────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .sp { margin-top: 44px; padding-bottom: 80px; }
  .sp__title { font-size: 34px; }
  .sp__desc { font-size: 15px; }
  .sp__bar { flex-wrap: wrap; margin-top: 32px; }
  .sp-search { width: 100%; }

  .nl__thumb { width: 180px; height: 124px; }
  .nl__item > a { gap: 24px; padding: 24px 12px; }
  .nl__title { font-size: 19px; }

  .nv__title { font-size: 28px; }

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

  .cf { flex-direction: column; }
  .cf__info { flex-basis: auto; width: 100%; }
  .cf__info dl > div { padding: 8px 0; }
}

/* ── 768 이하 : 모바일 ───────────────────────────────────────────────── */
@media (max-width: 768px) {

  .sp { margin-top: 36px; padding-bottom: 56px; }
  .sp__title { font-size: 30px; }
  .sp__desc { margin-top: 12px; font-size: 14px; }
  .sp__bar { margin-top: 22px; gap: 14px; }
  .sp-chips a { padding: 6px 13px; font-size: 14px; }
  .sp-chips a.is-active { padding: 7px 14px; }
  .sp-search { height: 42px; }
  .sp-search input { font-size: 14px; }
  .sp__count { margin-top: 18px; font-size: 13px; }
  .sp-empty { padding: 72px 0; border-radius: 12px; font-size: 15px; }
  .editor-body { font-size: 15px; }

  .sp-pager { margin-top: 28px; }
  .sp-pager__nums a { padding: 0 8px; margin: 0 3px; font-size: 15px; }
  .sp-pager__nav { margin: 0 3px; }

  /* 뉴스 목록 — 썸네일 위, 본문 아래 */
  .nl__item > a { flex-direction: column; align-items: stretch; gap: 14px; padding: 18px 4px; }
  .nl__thumb { width: 100%; height: auto; aspect-ratio: 16 / 9; }
  .nl__title { font-size: 17px; white-space: normal; }
  .nl__desc { font-size: 14px; }
  .nl__date { margin-top: 8px; font-size: 13px; }
  .nl__pin, .nl__cat { padding: 2px 10px; font-size: 12px; }

  /* 뉴스 상세 */
  .nv__head { margin-top: 28px; padding-bottom: 20px; }
  .nv__title { font-size: 22px; }
  .nv__info { font-size: 13px; gap: 14px; }
  .nv__body { padding: 28px 0; }
  .nv__files { padding: 14px 16px; }
  .nv__nav li { gap: 12px; padding: 14px 4px; font-size: 14px; }
  .nv__nav-label { width: 60px; }
  .nv__actions { margin-top: 28px; }

  /* 동영상 */
  .vg { grid-template-columns: 1fr; gap: 24px; margin-top: 24px; }
  .vg__thumb { border-radius: 12px; }
  .vg__play { width: 52px; height: 52px; }
  .vg__title { font-size: 16px; }
  .vlb { padding: 16px; }
  .vlb__close { top: 12px; right: 12px; }

  /* Q&A */
  .qa { margin-top: 24px; }
  .qa__q { gap: 12px; padding: 18px 4px; }
  .qa__mark { width: 30px; height: 30px; font-size: 14px; line-height: 30px; }
  .qa__text { font-size: 15px; }
  .qa__cat { display: block; width: fit-content; margin: 0 0 6px; }
  .qa__a { gap: 12px; padding: 18px 12px 22px; }
  .qa__answer { font-size: 14px; }

  /* 문의하기 */
  .cf { margin-top: 32px; gap: 16px; }
  .cf__info { padding: 24px 20px; border-radius: 12px; }
  .cf__info h3 { font-size: 20px; }
  .cf__info dl > div { font-size: 14px; }
  .cf__form { padding: 24px 20px; border-radius: 12px; }
  .cf__grid { grid-template-columns: 1fr; gap: 14px; }
  .cf__agree > label { align-items: flex-start; font-size: 14px; }
  .cf__done { padding: 48px 20px; border-radius: 12px; }
  .cf__done strong { font-size: 22px; }
  .cf__done p { font-size: 14px; }
}