@charset "utf-8";

/* =========================================================
   data-slider (정적 나열 버전)
   - PC: 2열  / Mobile: 1열
   - 배너가 그리드 셀을 꽉 채움 (높이 90px 고정)
   ========================================================= */

/* 컨테이너 */
.static-grid-banner,
.static-banner,
ul.basic-banner.static-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
}

/* PC: 2열 */
@media (min-width: 768px) {

  .static-grid-banner,
  .static-banner,
  ul.basic-banner.static-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }
}

/* 배너 아이템 */
.static-grid-banner .item,
.static-banner .item,
ul.basic-banner.static-grid .item {
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
}

/* 이미지 래퍼 */
.static-grid-banner .img-wrap,
.static-banner .img-wrap,
ul.basic-banner.static-grid .img-wrap {
  width: 100%;
  height: auto;
  line-height: 0;
  overflow: hidden;
}

/* 이미지 - 셀 너비 꽉 채움, 높이 90px 고정 */
.static-grid-banner .img-item img,
.static-banner .img-item img,
ul.basic-banner.static-grid .img-item img {
  display: block;
  width: 100% !important;
  height: 90px !important;
  object-fit: cover;
  margin: 0 !important;
  border-radius: 6px;
}

/* ----------------------------------------------------------------
   Owl Carousel 무력화
   ---------------------------------------------------------------- */
.static-grid-banner.owl-carousel,
.static-banner.owl-carousel,
ul.basic-banner.static-grid.owl-carousel {
  display: grid !important;
}

.static-grid-banner .owl-stage-outer,
.static-grid-banner .owl-stage,
.static-grid-banner .owl-item,
.static-banner .owl-stage-outer,
.static-banner .owl-stage,
.static-banner .owl-item,
ul.basic-banner.static-grid .owl-stage-outer,
ul.basic-banner.static-grid .owl-stage,
ul.basic-banner.static-grid .owl-item {
  display: contents !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
}

.static-grid-banner .owl-nav,
.static-grid-banner .owl-dots,
.static-banner .owl-nav,
.static-banner .owl-dots,
ul.basic-banner.static-grid .owl-nav,
ul.basic-banner.static-grid .owl-dots {
  display: none !important;
}

/* 기존 .basic-banner 여백 */
.basic-banner .item {
  margin: 0 !important;
}

/* ============================
   공통 여백/레이아웃 교정
   ============================ */
.basic-banner,
.static-grid-banner {
  margin: 0 !important;
  padding: 0 !important;
}

/* 오울용 비율고정 제거 */
.basic-banner .img-wrap,
.static-grid-banner .img-wrap {
  position: static !important;
  padding: 0 !important;
  height: auto !important;
  overflow: visible !important;
}

.basic-banner .img-wrap .img-item,
.static-grid-banner .img-wrap .img-item {
  position: static !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
}

.basic-banner .img-wrap img,
.static-grid-banner .img-wrap img {
  display: block !important;
  width: 100% !important;
  height: 90px !important;
  object-fit: cover !important;
}

/* 그리드 최종 */
.static-grid-banner {
  display: grid !important;
  grid-template-columns: 1fr;
  row-gap: 6px;
  column-gap: 6px;
}

@media (min-width: 992px) {
  .static-grid-banner {
    grid-template-columns: 1fr 1fr;
    column-gap: 8px;
    row-gap: 8px;
  }
}