
[class*='MC_wrap'] + [class*='MC_wrap'] {margin-top:1.5rem;}

.main-container {overflow:hidden;}
.main-container > .inner {max-width:80rem; margin:0 auto;}

.MC_wrap1 {display: flex; align-items: flex-start;  margin-top: 2rem; justify-content: space-between; gap:1.5rem;}
.MC_box1 {flex: 0 0 39.2rem; width: 39.2rem; min-width: 0; position: relative; z-index: 1;} 
.MC_box2 {flex: 1 1 auto;}

.MC_box3 {position:relative; z-index:0; height:15rem; display:flex; align-items:center;}
.MC_box3:before {content:''; z-index:1;}
.MC_box3:after {content:''; z-index:-1; position:absolute; width:calc(100% - 10rem); height:100%; left:calc(50% - 5rem); transform:translate(-50%, 0); background: linear-gradient(to right, #0068FF 30%, #82d85b 100%); border-radius:2.5rem;}


.MC_wrap3 {position:relative; display: flex; align-items: flex-start; justify-content: space-between; gap:2.5rem;}
.MC_box4 {flex: 1 1 auto;}
.MC_box5 {flex: 0 0 18.8rem; width: 18.8rem; min-width: 0; position: relative; z-index: 1;}

.MC_wrap4 {display: flex; align-items: flex-start; justify-content: space-between; gap:2.5rem;}
.MC_box6 {flex: 1 1 auto;}
.MC_box7 {flex: 0 0 18.8rem; width: 18.8rem; min-width: 0; position: relative; z-index: 1;}


.MC_wrap5 {position:relative;}
.MC_wrap5:before {content:''; position:absolute; width:100vw; height:100%; top:0; background:#F2F5FD; left:50%; transform:translate(-50%, 0); z-index:-1;}



@media screen and (max-width: 1600px){
	.main-container {padding: 0 1rem;}
	.MC_wrap1 {flex-direction:column;}
	.MC_box1 {width:100%; flex:0 0 100%;}
	.MC_box2 {width:100%;}
}

@media screen and (max-width: 1480px){
	.MC_box3 {align-items:flex-start;}
	.MC_box3:after {height:calc(100% - 2rem);}
}

@media screen and (max-width: 1280px){
	.MC_wrap4 {gap:1.5rem;}
	.MC_wrap3 {flex-direction:column;}
	.MC_box4,
	.MC_box5 {width:100%; flex:0 0 100%;}
}


@media screen and (max-width: 1024px){
	[class*='MC_wrap'] + [class*='MC_wrap'] {margin-top:2.5rem;}
	
	.MC_wrap4 {flex-direction:column;}
	.MC_box6 {width:100%; flex:1;}
	.MC_box7 {width:100%; flex:0 0 100%;}
	
	.MC_box3:after {width:100%; left:0; transform:translate(0, 0); height:calc(100% - 6rem);}
}

@media screen and (max-width: 768px){
	.MC_box3 {height:100%;}
	.MC_box3:after {height:100%;}
}

@media screen and (max-width: 480px){
}

@media screen and (max-width: 360px){
}
