﻿/* 메인 컨테이너 */
#container {position: relative; width:100%; z-index: 2; letter-spacing: -0.05rem;}

.container {max-width: 62rem; padding: 0 1rem;}
.container::after {display: none;}

.MC_wrap1 {padding-top: 2.5rem; position: relative;}
.MC_wrap1::before {content: ""; display: block; width: 96rem; height: 100%; background: url(/images/schl/template/T0017/main/container_bg.jpg) center bottom/cover no-repeat; position: absolute; left: calc(50% - 48rem); top: 0; z-index: -1;}
.MC_wrap1 .container {display: flex; flex-wrap: wrap; justify-content: space-between;}
.MC_wrap1 .container .MC_cont {width: calc(95% - 30rem);}
.MC_wrap2 {padding-bottom: 3.5rem; margin-top: 1rem;}
.MC_wrap2 .container {display: flex; flex-wrap: wrap; justify-content: space-between;}

.MC_box1 {width: 30rem; height: 25.25rem;} /* 메인비주얼 */
.MC_box2 {height: 12.9rem;} /* 게시판 */
.MC_box3 {height: 10.85rem; margin-top: 2rem;} /* 식단 */
.MC_box4 {width: 100%; height: 3.4rem; margin-top: 2.25rem;} /* 캘린더 */
.MC_box5 {width: 100%; height: 10.75rem; padding: 2rem 0; margin-top: 2.75rem; position: relative;} /* 바로가기 */
.MC_box5::before {content: ""; display: block; width: calc(100% + 12rem); height: 100%; border-radius: 4rem 4rem 0 0; background: #fff; position: absolute; left: -6rem; top: 0; z-index: -1;}
.MC_box6 {width: calc(95% - 17.5rem); height: 14.05rem;} /* 갤러리 */
.MC_box7 {width: 17.5rem; height: 14.05rem;} /* 팝업존 */



@media (max-width: 1240px) {

	.MC_wrap1 {padding-top: 1.5rem;}
	.MC_wrap1 .container .MC_cont {width: calc(96.25% - 27.1rem);}
	.MC_wrap2 {padding-bottom: 2.5rem;}

	[class^="MC_box"] {height: auto;}

	.MC_box1 {width: 27.1rem; height: auto;}
	.MC_box5 {padding: 2rem 1.25rem;}
	.MC_box5::before {width: 100%; border-radius: 3rem 3rem 0 0; left: 0;}
	.MC_box6 {width: calc(96.25% - 17.5rem);}
}



@media (max-width: 1024px) {

	.MC_wrap1 .container .MC_cont {width: 100%; margin-top: 2rem;}

	.MC_box1 {width: 100%;}
}



@media (max-width: 768px) {

	.MC_wrap1::before {width: 100%; background: linear-gradient(0deg, rgba(246,255,237,1) 0%, rgba(207,236,255,1) 100%); left: 0;}
	.MC_wrap1 .container .MC_cont {margin-top: 1.5rem;}
	.MC_wrap2 {margin-top: 1.5rem;}

	.MC_box3 {margin-top: 1.5rem;}
	.MC_box4 {margin-top: 1.5rem;}
	.MC_box5 {width: calc(100% + 2rem); padding: 1.5rem 1rem 0; margin: 2rem -1rem 0;}
	.MC_box5::before {border-radius: 0;}
}



@media (max-width: 580px) {

	.container {padding: 0 0.75rem;}
	
	.MC_wrap1 {padding-top: 0.85rem;}
	.MC_wrap2 {padding-bottom: 2rem;}

	.MC_box5 {width: calc(100% + 1.5rem); padding: 1.5rem 0.75rem 0; margin: 2rem -0.75rem 0;}
	.MC_box6 {order: 1; width: 100%; margin-top: 1.5rem;}
	.MC_box7 {width: 100%;}
}