@charset "utf-8";
/* ============================================================
   /case 導入事例：証拠スタッツ＋業種フィルタ付きロゴウォール＋声
   2025のデザイン言語に統一・名前空間 .cp-/.cw-
   ============================================================ */

/* ---- 証拠バンド ---- */
.caseProof{ padding:54px 0 0; }
.cp-stats{ max-width:840px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.cp-stat{ background:#fff; border:1px solid #e3eef5; border-radius:16px; padding:26px 18px; text-align:center;
  box-shadow:0 18px 44px -34px rgba(1,160,233,.45); }
.cp-stat__num{ display:block; font-family:"Poppins",sans-serif; font-weight:800; font-size:2.3rem; line-height:1.1; color:#073b52; }
.cp-stat__num small{ font-size:1rem; font-weight:700; color:#0288c2; margin-left:3px; }
.cp-stat__num.is-text{ font-size:1.42rem; }
.cp-stat__label{ display:block; margin-top:9px; font-size:.86rem; color:#6b7d88; font-weight:600; }

/* ---- ロゴウォール ---- */
.cw-filter{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; max-width:940px; margin:34px auto 0; }
.cw-chip{ background:#fff; border:1px solid #d4e3ef; color:#5f7480; font-size:.86rem; font-weight:700;
  padding:8px 16px; border-radius:99px; cursor:pointer; transition:.15s; display:inline-flex; align-items:center; gap:7px; }
.cw-chip:hover{ border-color:#51bfeb; color:#0561c5; }
.cw-chip.is-active{ background:#01a0e9; border-color:#01a0e9; color:#fff; }
.cw-chip span{ font-size:.74rem; opacity:.85; font-family:"Poppins",sans-serif; }
.cw-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; max-width:1000px; margin:30px auto 0; }
.cw-card{ background:#fff; border:1px solid #e3eef5; border-radius:14px; padding:18px 14px; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; transition:transform .18s, box-shadow .18s, border-color .18s; }
.cw-card__zoom{ position:absolute; top:8px; right:8px; width:24px; height:24px; border-radius:7px;
  background:rgba(1,160,233,.08); color:#01a0e9; display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .15s; }
.cw-card__zoom svg{ width:14px; height:14px; }
.cw-card{ position:relative; }
.cw-card:hover .cw-card__zoom{ opacity:1; }
.cw-card[hidden]{ display:none; }
.cw-card:hover{ transform:translateY(-3px); border-color:#bfe0f6; box-shadow:0 14px 30px -18px rgba(1,160,233,.4); }
.cw-card figure{ margin:0; height:62px; width:100%; display:flex; align-items:center; justify-content:center; }
.cw-card img{ max-width:100%; max-height:62px; width:auto; height:auto; object-fit:contain; }
.cw-card p{ margin:12px 0 0; font-size:.8rem; font-weight:600; color:#39474f; line-height:1.5; text-align:center; }
.cw-empty{ text-align:center; color:#9fb6c4; padding:30px 0; }

/* ---- ライトボックス（クリックで拡大） ---- */
.cw-lightbox{ position:fixed; inset:0; z-index:99999; display:none; align-items:center; justify-content:center;
  background:rgba(7,40,55,.74); padding:24px; }
.cw-lightbox.is-open{ display:flex; }
.cw-lightbox__panel{ position:relative; background:#fff; border-radius:18px; padding:22px;
  max-width:min(92vw,620px); box-shadow:0 30px 80px rgba(0,0,0,.45); text-align:center;
  animation:cwLbIn .18s ease-out; }
@keyframes cwLbIn{ from{ opacity:0; transform:scale(.96); } to{ opacity:1; transform:scale(1); } }
.cw-lightbox__img{ display:block; max-width:100%; max-height:70vh; width:auto; height:auto; margin:0 auto;
  border-radius:10px; border:1px solid #eef3f7; }
.cw-lightbox__name{ margin:15px 0 0; font-size:.98rem; font-weight:700; color:#26323a; }
.cw-lightbox__close{ position:absolute; top:-15px; right:-15px; width:42px; height:42px; border-radius:50%;
  background:#fff; border:1px solid #e3eef5; color:#5f7480; font-size:23px; line-height:1; cursor:pointer;
  box-shadow:0 6px 18px rgba(0,0,0,.2); display:flex; align-items:center; justify-content:center; transition:color .15s; }
.cw-lightbox__close:hover{ color:#01a0e9; }
body.cw-lock{ overflow:hidden; }

@media (max-width:991px){ .cw-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:575px){
  .cp-stats{ grid-template-columns:1fr; gap:12px; }
  .cp-stat{ padding:20px 16px; }
  .cp-stat__num{ font-size:2rem; }
  .cw-grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
  .cw-card figure{ height:52px; }
  .cw-card img{ max-height:52px; }
}

/* FV：見出し「300社以上の導入実績」とロゴアニメの間隔を確保
   （page.css の #fv_slide.case_type{margin-top:-10px} を上書き） */
@media (min-width:576px){
  #fv_slide.case_type{ margin-top: 40px; }
}
@media (max-width:575px){
  #fv_slide.case_type{ margin-top: 34px; }
}