﻿@charset "utf-8";

/* 알림장 */
.ann_tablet{display:none;}


/* 180713 : 메인비주얼 */
.main_visual {position:relative; width:100%; background:url('/images/web/samrangjin-m/main/040_m_bg.png') repeat center center #bde5f6;}
.main_visual ul {position:relative; }
.main_visual ul li {position:relative; text-align:center;}
.main_visual .bx-controls {position:absolute; width:980px; height:26px; left:50%; bottom:25px; margin-left:-490px; }
.main_visual .bx-controls-direction {display:none;}
.main_visual .bx-controls-auto {position:absolute; top:0; left:0;}
.main_visual .bx-controls-auto::after {content:''; display:block; clear:both; height:0;}
.main_visual .bx-controls-auto .bx-controls-auto-item {display:block; float:left; width:auto;}
.main_visual .bx-controls-auto .bx-controls-auto-item a {text-indent:-999em; width:26px; height:26px;}
.main_visual .bx-controls-auto .bx-controls-auto-item a.bx-start {display:none; background:url('../../../images/template/com/btn_play.png') no-repeat center center;}
.main_visual .bx-controls-auto .bx-controls-auto-item a.bx-stop {display:block; background:url('../../../images/template/com/btn_stop.png') no-repeat center center;}
.main_visual .bx-pager.bx-default-pager {position:absolute; top:5px; left:30px;}
.main_visual .bx-pager.bx-default-pager::after {content:''; display:block; clear:both; height:0;}
.main_visual .bx-pager.bx-default-pager .bx-pager-item {display:block; float:left; margin-left:5px;}
.main_visual .bx-pager.bx-default-pager .bx-pager-item a {display:block; text-indent:-999em; width:16px; height:16px; border:1px solid #1e665b; box-sizing:border-box; border-radius:9px;} /* 비주얼 버튼 색상 */
.main_visual .bx-pager.bx-default-pager .bx-pager-item a.active {background-color:#1e665b;}/* 비주얼 버튼 색상 */

/* 행사일정 */
.drawSchedule040  { position:relative; height:100%; background-color:#e05151; overflow:hidden;}
.drawSchedule040 h2{color:#fff;font-size:16px;padding: 10px 0 10px 20px;background: #ae3535;line-height: 20px;}
.drawSchedule040 .date_view{ position:relative; width:85%; margin:10px auto 3px; text-align:center; color:#fff; font-weight:bold; font-family:'돋움',Dotum; }
.drawSchedule040 .date_view a{ position:absolute; top:0; width:15px; height:15px; display:block; font-size:0; line-height:0;  }
.drawSchedule040 .date_view a.pre{ left:25px; background:url(/images/web/samrangjin-m/main/040_sche_pre.png) no-repeat;}
.drawSchedule040 .date_view a.next{ right:25px; background:url(/images/web/samrangjin-m/main/040_sche_next.png) no-repeat;}
.drawSchedule040 .date_view span{ padding:4px 0 5px; font-size:12px;}
.drawSchedule040 .inner{ margin:0 auto;}
.drawSchedule040 table{ width:85%; margin:0 auto;}
.drawSchedule040 table th, 
.drawSchedule040 table td{ margin:0; padding:0}
.drawSchedule040 table thead th{color:#fff; font-size:12px; line-height:26px; }
.drawSchedule040 table tbody td{ color:#333; font-size:12px; line-height:15px; padding:2px 0; text-align:center}
.drawSchedule040 table tbody td .today{ width:17px; height:17px; display:inline-block; background:url(/images/web/samrangjin-m/main/schd_today.png) no-repeat 0 0; color:#fff;}
.drawSchedule040 table tbody td .check{ width:17px; height:17px; display:inline-block; background:url(/images/web/samrangjin-m/main/schd_check.png) no-repeat 0 0; color:#fff; }
.drawSchedule040 table th.sun{ color:#ffb9b6 !important; }
.drawSchedule040 table th.sat{ color:#cce198 !important; }
.drawSchedule040 table .sun{ color:#f25953 !important; }
.drawSchedule040 table .sat{ color:#265f13 !important; }
.drawSchedule040 table tbody{ background:#fff;}
.drawSchedule040 .btn_more{position:absolute;top: 10px;right:15px;width:25px;height:25px;background:url('/images/web/samrangjin-m/main/040_btn_more.png') no-repeat 0 0;text-indent:-10000px;z-index:1000;}




/* 공지사항 */ 
.notice040 { position:relative; height:100%; background:#fff url(../../../../../images/main/tit_bg.gif) repeat-x 0 0; border:1px solid #c8d1db; }  
.notice040 h2 {font-size:16px;font-family:'NotoM';line-height: 54px;}
.notice040 h2 a{ position:absolute; top:0; width:144px; display:block; text-align:center; color:#333;}
.notice040 h2.tit_1 a{ left:0; border-bottom:1px solid #c8d1db;}
.notice040 h2.tit_2 a{ left:144px; border-left:1px solid #c8d1db; border-bottom:1px solid #c8d1db; }
.notice040 h2.tit_3 a{ left:288px; border-left:1px solid #c8d1db; border-bottom:1px solid #c8d1db; }
.notice040 h2 a.current{ color: #000000; background:#fff; border-bottom:none;}
.notice040 .list_box.on{ display:block; }
.notice040 .list_box{ display:none; padding:78px 30px 0; font-family:'돋움',Dotum; font-size:12px; overflow:hidden;}
.notice040 .list_box li{ position:relative; font-family:'돋움',Dotum; line-height:26px; font-size:12px; overflow:hidden;  vertical-align:middle;}
.notice040 .list_box li a { width:70%; display:block;  padding-left:8px;  float:left; background:url("/images/web/samrangjin-m/main/040_noti_dot.gif") no-repeat 0 11px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:#333;}
.notice040 .list_box li a:hover{ text-decoration:underline;}
.notice040 .list_box li span.date { width:25%; display:block;  float:right; text-align:right; }
.notice040 .btn_more{ position:absolute; top:0; right:0; width:58px; height:55px; background:url('/images/web/samrangjin-m/main/btn_more01.png') no-repeat 0 0; border-left:1px solid #c8d1db; border-bottom:1px solid #c8d1db;  text-indent:-10000px; z-index:10 }
.notice040 .btn_more {position:absolute;right:0;top:0;width: 58px;height: 54px;text-indent:-9999em;line-height:0;font-size:0;background: url(/images/web/samrangjin-m/main/040_btn_more2.png) no-repeat center #00a1b9;z-index:4;}

/* 학교앨범 */
.gallery040 {position:relative;height:100%;background-color: #b87114;overflow:hidden;}  
.gallery040 h2 {position:absolute; top:0; font-size:16px; font-family:'NotoM'; line-height:60px; }
.gallery040 h2 a {display:block; text-align:center; color:#fff;  }
.gallery040 h2.tit_1 {left:22px; }
.gallery040 h2.tit_2 {left:90px;  background:url('/images/web/samrangjin-m/main/bar.gif') no-repeat 0 50%; padding-left:10px; }
.gallery040 h2 a.current {color: #ffed8f;}
.gallery040 .gall_box.on {display:block; }
.gallery040 .gall_box {display:none; padding:40px 0 0; font-family:'돋움',Dotum; font-size:12px; overflow:hidden;}
.gallery040 .gall_info {display:none;}
.gallery040 .gall_list {overflow:hidden; padding:15px 0 0 5%;}
.gallery040 .gall_list li {width:93.9%; margin-left:7%; }
.gallery040 .gall_list li:first-child {margin-left:0;}
.gallery040 .gall_list li a {display:block;}
.gallery040 .gall_list li .img img {width:100%; height:124px;}
.gallery040 .gall_list li span {display:block; text-align:center; font-family:'돋움',Dotum; font-size:12px; color:#fff;}
.gallery040 .gall_list li span.txt {margin-top:15px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.gallery040 .gall_list li span.date {display:none;}
.gallery040 .btn_more{ position:absolute; top:18px; right:15px; width:25px; height:25px; background:url('/images/web/samrangjin-m/main/040_btn_more.png') no-repeat 0 0;  text-indent:-10000px; z-index:1000}



/* 팝업존 */
.pop040{position:relative;height:100%;background: url(/images/web/samrangjin-m/main/pt_bg.png) repeat center  #cfe1f7;overflow:hidden;}
.pop040 h2{font-size:16px;line-height:50px;padding-left:20px;color: #222;{height: 50px;line-height:50px;font-size:16px;font-family:'NotoM';color:#fff;background:#7987a2;padding:0 0 0 20px;}}
.pop040 .nss_pg{position:absolute;top:14px;right: 47px;}
.pop040 .nss_pg > span{position:absolute;display:inline-block;font-family:"NotoR";line-height:22px;color: #000000;font-size:13px;right:80px;width:40px;text-align:right;}
.pop040 .nss_pg > span strong{color: #489cfb;}
.pop040 .nss_pg a{ display:block; float:left; font-size:0; text-indent:-10000em; width:20px; height:20px; margin-left:3px; }
.pop040 .nss_pg a.pre{ background:url(/images/web/samrangjin-m/main/040_btn_prev.png) no-repeat center center; }
.pop040 .nss_pg a.stop{ background:url(/images/web/samrangjin-m/main/040_btn_stop.png) no-repeat center center; }
.pop040 .nss_pg a.next{ background:url(/images/web/samrangjin-m/main/040_btn_next.png) no-repeat center center; }
.pop040 .nss_pg a.play{ background:url(/images/web/samrangjin-m/main/040_btn_play.png) no-repeat center center; }
.pop040 .nss_pg a.list{ background:url(/images/web/samrangjin-m/main/040_btn_list.png) no-repeat center center; }
.pop040 .pop_img{width:100%;margin:0 auto;padding: 10px 0;}
.pop040 .pop_img li{ margin:13 auto; width:235px;}
.pop040 .pop_img li img{ width:100%; height:145px; }
.pop040 .pop_img li.on{ display:block}

/* 180713 : 팝업리스트 레이어 추가 */
.pop040 a.list {position:absolute;top: 14px;right: 20px;display:block;float:left;font-size:0;text-indent:-10000em;width:22px;height:22px;background:url('/images/web/samrangjin-m/main/040_btn_list.png') no-repeat;}
.pop040 .pop_layer_box {display:none; position:absolute; left:0; top:0; width:100%; height:100%; background:#394b61;}
.pop040 .pop_layer_box .pop_layer {position:relative; padding:20px;}
.pop040 .pop_layer_box .pop_layer h3 {font-size:18px; color:#fff;}
.pop040 .pop_layer_box .pop_layer ul {height:125px; margin-top:15px; padding:10px 15px 10px 25px; line-height:22px; overflow-y:auto; background:#576c85;}
.pop040 .pop_layer_box .pop_layer ul li {font-family:'돋움',Dotum; font-size:12px; color:#fff; list-style-type:disc;}
.pop040 .pop_layer_box .pop_layer ul li a {color:#fff; }
.pop040 .pop_layer_box .pop_layer a.pop_close {display:block; position:absolute; right:25px; top:15px; padding:5px 10px; font-family:"NotoR"; color:#fff; background:#576c85; border-radius:5px;}


/* 오늘의 식단 */
.meal_menu040 {position:relative;height:100%;background: #ef9a9a;}
.meal_menu040 h2 {padding:10px 20px 0 8%; line-height:38px; color:#fff; font-size:16px;  font-family:'NotoM'; }
.meal_menu040 .meal_info  { display:none; padding:15px 4% 0 4%; line-height:24px; font-size:16px; font-family:"NotoR"; }
.meal_menu040 p.kcal{margin: 10px 0 3% 8%;line-height:15px;text-align:left;font-size: 17px;color: #4c1c0b;font-family:"NotoR";}
.meal_menu040 .meal_list {height:105px;margin:0 90px 0 8%;padding-bottom:13px; word-break:keep-all;font-family:"NotoR";font-size: 13px;color:#fff;text-align:left;line-height:18px;overflow-y:auto;}
.meal_menu040 .imgBg {position:absolute;top: 130px;right:7%;z-index:1;}
.meal_menu040 .imgBg img {width: 82px;height: 82px;}
.meal_menu040 .btn_more {position:absolute;right: 15px;top:16px;width: 20px;height:19px;text-indent:-9999em;line-height:0;font-size:0;background:url('/images/web/samrangjin-m/main/040_btn_more.png') no-repeat 0 0;}

/* 바로가기 */
.M_link040 {position:relative;height:100%;background: #f0f0f0;overflow:hidden;}
.M_link040 ul li {position:relative; width:25%; float:left;}
.M_link040 ul li img {position:absolute;top: 55px;left:50%;width:84px;height:85px;margin-left:-40px;}
.M_link040 ul li a {display:block;height:38px;padding-top: 150px;color:#3e3e3e;font-size:14px;text-align:center;font-family:"NotoM";}
.M_link040 ul li a:hover, .M_link01 ul li a:focus {text-decoration:underline;}

/* 배너존 */
.banner_zone{ position:relative; background-color:#fff; float:left; *padding-bottom:20px;position:relative; width:980px; height:45px; margin:20px auto;}
.banner_zone .inner{ position:relative; width:980px; margin:0 auto; overflow:hidden}
.banner_zone h2{ position:absolute; top:2px; left:0; font-size:15px; font-family:"NotoM"; color:#1d1d1d; text-indent:-9999em; }
.banner_zone .btn{ position:absolute; left:0; top:6px}
.banner_zone .btn a{ width:28px; height:28px;  float:left; margin-right:3px; font-size:0; text-indent:-10000em; vertical-align:top}
.banner_zone .btn a.pre{background:url(/images/web/samrangjin-m/main/btn_b_prev.png) no-repeat}
.banner_zone .btn a.stop{ background:url(/images/web/samrangjin-m/main/btn_b_stop.png) no-repeat}
.banner_zone .btn a.play{ background:url(/images/web/samrangjin-m/main/btn_b_play.png) no-repeat}
.banner_zone .btn a.next{ background:url(/images/web/samrangjin-m/main/btn_b_next.png) no-repeat}
.banner_zone .btn a.list{ background:url(/images/web/samrangjin-m/main/btn_b_list.png) no-repeat; }
.banner_zone ul{ height:40px; float:left; overflow:hidden; margin-left: 130px;}
.banner_zone ul li{ float:left; margin-left:10px;}
.banner_zone ul li a img{ width:160px; height:45px;}

@media (max-width: 800px) {
	
	#container,
	.main_content, .gallery040, .notice040,
	.banner_zone{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box}
	
		
	.main_visual, .notice040, .pop040, .drawSchedule040, .gallery040, .meal_menu040, .M_link040, .M_link040_2, .M_link040_2 ul li, .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 ul li img {width:100%;}
	.main_visual .bx-controls {width:100%; left:2.5%; bottom:10px; margin-left:0; }

	/* 바로가기2 */
	.M_link040_2 {box-sizing:border-box;}

	/* 학교일정 */
	.drawSchedule040{ width:100%;  }
	
	/* 바로가기01 */
	.M_link040{ width:100%;  }

	/* 오늘의 식단 */
	.meal_menu040 { width:100%; }
	.meal_menu040 .meal_list { margin-right:40%}

	/* 공지사항 */
/* 공지사항 */
	.notice040 { width:100%;} 
	.notice040 h2 a{ width:-webkit-calc(33.3% - 20px); width:-moz-calc(33.3% - 20px); width:calc(33.3% - 20px) }
	.notice040 h2.tit_2 a{ left:-webkit-calc(33.3% - 20px); left:-moz-calc(33.3% - 20px); left:calc(33.3% - 20px)}
	.notice040 h2.tit_3 a{ left:-webkit-calc(66.5% - 40px); left:-moz-calc(66.5% - 40px); left:calc(66.6% - 40px)}
	
	/* 학교앨범 */
	.gallery040{ width:100%; border-right:1px solid #c8d1db;}
	
	/* 배너존 */
	.banner_zone .inner{width:95%;}
	.banner_zone ul{ margin-left:110px; }
	.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) {	
	
	
	/* 배너존 */
	.banner_zone ul li{width:-webkit-calc(50% - 10px); width:-moz-calc(50% - 10px); width:calc(50% - 10px);}
	
}

@media (max-width: 580px) {	

	/* 공지사항 */
	.notice040 .list_box ul.ul_list li a { width:60%;}

	/* 팝업존 */
	.pop040{ width:100%; }


	/* 바로가기 */
	.M_link040 ul li {position:relative; width:50%; float:left;}
	.M_link040 ul li img {position:absolute;top: 20px;left:50%;width:84px;height:85px;margin-left:-40px;}
	.M_link040 ul li a {display:block;height:38px;padding-top: 110px;color:#3e3e3e;font-size:14px;text-align:center;font-family:"NotoM";}
	.M_link040 ul li a:hover, .M_link01 ul li a:focus {text-decoration:underline;}


}


@media (max-width: 480px) {

	/* 공지사항 */
	.notice040 .list_box li a {width:90%;}
	.notice040 .list_box li span.date {display:none;}
			
}

@media (max-width: 380px) {

	/* 배너존 */
	.banner_zone ul li{width:-webkit-calc(100% - 10px); width:-moz-calc(100% - 10px); width:calc(100% - 10px);}
			
}
