/* 메인 페이지 공지 팝업. 네이티브 <dialog> + showModal() (top layer)이라 z-index를 쓰지 않는다.
   사이트가 로드하는 Elementor/SR7/magnific-popup 스타일과 겹치지 않도록
   모든 선택자를 dialog.bw-notice 아래로 한정하고 접두사는 bw-notice-를 쓴다. */

/* 필수: 패딩이 남으면 딤배경 클릭 판정(e.target === dlg)이 오작동한다 */
dialog.bw-notice{padding:0;border:0;background:transparent;margin:auto;max-width:none;max-height:none;overflow:visible;color:#1f2233}
dialog.bw-notice::backdrop{background:rgba(0,0,0,.6)}
dialog.bw-notice[open]{animation:bw-notice-fade .15s ease-out}
dialog.bw-notice[open]::backdrop{animation:bw-notice-fade .15s ease-out}

dialog.bw-notice .bw-notice-box{display:block;margin:0;padding:0;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 12px 40px rgba(0,0,0,.4)}
dialog.bw-notice .bw-notice-stage{position:relative;display:block;margin:0;padding:0;background:#0d1b3e}

dialog.bw-notice .bw-notice-slide{display:block;margin:0;padding:0;animation:bw-notice-fade .15s ease-out}
dialog.bw-notice .bw-notice-slide[hidden]{display:none}
dialog.bw-notice .bw-notice-link{display:block;margin:0;padding:0;line-height:0;cursor:pointer}
dialog.bw-notice .bw-notice-img{display:block;width:auto;height:auto;max-width:min(92vw,500px);max-height:78vh;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;cursor:default}
dialog.bw-notice .bw-notice-link .bw-notice-img{cursor:pointer}

/* 좌우 화살표 (공지 2건 이상일 때만 생성) */
dialog.bw-notice .bw-notice-box button.bw-notice-nav{position:absolute;top:50%;z-index:1;display:flex;align-items:center;justify-content:center;width:40px;height:40px;margin:-20px 0 0;padding:0 0 3px;border:0;border-radius:50%;background:rgba(0,0,0,.5);color:#fff;font-size:28px;line-height:1;font-family:inherit;letter-spacing:normal;text-transform:none;text-shadow:none;box-shadow:none;cursor:pointer;transition:background-color .15s}
dialog.bw-notice .bw-notice-box button.bw-notice-nav:hover,
dialog.bw-notice .bw-notice-box button.bw-notice-nav:focus-visible{background:rgba(0,0,0,.75);color:#fff}
dialog.bw-notice .bw-notice-box button.bw-notice-nav[hidden]{display:none}
dialog.bw-notice .bw-notice-box button.bw-notice-prev{left:8px}
dialog.bw-notice .bw-notice-box button.bw-notice-next{right:8px}

/* 하단 바: 하루 동안 안 보기 / N / M / 닫기 */
dialog.bw-notice .bw-notice-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0;padding:8px 10px;background:#fff}
dialog.bw-notice .bw-notice-count{flex:1 1 auto;margin:0;padding:0;text-align:center;font-size:14px;line-height:1.2;color:#6b6f86}
dialog.bw-notice .bw-notice-count[hidden]{display:none}
dialog.bw-notice .bw-notice-box button.bw-notice-btn{display:inline-block;min-height:40px;margin:0;padding:8px 14px;border:0;border-radius:6px;font-family:inherit;font-size:14px;font-weight:500;line-height:1.2;letter-spacing:normal;text-transform:none;text-shadow:none;box-shadow:none;cursor:pointer;transition:background-color .15s}
dialog.bw-notice .bw-notice-box button.bw-notice-hide{background:transparent;color:#6b6f86}
dialog.bw-notice .bw-notice-box button.bw-notice-hide:hover,
dialog.bw-notice .bw-notice-box button.bw-notice-hide:focus-visible{background:#f0f1f6;color:#2b2f6b}
dialog.bw-notice .bw-notice-box button.bw-notice-close{background:#22b4ea;color:#fff}
dialog.bw-notice .bw-notice-box button.bw-notice-close:hover,
dialog.bw-notice .bw-notice-box button.bw-notice-close:focus-visible{background:#1a9fd1;color:#fff}
dialog.bw-notice .bw-notice-box button:focus-visible{outline:2px solid #2b2f6b;outline-offset:2px}

@keyframes bw-notice-fade{from{opacity:0}to{opacity:1}}

/* 70vh 기준은 하단 바를 포함한 모달 전체 높이에 적용된다(침입형 인터스티셜 완화).
   바가 약 56px이라 이미지는 그만큼 더 낮게 잡는다 */
@media (max-width:768px){
  dialog.bw-notice .bw-notice-img{max-height:60vh}
}

@media (prefers-reduced-motion:reduce){
  dialog.bw-notice,
  dialog.bw-notice::backdrop,
  dialog.bw-notice .bw-notice-slide{animation:none !important;transition:none !important}
  dialog.bw-notice .bw-notice-box button{transition:none !important}
}