@charset "UTF-8";

/*	color
$textcolor:#333333;
$yubin:#cc0000;
$yubin2:#FAECEA;
$bg:#eeeeee;
$border:#c9c9c9;
$yucho:#009900;
$kanpo:#000099;
$int:#FA812F;

$gray1:#646464;
$gray2:#a0a0a0;
$gray3:#c8c8c8;
$gray4:#dcdcdc;
$gray5:#eeeeee;
$gray6:#f7f7f7;
$gray7:#FAFAFA;
*/


.h-step.forth-step .inner .col2-l:before {
	content: "STEP4";
}

.h-step.fifth-step .inner .col2-l:before {
	content: "STEP5";
}

.h-step.sixth-step .inner .col2-l:before {
	content: "STEP6";
}

.h-step.seventh-step .inner .col2-l:before {
	content: "STEP7";
}



div.flowBox .flow{
	position:relative;
	display:inline-block;
	vertical-align:top;
	width:25%;
	text-align:center;
	margin:6px 0;
}
	div.flowBox .flow span{
		display:block;
		text-align:left;
		margin:15px 20px 0 50px;
		font-size:85.8%;
	}
	div.flowBox .flow:after{
		position:absolute;
		display:inline-block;
		right:-10px;
		top:100px;
		content:"▲";
		color:#0180cd;
		-webkit-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
		transform: rotate(90deg);
	}
		div.flowBox .flow:nth-last-child(1):after{
			content:"";
		}



@media screen and (max-width: 640px){

div.flowBox .flow{
	display:block;

	width:100%;
	text-align:center;
	margin:6px 0;
}
	div.flowBox .flow span{
		display:block;
		text-align:left;
		margin:15px 20px 15px 30px;
	}
	div.flowBox .flow:after{
		position:initial;
		display:block;
		margin:10px -12px;
		content:"▲";
		color:#0180cd;
		-webkit-transform: rotate(180deg);
		-ms-transform: rotate(180deg);
		transform: rotate(180deg);
		border-bottom:1px dashed #0180cd;
	}
		div.flowBox .flow:nth-last-child(1):after{
			content:"";
			border-bottom:none;
		}


}/*end*/
