@charset "utf-8";
@import url("./default.css"); 

body{margin:0 auto; padding:0; box-sizing:border-box;  }
#wrap { background:#fff url(../images/main/wrap_bg.jpg) center 489px no-repeat; }

#container {width:1100px; margin:0px auto 0;  }


/*박스 공통*/
.col_box { border:1px solid #ddd; box-sizing:border-box;  position:relative; float:left; background:#f9f9f9;  }
.col_box h3 { font-size:15px; color:#333; }
.col_box h3 a { color:#333; }


/*메인비주얼*/
.visual_wrap { position:relative; max-height:393px; overflow:hidden; margin:-29px 0 12px; width:100%;}
.visual_wrap:after { content:""; display:block; clear:both; }
.visual_wrap .slick-list {   }
.visual_wrap .slick-slide img { display:block; margin:0 auto 0; } 

.visual_wrap .slick-dots { position:absolute; width:1100px; bottom:37px; left:50%; transform:translateX(-50%); text-align:right; box-sizing:border-box; padding:0 18px; }
.visual_wrap .slick-dots li { display:inline-block; vertical-align:top; width:12px; height:12px; background:#fff; cursor:pointer; border-radius:50%; box-sizing:border-box; margin:0 5px; border:1px solid #fff; }
.visual_wrap .slick-dots li span { display:none; }
.visual_wrap .slick-dots li.slick-active { background:#aacc00; }

.visual_wrap .main_btn { position:absolute; width:1100px; bottom:0px; left:50%; transform:translateX(-50%); text-align:right; box-sizing:border-box; }
.visual_wrap .main_btn li { position:absolute; top:-58px; z-index:1; }
.visual_wrap .main_btn li.v_prev { right:63px; }
.visual_wrap .main_btn li.v_next { right:0; }
.visual_wrap .main_btn li a { display:block; width:20px; height:28px; text-indent:-99999px; text-align:left; }
.visual_wrap .main_btn li.v_prev a { background:url(../images/main/v_bt1.png) center top no-repeat; }
.visual_wrap .main_btn li.v_next a { background:url(../images/main/v_bt2.png) center top no-repeat; }

.visual_wrap .vtxtbox { position:absolute; width:1100px; top:73px; left:50%; transform:translateX(-50%); text-align:left; box-sizing:border-box; }
.visual_wrap .vi_txt { opacity:0; transition:opacity 0.4s; }
.visual_wrap .vi_txt.effect { opacity:0; }

.visual_wrap .vi_txt.effect { -webkit-animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both; }
@-webkit-keyframes text-focus-in {
  0% {
    -webkit-filter: blur(12px);
            filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
            filter: blur(0px);
    opacity: 1;
  }
}
@keyframes text-focus-in {
  0% {
    -webkit-filter: blur(12px);
            filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
            filter: blur(0px);
    opacity: 1;
  }
}





/*월중행사 type1*/
.schedule { position:relative; padding:15px 20px 18px 20px; width:310px; height:200px; border-radius:10px 0 0 10px; overflow:hidden; background:#f9f9f9; border-top-width:2px; }
.schedule h3 { margin:0px 0 0 0px; letter-spacing:-0.5px; }
.schedule h3 span.year{ color:#80b918; font-size:24px;}
.schedule h3 span.month{ color:#2b9348; font-size:24px; margin-right:5px;}
.schedule h3 span.color { color:#55a630; }

.schedule .main_btn { position:absolute; right:20px; top:18px; border:1px solid #ddd; }
.schedule .main_btn:after { content:""; display:block; clear:both; }
.schedule .main_btn li { float:left; width:20px;}
.schedule .main_btn li a { display:block; text-indent:-99999px; width:100%; height:19px; }
.schedule .main_btn li.sbtn01 a { background:#eeeeee url(../images/main/btn01.png) center center no-repeat; }
.schedule .main_btn li.sbtn02 a { background:#dddddd url(../images/main/btn02.png) center center no-repeat; }
.schedule .main_btn li.sbtn03 a { background:#eeeeee url(../images/main/btn03.png) center center no-repeat; }

#schedule_scroll { width:100%; height:131px; box-sizing:border-box; background:#eeeeee; margin:6px 0 0; padding:10px 12px 1px; }
#schedule_scroll .slick-slide { height:23px; margin:0 0 7px 0; border:0 none; line-height:23px; }
#schedule_scroll .slick-slide a { font-size:12px; color:#333; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; display:block; width:100%; box-sizing:border-box; }
#schedule_scroll .slick-slide a strong { transition:all 0.4s; color:#fff; background:#80b918; display:inline-block; vertical-align:top; width:60px; text-align:center; margin-right:5px; }
#schedule_scroll .slick-slide a:hover strong { background:#55a630; }

#schedule_scroll .slick-slide a:hover { text-decoration:underline; }


/*아이콘바로가기*/
.quick_cont { float:right; width:790px; height:200px; background:#f9f9f9; border-top-width:2px; border-left:0 none; box-sizing:border-box; padding:0 0px 0 0px; border-radius:0px 10px 10px 0; margin-bottom:15px; }
.qslick { position:relative; }
.quick_cont .main_btn li { position:absolute; top:50px; }
.quick_cont .main_btn li.lbtn01 { left:30px; }
.quick_cont .main_btn li.lbtn03 { right:30px; }
.quick_cont .main_btn li a { display:block; width:14px; height:24px; text-indent:-99999px; }
.quick_cont .main_btn li.lbtn01 a { background:url(../images/main/q_bt1.png) center center no-repeat; }
.quick_cont .main_btn li.lbtn03 a { background:url(../images/main/q_bt3.png) center center no-repeat; }

#quick_slick { margin:38px 36px 0 74px; }
#quick_slick:after { content:""; display:block; clear:both; }
#quick_slick .slick-slide { width:96px; height:auto; position:relative; z-index:1; margin-right:40px; text-align:center; box-sizing:border-box;  }

#quick_slick div a { display:block; width:100%; height:auto;  }
#quick_slick div a .ic { display:block; width:96px; height:96px; position:relative; z-index:1; overflow:hidden; border-radius:50%; margin:0 auto 0; box-sizing:border-box; border:1px solid #ddd; transition:all 0.4s; }

#quick_slick div.qi1 a .ic { background:#eeeeee url(../images/main/l_ic1.png) center center no-repeat; }
#quick_slick div.qi2 a .ic { background:#eeeeee url(../images/main/l_ic2.png) center center no-repeat; }
#quick_slick div.qi3 a .ic { background:#eeeeee url(../images/main/l_ic3.png) center center no-repeat; }
#quick_slick div.qi4 a .ic { background:#eeeeee url(../images/main/l_ic4.png) center center no-repeat; }
#quick_slick div.qi5 a .ic { background:#eeeeee url(../images/main/l_ic5.png) center center no-repeat; }

#quick_slick div a:hover .ic { background-color:#ffcc50; }

#quick_slick div a .txt { margin-top:10px; display:block; width:100%; font-size:14px; color:#333; letter-spacing:-0.5px; padding:0 5px; box-sizing:border-box; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; line-height:20px; text-align:center; }
#quick_slick div a:hover .txt { text-decoration:underline; }

/*급식*/
.food { clear:both; position:relative; padding:15px 20px 18px 20px; width:310px; height:200px; border-radius:10px 0 0 10px; background:#f9f9f9; }
h3.dot { font-size:15px; }
h3.dot a { display:block; padding:0 0 0 21px; color:#000; background:url(../images/main/h3_dot.png) left 1px no-repeat;}
h3.dot a span.c1 { color:#55a630; }

.food .f_today { width:100%; height:26px; line-height:26px; font-weight:bold; text-align:center; border-radius:10px; background:#80b918; font-size:14px; color:#fff; margin:9px 0 10px; }
.food .f_today::before { content:""; display:inline-block; vertical-align:top; width:22px; height:18px; background:url(../images/main/food_ic.png) center center no-repeat; margin:4px 9px 0 0; }

.food .f_txt { width:100%; height:95px; box-sizing:border-box; background:#eeeeee; padding:12px 20px 0; }
.food .f_txt a { display:block; font-size:12px; color:#555; overflow:hidden; /* 여러 줄 자르기 추가 스타일 */
    white-space: normal;
    line-height: 18px;
    height: 72px;
    text-align: left;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;  }
.food .f_txt a:hover { text-decoration:underline; }

.more1 { position:absolute; right:-1px; top:-1px; }
.more1 a { background:#eeeeee; display:block; width:80px; height:26px; line-height:24px; box-sizing:border-box; border:1px solid #ddd; padding:0 0 0 9px; font-size:13px; color:#666; position:relative; }
.more1 a::before { content:""; display:block; width:26px; height:25px; position:absolute; right:-1px; bottom:-1px; background:#55a630 url(../images/main/more1.png) center center no-repeat; }

/*공지사항 type1*/
.noticeGroup{ width:400px; height:200px; border-left:0 none; border-right:0 none; padding:15px 19px 0; }
.noticeGroup h3 { margin-bottom:16px; }
.noticeGroup h3 a { display:inline-block; padding:0 8px 0 28px; height:28px; line-height:28px; border-radius:150px; background:#52b69a; color:#fff; font-size:16px; font-weight:bold; position:relative; }
.noticeGroup h3 a::before { content:""; display:block; width:16px; height:16px; border-radius:50%; background:#fff url(../images/main/nchk.png) center center no-repeat; position:absolute; left:5px; top:6px; }

.noticeGroup li { height:25px; line-height:25px; font-size:12px; }
.noticeGroup li::after { content:""; display:block; clear:both; }
.noticeGroup li a { color:#333; float:left; width:calc(100% - 94px); box-sizing:border-box; padding:0 0 0 13px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; position:relative; }
.noticeGroup li a::before { content:""; display:block; width:3px; height:3px; position:absolute; left:0; top:11px; background:#55a630; }
.noticeGroup li a:hover { text-decoration:underline; }
.noticeGroup li span { float:right; color:#777;}

/*가정통신문*/
.noticeGroup1 { width:390px; height:200px; border-radius:0 10px 10px 0; padding:15px 20px 0; margin-bottom:15px; }
.noticeGroup1 h3 { margin-bottom:20px; }
.noticeGroup1 li { height:25px; line-height:25px; font-size:12px; }
.noticeGroup1 li::after { content:""; display:block; clear:both; }
.noticeGroup1 li a { color:#333; float:left; width:calc(100% - 94px); box-sizing:border-box; padding:0 0 0 13px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; position:relative; }
.noticeGroup1 li a::before { content:""; display:block; width:3px; height:3px; position:absolute; left:0; top:11px; background:#55a630; }
.noticeGroup1 li a:hover { text-decoration:underline; }
.noticeGroup1 li span { float:right; color:#777;}


/*갤러리*/
.galleryGroup{ clear:both; float:left; width:711px; height:200px; background:#f9f9f9;  border-radius:10px 0px 0 10px; padding:14px 9px 0 20px;} 
.galleryGroup ul { margin-top:12px; }
.galleryGroup ul::after { content:""; display:block; clear:both; }
.galleryGroup ul li { float:left; width:160px; margin-right:10px; }
.galleryGroup ul li a { display:block; width:100%; text-align:center; }
.galleryGroup ul li .pic { width:100%; height:101px; overflow:hidden; border-radius:5px; background:#eee; margin-bottom:7px; }
.galleryGroup ul li .pic img { width:100%; height:101px; display:block; margin:0 auto 0; }
.galleryGroup ul li .gtxt { width:100%; height:25px; line-height:25px; font-size:12px; color:#515151; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.galleryGroup ul li a:hover .gtxt { text-decoration:underline; }

/*팝업*/
.popupZone { float:right; padding:14px 19px 0; border-left:none; border-radius:0 10px 10px 0; width:389px; height:200px; background:#f9f9f9; }
.popupZone h3.dot { font-size:15px; padding:0 0 0 21px; color:#000; background:url(../images/main/h3_dot.png) left 1px no-repeat; margin-bottom:15px; }
.popupZone h3.dot span.c1 { color:#55a630; }

.popupZone .main_btn { position:absolute; right:19px; top:18px; border:1px solid #ddd; }
.popupZone .main_btn:after { content:""; display:block; clear:both; }
.popupZone .main_btn li { float:left; width:20px; display:block;}
.popupZone .main_btn li a { display:block; text-indent:-99999px; width:100%; height:19px; }
.popupZone .main_btn li.pbtn01 a { background:#eeeeee url(../images/main/btn01.png) center center no-repeat; }
.popupZone .main_btn li.pbtn02 a { background:#dddddd url(../images/main/btn02.png) center center no-repeat; }
.popupZone .main_btn li.pbtn03 a { background:#eeeeee url(../images/main/btn03.png) center center no-repeat; }

.popupZone .slick-slide { height:25px; line-height:25px; font-size:12px; margin:0 0 0 0; border:0 none; }
.popupZone .slick-slide a { color:#333; width:100%; height:25px; line-height:25px; box-sizing:border-box; padding:0 0 0 13px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; position:relative; }
.popupZone .slick-slide a::before { content:""; display:block; width:3px; height:3px; position:absolute; left:0; top:8px; background:#55a630; }
.popupZone .slick-slide a:hover { text-decoration:underline; }


/*배너모음*/
#banner {  width:100%; height:60px; background:#fff; margin:15px 0 20px; padding:0 0 0 0; clear:both; border-radius:10px; overflow:hidden; position:relative; }
#banner::before { content:""; display:block; width:34px; height:100%; background:#52b69a; position:absolute; right:0px; top:0px; }
#banner h3 { float:left; line-height:40px; background:url(../images/main/banner_h3.jpg) left center no-repeat; padding-left:21px; margin:10px 0 0 23px; }
#banner h3 a { font-size:15px; color:#333; }
#banner .main_btn { position:absolute; left:111px; top:20px; }
#banner .main_btn:after { content:""; display:block; clear:both; }
#banner .main_btn li { float:left; width:20px; margin-left:4px; display:block; }
#banner .main_btn li a { display:block; width:100%; height:20px; border-radius:50%; box-sizing:border-box; text-indent:-999999px; }
#banner .main_btn li.bbtn01 a { background:url(../images/main/b_bt1.png) center center no-repeat; }
#banner .main_btn li.bbtn02 a { background:url(../images/main/b_bt2.png) center center no-repeat; }
#banner .main_btn li.bbtn03 a { background:url(../images/main/b_bt3.png) center center no-repeat; }


div#banner_scroll {position:absolute; left:204px; top:9px; width:850px; height:40px;overflow:hidden;  }
div#banner_scroll #banner_content { width:100%;}
div#banner_scroll #banner_content .slick-slide { margin:0 20px 0px 0; width:150px; }
div#banner_scroll #banner_content .banitem {float:left; width:100%; height:40px; box-sizing:border-box; background:#fff; border:1px solid #ddd; }
div#banner_scroll #banner_content .banitem img {float:left;width:100%;height:38px; }




/*///////////////////////////////////////////반응형//////////////////////////////////////////////*/

@media all and (max-width:1024px) {
body{ width:100%; height:auto; padding:0; margin:0px auto; }
#container {width:100%; margin:0px auto 0; overflow:hidden; min-height:100%; }
#container .default_layout { padding:0;}

/*박스 공통*/
.col_box{ clear:both; width:94%; margin:0px 3% 20px 3% !important; border-radius:10px !important;}


/*메인비주얼*/
.visual_wrap { position:relative; max-height:393px; overflow:hidden; margin:-28px 0 20px; width:100%;}
.visual_wrap:after { content:""; display:block; clear:both; }
.visual_wrap .slick-list {   }
.visual_wrap .slick-slide { height:300px; width:100%; position:relative; }
.visual_wrap .slick-slide div { height:300px;  }
.visual_wrap .slick-slide img { display:block; margin:0 0 0 0px; object-fit: cover; width:100%; height:300px; } 

.visual_wrap .slick-dots { position:absolute; width:100%; bottom:5px; left:0; transform:none; text-align:right; box-sizing:border-box; padding:0 18px; }
.visual_wrap .slick-dots li { display:inline-block; vertical-align:top; width:12px; height:12px; background:#fff; cursor:pointer; border-radius:50%; box-sizing:border-box; margin:0 5px; border:1px solid #fff; }
.visual_wrap .slick-dots li span { display:none; }
.visual_wrap .slick-dots li.slick-active { background:#aacc00; }

.visual_wrap .main_btn { display:none }
.visual_wrap .vtxtbox { position:absolute; width:94%; top:50%; transform:translateY(-50%); left:3%; }
.visual_wrap .vi_txt {  }
.visual_wrap .vi_txt img { width:200px; }

/*아이콘바로가기*/
.quick_cont { height:auto; background:#f9f9f9; border-top-width:2px; border-left:1px solid #ddd; box-sizing:border-box; padding:0 0px 0 0px;  }
.qslick { position:relative; }
.quick_cont .main_btn li { position:absolute; top:50%; transform:translateY(-50%); }
.quick_cont .main_btn li.lbtn01 { left:15px; }
.quick_cont .main_btn li.lbtn03 { right:15px; }

#quick_slick { margin:20px 36px 20px 44px; }
#quick_slick .slick-slide { margin-right:20px;  }

/*공지사항 type1*/
.noticeGroup{ border-left:1px solid #ddd; border-right:1px solid #ddd;  }

/*팝업*/
.popupZone { border-left:1px solid #ddd;  }
.popupZone .main_btn { top:16px; }

/*갤러리*/
.galleryGroup {
  padding: 14px 20px 0 20px;
}
.galleryGroup ul li { float:left; width:32%; margin:0 0 0 0; }
.galleryGroup ul li:nth-child(2) { margin:0 2%; }
.galleryGroup ul li:nth-child(4) { display:none; }


/*배너모음*/
#banner {margin:0px 0 0 0; height:auto;  float:left; position:relative; width:94%;  box-sizing:border-box; padding:10px 0 10px; }
#banner::before { display:none; }
#banner h3 { float:none; margin-top:0; margin-left:16px; }
#banner .main_btn { position:absolute; right:3%; top:20px; left:inherit; }
 
div#banner_scroll {position:relative; left:inherit; top:inherit; width:calc(100% - 20px); overflow:hidden; margin:5px 0 0 20px; }
div#banner_scroll ul#banner_content {position:absolute;left:0;top:0;width:100%;}
div#banner_scroll ul#banner_content li {float:left; margin:0 3% 0px 0; width:22%;  }

}



@media all and (max-width:740px) {

/*배너모음*/
div#banner_scroll ul#banner_content li {float:left; margin:0 3% 0px 0; width:30%;  }

}

@media all and (max-width:606px) {

.visual_wrap .slick-slide { height:180px; width:100%; position:relative; }
.visual_wrap .slick-slide div { height:180px;  }
.visual_wrap .slick-slide img { display:block; margin:0 0 0px; object-fit:cover; width:100%; height:180px;  object-position: 25% 50%;} 

.visual_wrap .slick-slide .visual02 img { object-position: 50% 50%;} 


}

@media all and (max-width:550px) {
/*배너모음*/
div#banner_scroll ul#banner_content li {float:left;  width:47%;  }

}

@media all and (max-width:490px) {

.galleryGroup ul li { float:left; width:49%; margin:0 0 0 0; }
.galleryGroup ul li:nth-child(2) { margin:0 0 0 2%; }
.galleryGroup ul li:nth-child(3) { display:none; }
.galleryGroup ul li:nth-child(4) { display:none; }

}