@charset "utf-8";

.commonTitle {margin-bottom:50px;}
.commonTitle h3 {font-size:var(--fs50); line-height:1.4; font-family:'SchoolSafetyChalkboardEraser'; font-weight:700;}
.commonTitle p {font-size:var(--fs18); color:#666; line-height:1.4;}

/* ======================== mainVisual ======================== */
.mainVisual { position:relative; width:100%; max-width:1750px; margin:0 auto; overflow:hidden; margin-top:150px; border-radius:50px;}
.mainVisualSwiper { width:100%; height:560px; }
.mainVisualSwiper .swiper-slide { position:relative; overflow:hidden; }
.slideImg { position:absolute; left:0; top:0; width:100%; height:100%; background:#000;}
.slideImg img { width:100%; height:100%; object-fit:cover; opacity:60%;}
.slideText { position:absolute; left:0; top:0; width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; padding:0 8%; z-index:2; }
.slideTitle { font-family:'SchoolSafetyChalkboardEraser', var(--f_base1), sans-serif; font-size:var(--fs64); color:#fff; line-height:1.2; font-weight:700; text-shadow:0 2px 10px rgba(0,0,0,.15); }
.slideDesc { margin-top:24px; font-family:var(--f_base1), sans-serif; font-size:var(--fs16); color:rgba(255,255,255,.9); line-height:1.7; text-shadow:0 1px 4px rgba(0,0,0,.15); }

/* control */
.mainVisualControl { position:absolute; left:0; top:18%; width:100%; z-index:10; padding:0 8%; }
.controlWrap { display:inline-flex; align-items:center; gap:10px; padding:20px 0;}
.pageCurrent { font-family:var(--f_base1), sans-serif; font-size:var(--fs14); color:#fff; min-width:18px; text-align:center; }
.pageTotal { font-family:var(--f_base1), sans-serif; font-size:var(--fs14); color:rgba(255,255,255,.6); min-width:18px; text-align:center; }
.pageProgress { width:100px; height:2px; background:rgba(255,255,255,.3); border-radius:2px; overflow:hidden; }
.pageProgressBar { width:0; height:100%; background:#fff; border-radius:2px; }
.btnAutoplay { position:relative; width:24px; height:24px; display:flex; align-items:center; justify-content:center; background:none; border:0;}
.btnAutoplay .iconPause { display:flex; align-items:center; gap:3px; }
.btnAutoplay .iconPause span { display:block; width:3px; height:12px; background:#fff; border-radius:1px; }
.btnAutoplay .iconPlay { display:none; font-size:10px; color:#fff; line-height:1; margin-left:1px; }
.btnAutoplay .iconPlay em {font-size:14px; font-style:normal;}
.btnAutoplay.btnPlay .iconPause { display:none; }
.btnAutoplay.btnPlay .iconPlay { display:block; }

/* ======================== responsive 1249px ======================== */
@media screen and (max-width:1249px) {
	.mainVisualSwiper { height:500px; }
	.slideText { padding:0 6%; }
	.slideDesc { margin-top:18px; }
	.mainVisualControl { padding:0 6%; }
}

/* ======================== responsive 991px ======================== */
@media screen and (max-width:991px) {
	.mainVisualSwiper { height:400px; }
	.slideDesc { margin-top:16px; }
	.pageProgress { width:80px; }
	
	.noticeInfo:before {border-radius:0 !important;}
	
}

/* ======================== responsive 768px ======================== */
@media screen and (max-width:768px) {
	.mainVisualSwiper { height:300px; }
	.slideText { padding:0 5%; }
	.slideDesc { margin-top:12px; line-height:1.6; }
	.mainVisualControl { padding:0 5%; }
	.controlWrap { gap:8px; padding:14px 0; }
	.pageProgress { width:60px; }
}




/* ======================== 알림·정보 섹션 ======================== */
.noticeInfo { position:relative; padding:110px 0; padding-bottom:240px; background: linear-gradient(180deg, #C8F3FD 0%, #FCFEFF 100%); border-radius:50px; margin-top:60px;}
.noticeInfo:before {width:100%; height:100%; position:absolute; bottom:0; content:""; background:url(../../images/main/bg_bottom.png) no-repeat bottom; border-radius:50px;}
.noticeInfo .inner { max-width:1485px; margin:0 auto; }

.noticeInfoWrap { position:relative; display:flex; gap:30px; align-items: flex-start; z-index:1; }
.noticeInfoWrap:before { content:""; position:absolute; top:-145px; right:20px; width:140px; height:170px; background:url(../../images/main/kids01.png) no-repeat right top;}

/* ---------- 공지사항 리스트 ---------- */
.noticeBoard { flex:1 1 0; background:#fff; border-radius:30px; border:1px solid #e8e8ec; display:flex; flex-direction:column; justify-content:center; }
.noticeBoardList li { border-bottom:1px solid #e8e8ec; }
.noticeBoardList li:last-child { border-bottom:none; }
.noticeBoardList li a { width:100%; display:flex; align-items:center; padding:28px 0; gap:12px; padding-left:40px; padding-right:50px; border-radius:0; transition:background 0.2s; }
.noticeBoardList li:first-child a { border-radius:20px 20px 0 0; }
.noticeBoardList li:last-child a { border-radius:0 0 20px 20px; }
.noticeBoardList li a:hover { background:#f3f4f6; }
.noticeBoardList li a span {transition:.3s;}
.noticeBoardList li a:hover span {color:var(--c_base1); transform:translateX(10px)}
.noticeBoardList li a { position:relative; }
.noticeBoardList li a::before { content:''; display:block; width:7px; height:7px; border-radius:100px; background:#4fc4e0; opacity:0; transition:opacity 0.2s; }
.noticeBoardList li a:hover::before { opacity:1; }
.noticeBoardTitle { flex:1; font-size:var(--fs18); color:#333; font-weight:400; width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.noticeBoardDate { font-size:var(--fs16); color:#aaa; white-space:nowrap; margin-left:30px; }

/* ---------- 정보 카드 그리드 ---------- */
.infoCardGrid { flex:0 0 675px; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:20px; }
.infoCard { background:#fff; border:1px solid #e5e5e5; border-radius:30px; padding:60px 50px; display:flex; flex-direction:column; transition:.3s; }
.infoCard:hover { box-shadow:0 15px 20px rgba(0,0,0,0.08);}
.infoCard:hover .infoCardTitle { color:var(--c_base1); }
.infoCard:hover .infoCardTitle {transform:translateX(8px)}

.infoCardTitle { font-family:'SchoolSafetyChalkboardEraser';  font-weight:700; display:block; font-size:var(--fs30); font-weight:700; color:#1a1a2e; line-height:1.3; transition:.3s;}
.infoCardDesc { margin-top:10px; color:#666; line-height:1.4; word-break:keep-all; }
.infoCardDivider { width:100%; height:1px; background:#e5e5e5; margin:18px 0; }
.infoCardBottom { display:flex; align-items:flex-end; justify-content:space-between; }
.infoCardLinks { display:flex; flex-direction:column; gap:2px; }
.infoCardLinks li { display:flex; align-items:center; gap:8px; font-size:var(--fs16); color:#666; }
.infoCardLinks li::before { content:''; display:inline-block; width:5px; height:5px; border-radius:100px; background:#666; }
.infoCardLinks li a:hover { color:var(--c_base1); }
.infoCardIcon { display:block; width:60px; height:60px; flex-shrink:0; margin-top:5px;}
.infoCardIcon img { width:100%; height:100%; object-fit:contain; }

/* ======================== 반응형 ======================== */
@media screen and (max-width:1249px) {
	.mainVisual {margin-top:100px;}
	
  .noticeInfo { padding:90px 0; }
  .noticeInfo .inner {padding:0 40px;}
  .noticeInfoWrap { gap:24px; }
  .infoCardGrid { flex:0 0 480px; gap:16px; }
  .infoCard { padding:24px; }
  .noticeBoardList li a { padding-left:36px; padding-right:36px; }
}

@media screen and (max-width:991px) {
  .noticeInfoWrap { flex-direction:column; display:block; }
  .noticeBoardList {margin-bottom:20px;}
  .infoCardGrid { flex:none; width:100%; margin-top: 20px; }
  .noticeBoardList li a { padding-left:30px; padding-right:30px; }
  .noticeInfoWrap:before {content:none;}
  .commonTitle {margin-bottom: 20px;}
  
  .mainVisual {border-radius:0;}
  .mainVisual {margin-top: 70px;}
  .noticeInfo {border-radius:0; margin-top:0;}
  
  .noticeInfo .inner {padding:0 20px;}
}

@media screen and (max-width:768px) {
  .noticeInfo { padding:40px 0; padding-bottom: 70px; }
  .infoCardGrid { grid-template-columns:1fr 1fr; gap:12px; }
  .infoCard { padding:20px; border-radius:12px; }
  .noticeBoard { border-radius:12px; }
  .noticeBoardList li a { padding:16px 20px; }
  .noticeBoardList li:first-child a { border-radius:12px 12px 0 0; }
  .noticeBoardList li:last-child a { border-radius:0 0 12px 12px; }
  .infoCardIcon { width:48px; height:48px; }
  
	.mainVisualControl {    top: 13%;}
	.noticeBoardList li a::before {content:none;}
}

@media screen and (max-width:480px) {
  .infoCardGrid { grid-template-columns:1fr; }
}





/* ===== 포토앨범 ===== */
.photoAlbum { padding:100px 0; padding-top:100px; }
.photoAlbum .inner { max-width:1485px; margin:0 auto; }

/* commonTitle 버튼 추가 */
.photoAlbum .commonTitle { position:relative; }
.photoAlbum .commonTitle .btnMore { position:absolute; right:0px; top:20px; display:inline-flex; align-items:center; padding:10px 24px; border:1px solid #ddd; border-radius:30px; font-size:var(--fs15); color:#333; transition:all 0.3s; }
.photoAlbum .commonTitle .btnMore::before { content:''; display:inline-block; width:5px; height:5px; background:var(--c_base1); border-radius:50%; margin-right:8px; transition:background 0.3s; }
.photoAlbum .commonTitle .btnMore:hover { background:var(--c_base1); color:#fff; }
.photoAlbum .commonTitle .btnMore:hover::before { background:#fff; }

/* 포토그리드 */
.photoGrid { margin-top:30px; display:flex; flex-direction:column; gap:10px; }

/* 공통 photoItem */
.photoItem { border: 1px solid #eee; flex:1; min-width:0; overflow:hidden; border-radius:30px; position:relative; display:block; transition:flex 0.5s cubic-bezier(0.25, 0.8, 0.25, 1); }
.photoItem img { width:100%; height:100%; object-fit:cover; display:block; }
.photoItem::before { content:''; position:absolute; inset:0; background:rgba(0,0,0,0); transition:background 0.4s; z-index:1; pointer-events:none; }
.photoItem:hover::before { background:rgba(0,0,0,0.35); }
.photoItem:hover { flex:2; }

/* 1번째, 6번째 기본 사이즈 확장 */
.photoRowTop .photoItem:first-child { flex:1.4; }
.photoRowBottom .photoItem:last-child { flex:1.4; }
.photoRowTop .photoItem:first-child:hover { flex:2.5; }
.photoRowBottom .photoItem:last-child:hover { flex:2.5; }

/* 오버레이 텍스트 */
.photoOverlay { position:absolute; left:0; bottom:0; width:100%; padding:30px 20px; background:linear-gradient(transparent, rgba(0,0,0,0.5)); opacity:0; transition:opacity 0.4s; display:flex; flex-direction:column; gap:4px; z-index:2; }
.photoItem:hover .photoOverlay { opacity:1; }
.photoTitle { font-size:var(--fs18); font-weight:600; color:#fff; }
.photoDate { font-size:var(--fs14); color:rgba(255,255,255,0.8); }

/* 상단 행 */
.photoRowTop { display:flex; gap:10px; height:400px; }

/* 하단 행 */
.photoRowBottom { display:flex; gap:10px; height:280px; }

/* ===== 반응형 ===== */
@media screen and (max-width:1249px) {
	.photoAlbum { padding:60px 0; }
	.photoRowTop { height:260px; }
	.photoRowBottom { height:220px; }
}

@media screen and (max-width:991px) {
	.photoAlbum .commonTitle .btnMore { position:static; margin-top:15px; }
	.photoRowTop { height:220px; }
	.photoRowBottom { height:180px; }
}

@media screen and (max-width:768px) {
	.photoAlbum { padding:40px 20px; }
	.photoGrid { gap:6px; }
	.photoRowTop { height:160px; gap:6px; }
	.photoRowBottom { height:140px; gap:6px; }
	.photoItem:hover { flex:1.8; }
	.photoRowTop .photoItem:first-child { flex:1.2; }
	.photoRowBottom .photoItem:last-child { flex:1.2; }
	.photoRowTop .photoItem:first-child:hover { flex:2; }
	.photoRowBottom .photoItem:last-child:hover { flex:2; }
	.photoItem { border-radius:8px; }
	.photoTitle { font-size:var(--fs15); }
	.photoDate { font-size:var(--fs12); }
	.photoOverlay { padding:20px 15px; }
}