﻿
/*-----------------------------------------------------------
Author : yejin, Son
Creative date :2022. 03. 28
-----------------------------------------------------------*/

/* 메인 컨테이너 */
#container { position:relative; z-index:2; width:100%; }
#container *{ scrollbar-arrow-color:#ddd; scrollbar-Track-Color:#ddd; scrollbar-base-color:#aaa; scrollbar-Face-Color:#aaa; scrollbar-3dLight-Color:#aaa; scrollbar-DarkShadow-Color:#aaa; scrollbar-Highlight-Color:#aaa; scrollbar-Shadow-Color:#aaa;}
#container ::-webkit-scrollbar { width:5px; }
#container ::-webkit-scrollbar-thumb { background-color:#aaa; border-radius:10px; }
#container ::-webkit-scrollbar-track { background-color:#ddd; border-radius:10px; }

.MC_wrap1 { position: relative; padding-bottom: 1.5rem; }
.MC_wrap1::before { position: absolute; bottom: 0; left: 0; width: 100%; height: 8.45rem; background:-webkit-linear-gradient(-90deg, rgba(255, 247, 241, 0.8) 0%, rgba(229, 233, 253, 0.8) 100%); background:linear-gradient(-90deg, rgba(255, 247, 241, 0.8) 0%, rgba(229, 233, 253, 0.8) 100%); content: ""; }
.MC_wrap1 .container::before { position: absolute; top: -5rem; right: -19.75rem; width: 18.65rem; height: 22.2rem; background: url('/images/schl/template/T0014/main/0014_cont01_img01.png') no-repeat center / cover; content: ""; z-index: -1; }
.MC_wrap2 .container::before  { position:absolute; width: 100vw; height: 100%; top: 0; left: 0; background: #577adc; border-radius: 4rem 0 0 4rem; content: ""; z-index: -2; }
.MC_wrap3 { position: relative; }
.MC_wrap3::before { position: absolute; bottom: 0; left: 0; width: 100%; height: 14.2rem; background: #f3f6ff; content: ""; z-index: -4; }

.MC_box1 { position:relative; width:78rem; height:27.35rem; margin:auto; -webkit-transform:translateX(-19rem); transform:translateX(-19rem); } /* 메인비주얼 */
.MC_box2 { position:absolute; bottom:0; right:0; width:17.5rem; height:11.3rem; } /* 팝업존 */
.MC_box3 { position: relative; width: 100%; height: 6.65rem; margin-top: 2.9rem; } /* 캘린더 */
.MC_box4 { position: relative; width: 100%; height: 8.45rem; margin: 2rem 0 0; } /* 바로가기1 */
.MC_box5 { position: relative; width: 49%; height: 14.2rem; float: left; margin-top: 3.1rem; } /* 게시판 */
.MC_box6 { position: relative; width: 49%; height: 20.6rem; float: right; padding: 3rem 0 0 2rem; } /* 갤러리 */
.MC_box6::before { position: absolute; width: 100vw; height: 100%; left: 0; top: 0; background: url('/images/schl/template/T0014/main/0014_pttrn_dot.png'); content: ""; }
.MC_box7 { position: relative; width: 100%; height: 6.5rem; margin-bottom: 3.2rem; float: left; } /* 식단 */

@media (max-width:1280px) {
	.MC_wrap1 { height:auto; }
    .MC_wrap2 .container::before { left: 0.5rem; }

    .MC_box1 { width:100%; height:auto; -webkit-transform:translateX(0); transform:translateX(0); } /* 메인비주얼 */
    .MC_box2 { right: 1rem; height: 9.6rem; } /* 팝업존 */ 
}

@media (max-width:1080px) {
    .MC_box2 { height: 8.3rem; } /* 팝업존 */
}

@media (max-width:960px) {
    .MC_wrap1::before { height: calc(100% - 6.8rem); }
    .MC_wrap3::before { height: calc(100% + 3rem); }

    .MC_box2 { position: relative; right: auto; width: 100%; height: auto; margin-top: 1.5rem; } /* 팝업존 */
    .MC_box3 { margin-top: 1.5rem; } /* 캘린더 */
    .MC_box4 { height: auto; } /* 바로가기1 */
    .MC_box5 { width: 100%; margin-top: 1.5rem; } /* 게시판 */
    .MC_box6 { width: 100%; height: auto; padding: 1.5rem 0 1.5rem 0; } /* 갤러리 */
    .MC_box7 { margin-bottom: 1.5rem; } /* 식단 */
}

@media (max-width:768px){
    .MC_wrap2 .container::before{border-radius: 1.5rem 0 0 1.5rem;}

    .MC_box3 { height: auto; } /* 캘린더 */
    .MC_box5 { height: auto; } /* 게시판 */
    .MC_box7 { height: auto; overflow: hidden; } /* 식단 */
}