@font-face { font-family: "Pretendard Variable"; src: url("../fonts/PretendardVariable.woff2") format("woff2"); font-style: normal; font-weight: 100 900; font-display: swap; }
* { box-sizing: border-box; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; margin: 0; padding: 0; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; overscroll-behavior: none; }
body { position: fixed; inset: 0; font-family: "Pretendard Variable", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif; background: #fff; }
.background { position: absolute; top: 0; left: 0; width: 100%; aspect-ratio: 1920 / 1400; overflow: hidden; pointer-events: none; user-select: none; }
.background img { display: block; width: 100%; height: auto; }
.notice { position: fixed; inset: 0; z-index: 1; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(0, 0, 0, 0.7); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); color: #fff; text-align: center; }
.notice-box { width: 520px; max-width: 100%; min-height: 200px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 40px; border-radius: 16px; background: #fff; color: #222; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.24); word-break: keep-all; overflow-wrap: anywhere; }
.notice-box h1 { max-width: 100%; font-size: 22px; font-weight: 700; line-height: 1.4;  color: #222;}
.notice-box p { max-width: 100%; font-size: 18px; font-weight: 500; line-height: 1.6; color: #444;}
.notice-box a { color: #005eb8; text-decoration: none;}
.notice-box a:visited { color: #005eb8;}
.notice-box a:hover { text-decoration: underline;}
.notice-box img {margin-top: 1rem;}
@media (width < 768px) {
  .background { aspect-ratio: 671 / 1600; }
  .notice-box { width: 100%; min-height: 180px; gap: 12px; padding: 32px 24px; border-radius: 12px; }
  .notice-box h1 { font-size: 20px; }
  .notice-box p { font-size: 16px; }
 }