
/* === PAM 2025-10-15 fixed === */
/* Wrapper */
.pam-wrap{position:relative;margin:0;padding:12px 16px;border-bottom:1px solid #eee;background:#fff}
.pam-label{font-size:12px;opacity:.7;margin-bottom:8px}

/* Grid: widthは自動に任せる（100%強制なし） */
.pam-grid{
  display:grid;
  gap:12px;
  grid-template-columns:repeat(4,minmax(0,1fr));
  box-sizing:border-box;
}
@media (max-width:1024px){.pam-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media (max-width:640px){ .pam-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}

/* Card: 幅はグリッドに任せる / オーバーフロー抑止 */
.pam-card{
  position: relative;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  border: 1px solid #eee;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  box-sizing: border-box;
  width: auto;     /* ← 100%を強制しない */
  min-width: 0;    /* ← はみ出し防止（100%はNG） */
}

/* Image area: 親に高さを与え、画像は100%でフィット */
.pam-thumb{
  position: relative;
  z-index: 2;
  overflow: hidden;
  margin: 0;
  width: 100%;
  height: 100%;              /* ← 必要なら 160/200 に調整 -> 100%の方が綺麗に調整してくれるから変更 */
}
@media (max-width:1024px){ .pam-thumb{ height:160px; } }
@media (max-width:640px){  .pam-thumb{ height:140px; } }

.pam-thumb img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;          /* 全体優先なら .pam-fit-contain を併用 */
  object-position: center center;
}

/* 全体表示にしたいラッパ（任意で使用） */
.pam-fit-contain .pam-thumb img{
  object-fit: contain;
  background:#f7f7f7;
}

/* Text area */
.pam-meta{ position: relative; z-index: 1; }

.pam-title{
  color: #222;
  font-size: 15px;
  line-height: 1.3;
  padding: 6px 8px 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  min-height: 44px;           /* ← 2行想定でコンパクト */
}
.pam-caption{font-size:12px;line-height:1.5;padding:0 8px 8px;color:#444;overflow:hidden}

/* Overlay/hover stacking（画像内に閉じ込め） */
.pam-type-hover .pam-hover-msg{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  background: rgba(0,0,0,.7);
  color: #fff;
  font-size: 14px;
  opacity: 0;
  transition: opacity .2s ease;
  pointer-events: none;
  z-index: 3;   /* 画像の上 */
}
.pam-type-hover:hover .pam-hover-msg{opacity:1}
.pam-badge{position:absolute;z-index:4;background:rgba(0,0,0,.75);color:#fff;padding:6px 10px;border-radius:999px;font-size:13px;pointer-events:none}

/* Safety */
.pam-title, .pam-caption{position: static !important}
/* === end fixed === */

/* Rakuten Motion Widget container (fit to card) */
.pam-type-rakuten, .pam-rakuten-mw { display:block; }
.pam-card.pam-type-rakuten { overflow:hidden; }
.pam-rakuten-mw iframe,
.pam-rakuten-mw div,
.pam-rakuten-mw script { max-width:100%; }

.pam-wrap { display:block; width:100%; }
.pam-grid { display:grid; grid-column: 1 / -1; }
.pam-wrap, .pam-grid { box-sizing: border-box; }