@charset "utf-8";
/* ==================================================================
   theme/basic 반응형 보정 — 2026 리뉴얼
   ------------------------------------------------------------------
   기본 테마(default.css)는 1200px 고정폭이라 모바일에서 깨진다.
   G5_USE_MOBILE 을 false 로 두고(모바일 전용 페이지 미사용)
   이 파일이 default.css 뒤에 로드되어 폭만 반응형으로 풀어준다.
   default.css 는 수정하지 않는다 → 그누보드 업데이트 시 충돌 없음.
   ================================================================== */

/* ---------- 1. 고정폭 해제 ---------- */
#hd, #wrapper, #ft { min-width: 0; }

#hd_pop,
#hd_wrapper,
#tnb .inner,
#gnb .gnb_wrap,
#container_wr,
#ft_wr {
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

#container { width: auto; }

/* default.css 의 나머지 고정폭 두 곳 */
#ft_copy { width: auto; max-width: 1200px; margin: 0 auto; }
.hd_sch_wr { width: auto; max-width: 445px; }
.popular_inner { width: auto; max-width: 100%; }   /* 인기검색어 (스킨 CSS 고정폭) */

img, video, iframe, embed, object { max-width: 100%; }
img { height: auto; }

/* 표는 좁은 화면에서 가로 스크롤 */
.tbl_wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ---------- 2. 태블릿 이하 (1200px) ---------- */
@media (max-width: 1200px) {
  #hd_pop,
  #hd_wrapper,
  #tnb .inner,
  #gnb .gnb_wrap,
  #container_wr,
  #ft_wr { padding-left: 16px; padding-right: 16px; }

  #hd_sch #sch_stx { width: calc(100% - 60px); box-sizing: border-box; }
}

/* ---------- 3. 본문/사이드 1단 (1000px) ---------- */
@media (max-width: 1000px) {
  #container { float: none; width: auto; margin: 20px 0; }
  #aside { float: none; width: auto; margin: 20px 0; }

  #ft_wr { display: block; }
  #ft_wr .ft_cnt { width: 50%; }
}

/* ---------- 4. 모바일 (768px) ---------- */
@media (max-width: 768px) {
  #hd_wrapper { height: auto; padding-top: 14px; padding-bottom: 14px; }
  #logo { float: none; padding: 0 0 12px; text-align: center; }
  #logo img { max-height: 44px; width: auto; }

  #tnb .inner { text-align: center; }
  #tnb li { float: none; display: inline-block; }

  /* 헤더 검색 — 로고 아래로 내리고 폭을 화면에 맞춘다 */
  .hd_sch_wr { float: none; width: 100%; max-width: none; margin-left: 0; padding: 0 0 14px; }
  #hd_sch { margin-top: 10px; }
  #hd_sch #sch_stx { height: 40px; font-size: 1em; }
  #hd_sch #sch_submit { height: 40px; }

  /* GNB — 가로 스크롤 한 줄 */
  #gnb .gnb_wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  #gnb #gnb_1dul { white-space: nowrap; display: flex; }
  #gnb .gnb_1dli { float: none; flex: 0 0 auto; line-height: 46px; }
  #gnb .gnb_1dli .gnb_1da { padding: 0 14px; font-size: .95em; }
  #gnb .gnb_2dul { display: none !important; }   /* 2단 드롭다운은 터치에서 방해만 된다 */
  #gnb_all .gnb_al_li { width: 50%; min-height: 0; }


  /* 게시판 글쓰기/뷰 */
  #bo_v_title { font-size: 1.25em; }
  #bo_v_info { font-size: .9em; }
  .tbl_frm01 th, .tbl_frm01 td { display: block; width: 100%; box-sizing: border-box; }
  .tbl_frm01 th { padding-bottom: 4px; border: 0; }
  .twopart_input { width: 100%; }
  .frm_input, .frm_file, select, textarea { max-width: 100%; box-sizing: border-box; }

  /* 버튼 그룹 줄바꿈 */
  .btn_confirm .btn_submit, .btn_confirm .btn_cancel { display: inline-block; margin-bottom: 6px; }

  /* 푸터 */
  #ft_wr { padding: 28px 16px; text-align: center; }
  #ft_wr .ft_cnt { width: 100%; float: none; padding: 0 0 18px; }

  /* 캡차 */
  #captcha.m_captcha #captcha_img { max-width: 100%; }
}

/* ---------- 5. 소형 (480px) ---------- */
@media (max-width: 480px) {
  #gnb_all .gnb_al_li { width: 100%; border-left: 0; }
  .tbl_head01 caption { font-size: .95em; }
}