
#system .contents{
	width:1600px;
    margin: 0 auto;
}
#system .contents h3{
	background: #f30;
    padding: 30px 0;
    text-align: center;
    font-size: 20px;
}
#system .contents .explanation{
	display: flex;
}
#system .contents .explanation div{
	width: 660px;
    padding: 100px 0;
    text-align: center;
    font-size: 50px;
    border: 2px solid #fff;
    margin: 0;
}
#system .contents .explanation p{
    padding-left: 40px;
    font-size: 20px;
    width: 900px;
    line-height: 1.2;
}
#system .contents .explanation p span{
    display: inline-block;
	margin-top:50px;
	font-size:16px;
}
#system-flow .contents{
	width:1500px;
	margin:20px auto 20px auto;
	border:1px solid #fff;
}
#system-flow .contents h3{
	background: #333;
    margin: 0;
    padding: 20px;
}
#system-flow .contents h3 span {
    width: 150px;
    display: inline-block;
    font-size: 40px;
}
#system-flow .contents p{
	padding: 20px;
}
#system-flow div.ya{
    width: 1400px;
    margin: 0 auto;
    font-size: 50px;
}

@media screen and (max-width: 1600px){
	#system .contents{ width:96%; }
	#system-flow .contents { width:96%; }
	#system-flow div.ya { width:96%; }
}
@media screen and (max-width: 1024px){
	#system .contents .explanation div{ font-size: 4.88vw; }
}
@media screen and (max-width: 640px){
	#system .contents .explanation { display: block; }
	#system .contents .explanation div { width: 96%; margin: auto; }
	#system .contents .explanation p { width: 96%; margin: 2%; padding: 0; }
	#system-flow .contents h3 { }
	#system-flow .contents h3 span { width:100%; font-size:30px; margin-bottom:20px; }

}
