/* ===== PIXEL MARKET Exhibitions ===== */
:root{
  --pm-bg: #0a0d17;
  --pm-surface: rgba(255,255,255,.05);
  --pm-border: rgba(255,255,255,.10);
  --pm-text: #e7ecff;
  --pm-dim: #93a0c3;
  --pm-accent1:#00d1ff;
  --pm-accent2:#ff33b5;
  --pm-grad: linear-gradient(90deg,var(--pm-accent1),var(--pm-accent2));
  --pm-radius: 16px;
  --pm-shadow: 0 12px 32px rgba(0,0,0,.35);
}

/* reset最小限 */
#main_container{ padding-top: 10px; }
body.visitor_exhibitions #main_container #contents_area{ clear: both; }

/* ---------- HERO (非ログイン時) ---------- */
#pm-hero{
  margin-top: 24px;
  background:
    radial-gradient(100% 120% at 0% 0%, rgba(0,209,255,.22) 0%, rgba(0,0,0,0) 60%),
    radial-gradient(120% 120% at 100% 0%, rgba(255,51,181,.22) 0%, rgba(0,0,0,0) 60%),
    #0b0f1a;
  border: 1px solid var(--pm-border);
  border-radius: var(--pm-radius);
  box-shadow: var(--pm-shadow);
}
#pm-hero .pm-hero__inner{
  max-width: 1200px; margin: 0 auto; padding: 40px 24px;
  display: grid; align-items: center;
}
#pm-hero h1{
  font-size: clamp(28px, 3.2vw, 44px);
  line-height: 1.2; margin: 0 0 16px; color: var(--pm-text);
  letter-spacing: .02em;
}
.pm-btn{
  display:inline-block; padding: 12px 18px; border-radius: 12px;
  font-weight: 700; text-decoration:none;
}
.pm-btn--primary{
  background: var(--pm-grad); color:#fff; box-shadow: var(--pm-shadow);
}

/* ---------- Section ---------- */
.pm-section{ max-width: 1200px; margin: 32px auto 40px; padding: 0 16px; }
.pm-section__head{
  display:flex; align-items:center; justify-content: space-between; gap: 12px;
}
.pm-section__title{
  font-size: clamp(20px, 2.2vw, 28px); margin: 0; color: var(--pm-text);
  background: var(--pm-grad); -webkit-background-clip:text; background-clip:text; color: transparent;
}
.pm-chip{
  display:inline-block; padding:6px 10px; border-radius:999px;
  background: var(--pm-surface); border:1px solid var(--pm-border);
  color: var(--pm-dim); font-size: 12px;
}

/* ---------- Grid & Card ---------- */
.pm-grid{
  margin-top: 18px;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 14px;
}
@media (max-width: 1200px){ .pm-grid{ grid-template-columns: repeat(12, 1fr); } }
@media (max-width: 992px){ .pm-grid{ grid-template-columns: repeat(8, 1fr); } }
@media (max-width: 640px){ .pm-grid{ grid-template-columns: repeat(4, 1fr); } }

.pm-card{
  grid-column: span 3; /* 4列 */
  display:flex; flex-direction:column;
  background: var(--pm-surface);
  border:1px solid var(--pm-border);
  border-radius: 14px; overflow:hidden;
  transition: transform .12s ease, border-color .15s ease, box-shadow .15s ease;
  text-decoration:none; color: var(--pm-text);
}
@media (max-width: 992px){ .pm-card{ grid-column: span 4; } } /* 2列 */
@media (max-width: 640px){ .pm-card{ grid-column: span 4; } } /* 1列 */

.pm-card:hover{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,.2);
  box-shadow: var(--pm-shadow);
}
.pm-card__media{
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0));
  display:grid; place-items:center; height: 170px;
}
.pm-card__img{
  max-height: 150px; max-width: 90%; width:auto; height:auto; display:block;
  filter: drop-shadow(0 6px 16px rgba(0,0,0,.35));
}
.pm-card__body{ padding: 12px 12px 14px; }
.pm-card__title{
  font-size: 15px; margin: 0 0 8px; font-weight: 700; color: var(--pm-text);
}
.pm-card__meta{ display:flex; gap: 8px; flex-wrap: wrap; align-items:center; }
.pm-badge{
  display:inline-flex; align-items:center; gap:6px;
  background: rgba(255,255,255,.06);
  border:1px solid var(--pm-border);
  border-radius: 10px; padding: 6px 8px; font-size: 12px; color: var(--pm-dim);
}
.pm-badge--price .gift_min_price{ color:#fff; font-weight:800; }

/* ---------- Empty ---------- */
.pm-empty{
  margin: 24px auto 0; padding: 24px;
  text-align:center; color: var(--pm-dim);
  background: var(--pm-surface); border:1px solid var(--pm-border);
  border-radius: 12px;
}

/* ---------- Skeleton ---------- */
.is-skeleton{ pointer-events:none; }
.pm-skel{
  position:relative; overflow:hidden; background: rgba(255,255,255,.08); border-radius: 8px;
}
.pm-skel:before{
  content:""; position:absolute; inset:0;
  background: linear-gradient(100deg, transparent 20%, rgba(255,255,255,.15) 38%, transparent 56%);
  transform: translateX(-100%); animation: pmShine 1.1s infinite;
}
.pm-skel--media{ height:170px; }
.pm-skel--line{ height:14px; margin:10px 0; }
@keyframes pmShine { 100% { transform: translateX(100%); } }

/* 既存の古いスタイルは未使用。競合回避のため不要な #main_banner 系は削除可。 */
