/* 맞춤 학습 및 놀이 추천 시스템 */
.system {background: url(../images/bg_06.png); background-size:cover;color:#fff; position:relative;}
.system h1 {line-height:1.2;}
.system ul {display:flex; justify-content:space-around; margin-top: 5%; height: 432px; background: url(../images/mobile_circle.png) center no-repeat;}
.system ul li {display:flex; align-items:center; flex-direction: column; margin-top:35px;}
.system ul .circle {justify-content: center;}
.system ul .circle div { font-size:1.6rem!important;}
.system ul li div {text-align:center; display:flex; align-items: center; flex-direction: column; justify-content: center; font-size:1.488rem; margin-bottom:-25px; line-height:1.2;}
.system ul li .yellow {background-color: #f6ba0f; color:#000; width:265px; height:135px; border-radius: 10px;}
.system ul li .green {background-color: #23b014; color:#fff; width:265px; height:135px; border-radius: 10px; margin-top:40%;}
.system ul li .pink {background-color: #ff6d91; color:#fff; width:265px; height:135px; border-radius: 10px;}
.system ul li .red {background-color: #ae140e; color:#fff; width:265px; height:135px; border-radius: 10px; margin-top:40%;}
.system p {margin-top:45px;}
.system h3 {display:none;} 
.yel_bg {background: linear-gradient(to top, #5f81a8 55%, transparent 50%);}

.system .par1 {left:260px; top:80px;}
.system .par2 {left:120px; bottom:160px;}
.system .par3 {right:230px; top:140px;}
.system .par4 {right:150px; bottom:200px;}

/* 반응형 */
@media screen and (max-width: 768px){
	.mblock {display:block;}
	.system ul {background:none; flex-direction:column; height:inherit;}
	
	.system h3 {display:block; color: #ffdc4e; font-size:1.5rem; line-height: 1.2;} 
	.system ul li {margin-top:0;}
	.system ul li.circle {display:none;}
	.system ul li div {font-size: 1.4rem; line-height: 1.2;}
	.system ul li .yellow {width:100%; height:auto; padding:10px;margin:4px;}
	.system ul li .pink {width:100%; height:auto; padding:10px;margin:4px;}
	.system ul li .red {margin-top:0; width:100%; height:auto; padding:10px;margin:4px;}
	.system ul li .green {margin-top:0; width:100%; height:auto; padding:10px;margin:4px;}
	.system p {margin-top:10px;}
	
}