﻿/*-----------------------------------------------------------
Author :JH, Woo
Creative date :2021. 04. 21
-----------------------------------------------------------*/


.MC_wrap1 {position: relative; padding: 2rem 0; background: url('/tempSample/30001/images/main/0001_img_link_bg.png') no-repeat 2rem bottom;}/* 비주얼, 행사일정 */
.MC_wrap2 {position: relative; z-index: 2; background: url('/tempSample/30001/images/main/0001_img_notice_bg.png') no-repeat top 1.2rem right 4rem;}/* 바로가기, 공지사항, 팝업존 */
.MC_wrap2 .container{background: #ffe289; border-radius: 0 5rem 5rem 0; position: relative; padding: 1.5rem 0;}
.MC_wrap2 .container::before{background: #ffe289; width: 100%; height: 100%; position: absolute; left: -100%; top: 0; content: '';}
.MC_wrap3 {position: relative; background:#f0f4ff url('/tempSample/30001/images/main/0001_img_gal_bg.png') no-repeat left bottom; margin-top: -9.5rem; padding-top: 9.5rem;}/* 포토앨범 */
.MC_box1 {position: relative; width: calc(100% - 6.5rem); height: 22.5rem; float: right; margin-bottom: 2rem;}/* 비주얼 */
.MC_box2 {position: absolute; bottom: 11.2rem; left: 0; width: 15rem; height: 13.5rem; }/* 행사일정 */
.MC_box3 {position: relative; width: 100%; float: left;}
.MC_box4 {position: relative; width: 35rem; height: 13.5rem; float: left;}/* 공지사항 */
.MC_box5 {position: relative; width: 17.5rem; margin-right: 4.5rem; float: right;}/* 팝업존 */
.MC_box6 {position: relative; width: 100%; padding: 2rem 0;}/* 포토갤러리 */
.MC_box7 {position: relative; width: 100%; background: #607abf;} /* 오늘의식단 */

@media (max-width: 1200px) {
	.MC_wrap1{background: none;}

	.MC_box1{height: auto;} /* 비주얼 */
	.MC_box2{bottom: 10.9rem;} /* 행사일정 */
	.MC_box4{width: calc(100% - 21.5rem);} /* 공지사항 */
	.MC_box5{margin-right: 2.5rem;} /* 팝업존 */
}

@media (max-width: 920px) {
	.MC_wrap2 .container{border-radius: 0 3rem 3rem 0; padding-right: 1rem;}

	.MC_box4{width: 100%; float: none;} /* 공지사항 */
	.MC_box5{width: 100%; float: none; margin: 1rem 0 0;} /* 팝업존 */
}

@media (max-width: 800px) {
	.MC_wrap1{padding: 1rem 0;}

	.MC_box1{width: 100%; float: none; margin-bottom: 1rem;}
	.MC_box2{width: 100%; position: relative; height: auto; bottom: 0; margin-bottom: 1rem;}
}

@media (max-width: 580px) {
}

@media (max-width: 480px) {
	.MC_box4 {height: 25rem;}
}

@media (max-width: 380px) {
	.MC_wrap2 .container { padding-right:0; }
	.MC_wrap2 .container::before { width:300%; }
}
