@charset "utf-8";


.content-inbody {
	width: 100%;
}

.content-inbody .box {
	color: #FFF;
	position: relative;
	width: 80%;
	max-width: 1200px;
	margin: 0 auto;
	text-align: left;
}

.content-flow {
	display: flex;
	flex-wrap: wrap;
}

.box-flow {
	width: calc(100% / 3);
	margin-bottom: 60px;
	position: relative;
}

.box-flow::before,
.box-flow::after {
	content: '';
	display: block;
	position: absolute;
	width: calc(50% - 65px);
	height: 1px;
	background: #FFF;
	top: 65px;
}

.box-flow::before {
	left: 0;
}

.box-flow::after {
	right: 0;
}

.box-flow:last-child::after,
.box-flow:first-child::before {
	display: none;
}

@media(max-width:1000px){
	.box-flow {
	  width: 50%;
	}
}
@media(max-width:600px){
	.box-flow {
	  width: 100%;
	}
}

.box-flow .box-txt {
	text-align: center;
}

.box-thum {
	margin: 0 auto 30px;
	width: 100%;
	position: relative;
	padding-left: calc( 50% - 65px);
}

.box-thum span {
	display: block;
	border: 1px solid #FFF;
	border-radius: 100%;
	width: 130px;
	height: 130px;
	position: relative;
}

.box-flow .box-thum::before,
.box-flow .box-thum::after {
	content: '';
	position: absolute;
	top:45px;
	display: none;
	width: 10px;
	height: 40px;
	border-left: 1px solid #FFF;
	border-right: 1px solid #FFF;
	transform:rotate(35deg);
}

.box-flow .box-thum::before {
	left: 0;
}
.box-flow .box-thum::after {
	right: 0;
}

.box-flow3 .box-thum::after,
.box-flow4 .box-thum::before {
	display: block;
}

@media(max-width:1000px){
	.box-flow .box-thum::after,
	.box-flow .box-thum::before{
		display: none;
	}
	.box-flow2 .box-thum::after,
	.box-flow3 .box-thum::before,
	.box-flow4 .box-thum::after,
	.box-flow5 .box-thum::before{
		display: block;
	}
}
@media(max-width:600px){
	.box-flow .box-thum::after,
	.box-flow .box-thum::before{
		display: block;
	}
	.box-flow1 .box-thum::before,
	.box-flow5 .box-thum::after{
		display: none;
	}
}

.box-thum span::before {
	position: absolute;
	top:-5px;
	left: -5px;
	display: block;
	width: 40px;
	height: 40px;
	background: #FFF;
	border-radius: 100%;
	padding: 5px 0 0 0;
	text-align: center;
}

.box-flow1 .box-thum span::before {	content: '01';}
.box-flow2 .box-thum span::before {	content: '02';}
.box-flow3 .box-thum span::before {	content: '03';}
.box-flow4 .box-thum span::before {	content: '04';}
.box-flow5 .box-thum span::before {	content: '05';}

.box-flow1 .box-thum span::before,
.box-flow4 .box-thum span::before {	color: #A117F2;}

.box-flow2 .box-thum span::before,
.box-flow5 .box-thum span::before {	color: #724EF9;}

.box-flow3 .box-thum span::before {	color: #590AFA;}

@media(max-width:1000px){
	.box-flow1 .box-thum span::before,
	.box-flow3 .box-thum span::before,
	.box-flow5 .box-thum span::before {	color: #A117F2;}
	
	.box-flow2 .box-thum span::before,
	.box-flow4 .box-thum span::before {	color: #724EF9;}
}
@media(max-width:600px){
	.box-flow .box-thum span::before {	color: #A117F2;}
}

.box-thum img {
	width: 60px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}

.box-flow2 .box-thum img {
	left: 54%;
}

.box-flow h3 {
	font-size: 20px;
	text-align: center;
	margin-bottom: 30px;
}

.box-flow h3 small {
	display: block;
	font-size: 13px;
}

.box-flow p {
	text-align: left;
	width: 90%;
	margin: 0 auto;
}

@media(max-width:1000px){
	.content-inbody .box h2 br {
		display: none;
	}
}
@media(max-width:600px){
	.box-flow p {
		width: 100%;
	}
	.btn-form {
		left: 0;
	}
}