@charset "utf-8";

.contents_section {
	text-align : center;
	margin : 50px auto;
}

.contents_section h2 {
	text-align : center;
	font-weight : 400;
	font-size : 2.4rem;
	font-family: 'Noto Sans Japanese', serif;
	color : #2B91E5;
}


.flow_list {
	display : flex;
	justify-content: space-between ;
	width : 960px;
	margin : 20px auto;
}
.flow_list li {
	position : relative;
}

.flow_list li:before {
	content : "\f138";
	font-family : 'FontAwesome';
	position : absolute;
	top : 110px;
	left : -10px;
	color : #4FC2BD;
	font-size : 2.0rem;
}
.flow_list li:first-child:before{
	content : "";
}

.flow_comment {
	height : 180px;
	font-family: 'Noto Sans Japanese', serif;
	background: url(../images/img_bg_footer.png) no-repeat scroll top center;
	font-size : 2.6rem;
	text-align : center;
	line-height : 45px;
	padding : 40px;
	color : #fff;
}

.promise_section {
	display : flex;
	flex-wrap: wrap;
	width : 1090px;
}

.promise_section > div {
	width : 50%;
	margin : 0 0 20px 0;
}

.promise_section .contents_title {
	text-align : left;
	font-size : 4.8rem;
}
.promise_section .contents_sub_title {
	text-align : left;
	color : #252B25;
	font-size : 1.8rem;
}

.promise_section .contents_comment{
	font-size : 2.4rem;
	text-align : left;
	padding : 30px 0 0 0;
}

.promise01 {
	order : 2;
	padding : 40px 0 0 40px;
}
.promise02 {
	order : 1;
}
.promise03 {
	order : 3;
}
.promise04 {
	order : 4;
}


@media screen and (max-width : 768px) {

	.contents_section h2 {
		font-size : 1.5rem;
	}

	.flow_list {
		display : flex;
		justify-content: space-between ;
		flex-wrap: wrap;
		width : 95%;
		margin : 20px auto;
	}
	
		
	.contents_section .image_area {
		width : 100%;
	}
	
	.flow_list{
		justify-content: flex-start ;
	
	}
										
	.flow_list li {
		width : 16%;
		margin-bottom : 20px;
	}
	.flow_list li:before {
		top : calc(50% - 15px);
	}
	
	.flow_comment {
		font-size : 1.6rem;
		line-height : 1.6;
	}
	.sub .contents_section {
		margin : 40px 0;
	}
	
	.promise_section .contents_title {
		text-align : center;
		font-size : 4.0rem;
	}
	.promise_section .contents_sub_title {
		text-align : center;
		font-size : 1.8rem;
	}

	.promise_section .contents_comment{
		font-size : 1.6rem;
		text-align : center;
	}
		
	
	.promise_section > div.promise01 {
		order : 1;
		padding : 0;
		width : 100%;
	}
	.promise_section > div.promise02 {
		order : 2;
		width : 33%;
	}
	.promise_section > div.promise03 {
		order : 3;
		width : 33%;
	}
	.promise_section > div.promise04 {
		order : 4;
		width : 33%;
	}
	

}


