@charset "UTF-8";
/*==========================

	service

============================*/
#service {
	margin: 0 14.5% 180px 7.5%;
}
#service .flexTexte {
	top: 0;
	bottom: 0;
	margin: auto;
	max-width: 700px;
	padding: 80px 150px 80px 20px;
	position: absolute;
	right: 12%;
	z-index: 1;
	height: 66%;
}
#service .flexImg {
	background: url(../img/service/img_Service.jpg) no-repeat center center;
	float: left;
}
.bgListline li {
	line-height: 2;
	padding: 0 0 0 30px;
	position: relative;
}
.bgListline li::before {
	background: #d61518;
	bottom: 0;
	content: "";
	display: block;
	height: 1px;
	left: 5px;
	margin: auto;
	position: absolute;
	top: 0px;
	width: 15px;
}
#roomText {
	text-align: center;
	margin: 0 auto 180px;
}
/*==========================
	feature
============================*/
#feature {margin: 0 14.5% 180px 14.5%;}
.featureList dl {
	float: left;
	line-height: 2;
	margin: 0 5% 0 0;
	width: 28%;
}
.featureList dl:last-child {margin: 0;}
.featureList dt {
	margin: 0 auto 10px;
	text-align: center;
}
.featureList .ttlBlock1 {font-size: 30px;}
.featureList .ttlBlock2 {font-size: 18px;}
/*==========================
	serviceList
============================*/
#serviceList {margin: 0 7.5% 50px 7.5%;}
#serviceList h2.ttlLine {margin: 0 0 40px 8.2%;}
#serviceList ul {margin: 0 -5.2% 0 0;}
#serviceList li {
	float: left;
	margin: 0 5% 3% 0;
	text-align: center;
	width: 20%;
}
#serviceList li .iconImg {margin: 0 auto 10px;}
#serviceList li .iconImg img {width: 100%;}
#serviceList li .iconImg p {font-size: 18px;}
/*==========================
	process
============================*/
#process {margin: 0 14.5% 180px 14.5%;}
#process .textNormal {margin: 0 0 50px;}
#process ul {margin: 0 -6% 0 0;}
#process li {
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	float: left;
	height: 12vw;
	margin: 0 3.65% 0 0;
	text-align: center;
	position: relative;
	width: 12vw;
}
#process li::after {
	bottom: 0;
	content: "";
	display: block;
	margin: auto;
	position: absolute;
	right: -2vw;
	top: 0;
	border-color: transparent transparent transparent #162f5c;
	border-style: solid;
	border-width: 1vw 0 1vw 1.2vw;
	height: 0;
	width: 0;
}
#process li:last-child::after {	display: none;}
#process li:last-child {margin: 0;}
#process li div {
	display: table-cell;
	height: 12vw;
	vertical-align: middle;
	line-height: 1.2;
	width: 12vw;
}
#process li strong, #process li span {display: block;}
#process li strong {font-size: 5vw;}
#process li span {font-size: 1vw;}

@media screen and (max-width: 980px) {
	/*==========================

		service

	============================*/
	#service {
		margin: 0 14.5% 180px 7.5%;
	}
	#service .flexTexte {
		bottom: 0;
		height: 66%;
		margin: auto;
		max-width: 700px;
		padding: 80px 150px 80px 20px;
		position: absolute;
		right: 12%;
		top: 0;
		width: 58vw;
		z-index: 1;
	}
	#service .flexImg {
		background: url(../img/service/img_Service.jpg) no-repeat center center;
		float: left;
	}
	.bgListline li {
		line-height: 2;
		padding: 0 0 0 30px;
		position: relative;
	}
	.bgListline li::before {
		background: #d61518;
		bottom: 0;
		content: "";
		display: block;
		height: 1px;
		left: 5px;
		margin: auto;
		position: absolute;
		top: 0px;
		width: 15px;
	}
	#roomText {
		text-align: center;
		margin: 0 auto 180px;
	}
	/*==========================
		feature
	============================*/
	#feature {margin: 0 14.5% 180px 14.5%;}
	.featureList dl {
		float: left;
		line-height: 2;
		margin: 0 5% 0 0;
		width: 28%;
	}
	.featureList dl:last-child {margin: 0;}
	.featureList dt {
		margin: 0 auto 10px;
		text-align: center;
	}
	.featureList .ttlBlock1 {font-size: 30px;}
	.featureList .ttlBlock2 {font-size: 18px;}
	/*==========================
		serviceList
	============================*/
	#serviceList {margin: 0 7.5% 50px 7.5%;}
	#serviceList h2.ttlLine {margin: 0 0 40px 7.5%;}
	#serviceList ul {margin: 0 -5.2% 0 0;}
	#serviceList li {
		float: left;
		margin: 0 5% 3% 0;
		text-align: center;
		width: 20%;
	}
	#serviceList li .iconImg {margin: 0 auto 10px;}
	#serviceList li .iconImg img {width: 100%;}
	#serviceList li .iconImg p {font-size: 18px;}
	/*==========================
		process
	============================*/
	#process {margin: 0 14.5% 180px 14.5%;}
	#process .textNormal {margin: 0 0 50px;}
	#process ul {margin: 0 -6% 0 0;;}
	#process li {
		border-radius: 50%;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		-ms-border-radius: 50%;
		-o-border-radius: 50%;
		float: left;
		height: 12vw;
		margin: 0 3.65% 0 0;
		text-align: center;
		position: relative;
		width: 12vw;
	}
	#process li::after {
		bottom: 0;
		content: "";
		display: block;
		margin: auto;
		position: absolute;
		right: -2vw;
		top: 0;
		border-color: transparent transparent transparent #162f5c;
		border-style: solid;
		border-width: 1vw 0 1vw 1.2vw;
		height: 0;
		width: 0;
	}
	#process li:last-child::after {	display: none;}
	#process li:last-child {margin: 0;}
	#process li div {
		display: table-cell;
		height: 12vw;
		vertical-align: middle;
		line-height: 1.2;
		width: 12vw;
	}
	#process li strong, #process li span {display: block;}
	#process li strong {font-size: 5vw;}
	#process li span {font-size: 1vw;}
}


@media screen and (max-width: 786px) {
	/*==========================

		service

	============================*/
	#service {
		margin: 0 0 10% 0%;
	}
	#service .flexTexte {
		bottom: auto;
		margin: -4% 0 0 4%;
		max-width: 100%;
		padding: 8% 4% 8% 4%;
		position: relative;
		right: auto;
		top: auto;
		width: auto;
		z-index: 1;
	}
	#service .flexImg {
		background: url(../img/service/img_Service.jpg) no-repeat left top;
		float: none;
		margin: 0 4% 0 0;
		width: auto;
	}
	.bgListline li {
		line-height: 1.8;
		margin: 0 0 1%;
		padding: 0 0 0 30px;
		position: relative;
	}
	.bgListline li::before {
		background: #d61518;
		bottom: auto;
		content: "";
		display: block;
		height: 1px;
		left: 5px;
		margin: auto;
		position: absolute;
		top: 2.8vw;
		width: 15px;
	}
	#roomText {
		margin: 0 auto 10%;
		text-align: center;
		width: 84%;
	}
	/*==========================
		feature
	============================*/
	#feature {
		background:#ffffff;
		margin: 0 4% 10% 4%;
		padding: 8% 4% 8% 4%;
	}
	.featureList dl {
		float: none;
		line-height: 2;
		margin: 0 auto 5%;
		width: auto;
	}
	.featureList dl:last-child {margin: 0 auto 5%;}
	.featureList dt {
		margin: 0 auto;
		text-align: center;
	}
	.featureList .ttlBlock1 {font-size: 30px;}
	.featureList .ttlBlock2 {font-size: 18px;}
	/*==========================
		serviceList
	============================*/
	#serviceList {
		background:#ffffff;
		margin: 0 4% 10% 4%;
		padding: 8% 4% 8% 4%;
	}
	#serviceList h2.ttlLine {margin: 0 0 8%;}
	#serviceList ul {margin: 0 auto;}
	#serviceList li {
		float: none;
		margin: 0 0 3% 0;
		text-align: center;
		width: 48%;
	}
	#serviceList li:nth-child(odd) {float: left;}
	#serviceList li:nth-child(even) {float: right;}
	#serviceList li .iconImg {margin: 0 auto 3%;}
	#serviceList li .iconImg img {width: 100%;}
	#serviceList li .iconImg p {font-size: 3vw;}
	/*==========================
		process
	============================*/
	#process {
		background:#ffffff;
		margin: 0 4% 10% 4%;
		padding: 8% 4% 8% 4%;
	}
	#process .textNormal {margin: 0 0 4%;}
	#process ul {margin: 0;}
	#process li {
		border-radius: 0;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		-ms-border-radius: 0;
		-o-border-radius: 0;
		float: none;
		height: auto;
		margin: 0 0 10% 0;
		text-align: left;
		position: relative;
		width: auto;
	}
	#process li::after {
		bottom: -6vw;
		content: "";
		display: block;
		margin: auto;
		position: absolute;
		right: 0;
		top: auto;
		border-color: #162f5c transparent transparent transparent;
		border-style: solid;
		border-width: 1vw 0 1vw 1.2vw;
		border-width: 3vw 3vw 0 3vw;
		height: 0;
		width: 0;
		left: 0;
	}
	#process li:last-child::after {	display: none;}
	#process li:last-child {margin: 0;}
	#process li div {
		display: block;
		height: auto;
		vertical-align: middle;
		line-height: 3;
		margin: 0 0 0 6%;
		width: auto;
	}
	#process li strong, #process li span {display: inline-block;}
	#process li strong {font-size: 4vw;}
	#process li span {font-size: 4vw;}
}