:root {
  --bg:#fff; --fg:#0f172a; --muted:#475569;
  --surface:#f7f9fc; --edge:rgba(2,6,23,.12);
  --primary:#0b3b74; --primary-50:#e9f1ff;
  --radius-lg:18px; --shadow-md:0 10px 24px rgba(2,6,23,.06);
}

body {margin:0;font-family:"Pretendard",system-ui,sans-serif;color:var(--fg);background:var(--bg);}
.container{width:min(1200px,92vw);margin:auto;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;}

/* Header */
header{position:sticky;top:0;background:rgba(255,255,255,.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--edge);z-index:10;}
.nav{display:flex;justify-content:space-between;align-items:center;padding:14px 0;}
.logo a{font-weight:900;font-size:22px;}
.logo .mark{border:2px solid var(--fg);padding:6px 10px;border-radius:10px;}
.menu{display:flex;gap:20px;}
.menu a{color:var(--muted);font-weight:600;padding:8px 10px;border-radius:8px;}
.menu a:hover{background:var(--primary-50);}
.hamburger{display:none;}
@media(max-width:860px){
  .menu{display:none;}
  .menu.open{display:flex;flex-direction:column;background:#fff;border:1px solid var(--edge);position:absolute;top:60px;left:16px;right:16px;border-radius:10px;padding:10px;}
  .hamburger{display:block;background:none;border:1px solid var(--edge);border-radius:8px;padding:6px 10px;}
}

/* Slider */
.slider{position:relative;overflow:hidden;border-radius:var(--radius-lg);border:1px solid var(--edge);box-shadow:var(--shadow-md);}
.slides{display:flex;transition:transform .6s ease;}
.slide{min-width:100%;aspect-ratio:16/9;position:relative;}
@media(max-width:560px){.slide{aspect-ratio:4/3;}}
.slide img{width:100%;height:100%;object-fit:cover;}
.caption{position:absolute;bottom:20px;left:20px;background:rgba(255,255,255,.85);padding:8px 12px;border-radius:8px;font-weight:700;}
.controls{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center;padding:0 8px;pointer-events:none;}
.btn{pointer-events:auto;background:rgba(255,255,255,.7);border:1px solid var(--edge);border-radius:50%;width:40px;height:40px;cursor:pointer;}
.dots{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;gap:8px;}
.dot{width:8px;height:8px;border-radius:50%;border:1px solid var(--fg);opacity:.5;}
.dot.active{background:var(--fg);opacity:1;}

/* Notices */
.notices{margin-top:30px;border:1px solid var(--edge);border-radius:12px;background:#fff;box-shadow:var(--shadow-md);}
.notices-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--edge);}
.notice-list{list-style:none;margin:0;padding:0;}
.notice-list li{border-top:1px solid var(--edge);}
.notice-list li:first-child{border-top:none;}
.notice-list a{display:grid;grid-template-columns:110px 1fr auto;gap:12px;align-items:center;padding:12px 18px;}
.notice-list a:hover{background:var(--primary-50);}
.notice-list time{color:var(--muted);}
.notice-list .badge{font-size:11px;padding:3px 6px;border-radius:999px;background:var(--primary-50);}
footer{border-top:1px solid var(--edge);text-align:center;color:var(--muted);padding:20px 0;}

/* Popup */
.popup {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.4);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 999;
  animation: fadeIn .3s ease;
}
.popup-inner {
  position: relative;
  width: min(420px, 85vw); /* ✅ 크기 축소: 데스크톱 420px, 모바일 85vw */
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,0.25);
  text-align: center;
  transform: translateY(-10px);
  animation: popupScale .3s ease forwards;
}
.popup-inner img { width: 100%; height: auto; display: block; cursor: pointer; }
.popup-close {
  position: absolute;
  top: 8px;
  right: 8px;
  background: rgba(255,255,255,0.9);
  border: none;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  font-size: 22px;
  cursor: pointer;
}
.popup-footer {
  font-size: 14px;
  padding: 10px;
  background: #f7f9fc;
  border-top: 1px solid var(--edge);
}
.popup-footer label {
  cursor: pointer;
  color: var(--muted);
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}