/* ============================================================
   제휴사 배너 (pbanner)
   campaign.ippeo.io 의 좌측 레일 배너와 동일 규격(300x250),
   랜딩에서는 우하단 고정으로 배치.
   노출: 첫 화면 45% 통과 후 → 푸터 진입 전 퇴장
   ============================================================ */
.pbanner-wrap {
  position: fixed;
  right: 28px;
  bottom: 28px;
  z-index: 40;
  width: 300px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity .4s, transform .4s, visibility .4s;
}
.pbanner-wrap.is-on { opacity: 1; visibility: visible; transform: none; }

.pbanner-ad {
  display: block;
  margin-bottom: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  color: #838383;
  text-align: right;
}
.pbanner {
  display: block;
  line-height: 0;
  overflow: hidden;
  border-radius: 10px;
  text-decoration: none;
  box-shadow: 0 4px 20px rgba(0, 0, 0, .08);
}
.pbanner img { display: block; width: 100%; height: auto; }
.pbanner--rail { aspect-ratio: 300 / 250; }
.pbanner--rail:hover { opacity: .9; }

/* 실제 소재 들어오기 전 자리표시 */
.pbanner__ph {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 5px;
  width: 100%; height: 100%;
  border-radius: 10px;
  border: 1px dashed #D8C8B8;
  background: rgba(255, 253, 250, .9);
  font-size: 12px; font-weight: 700; line-height: 1.6;
  color: #838383; text-align: center;
}
.pbanner__ph b { font-size: 16px; color: #404040; font-variant-numeric: tabular-nums; }

/* 좁은 화면에서는 콘텐츠를 가리므로 숨김 */
@media (max-width: 1024px) { .pbanner-wrap { display: none; } }

@media (prefers-reduced-motion: reduce) {
  .pbanner-wrap { transition: none; }
}

/* ---- 좁은 화면용 인라인 배너 (320x100) ----
   레일 배너가 숨는 1024 이하에서 본문 흐름 안에 노출 */
.pbanner-slot { display: none; }
.pbanner-slot .pbanner-ad { max-width: 420px; margin: 0 auto 6px; text-align: left; }
.pbanner--inline {
  width: 100%; max-width: 420px; margin: 0 auto;
  aspect-ratio: 320 / 100;
}
.pbanner--inline .pbanner__ph { flex-direction: row; gap: 10px; font-size: 11.5px; }
.pbanner--inline .pbanner__ph b { font-size: 13px; }

@media (max-width: 1024px) {
  .pbanner-slot { display: block; padding: 0 20px 60px; }
}