@charset "utf-8";

@import url(common.css);

#container {position:relative; height:100%;}
#container:after {content:""; display:block; clear:both;}

.main_content {position:relative; z-index:7; width:960px; margin:0 auto; padding-top: 100px;}
.main_content:after {content:""; display:block; clear:both;}

/* 슬라이더 */
#slider { position:absolute; left:0; top:0; width:100%; height:100%;}
#slider div{position:absolute; width:100%; height:100%;top:0; left:0;}
#slider .img_1 {background: #f5f4f2 url(/images/template/02171/main/bg_01.png) no-repeat center top}
 
/* 메인비주얼 */
.main_visual{position:absolute;top: 50px;right: 200px;}

/* 포토갤러리 */
.gallery { position:relative; width:400px; height:185px; background:#fff; clear:both}
.gallery h2{ font-size:18px; color:#111; padding:20px 0 0 25px;}
.gallery .gall_list{ padding:10px 25px 0;}
.gallery .gall_list {overflow:hidden; width:100%; }
.gallery .gall_list li{ float:left; margin-left:15px; width:165px}
.gallery .gall_list li:first-child{ margin-left:0}
.gallery .gall_list li a{ color:#111; font-size:12px; font-family:'돋움',Dotum; text-align:center;}
.gallery .gall_list li a:hover{ text-decoration:underline}
.gallery .gall_list li a .img{ display:block;}
.gallery .gall_list li a .img img{ width:100%; height:90px; }
.gallery .gall_list li a .txt{ display:block; margin-top:12px; line-height:14px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.gallery .btn_more{ position:absolute; top:17px; right:20px; background:url('/images/template/02171/main/btn_more.png') no-repeat 50% 50%; width:23px; height:23px; text-indent:-10000px; z-index:10 }

/* 공지사항 */
.notice {position:relative;width:400px;height:185px;float:left;background:#e15555;}  
.notice h2 { font-size:18px; font-family:'NanumBold'; color:#fff; padding:20px 0 0 20px }
.notice .btn_more{ position:absolute; top:17px; right:20px; background:url('/images/template/02171/main/btn_more.png') no-repeat 50% 50%; width:23px; height:23px; text-indent:-10000px; z-index:10 }
.notice .list_box{display:block;padding:20px 25px 0;font-family:'돋움',Dotum;font-size:12px;overflow:hidden;}
.notice .list_box li{ font-family:'돋움',Dotum; line-height:21px; font-size:12px; overflow:hidden; position:relative;}
.notice .list_box li a {display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color: #fff;}
.notice .list_box li a:hover{ text-decoration:underline;}
.notice .list_box li span.text {float:left; padding-left:8px; background:url("/images/template/02171/main/notice_dot.gif") no-repeat 0 9px; width:70%;}
.notice .list_box li span.date {position:absolute;top:0;right:0;color: #fff;}

 /* 오늘의 식단 */
.meal_menu{width:200px; height:185px; position:relative;background: #ff7861 url("/images/template/02171/main/lunch_bg.png") no-repeat center bottom; overflow:hidden}
.meal_menu h2 {margin:0 auto;text-align:center;color: #fff;letter-spacing: -1px;padding:20px 10px 10px;}
.meal_menu h2 a {font-size:18px;font-family:"NanumBold"; color:#fff;}
.meal_list { overflow:hidden}
.meal_list ul{ height:130px; overflow:hidden; overflow-y:auto;font-family:'Dotum', '돋움';font-size:12px;color:#fff;text-align:center;line-height:18px; padding:0 10px}
.meal_list ul li{ color:#fff}
.meal_list ul li:after{content:""; display:inline-block; *display:inline; zoom:1}

/* 바로가기 */
.M_link{position:relative; z-index:5; float:left}
.M_link ul{ width:100%; }
.M_link li{ width:200px; height:185px; float:left; }
.M_link li a{ display:block; height:185px; color:#fff; font-family:"NanumBold"; font-size:18px; text-align:center; letter-spacing:-1px;}
.M_link li a span{ display:block; margin-top:10px;}
.M_link li.link1 a{ background:#39a8dd}
.M_link li.link2 a{ background:#187cba;}
.M_link li.link3 { margin-left:360px;}

/* 가정통신문 */
.notice02 {position:relative; width:360px;height:185px;background-color:#27a2bc;overflow:hidden;z-index:10;}  
.notice02 h2 { font-size:18px; font-family:'NanumBold'; color:#fff; padding:20px 0 0 20px }
.notice02 .btn_more{ position:absolute; top:17px; right:20px; background:url('/images/template/02171/main/btn_more.png') no-repeat 50% 50%; width:23px; height:23px; text-indent:-10000px; z-index:10 }
.notice02 .list_box{ display:block; padding:20px 25px 0; font-family:'돋움',Dotum; font-size:12px; overflow:hidden;}
.notice02 .list_box li{ font-family:'돋움',Dotum; line-height:21px; font-size:12px; overflow:hidden; position:relative;}
.notice02 .list_box li a {display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color: #fff;}
.notice02 .list_box li a:hover{ text-decoration:underline;}
.notice02 .list_box li span.text {float:left; padding-left:8px; background:url("/images/template/02171/main/notice_dot.gif") no-repeat 0 9px; width:70%;}
.notice02 .list_box li span.date {position:absolute;top:0;right:0;color: #fff;}

/* 행사일정 */
.schedule{ position:relative; width:600px; height:210px; background-color:#13548c; overflow:hidden; float:left; clear:both;}
.schedule .date_view{ position:absolute; top:15px; right:30px; width:35%; text-align:center; }
.schedule .date_view a{ position:absolute; top:8px; display:block; font-size:0; line-height:0; width:21px; height:20px; }
.schedule .date_view a.pre{ left:10px; background:url(/images/template/02171/main/btn_c_prev.png) no-repeat;}
.schedule .date_view a.next{ right:8px; background:url(/images/template/02171/main/btn_c_next.png) no-repeat;}
.schedule .date_view span{ line-height:28px; font-weight:bold; font-family:"NanumBold"; font-size:16px; font-weight:bold; color:#fff;}
.schedule .inner{ width:50%; float:left; margin:25px 30px 0;}
.schedule table{ width:100%; font-family:'돋움',Dotum;}
.schedule table thead th{ color:#fff; font-size:11px; letter-spacing:-1px; background-color:#393939; line-height:23px; font-weight:normal }
.schedule table tbody td{color:#222;letter-spacing:-1px;font-size:11px;line-height:25px;text-align:center;background: #5a88af;border-bottom: 1px solid #333;}
.schedule table tbody td .today{ display:inline-block; color:#333; width:18px; height:25px; background:url(/images/template/02171/main/schd_today.png) no-repeat 50% 50%}
.schedule table tbody td a { display:inline-block; color:#fff; width:18px; height:25px; background:url(/images/template/02171/main/schd_check.png) no-repeat 50% 50%}
.schedule table .sun{ color:#e06a6d;}
.schedule table .sat{ color:#528fcc;}
.schedule .sch_list{width:35%; margin:51px 30px 0 0; float:right; font-family:'돋움',Dotum; font-size:12px; color:#4e4e4e; }
.schedule .sch_list h2{color: #fff799;font-size:14px;}
.schedule .sch_list ul{margin:10px auto 0;padding:10px;height:90px;overflow:hidden;overflow-y:auto;background: #d0dde8;}
.schedule .sch_list ul li{ line-height:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.schedule .sch_list ul li strong{ display:inline-block; width:25px; text-align:right; margin-right:7px; font-weight:bold; color:#396f9d}

/* 바로가기 */
.M_link02{ position:relative; width:360px; height:210px; float:right; background:#d3eccf url(/images/template/02171/main/link_bg.jpg) no-repeat;}
.M_link02 h2{font-size:16px;font-family:"NanumBold";color: #434343; padding:20px 0 5px 20px;overflow:hidden;}
.M_link02 p{color: #434343;font-size:13px;font-family:"Nanum"; padding-left:20px;}
.M_link02 ul{padding: 20px 20px 0;}
.M_link02 li{ width:25%; float:left; }
.M_link02 li a{display:block;color: #434343;font-family:"Nanum";font-size:13px;text-align:center;letter-spacing:-1px;}
.M_link02 li a span{display:block; margin-top:10px; width:70px;}

/* 배너존 */
.banner_zone{ position:relative; z-index:1; width:100%; height:78px; overflow:hidden; clear:both; /*background:#fff;*/}
.banner_zone .inner{ position:relative; width:960px; margin:0 auto; overflow:hidden}
.banner_zone h2{ font-size:15px; font-family:"NanumBold"; color:#1d1d1d; position:absolute; top:19px; left:0;}
.banner_zone .btn{ position:absolute; left:0; top:44px}
.banner_zone .btn a{ float:left; font-size:0; text-indent:-10000em; width:14px; height:15px; vertical-align:top}
.banner_zone .btn a.pre{background:url(/images/template/02171/main/btn_b_prev.gif) no-repeat}
.banner_zone .btn a.stop{ background:url(/images/template/02171/main/btn_b_stop.gif) no-repeat}
.banner_zone .btn a.next{ background:url(/images/template/02171/main/btn_b_next.gif) no-repeat}
.banner_zone .btn a.list{ background:url(/images/template/02171/main/btn_b_list.gif) no-repeat; width:15px; }
.banner_zone ul{ padding-top:17px; margin-left:70px; height:45px; overflow:hidden}
.banner_zone ul li{ float:left; margin-left:8px;}
.banner_zone ul li a img{ width:170px; height:45px}
  
 
@media (max-width: 800px) {
	
	#container,
	.main_content,
	.banner_zone{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box}
	#container { width:100%; margin-top:0; padding-top:69px; background:none; }
	.main_content { width:95%; height:100%; }
	#slider .img_1 {background: #f5f4f2 url(/images/template/02171/main/bg_02.png) no-repeat center top;/* background-size:cover; */}	
	.main_visual, .notice, .popBox, .schedule, .gallery, .M_link, .M_link02, .banner_zone{-webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; transition:all 0.3s ease}
 
	/* 슬라이더 */
	#slider div{top:60px;}

	/* 메인비주얼 */
	.main_visual{position: absolute;top: 10px;width:100%;text-align:center;left: 0;}
	
	/* 포토갤러리 */
	.gallery { width:49%; margin-top:0;  }
	.gallery .gall_list ul li{margin-left:14px; width:-webkit-calc(50% - px); width:-moz-calc(50% - px); width:calc(50% - 7px);}
	
	/* 공지사항 */
	.notice {width:50%; margin-top:10px;}	
			
	/*오늘의식단*/
	.meal_menu {width:50%;  margin-top:10px;}
		
	/* 가정통신문 */
	.notice02{position:relative; width:50%; margin:10px 0;}
		
	/* 바로가기 */
	.M_link{margin-top:10px;width:50%;}
	.M_link li{ width:50%; }
	.M_link li.link_03{ margin-left:0;}

	/* 행사일정 */
	.schedule{ width:100%}
	.schedule .date_view{width:-webkit-calc(55% - 90px); width:-moz-calc(55% - 90px); width:calc(55% - 90px);}
	.schedule .inner{ width:45%; float:left; margin:25px 30px 0;}
	.schedule .sch_list{width:-webkit-calc(55% - 90px); width:-moz-calc(55% - 90px); width:calc(55% - 90px); }

	/* 바로가기 */
	.M_link02{width:100%;margin:10px 0;text-align:center;background: url(/images/template/02171/main/link_bg.jpg) no-repeat;background-size: cover;}
	.M_link02 h2{ padding:20px 0 5px 0; }
	.M_link02 p{ padding-left:0;}
	.M_link02 li a span {width:100%;}

	/* 배너존 */
	.banner_zone .inner{width:95%;}
	.banner_zone ul li{width:-webkit-calc(33% - 10px); width:-moz-calc(33% - 10px); width:calc(33% - 10px);}
	.banner_zone ul li a img{ width:100%}

}

@media (max-width: 560px) {	

	/* 메인비주얼 */
	.main_visual{position:absolute;top:10px;left: 0px;width:100%;text-align:center;}

	/* 포토갤러리 */
	.gallery { width:100%}
	
	/* 공지사항 */
	.notice {width:100%; float:none}	
			
	/*오늘의식단*/
	.meal_menu {width:100%; margin-top:10px}
		
	/* 가정통신문 */
	.notice02{width:100%}
		
	/* 바로가기 */	
	.M_link { width:100%; height:auto; margin-bottom:10px}
	.M_link li { height:auto}
	.M_link li a { height:auto; padding-bottom:20px}
	.M_link li.link1 a img,
	.M_link li.link2 a img { width:50%; height:auto;}

	/* 바로가기 */
	.M_link02{width:100%;margin:10px 0;text-align:center;background: url(/images/template/02171/main/link_bg.jpg) no-repeat;background-size: cover;}
	.M_link02 h2{ padding:20px 0 5px 0; }
	.M_link02 p{ padding-left:0;}
	.M_link02 li a span {width:100%;}
	
	/* 행사일정 */
	.schedule{ height:auto; padding-bottom:20px;}
	.schedule .date_view{ top:10px; width:-webkit-calc(100% - 60px); width:-moz-calc(100% - 60px); width:calc(100% - 60px);}
	.schedule .inner{ width:-webkit-calc(100% - 60px); width:-moz-calc(100% - 60px); width:calc(100% - 60px); margin-top:45px;}
	.schedule .sch_list{ width:-webkit-calc(100% - 60px); width:-moz-calc(100% - 60px); width:calc(100% - 60px); margin-top:15px;}
		
	/* 배너존 */
	.banner_zone ul li{ width:-webkit-calc(50% - 14px); width:-moz-calc(50% - 14px); width:calc(50% - 14px);}
}

@media (max-width: 480px) {	 

	/* 메인비주얼 */
	.main_visual img{width:80%; }
	
	/* 공지사항 */  
	.notice01 h2 { font-size:15px; }
	.notice01 h2.tit_2 a{ left:100px; }
	.notice01 h2.tit_3 a{ left:175px; }
				
}

@media (max-width: 380px) {	
		
	/* 바로가기 */
	.M_link02{ height:190px;}
	.M_link02 p{ display:none;}
	.M_link02 ul{ padding:0 10px; }
	
	/* 배너존 */
	.banner_zone ul li{ width:-webkit-calc(100% - 10px); width:-moz-calc(100% - 10px); width:calc(100% - 10px);}
			
}