﻿@charset "utf-8";

#container {position:relative; height:100%; background:#f3f9f8; padding-top:20px;}
#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;}


.MC_box1 {position:relative; width:698px; height:339px; float:left; border-radius:10px; overflow:hidden;}
.MC_box2 {position:relative; width:262px; height:339px; float:right;}/*바로가기*/
.MC_box3 {position:relative; width:262px; height:327px; float:left; margin:20px 0;}/*학교일정*/
.MC_box4 {position:relative; width:339px; height:327px; float:left; margin:20px;}/*공지사항*/
.MC_box5 {position:relative; width:339px; height:327px; float:left; margin:20px 0;}/*공지사항2*/
.MC_box6 { position:relative; width:262px; height:209px; float:left;}/*팝업존*/
.MC_box7 { position:relative; width:349px; height:209px; float:left; margin-left:20px;}
.MC_box8 { position:relative; width:349px; height:209px; float:left;}
.MC_box9 { position:relative; width:100%; height:70px; }/*배너*/

 @media (max-width: 800px) {
	 
	#container,  .main_content { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box }
	.MC_box1, MC_box2, MC_box3, MC_box4, MC_box5, MC_box6, MC_box7, MC_box8, MC_box9, MC_box10, MC_box11, MC_box12, MC_box13, MC_box14, MC_box15 {-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%;}

	.MC_box0 {display:block; width:100%;  position:relative; height:40px;}
	.MC_box1 {width:100%; height:auto;}
	.MC_box2 { position:relative; width:100%; height:auto; margin-top:20px;}
	.MC_box3 { position:relative; width:100%;}
	.MC_box4 { position:relative; width:100%; margin:0;}
	.MC_box5 { position:relative; width:100%;}
	.MC_box6{ position:relative; width:100%; margin-bottom:20px;}
	.MC_box7 { position:relative; width:50%; margin:0;}
	.MC_box8 { position:relative; width:50%;}
	 
 }

@media (max-width: 640px) {
	.MC_box1 {   width:100%;}
	.MC_box2 {  width:100%;}
	.MC_box5 {  width:100%; margin:15px 0 0 0;}
	.MC_box6 {  width:100%; height:auto;  margin:15px 0 0 0;}
	.MC_box7 { width:100%; margin:15px 0 0 0 ;}
	.MC_box8 { width:100%;margin:15px 0 0 0;}
	.MC_box9 {  width:100%; height:auto;  margin:15px 0 0 0 ;}
	.MC_box10 { width:100%;  margin:15px 0 0 0;}

	 
 }
