@charset "utf-8";
/* ==========================================================================
   BMTECH — 인증현황 그리드 (content/certification.php)
   원본: webdot-blueprints 03_about/certification/_code/a1_spsystems_certification_grid-4col
   변경: hover 오버레이·인증서별 제목 제거 (지시), 색·폰트만 --bmt 토큰으로.
   섹션 상하 padding 은 페이지 셸(m_box/p_box)이 담당하므로 좌우만 유지.
   ========================================================================== */

/* ── Block ── */
.wd-cert {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 20px;
}

/* ── List ── */
.wd-cert__list {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -1%;
  list-style: none;
  padding: 0;
}

/* ── Item ── */
.wd-cert__item {
  width: 23%;
  margin: 0 1% 2% 1%;   /* 행간 = 열간(1%+1%) */
  font-family: var(--bmt-font);
}

.wd-cert__item a {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* ── Thumbnail ── */
.wd-cert__thumb {
  position: relative;
  padding: 60px 0;
  background-color: var(--bmt-surface-alt);
  border-radius: 0;
  margin-bottom: 0;      /* 제목 삭제로 하단 간격 불필요 */
  overflow: hidden;
}

.wd-cert__img-wrap {
  display: block;
  position: relative;
  width: 50%;
  margin: 0 auto;
}

.wd-cert__img-wrap span {
  position: relative;
  display: block;
  width: 100%;
  height: 0;
  padding-top: 133%;
}

.wd-cert__img-wrap span img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* ── Responsive: Tablet ── */
@media (max-width: 1220px) {
  .wd-cert__item {
    width: 31.33%;
  }
}

/* ── Responsive: Mobile ── */
@media (max-width: 800px) {
  .wd-cert {
    padding: 0 20px;
  }

  .wd-cert__list {
    max-width: 480px;
    margin: 0 auto;
  }

  .wd-cert__item {
    width: 48%;
    margin-bottom: 2%;   /* 행간 = 열간(1%+1%) */
  }

  .wd-cert__thumb {
    padding: 20% 0;
  }

  .wd-cert__img-wrap {
    width: 70%;
  }
}

/* ── Responsive: Small Mobile ── */
@media (max-width: 480px) {
  .wd-cert__item {
    width: 100%;
  }
}

/* 2026-09-18 인증현황 2종(ISO 13485 · GMP) — 고객 PPT(ver1.3.2) 슬라이드 24.
   4열 격자에 2장만 두면 왼쪽에 몰려 보여 가운데 2열로 둔다. 인증서 위 라벨은 역할 D. */
.wd-cert--two .wd-cert__list { justify-content: center; }
.wd-cert--two .wd-cert__item { width: 31%; }
.wd-cert__label { margin-bottom: 16px; text-align: center; color: var(--bmt-accent); }
@media (max-width: 800px) {
  .wd-cert--two .wd-cert__item { width: 48%; }
}

/* 2026-09-30 특허증 12건 — ISO 13485 · GMP 아래 4열 (고객 요청 수정사항0930) */
.wd-cert--patent { margin-top: var(--bmt-block-gap); }