/* 메인 컨테이너 */
#container {width: 100%; position: relative; z-index: 2;}

.container {max-width: 62rem; padding: 0 1rem;}
.container::after {display: none;}

.MC_wrap1 {padding: 1.5rem 0 2rem; position: relative;}
.MC_wrap1::before {content: ""; display: block; width: 50%; height: 100%; border-bottom-right-radius: 1rem; background: url(/images/schl/template/T0021/main/wrap1_bg01.png) #fff1cd left bottom no-repeat; position: absolute; left: 0; top: 0; z-index: -1;}
.MC_wrap1::after {content: ""; display: block; width: 12.35rem; height: 16.65rem; background: url(/images/schl/template/T0021/main/wrap1_bg02.png) center/contain no-repeat; position: absolute; right: 2.15rem; top: 3.2rem; z-index: -1;}
.MC_wrap1 .container {display: flex; flex-wrap: wrap; justify-content: space-between;}
.MC_wrap2 {margin-top: 2rem;}
.MC_wrap2 .container {display: flex; flex-wrap: wrap; justify-content: space-between;}

.MC_box1 {width: 60.83%; height: 24rem;} /* 메인비주얼 */
.MC_box2 {width: 34.17%; height: 26.65rem;} /* 게시판 */
.MC_box3 {width: 100%; min-height: 6.75rem;} /* 바로가기 */
.MC_box4 {width: 100%; height: 6.6rem; margin-top: 3rem;} /* 식단 */
.MC_box5 {width: calc(97.08% - 21.5rem - 2px); height: 17.7rem; margin-top: 2.5rem;} /* 캘린더 */
.MC_box6 {width: calc(21.5rem + 2px); height: 17.7rem; padding: 0.5rem 2rem 1.5rem; margin-top: 2.5rem; position: relative;} /* 팝업존 */
.MC_box6::before {content: ""; display: block; width: 100%; height: 8.2rem; border-radius: 1.5rem; background: #e8fcee; position: absolute; left: 0; bottom: 0; z-index: -1;}
.MC_box7 {width: 100%; height: 19.85rem; padding: 2.5rem 0; margin-top: 2.5rem; position: relative;} /* 갤러리 */
.MC_box7::before {content: ""; display: block; width: 300%; height: 100%; border-top-left-radius: 2.5rem; background: url(/images/schl/template/T0021/main/wrap3_bg01.png) #f2fbff left -1.8rem top -4.35rem no-repeat; position: absolute; left: -4rem; top: 0; z-index: -1;}
.MC_box7::after {content: ""; display: block; width: 11.55rem; height: 10.5rem; background: url(/images/schl/template/T0021/main/wrap3_bg02.png) center bottom/contain no-repeat; position: absolute; left: -1.05rem; bottom: 1.75rem;}



@media (max-width: 1640px) {

    .MC_wrap1::after {display: none;}
}



@media (max-width: 1240px) {

    .MC_wrap1 {padding: 1rem 0 0;}
    .MC_wrap1::before {display: none;}
    .MC_wrap2 {margin-top: 1.5rem;}

    [class^="MC_box"] {height: auto;}

    .MC_box1 {width: 60.98%; height: 26.35rem; padding-bottom: 2.35rem; position: relative;}
    .MC_box1::before {content: ""; width: 100%; height: calc(100% + 1rem); border-bottom-right-radius: 1rem; background: #fff1cd; position: absolute; right: 9%; top: -1rem;}
    .MC_box2 {width: 35.57%;}
    .MC_box3 {min-height: unset;}
    .MC_box4 {margin-top: 1.5rem;}
    .MC_box5 {width: calc(96.95% - 17.5rem - 2px); margin-top: 1.1rem;}
    .MC_box6 {width: calc(17.5rem + 2px); padding: 0.5rem 0 1.5rem; margin-top: 1.1rem;}
    .MC_box6::before {width: 300%;}
    .MC_box7 {padding: 2.5rem 0 3.2rem; margin-top: 2rem;}
    .MC_box7::before {left: 0;}
    .MC_box7::after {left: 1.85rem; bottom: 2.4rem;}
}



@media (max-width: 1024px) {

    .MC_box5 {width: 100%;}
    .MC_box6 {width: 100%; padding-top: 0;}
    .MC_box7::after {left: 0.25rem;}
}



@media (max-width: 768px) {

    .MC_wrap1 {padding: 0;}
    .MC_wrap2 {margin-top: 1.75rem;}

    .MC_box1 {width: 100%; padding: 0.5rem 0 1.5rem;}
    .MC_box1::before {width: 100vw; height: 100%; border-radius: 0; right: -1rem; top: 0;}
    .MC_box2 {width: 100%; margin-top: 1.5rem;}
    .MC_box5 {margin-top: 1.5rem;}
    .MC_box6 {padding-bottom: 1.5rem; margin-top: 1.5rem;}
    .MC_box7 {padding: 1.5rem 0 2rem; margin-top: 1.5rem;}
    .MC_box7::after {bottom: 1.2rem;}
}



@media (max-width: 680px) {

    .MC_box1 {height: auto;}
}



@media (max-width: 480px) {

    .container {padding: 0 0.75rem;}

    .MC_wrap2 {margin-top: 1.75rem;}

    .MC_box1 {padding-bottom: 1.5rem;}
    .MC_box1::before {right: -0.75rem;}
    .MC_box2,
    .MC_box4,
    .MC_box5 {margin-top: 1.5rem;}
    .MC_box6 {padding-bottom: 1.5rem; margin-top: 1.5rem;}
    .MC_box7 {width: calc(100% + 1.5rem); padding: 1.5rem 0.75rem 2rem; margin: 1.5rem -0.75rem 0; overflow: hidden;}
    .MC_box7::before {width: 100%; border-radius: 0; background: #effbff; left: 0; z-index: -2;}
    .MC_box7::after {width: 16.45rem; height: 16.45rem; border-radius: 50%; background: #e1f6fc; left: -8.6rem; top: -7.05rem; z-index: -1;}
}



@media (max-width: 380px) {

    .MC_wrap2 {margin-top: 8.17vw;}

    .MC_box1 {padding-bottom: 7vw;}
    .MC_box2,
    .MC_box4,
    .MC_box5 {margin-top: 7vw;}
    .MC_box6 {padding-bottom: 7vw; margin-top: 7vw;}
    .MC_box7 {padding: 7vw 0.75rem 9.33vw; margin-top: 7vw;}
}