/* privacy.html — 개인정보 취급방침 전용 보정
 *
 * 원본(U_ET_menprotection_0001.php)은 width="1080"/"1078" 고정폭 2단 테이블 +
 * 본문 조문 블록이 style="width: 825px" / "width: 805px" 로 박힌 구조다.
 * 원본 CSS(front.css)와 요소 인라인 style 은 그대로 두고, 폭 제약만 푸는 보정만 얹는다.
 */

/* 데스크톱: 좌측 카테고리 열(228) / 구분선(1) / 본문 나머지 — 원본 td width 속성값 그대로 */
@media screen and (min-width: 1081px) {
  #content table[width="1078"] {
    table-layout: fixed;
  }

  #content table[width="1078"] > tbody > tr > td[width="228"] {
    width: 228px;
  }

  #content table[width="1078"] > tbody > tr > td[width="1"] {
    width: 1px;
  }
}

/* ------------------------------------------------------------------
 * 반응형 리플로우 (R3) — 1080 고정폭 2단을 좁은 폭에서 단일열로
 * ------------------------------------------------------------------ */
@media screen and (max-width: 1080px) {
  #content table[width="1080"],
  #content table[width="1078"] {
    width: 100% !important;
    max-width: 100%;
    table-layout: fixed;
  }

  #content table[width="1078"] > tbody,
  #content table[width="1078"] > tbody > tr {
    display: block;
    width: 100%;
  }

  #content table[width="1078"] > tbody > tr > td {
    display: block;
    width: 100% !important;
    max-width: 100%;
  }

  #content table[width="1078"] > tbody > tr > td[width="228"] {
    max-width: 228px;
    margin: 0 auto;
  }

  /* 1px 세로 구분선은 단일열에서 의미가 없다 */
  #content table[width="1078"] > tbody > tr > td[width="1"] {
    display: none;
  }

  /* 카테고리 hover 레이어(#CA_SUB_MENU)는 visibility:hidden 이어도
   * absolute 폭이 문서 스크롤폭을 늘린다 — 좁은 폭에선 레이아웃에서 뺀다. */
  #content [id="CA_SUB_MENU"] {
    display: none;
  }

  /* 본문 조문 블록의 인라인 고정폭(825/805px)을 유동으로 */
  #content div[style*="width: 825px"],
  #content div[style*="width: 805px"] {
    width: auto !important;
    max-width: 100%;
  }

  /* 목차 박스(825 고정 테이블)와 그 상하단 장식 이미지 */
  #content table[width="825"] {
    width: 100% !important;
    max-width: 100%;
    table-layout: fixed;
  }

  #content table[width="825"] img[width="825"] {
    width: 100%;
    height: auto;
  }

  /* 목차 내부 700px 고정 테이블 */
  #content table[width="700"] {
    width: 100% !important;
    max-width: 100%;
    table-layout: fixed;
  }

  /* 구분선 대용 스페이서 이미지(폭 825)가 넘치지 않게 */
  #content div img[width="825"] {
    width: 100%;
    height: auto;
  }
}

@media screen and (max-width: 640px) {
  /* 목차 2열을 단일열로 — 조문 링크가 좁은 폭에서 뭉개진다 */
  #content table[width="700"] colgroup {
    display: none;
  }

  #content table[width="700"] td[width="49%"] {
    width: auto;
    word-break: keep-all;
  }

  /* 상단 타이틀 바: 좌측 아이콘 + 제목 + 우측 네비를 좁은 폭에 맞춘다 */
  #content table[background$="sbt_bg_01.gif"] td[width="200"] {
    width: auto;
  }

  #content td.navi {
    font-size: 11px;
    white-space: nowrap;
  }

  /* 조문 헤더의 float 2단(제목 / TOP 버튼)이 겹치지 않게 */
  #content div[style*="height: 35px"] {
    height: auto !important;
    overflow: hidden;
  }
}

/* 어느 폭에서도 본문 이미지·표는 컨테이너를 넘지 않는다 (R3) */
#content img,
#content table {
  max-width: 100%;
}

/* ── 빌더 기본약관 배선 컨테이너 — 인라인 스타일 대체 (2026-08-31) ── */
.ahb-terms { padding: 10px 24px 30px; text-align: left; line-height: 1.7; }
.ahb-terms-state { padding: 24px 0; text-align: center; color: #888; }