@charset "utf-8";

@import url(common.css);

#container {position:relative; background:url(/images/template/02291/main/m_bg.gif) repeat-x 0 530px;}
#container:after {content:""; display:block; clear:both;}

.main_content {position:relative; z-index:7; width:980px; margin:0 auto; }

/* visual */
.main_visual { position:relative; width:100%; height:320px; background:url(/images/template/02291/main/visual_bg.png) no-repeat 50% 0; background-size:cover; overflow:hidden;}
.main_visual .ul_visual{ position:absolute; top:0; left:50%; margin-left:-490px; width:980px; height:320px; overflow:hidden; }
.main_visual .ul_visual li {overflow:hidden; position:absolute; top:0; left:0; width:100%; height:100%; }

/* 공지사항 */
.notice { position:relative; width:280px; height:145px; float:left; margin-top:30px; overflow:hidden; background:url(/images/template/02291/main/tit_line01.png) repeat-x 0 0}  
.notice h2 { font-size:16px; font-family:'NanumBold'; }
.notice h2 a{ position:absolute; top:0; display:block; line-height:25px; padding-bottom:5px; text-align:center; color:#777;}
.notice h2.tit_1 a{ left:0; }
.notice h2.tit_2 a{ left:80px; }
.notice h2.tit_3 a{ left:160px; }
.notice h2 a.current{ color:#0095ae; border-bottom:3px solid #0095ae; }
.notice .btn_more{ position:absolute; top:0; right:0; background:url('/images/template/02291/main/btn_more.png') no-repeat 0 0; width:21px; height:21px; text-indent:-10000px; z-index:10 }
.notice .list_box.on{ display:block; }
.notice .list_box{ display:none; padding:45px 0 0; font-family:'돋움',Dotum; font-size:12px; overflow:hidden;}
.notice .list_box li{position:relative; width:100%; height:25px; float:left; clear:both; font-family:'돋움',Dotum; line-height:25px; font-size:12px; overflow:hidden; }
.notice .list_box li a { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:#222; padding-left:8px; background:url("/images/template/02291/main/notice_dot.gif") no-repeat 0 9px;}
.notice .list_box li a:hover{ text-decoration:underline;}
.notice .list_box li span.text {width:70%; float:left;  display:block; }
.notice .list_box li span.date {width:25%; float:right; text-align:right; color:#666;}

/* 바로가기 */ 
.M_link { position:relative;  width:340px; height:145px; float:left; margin:35px 0 0 40px; }
.M_link ul{ width:100%;}
.M_link li{ float:left; width:33.33%;}
.M_link li a{ display:block; color:#222; height:145px; font-family:"NanumBold"; font-size:14px; letter-spacing:-1px; text-align:center;}
.M_link li a:hover{ color:#0291d3}
.M_link li a span{ display:block; padding-top:10px;}

/* 팝업존 */
.pop{ position:relative; width:280px; height:145px; float:right; margin-top:30px; }
.pop h2{font-size:16px; font-family:"NanumBold"; padding:0 0 10px 0; line-height:25px;}
.pop .nss_pg{ position:absolute; top:3px; right:0; }
.pop .nss_pg > span{ font-family:'돋움',Dotum; line-height:28px; color:#fff; font-size:12px; display:inline-block; width:45px; text-align:center}
.pop .nss_pg > span strong{ color:#fff155}
.pop .nss_pg a{ display:block; float:left; font-size:0; text-indent:-10000em; width:21px; height:21px; margin:0 0 0 3px}
.pop .nss_pg a.pre{ background:url(/images/template/02291/main/btn_prev.png) no-repeat;}
.pop .nss_pg a.next{ background:url(/images/template/02291/main/btn_next.png) no-repeat; }
.pop .nss_pg a.stop{ background:url(/images/template/02291/main/btn_stop.png) no-repeat; }
.pop .nss_pg a.list{ background:url(/images/template/02291/main/btn_more.png) no-repeat; }
.pop .pop_img li{ display:none; width:280px; height:106px; }
.pop .pop_img li img{ width:100%; height:106px;}
.pop .pop_img li.on{ display:block}

/* 자료마당 */
.notice02 {position:relative; width:280px; height:145px; float:left; clear:both; margin-top:70px; background:url(/images/template/02291/main/tit_line02.png) repeat-x 0 0;}  
.notice02 h2{ font-size:16px; font-family:'NanumBold'; }
.notice02 .btn_more{ position:absolute; top:0; right:0;  font-size:16px; font-family:'NanumBold'; background:url('/images/template/02291/main/btn_more.png') no-repeat 0 0; width:21px; height:21px; text-indent:-10000px; z-index:10 }
.notice02 .list_box{ padding:30px 0 0; font-family:'돋움',Dotum; font-size:12px; overflow:hidden;}
.notice02 .list_box li{position:relative; width:100%; height:25px; float:left; clear:both; font-family:'돋움',Dotum; line-height:25px; font-size:12px; overflow:hidden; }
.notice02 .list_box li a { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:#222; padding-left:8px; background:url("/images/template/02291/main/notice_dot.gif") no-repeat 0 9px;}
.notice02 .list_box li a:hover{ text-decoration:underline;}
.notice02 .list_box li span.text {width:70%; float:left;  display:block; }
.notice02 .list_box li span.date {width:25%; float:right; text-align:right; color:#666;}

/* 포토갤러리 */
.gallery{ position:relative; width:340px; height:145px; float:left; margin:70px 0 0 40px; background:url(/images/template/02291/main/tit_line02.png) repeat-x 0 0}
.gallery h2{ font-size:16px; font-family:'NanumBold'; }
.gallery .btn_more{ position:absolute; top:0; right:0; background:url('/images/template/02291/main/btn_more.png') no-repeat 0 0; width:21px; height:21px; text-indent:-10000px; z-index:10 }
.gallery .gall_list { position:relative; margin-top:30px; font-size:12px; overflow:hidden;}
.gallery .gall_list p {width:30%; float:left;}
.gallery .gall_list p img {height:78px;}
.gallery .gall_list dl {width:65%; float:right;}
.gallery .gall_list dl dt {font-family:'굴림',gulim; color:#111; line-height:18px; padding-bottom:7px; font-weight:bold; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.gallery .gall_list dl dd {color:#555; line-height:18px; overflow:hidden; height:36px;}
.gallery .gall_list p.date {width:65%; float:right; color:#888; padding:5px 0 0; }
.gallery ul li {float:left; margin-left:15px; width:160px}
.gallery ul li:first-child {margin-left:0}
.gallery ul li a {color:#424242; font-size:12px; font-family:'돋움',Dotum;}
.gallery ul li a:hover {text-decoration:underline}
.gallery ul li a .img {display:block}
.gallery ul li a .img img {width:100%; height:85px}
.gallery ul li a .txt {display:block; margin-top:15px; line-height:14px; text-align:center; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}

/* 학교일정 */
.schedule{ position:relative; width:280px; height:145px; float:right; margin:70px 0 0; background:url(/images/template/02291/main/tit_line02.png) repeat-x 0 0;}
.schedule h2{ font-size:16px; font-family:"NanumBold"; color:#444; height:29px; line-height:29px;}
.schedule .btn_more{ position:absolute; top:0; right:0; background:url('/images/template/02291/main/btn_more.png') no-repeat 0 0; width:21px; height:21px; text-indent:-10000px; z-index:10 }
.schedule span.sch_year{ display:none; }
.schedule span.sch_month{ position:absolute; top:53px; left:0; background:url(/images/template/02291/main/ico_cal.png) no-repeat 0 0; width:85px; height:85px; text-align:center; line-height:96px; color:#111; font-size:26px; font-family:"NanumBold";}
.schedule .sch_list ul{ margin-top:25px; padding:0 10px 0 110px; height:80px; overflow:hidden; overflow-y:auto;}
.schedule .sch_list ul li{ line-height:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px;}
.schedule .sch_list ul li strong{ display:inline-block; width:25px; text-align:right; margin-right:7px; font-weight:bold; color:#0291d3}
.schedule{ position:relative; width:280px; height:145px; float:right; margin:70px 0 0; background:url(/images/template/02203/main/tit_line02.png) repeat-x 0 0;}
.schedule h2{ font-size:16px; font-family:"NanumBold"; color:#444; height:29px; line-height:29px;}
.schedule .btn_more{ position:absolute; top:0; right:0; background:url('/images/template/02203/main/btn_more.png') no-repeat 0 0; width:21px; height:21px; text-indent:-10000px; z-index:10 }
.schedule p.month{ position:absolute; top:53px; left:0; background:url(/images/template/02203/main/ico_cal.png) no-repeat 0 0; width:85px; height:85px; text-align:center; line-height:96px; color:#111; font-size:26px; font-family:"NanumBold";}
.schedule .sch_list ul{ margin-top:25px; padding:0 10px 0 110px; height:80px; overflow:hidden; overflow-y:auto;}
.schedule .sch_list ul li{ line-height:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px;}
.schedule .sch_list ul li strong{ display:inline-block; width:25px; text-align:right; margin-right:7px; font-weight:bold; color:#0291d3}

/* 바로가기 */ 
.M_link02 { position:relative; width:100%; float:left; padding:15px 0; margin-top:30px;}
.M_link02 ul{ width:100%;}
.M_link02 li{ float:left; width:16.666%; background:url(/images/template/02291/main/bar.gif) no-repeat 0 50%;}
.M_link02 li a{ display:block; color:#222; font-family:"Nanum"; font-size:14px; letter-spacing:-1px; text-align:center;}
.M_link02 li a:hover{ color:#0291d3}
.M_link02 li:first-child{ background:none;}

/* 배너존 */
.banner_wrap{ position:relative; z-index:1; width:100%; height:78px; overflow:hidden; clear:both; background:#fff; border-top:1px solid #ddd;}
.banner_zone { position:relative; width:980px; 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/02291/main/btn_b_prev.gif) no-repeat}
.banner_zone .btn a.stop{ background:url(/images/template/02291/main/btn_b_stop.gif) no-repeat}
.banner_zone .btn a.next{ background:url(/images/template/02291/main/btn_b_next.gif) no-repeat}
.banner_zone .btn a.list{ background:url(/images/template/02291/main/btn_b_list.gif) no-repeat; width:15px; }
.banner_zone ul{ padding-top:17px; margin-left:80px; height:45px; overflow:hidden}
.banner_zone ul li{ float:left; margin-left:10px;}
.banner_zone ul li a img{ width:170px; height:45px}

@media (max-width: 800px) {
	
	#container,
	.main_content,
	.M_link02, 
	.M_link02 li,
	.banner_zone{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box}
	
	#container { width:100%; padding-top:68px; background-image:none;}
	.main_content { width:95%; margin:0 auto; height:100%; }
		
	.main_visual, .notice, .gallery, .M_link, .M_link02, .pop, .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}
	
	/* visual */
	.main_visual { height:0; padding-top:30%;}
	.main_visual .ul_visual{ margin-left:-50%; width:100%;}
	.main_visual .ul_visual li img{ width:100%;}

	/* 공지사항 */
	.notice { width:48%;}
	
	/* 바로가기 */ 
	.M_link{ width:48%; float:right; margin-left:0; }
	.M_link li img{ width:80%;}

	/* 팝업존 */
	.pop{ width:48%; float:left; }
	.pop .pop_img li{ width:100%; }

	/* 자료마당 */
	.notice02 {width:48%;  float:right; clear:none; margin-top:30px; }  
	
	/* 포토갤러리 */
	.gallery { width:48%; margin:30px 0 0 0; }
	.gallery .gall_list p img {width:100%;}
	
	/* 학교일정 */
	.schedule { width:48%; margin:30px 0 0; }	

	/* 바로가기 */ 
	.M_link02{ padding:0; margin-bottom:30px; border-top:1px solid #ddd; border-right:1px solid #ddd;}	
	.M_link02 li{ width:50%; background:none; border-left:1px solid #ddd; border-bottom:1px solid #ddd; }
	.M_link02 li a{ line-height:20px; padding:5px 0}

	/* 배너존 */
	.banner_zone {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) {	

	/* 공지사항 */
	.notice, .notice02 { width:100%;}
	
	/* 바로가기 */ 
	.M_link{ width:100%; }
	.M_link li img{ width:auto;}

	/* 팝업존 */
	.pop{ width:100%; }
	
	/* 포토갤러리 */
	.gallery{ width:100%; }
	
	/* 학교일정 */
	.schedule{ width:100%; }	
	
	/* 배너존 */
	.banner_zone ul li{ width:-webkit-calc(50% - 10px); width:-moz-calc(50% - 10px); width:calc(50% - 10px);}	

}

@media (max-width: 480px) {

	/* 바로가기 */ 
	.M_link02 li{ width:50%; }	
		
}

@media (max-width: 380px) {
	
	/* 배너존 */
	.banner_zone ul li{ width:-webkit-calc(100% - 10px); width:-moz-calc(100% - 10px); width:calc(100% - 10px);}

}