/* 기본 팝업 스타일 */
.popup {
  position: fixed;
  z-index: 10000;
  background: #fff;
  box-shadow: 0 4px 20px rgba(0,0,0,0.25);
  border-radius: 12px;
  overflow: hidden;
  text-align: center;
  padding: 0;
}
.popup img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 12px 12px 0 0;
}

/* 크기 옵션 */
.popup-small { max-width: 400px; width: 90%; }
.popup-medium { max-width: 600px; width: 90%; }
.popup-large { max-width: 800px; width: 90%; }

/* 위치 옵션 */
.popup-center { left: 50%; top: 50%; transform: translate(-50%, -50%); }
.popup-top { top: 10%; left: 50%; transform: translateX(-50%); }
.popup-bottom { bottom: 10%; left: 50%; transform: translateX(-50%); }

/* 닫기 버튼 */
.popup-close {
  position: absolute;
  top: 10px; right: 10px;
  background: rgba(0,0,0,0.6);
  color: #fff;
  font-size: 14px;
  border-radius: 50%;
  width: 32px; height: 32px;
  cursor: pointer;
  line-height: 32px;
  text-align: center;
}

/* 위치 프리셋 */
.popup-top-left {
  top: 5%;
  left: 5%;
}

.popup-middle-left {
  top: 40%;
  left: 5%;
  transform: translateY(-50%);
}

.popup-bottom-left {
  bottom: 5%;
  left: 5%;
}

/* 하단 영역 (오늘 하루 보지 않기) */
.popup-bottom {
  background-color: #333;
  color: #fff;
  font-size: 13px;
  padding: 5px;
  text-align: right;
}

/* 배경 오버레이 */
.popup-overlay {
  position: fixed;
  top:0; left:0; right:0; bottom:0;
  background: rgba(0,0,0,0.6);
  z-index: 9999;
}

/* 반응형 */
@media (max-width: 768px) {
  .popup { max-width: 90%; top: 20%; left: 50%; transform: translateX(-50%); }
}
@media (max-width: 480px) {
  .popup { max-width: 95%; top: 10%; left: 50%; transform: translateX(-50%); }
  .popup-close { width: 26px; height: 26px; font-size: 12px; line-height: 26px; }
}