/* ===== ICON_INFO1 모바일 배경 잘림 보정 =====
   wid_css(DB)의 N1 배경 규칙을 모바일에서 보강.
   섹션 전체를 항상 object-fit: cover로 채우고 잘림 방지. */

@media (max-width: 768px) {
  /* ★ 배경 기준 컨테이너 — wg_side(제목+그리드 포함 전체)를 기준 박스로 만들기
     + 양옆 패딩 제거 (모바일에서 답답함 해소) */
  .LB_ICON_INFO1 .wg_side {
    position: relative !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* N1 배경 박스 — wg_side(제목+그리드 전체)를 덮도록 확장 */
  .LB_ICON_INFO1 .wg_box_in:first-child {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 100vw !important;
    height: auto !important;       /* top/bottom 0으로 자동 산출 → wg_side 전체 높이 */
    min-height: 100% !important;
    z-index: 0 !important;
    pointer-events: none !important;
    overflow: hidden !important;
  }

  /* 제목 박스 — 배경 위에 표시 + 텍스트가 안 잘리게 */
  .LB_ICON_INFO1 .sub_stit_box {
    position: relative !important;
    z-index: 3 !important;
  }
  /* ★ 카드 그리드 — position:static 으로 강제하여 N1 absolute 기준을
     .wg_box 가 아닌 .wg_side(상위 relative)로 끌어올림 (제목 영역까지 배경 확장)
     z-index는 isolation으로 stacking context 분리 (배경 위에 표시) */
  .LB_ICON_INFO1 .wg_box {
    position: static !important;
    z-index: auto !important;
    isolation: isolate;
  }

  /* 이미지 컨테이너 — 박스 전체 영역 강제 */
  .LB_ICON_INFO1 .wg_box_in:first-child .wg_img_box,
  .LB_ICON_INFO1 .wg_box_in:first-child .wg_img1 {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
  }

  /* 실제 이미지 (img/picture/source) — cover 강제 */
  .LB_ICON_INFO1 .wg_box_in:first-child .wg_img1 img,
  .LB_ICON_INFO1 .wg_box_in:first-child .wg_img1 picture,
  .LB_ICON_INFO1 .wg_box_in:first-child .wg_img1 picture img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
  }

  /* 위젯 컨테이너의 가로 오버플로우 클립 (수직 잘림 방지) */
  .LB_ICON_INFO1 {
    overflow-x: clip;
    overflow-y: visible;
  }

  /* ★ 모바일 3칸 그리드 가로 넘침 방지 — 셀 min-width 0, 카드 패딩/gap 축소 */
  .LB_ICON_INFO1 .wg_box {
    min-width: 0 !important;
  }
  .LB_ICON_INFO1 .wg_box_in:nth-child(n+2) {
    min-width: 0 !important;            /* grid 자동 줄어듦 보장 */
    padding: 10px 6px !important;       /* 카드 좌우 패딩 대폭 축소 */
    gap: 10px !important;               /* 아이콘-텍스트 간격 축소 */
  }
  /* 아이콘 크기 — 좁은 칸에 맞춰 축소 */
  .LB_ICON_INFO1 .wg_box_in:nth-child(n+2) .wg_img1 {
    width: clamp(36px, 9vw, 60px) !important;
    height: clamp(36px, 9vw, 60px) !important;
  }
  /* 텍스트 크기 — 한 줄에 안 들어가면 줄바꿈 허용 */
  .LB_ICON_INFO1 .wg_box_in:nth-child(n+2) .wg_txt1 {
    font-size: clamp(11px, 2.8vw, 14px) !important;
    word-break: keep-all;
  }
}

/* 480px 이하도 동일 보강 (작은 모바일에서 이미지 비율 차이 큼) */
@media (max-width: 480px) {
  .LB_ICON_INFO1 .wg_box_in:first-child {
    height: 100% !important;
    min-height: 100% !important;
  }
  .LB_ICON_INFO1 .wg_box_in:first-child .wg_img1 img {
    object-fit: cover !important;
    object-position: center center !important;
  }
}