.notice-main { padding: 0; margin: 0; }

/* 🎥 비디오 히어로: 페이지 스코프 + svh */
.notice-main .video-hero{
  position: relative;
  width: 100%;
  min-height: 100svh;
  overflow: hidden;
}
.notice-main .video-hero > video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  z-index: 0;
}
.notice-main .video-hero .overlay{
  position: relative;
  z-index: 1;
  color: #fff;
  text-align: center;
  padding-top: min(30svh, 30vh);
  text-shadow: 0 2px 6px rgba(0,0,0,.4);
}

/* 🧭 인트로(배경 오버레이) */
.notice-intro{
  background-image: url('../../img/bg/notice-bg.webp');
  background-size: cover;
  background-position: center;
  color: var(--color-text-light, #fff);
  position: relative;
  margin-top: 75px;
  text-align: center;
  overflow: hidden;
}
.notice-intro::before{
  content:''; position:absolute; inset:0;
  background-color: var(--color-overlay-green, rgba(43,90,43,.55));
  z-index:-1;
}
.notice-intro:hover::before{ background-color: rgba(60,120,60,.5); }
.notice-intro h2{ font-size:1.5rem; font-weight:700; margin-bottom:1rem; color:#fff; }

/* ⌨️ 타이핑: JS 전용(가로쓰기 + 줄바꿈 허용) */
.notice-main .typewriter {
  font-size: 1.1rem;
  font-family: 'Noto Sans KR', sans-serif;
  color: var(--color-text);
  writing-mode: horizontal-tb;
  text-orientation: mixed;
  white-space: normal;   /* 줄바꿈 허용 */
  overflow: visible;     /* 잘림 방지 */
  max-width: 800px;
  margin: 0 auto;
  line-height: 1.8;
  color: #fff;           /* 인트로는 밝은 글자 */
}

/* 📄 공지 리스트 섹션 */
.notice-section{
  max-width: 900px;
  margin: 0 auto;
  padding: var(--section-padding) 0;
  font-size: var(--fs-base);
  color: var(--color-text);
  line-height: 1.8;
  padding: var(--section-padding) 1.25rem; /* ← 좌우 여백 추가 */
}
.notice-list{ list-style:none; padding:0; margin:0; }
.notice-list li{
  display:flex; flex-direction:column; align-items:flex-start;
  padding: var(--gap-sm) 0;
  border-bottom:1px solid var(--color-border);
}
.notice-date{
  font-size: var(--fs-sm);
  color: var(--color-text-muted);
  white-space: nowrap;
}
.notice-list a{
  color: var(--color-primary);
  text-decoration: none;
  font-weight: bold;
  flex: 1;
  text-align: left;
  transition: color .2s ease;
}
.notice-title{
  display:inline-block; color:#333; font-weight:500;
  padding-left:4px; flex:1; text-align:left;
}
.notice-list a:hover,
.notice-title:hover{ color: var(--color-primary); text-decoration: underline; cursor: pointer; }
.notice-desc{
  width:100%; margin-top:6px;
  font-size:1rem; font-weight:400; color:#28a745; line-height:1.8;
}

/* ===== 반응형 ===== */
@media (max-width:768px){
  .notice-main .video-hero{ min-height: 60svh; }
  .notice-main .video-hero .overlay{ padding-top: 12svh; font-size: 1rem; }

  .notice-intro{ padding: 2.5rem 1rem; margin-top: 40px; }
  .notice-intro h2{ font-size: 1.4rem; margin-bottom: .8rem; }

  .notice-main .typewriter {
    font-size: 1rem; line-height: 1.6;
    white-space: normal; width:100%; max-width:100%; margin:1rem auto 0;
  }

  .notice-section{ padding: 2rem 1rem; font-size:.95rem; }
  .notice-list li{ padding: .75rem 0; }
  .notice-date{ font-size: .85rem; }
  .notice-list a, .notice-title{ font-size: 1rem; line-height: 1.5; }
  .notice-desc{ font-size:.95rem; line-height:1.6; padding-left:.25rem; }
}

/* ===== FP07-2 Override: notice ===== */
.notice-table-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.notice-table{ min-width: 720px; }

.notice-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:16px; }
@media (max-width:1024px){ .notice-grid{ grid-template-columns: repeat(2,1fr);} }
@media (max-width:640px) { .notice-grid{ grid-template-columns: 1fr; } }