@import url("/resource/font/TitilliumWeb/fonts.css");
@import url("/resource/font/Montserrat/fonts.css");

/*-----------------------------------------------------------
Author :dawon, Kim
Creative date :2022. 05. 11
-----------------------------------------------------------*/

/* 메인 컨테이너 */
#container { position:relative; z-index:2; width:100%; }
#container:before {content:"";display:block; background: url(/images/schl/template/T0062/main/0062_con_bg01.png) no-repeat; width:12.2rem; height:15.6rem; position:absolute; top:15rem; right:0; }
#container:after {content:"";display:block; background: url(/images/schl/template/T0062/main/0062_con_bg02.png)no-repeat; width:13.8rem; height:18.15rem; position:absolute; bottom:4.05rem; left:0; z-index: -1;}
#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;   }
.MC_wrap1 .container {padding: 2.5rem 0}
.MC_wrap1 .container:before {content:""; display:block; width: 50rem; height: 100%; position:absolute; top: 0; right: 28rem;  border-radius: 0 0 4rem 0; z-index:-1; background: #ffa127 url(/images/schl/template/T0062/main/0062_M_visual_bg01.png) no-repeat right bottom; }
.MC_wrap2 { position:relative; margin-top:3rem; }
.MC_wrap3 { position:relative; margin-top:3rem; margin-bottom: 4.25rem;}
.MC_wrap4 { position:relative; margin:3rem 0; padding-top:.25rem; overflow:hidden; }

.MC_box1 { position:relative; width: 62.25%; height: 24.5rem; overflow: hidden; float: right; border-radius: 3rem 3rem 0 3rem; box-shadow: 2px 2px 3px rgb(0 0 0 / 30%);}
.MC_box2 {width: 32.5%; height:19rem; float: left; margin-top: 2.5rem;} 
.MC_box2:before {content:""; display:block; position:absolute; bottom: 0; left:-18rem; background: url(/images/schl/template/T0062/main/0062_M_visual_bg02.png) no-repeat; width:17.15rem; height:20.15rem;}
.MC_box3 { position:relative; width: 48%; height: 16rem;  float:left; } 
.MC_box4 { position:relative; width: 48%; height: 16rem;  float: right; } 
.con_wrap {width: 40.6rem; float: left;}
.MC_box5 { position:relative; width: 46.3%; height: 13.25rem; float: left; } 
.MC_box6 { position:relative; width: 50%; height: 13.25rem; float:right;} 
.MC_box7 { position:relative; width:100%;  float: left; margin-top: 1.7rem;} 
.MC_box8 { position:relative; width:17.1rem;  float:right; height: 28rem; } 

@media (max-width:1500px) {
	.MC_wrap1:before {display:none;}
}

@media (max-width:1240px) { 
	.MC_wrap1 .container {padding: 2.5rem 1rem; }
	.con_wrap {width: 65%; }
	.MC_box8 { width:32%; } 
}

@media (max-width:1200px) {
	#container:before {display:none;}
	#container:after {display:none;}
	
	
	.MC_wrap1:after { display:none;}

}

@media (max-width:1150px) { 
	.MC_box1 { width: 65%; }
	.MC_box2 { width: 31%; } 
}
@media (max-width:1080px) { 
	.MC_box1 { width: 67%; }
	.MC_box2 { width: 29%; } 
}
@media (max-width:1024px) {
	
	.con_wrap {width: 100%; height:auto;}
	.MC_wrap3 {  margin-bottom: .5rem;}
	.MC_box8 { width: 100%; height: auto; float: left;} 
}
@media (max-width:980px) {
	.MC_wrap1 .container {padding: 0 1rem 1rem;}
	.MC_wrap1 .container:before {display:none;}
	.MC_wrap2 { margin-top:1rem;}
	.MC_wrap3 { margin-top:2rem;}
    .MC_box1 { width: 100%; height: 20rem; float:none; margin: 1rem auto 0; background: rgba(0,0,0,0.2);} 
	.MC_box2 { width:100%; margin: 0; height: auto; padding: 1rem 0; margin-top: 1rem; position:relative; top:auto; border-radius: 1rem; overflow: hidden; padding: 1rem 1rem 1.8rem;} 
    .MC_box2:before {content:""; display:block; width: 100%; height: auto; position:absolute; top: 0; right: 0; left: auto; background:#ffa127;  z-index:-1; }
    
}
@media (max-width:900px) { 
	.MC_wrap1 { height:auto;  }
	.MC_wrap2 { margin-top:0.8rem; }
    
}
@media (max-width:830px) {
	.MC_wrap2 { margin-top:0.3rem; }
	.MC_wrap3 { margin-top:1.8rem; }
	.MC_box3 { width:100%;height: auto;padding-right:0; float:none;} 
	.MC_box4 {  width:100%;  padding-left:0; float:none; margin-top: 1.5rem;} 
}
@media (max-width:680px) {
	.MC_wrap3 {  margin-bottom: 2rem;}
	.MC_box8 { height: auto; margin-top: 1rem;} 
}
@media (max-width:590px) {
	.MC_wrap3 { margin-top: 0; }
	
	.MC_box5 {  width: 100%;  float: none; margin-top: 1rem;} 
	.MC_box6 { width: 100%; height: auto; float:none; margin-top:1rem;} 
	.MC_box7 { margin-top: 1.5rem;} 
	.MC_box8 { margin-top:1rem;} 
}

@media (max-width:545px){ 
	.MC_box1 { width:auto; height:auto;}  
	.MC_box8 { width:100%; height: auto;} 
}

@media (max-width:480px){
	.MC_wrap1 .container {padding: 0 0.5rem 0;}
	.MC_box2 { height: 20.5rem;} 
    .MC_box2:before { height: 20rem;}
	.MC_box2:after {background: url(/images/schl/template/T0062/main/0062_M_visual_bg01.png) no-repeat center center / cover; content:""; display:block; position:absolute;  bottom:-5rem; left:0; width: 100%; height: 100%; z-index: -1;}
	.MC_box4 { margin-top: 0; margin-top: 1rem;} 
	.MC_box5 { margin-top:1.5rem;} 
}