@charset "utf-8";

@import url(common.css);

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

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

/* 메인비주얼 */
.main_visual{ position:relative; width:100%; height:330px;} /* 170320 170323*/
.main_visual p{ position:relative; width:980px; margin:0 auto;}
.main_visual p img{ width:100%;}

/* 공지사항 */
.notice { position:relative; width:980px; height:250px; float:left; background:#fff url(../images/main/tab_line.gif) repeat-x 0 0; }  /*  170323*/  
.notice h2 { font-size:15px; font-family:'NanumBold'; letter-spacing:-1px; }
.notice h2 a{ position:absolute; top:0; display:block; text-align:center; color:#666; width:197px; height:49px; line-height:49px; border-right:1px solid #c8d1db;}
.notice h2.tit_1 a{ left:0; border-left:0; }
.notice h2.tit_2 a{ left:197px;}
.notice h2.tit_3 a{ left:395px;}
.notice h2 a.current{color:#000; background:#fff url(/images/template/02246/main/tab_on.png) no-repeat; height:50px; }
.notice h2.tit_1 a.current{ background-position:80% 50%}
.notice h2.tit_2 a.current{ background-position:85% 50%}
.notice h2.tit_3 a.current{ background-position:90% 50%}
.notice .btn_more{ position:absolute; top:0; right:0; background:url('/images/template/02246/main/btn_more.gif') no-repeat 50% 50%; width:63px; height:49px; text-indent:-10000px; z-index:10 }
.notice .list_box.on{ display:block; }
.notice .list_box{ display:none; margin:65px 20px 0; font-family:'돋움',Dotum; font-size:12px;  clear:both;}
.notice .list_box a{color:#3c3c3c;}
.notice .list_box a:hover { text-decoration:underline;}
.notice .list_box .top_list{padding:20px 20px 30px 130px; border-bottom:1px dotted #b3b3b3; background:url(/images/template/02246/main/img_notice.png) no-repeat 10px 10px; font-family:'돋움',Dotum; }
.notice .list_box .top_list dt{font-weight:bold; margin-bottom:10px; font-size:13px; font-family:'굴림',gulim; text-decoration:underline; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} 
.notice .list_box .top_list dd{ overflow:hidden; height:32px;}
.notice .list_box .ul_list{ padding-top:14px}
.notice .list_box .ul_list li{ position:relative; float:left; width:50%; font-family:'돋움',Dotum; line-height:24px; font-size:12px; overflow:hidden;}
.notice .list_box .ul_list li a {width:85%; display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:#444; padding-left:8px; background:url("/images/template/02246/main/notice_dot.gif") no-repeat 0 9px;}
.notice .list_box .ul_list li a:hover{ text-decoration:underline;}

/* 학사일정 */
.schedule{ width:325px; height:250px; float:left; background:#0160c2; overflow:hidden;}
.schedule h2{ font-size:16px; font-family:"NanumBold"; color:#fff; line-height:50px; text-align:center; background:#0145ad; width:49%; float:left; margin-bottom:15px; }
.schedule .date_view{ position:relative; width:51%; float:right; background:#013195; height:50px; line-height:50px; overflow:hidden;}
.schedule .date_view .sch_year {position:relative; width:40%; float:left; display:block; font-family:"Arial"; font-size:16px; color:#90c6fe;  text-align:right; }
.schedule .date_view .sch_month {position:relative; width:60%; float:left; display:block; font-weight:bold; font-family:"Arial"; font-size:28px; color:#fff;  text-align:center; }
.schedule .date_view a{ position:absolute; top:15px; display:block; font-size:0; line-height:0; width:40px; height:20px; }
.schedule .date_view a.pre{ left:40%; background:url(/images/template/02246/main/btn_c_prev.png) no-repeat center;}
.schedule .date_view a.next{ right:0; background:url(/images/template/02246/main/btn_c_next.png) no-repeat center;}
.schedule .inner{ margin:0 auto; background:#0160c2;}
.schedule table{ width:90%; margin:0 auto; border-collapse:separate; border-spacing:3px;}
.schedule table th, 
.schedule table td{ margin:0; padding:0;}
.schedule table thead th{color:#333; font-size:12px; font-weight:bold; padding:5px 0 3px; background:#fff; }
.schedule table tbody tr:first-child td{ padding-top:5px;}
.schedule table tbody td{ color:#fff; font-size:12px; line-height:22px; text-align:center; border-bottom:1px dashed #ffefc9;}
.schedule table tbody td .today{ display:inline-block; width:30px; height:22px; color:#fdd000; text-decoration:underline; font-weight:bold;}
.schedule table tbody td .check{ display:inline-block; width:30px; height:22px; color:#fff; background:url(/images/template/02246/main/schd_check.png) no-repeat 50% 50%; font-weight:bold;}
.schedule table .sun{ color:#ff8425;}
.schedule table .sat{ color:#c4d700}
.schedule table thead .sun{ background:#f16b6c; color:#fff; font-weight:bold;}
.schedule table thead .sat{ background:#c4d700; color:#fff; font-weight:bold;}

/* 바로가기 */
.M_link{ position:relative; width:530px; height:250px; background:#c2cad3; overflow:hidden; float:left; }/* 190522*/
.M_link ul{ width:100%; overflow:hidden; }
.M_link li{position:relative; width:25%; float:left; height:125px; }/* 190522*/
.M_link li a{ display:block; height:125px; color:#333; font-family:"Nanum"; font-size:13px; box-sizing:border-box;}
.M_link li a span{ padding:90px 0 0; display:block; text-align:center;}
.M_link li img {position:absolute; top:15px; left:50%; margin-left:-45px; width:89px; height:63px;}

/* 행사사진 190522 추가*/
.gallery{position: relative; width:250px; height: 250px; background: #5882ac;overflow:hidden;float:left; }
.gallery h2 {height:30px; margin:15px 25px 0; font-size:14px; font-family:"NanumBold"; letter-spacing:-1px;color:#fff;}
.gallery .btn_more {position:absolute; top:15px; right:25px; width:20px; height:20px; text-indent:-10000px; background:url('/images/template/02246/main/btn_list.png') no-repeat 0 0; z-index:10 } /* 20190523 수정 */
.gallery ul {overflow:hidden;width:100%;height: 100%;}
.gallery ul li { margin: 0 auto; width:160px;}
.gallery ul li:first-child {margin-bottom:10px;}
.gallery ul li a {color:#424242; font-size:12px; font-family:'돋움',Dotum;color:#fff;}
.gallery ul li a:hover {text-decoration:underline}
.gallery ul li a .img {display:block}
.gallery ul li a .img img {width:90%; height:70px; margin: 0 auto;} /* 20190523 수정 */
.gallery ul li a .txt {display:block; margin-top:10px; line-height:14px; text-align:center; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} /* 20190523 수정 */
.gallery ul li.pcNone {display:none}

/* 팝업존 */
.pop{ position:relative; width:200px; height:250px; float:left; background:#0D4B8A; overflow:hidden; } /*  170323*/
.pop h2{ font-size:16px; line-height:50px; padding-left:20px; color:#fff; }
.pop .nss_pg{ position:absolute; top:14px; right:20px}
.pop .nss_pg > span{ position:absolute; display:inline-block; font-family:"Nanum"; line-height:22px; color:#fff; font-size:13px; right:80px; width:40px; text-align:right;}/* 20161122 수정 */
.pop .nss_pg > span strong{ color:#fff799}
.pop .nss_pg a{ display:block; float:left; font-size:0; text-indent:-10000em; width:20px; height:20px; margin-left:3px; }
.pop .nss_pg a.pre{ background:url(/images/template/02246/main/btn_prev.png) no-repeat center center; }
.pop .nss_pg a.stop{ background:url(/images/template/02246/main/btn_stop.png) no-repeat center center; }
.pop .nss_pg a.next{ background:url(/images/template/02246/main/btn_next.png) no-repeat center center; }
.pop .nss_pg a.list{ background:url(/images/template/02246/main/btn_list.png) no-repeat center center; }
.pop .pop_img{ width:182px; margin:0 auto;}/*  170323*/
.pop .pop_img li{ display:none; margin:0 auto; width:100%;}
.pop .pop_img li img{ width:100%; height:145px; }/*  170323*/
.pop .pop_img li.on{ display:block}


/* 배너존 */
.banner_zone{ position:relative; width:100%; margin:20px 0; overflow:hidden;}
.banner_zone .inner{ position:relative; width:980px; padding:15px 0; background-color:#fff; border:1px solid #ddd; margin:0 auto; overflow:hidden; box-sizing:border-box;}
.banner_zone h2{ font-size:15px; font-family:"NanumBold"; color:#1d1d1d; position:absolute; top:22px; left:0;}
.banner_zone .btn{ position:absolute; left:0; top:45px}
.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/02246/main/btn_b_prev.gif) no-repeat}
.banner_zone .btn a.stop{ background:url(/images/template/02246/main/btn_b_stop.gif) no-repeat}
.banner_zone .btn a.next{ background:url(/images/template/02246/main/btn_b_next.gif) no-repeat}
.banner_zone .btn a.list{ background:url(/images/template/02246/main/btn_b_list.gif) no-repeat; width:15px; }
.banner_zone ul{ height:40px; padding-left:90px; overflow:hidden}
.banner_zone ul li{ float:left; margin-left:20px;}
.banner_zone ul li a img{ width:155px; height:40px}

@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:70px}
	.main_content { width:95%; height:100%; }
		
	.main_visual, .notice, .pop, .schedule, .gallery, .M_link, .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}
	
	/* 메인비주얼 */
	.main_visual{ height:auto;}
	.main_visual p{ width:95%;}

	/* 공지사항 */
	.notice { width:100%; } 
	.notice h2{ font-size:14px; } 
	.notice h2 a{ width:-webkit-calc(33.3% - 21px); width:-moz-calc(33.3% - 21px); width:calc(33.3% - 21px) }
	.notice h2.tit_2 a{ left:-webkit-calc(33.3% - 21px); left:-moz-calc(33.3% - 21px); left:calc(33.3% - 21px)}
	.notice h2.tit_3 a{ left:-webkit-calc(66.5% - 42px); left:-moz-calc(66.5% - 42px); left:calc(66.5% - 42px)}	
	.notice h2 a.current{ background-image:none; }
	
	/* 학사일정 */
	.schedule{ width:50%;}
	
	/* 바로가기 */
	.M_link{ width:100%; clear:none; }

        /* 행사사진 190522 추가*/
	.gallery {position:relative; top:0; left:0; float:left; width:100%; border-top:0; border-left:1px solid #d8d8d8;height: 150px;}
	.gallery ul {width:auto}
	.gallery ul li.pcNone {display:block;}
	.gallery ul li {margin-left:2.5%; width:22%;float:left;}


	/* 팝업존 */
	.pop{width:100%; } /*  170323*/
	.pop .pop_img{ width:90%; }

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

}

@media (max-width: 640px) {	
	
	/* 행사사진 190522 추가*/
	.gallery {position:relative; top:0; left:0; float:left; border-top:0; border-left:1px solid #d8d8d8;height:200px}
	.gallery ul {width:auto}
	.gallery ul li {margin-left:2%; width:47%;float:left}
        .gallery ul li.pcNone {display:none}
        .gallery ul li a .img img {width:100%; height:130px}


	/* 배너존 */
	.banner_zone ul li{width:-webkit-calc(50% - 10px); width:-moz-calc(50% - 10px); width:calc(50% - 10px);}
	
}

@media (max-width: 580px) {	

	/* 학사일정 */
	.schedule{ width:100%;}
	
	/* 바로가기 */
	.M_link{ width:100%; height:auto;}/*  170323*/
	.M_link li{width:25%; height:100px;}
	.M_link li a{height:100px;}
	.M_link li a span{padding:70px 0 0; }
	.M_link li img {margin-left:-35px; width:70px; height:auto;}

	/* 팝업존 */
	/*.pop{position:absolute; top:500px; right:0;  width:100%; }*/

	/* 학교앨범 */
	.gallery{ width:100%; }
	
}

@media (max-width: 480px) {	

	/* 공지사항 */
	.notice h2{ font-size:13px; } 	
	.notice .list_box .top_list{padding:20px 0 30px 0; background:none; }

	/* 행사사진 190522 추가*/
	.gallery {height:180px}
        .gallery ul li a .img img {width:100%; height:100px}

}

@media (max-width: 380px) {

	/* 공지사항 */
	.notice h2{ font-size:12px; letter-spacing:-2px;}

	/* 바로가기 */
	.M_link li{width:33.3%;}
		
	/* 배너존 */
	.banner_zone ul li{width:-webkit-calc(100% - 10px); width:-moz-calc(100% - 10px); width:calc(100% - 10px);}
			
}