@charset "utf-8";



/* header
-----------------------------------*/
#header{
	background-image: url("../img/bg_flow_01.jpg");
}



/* flow_unit
-----------------------------------*/
#flow_unit{
	margin-bottom: 555px;
	padding-top: 153px;
}


#flow_unit > .intro{
	width: 100%;
	margin-bottom: 96px;
}
#flow_unit > .intro h3{
	font-size: 138.5%;
	font-weight: bold;
	text-align: center;
	margin-bottom: 31px;
}
#flow_unit > .intro ul{
	margin: 0 29px 16px;
}
#flow_unit > .intro ul:after{
	content: "";
	clear: both;
	display: block;
}
#flow_unit > .intro li{
	list-style: none;
	width: 33.3%;
	float: left;
	position: relative;
}
#flow_unit > .intro li:before, 
#flow_unit > .intro li:after{
	content: "";
	display: block;
	position: absolute;
	z-index: 1;
}
#flow_unit > .intro li:before{
	width: 53px;
	height: 42px;
	background: url("../../common/img/ico_01.png") no-repeat 0 0;
	margin-left: -27px;
	left: 50%;
	top: -19px;
}
#flow_unit > .intro li:after{
	width: 100%;
	height: 79px;
	background: -webkit-linear-gradient(bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
	background: linear-gradient(to top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
	left: 0;
	bottom: 0;
}
#flow_unit > .intro li span{
	height: 135px;
	background-repeat: no-repeat;
	background-position:center center;
	-webkit-background-size: cover;
	background-size: cover;
	display: block;
	margin: 0 1px;
	position: relative;
}
#flow_unit > .intro li img{
	position: absolute;
	left: 50%;
	top: 29px;
	z-index: 10;
}
#flow_unit > .intro li:nth-child(1) span{
	background-image: url("../img/bg_flow_02.jpg");
}
#flow_unit > .intro li:nth-child(1) img{
	margin-left: -96px;
}
#flow_unit > .intro li:nth-child(2) span{
	background-image: url("../img/bg_flow_03.jpg");
}
#flow_unit > .intro li:nth-child(2) img{
	margin-left: -129px;
}
#flow_unit > .intro li:nth-child(3) span{
	background-image: url("../img/bg_flow_04.jpg");
}
#flow_unit > .intro li:nth-child(3) img{
	margin-left: -80px;
}
#flow_unit > .intro p{
	font-size: 116%;
	line-height: 1.67;
	width: 900px;
	margin: 0 auto;
}


#flow_unit > .flow{
	width: 100%;
	position: relative;
}
#flow_unit > .flow:after{
	content: "";
	width: 100%;
	background: url("../../common/img/bg_01.jpg") no-repeat center center;
	-webkit-background-size: cover;
	background-size: cover;
	display: block;
	position: absolute;
	left: 0;
	top: 30px;
	bottom: 0;
	z-index: 1;
}
#flow_unit > .flow h3{
	color: #0067b2;
	font-size: 153.9%;
	font-weight: bold;
	letter-spacing: 0.2em;
	width: 900px;
	background-color: #fff;
	border: 2px solid #0067b2;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	text-align: center;
	margin: 0 auto 40px;
	padding: 15px 0 9px;
	position: relative;
	z-index: 10;
}
#flow_unit > .flow ol{
	width: 900px;
	margin: 0 auto;
	position: relative;
	z-index: 10;
}
#flow_unit > .flow ol:after{
	content: "";
	clear: both;
	display: block;
}
#flow_unit > .flow li{
	list-style: none;
	width: 280px;
	background-color: #fff;
	float: left;
	margin-bottom: 50px;
	padding: 39px 0 32px;
	position: relative;
}
#flow_unit > .flow li:before{
	content: "";
	width: 58px;
	height: 59px;
	background-repeat: no-repeat;
	background-position: 0 0;
	display: block;
	margin-left: -29px;
	position: absolute;
	left: 50%;
	top: -25px;
}
#flow_unit > .flow li + li{
	margin-left: 30px;
}
#flow_unit > .flow li + li:after{
	content: "";
	width: 12px;
	height: 50px;
	background: url("../../common/img/ico_03.png") no-repeat 0 0;
	display: block;
	margin-top: -25px;
	position: absolute;
	left: -20px;
	top: 50%;
}
#flow_unit > .flow li:nth-child(1):before{
	background-image: url("../img/ico_flow_01.png");
}
#flow_unit > .flow li:nth-child(2):before{
	background-image: url("../img/ico_flow_02.png");
}
#flow_unit > .flow li:nth-child(3):before{
	background-image: url("../img/ico_flow_03.png");
}
#flow_unit > .flow li:nth-child(4){
	margin-left: 155px;
}
#flow_unit > .flow li:nth-child(4):before{
	background-image: url("../img/ico_flow_04.png");
}
#flow_unit > .flow li:nth-child(5):before{
	background-image: url("../img/ico_flow_05.png");
}
#flow_unit > .flow li h4{
	font-size: 138.5%;
	font-weight: bold;
	text-align: center;
	margin-bottom: 5px;
}
#flow_unit > .flow li h4 span{
	font-size: 83.3%;
}
#flow_unit > .flow li .inner{
	width: 240px;
	margin-left: 20px;
}
#flow_unit > .flow li .inner:after{
	content: "";
	clear: both;
	display: block;
}
#flow_unit > .flow li p{
	width: 120px;
	float: left;
}
#flow_unit > .flow li img{
	float: right;
	margin-top: 2px;
}