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

	index

============================*/
.index {
	text-align:center;
}
.scroll {
	bottom: 0;
	color: #ffffff !important;
	display: inline-block;
	font-size: 1vw;
	height: 100px;
	left: 0;
	margin: auto;
	position: absolute;
	right: 0;
}
.scroll:hover {
	text-decoration:none;
}
.scroll:after {
	content:'';
	height:40px;
	left:0;
	margin:auto;
	position:absolute;
	right:0;
	top:15px;
	width:40px;
	-webkit-animation:3s arrow infinite ease;
	animation:3s arrow infinite ease;
}
.scroll:after {
	border-right:2px solid #FFF;
	border-bottom:2px solid #FFF;
	-ms-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
}
.itemBox {
	margin: 0 auto;
	position: relative;
}
/*==========================

	section1

============================*/
.slider-pro {
	margin:0 auto 5%;
	overflow: hidden;
}
.section1 h2 {
	float: right;
	margin: 4% 1% 0 0;
}
.section1 p {
	float: right;
	margin: 0 -12% 0 0;
	position: relative;
	width: 71%;
	z-index: 1;
}
/*==========================

	section2

============================*/
.section2 .img {
	margin: 0 auto 5%;
	width: 84%;
}
.section2 .systemList {
	margin: 0 auto;
}
.section2 h2 {
	float: left;
	margin: 2% 0 0 2%;
}
.section2 table {
	float: left;
	margin: 0 0 0 -3%;
	position: relative;
	width: 68%;
	z-index: 1;
}
.section2 table th {
	font-size: 0.9vw;
	width: 20%;
}
.section2 table th span {
	background: #113127;
	color: #ffffff;
	display: block;
	margin: 0 10px 0 0;
	padding: 5% 0;
}
.section2 table th, .section2 table td {
	border-bottom: 1px solid #113127;
	padding: 2% 0;
	vertical-align: middle;
}
.lage {font-size: 1.2vw;}
.small {font-size: 0.8vw;}
.nostyle {
	border-bottom: 0!important;
}
/*==========================

	section3

============================*/
.section3 h2 {
	float: left;
	margin: 7% 0 0 2%;
}
.section3 h3 {
	float: left;
	font-size: 2.0vw;
	margin: 8% 0 1% 1%;
}
.section3 p {
	float: left;
	margin: 0 0 0 1%;
}
.section3 ul {
	clear: both;
	margin: 5% 0 0 0;
	text-align: center;
}
.section3 ul li {
	margin: 0 auto 8%;
	width: 76%;
}
/*==========================

	section4

============================*/
#map_canvas {
	position: relative;
	margin: 0 0 5% 0;
	width: 100%;
}
#map_canvas:after {
	content:"";
	display: block;
	padding-top: 60%;
}
.section4 h2 {
	float: left;
	margin: 7% 0 0 2%;
}
.section4 .textBlock {
	float: left;
	margin: 3% 0 0;
}
.section4 h3 span {
	border-left:12px solid #113127;
	display: block;
	line-height: 1;
	margin: 0 0 3% 0;
	padding: 0 0 0 10px;
}
.section4 p {
	margin: 0 0 0 1%;
}
.section4 strong {
	background: url(../img/bgTelIcon.png) no-repeat left 20%;
	background-size:12% auto;
	-webkit-background-size:12% auto;
	-moz-background-size:12% auto;
	-o-background-size:12% auto;
	display: block;
	font-size: 2.2vw;
	letter-spacing: 2px;
	line-height: 1;
	padding: 0 0 0 15%;
}
/*==========================

	section5

============================*/
.section5 h2 {
	float: left;
	margin: 7% 0 0 2%;
}
.section5 h3 {
	float: left;
	font-size: 2.0vw;
	margin: 8% 0 1% 1%;
}
.section5 p {
	float: left;
	margin: 0 0 0 1%;
	width: 60%;
}
.section5 ul {
	clear: both;
	margin: 0 auto;
	text-align: center;
	width: 85%;
}
.section5 ul li {
	float: left;
	margin: 0 2%;
	width: 29.3%;
}

/* Media Queries ================================================== */
@media screen and (max-width: 736px) {
	/*==========================

		index

	============================*/
	.index {
		text-align:center;
	}
	.scroll {
		bottom: 0;
		color: #ffffff !important;
		display: inline-block;
		font-size: 1.0vw;
		height: 70px;
		position: absolute;
	}
	.scroll:hover {
		text-decoration:none;
	}
	.scroll:after {
		content:'';
		height:40px;
		left:0;
		margin:auto;
		position:absolute;
		right:0;
		top:15px;
		width:40px;
		-webkit-animation:3s arrow infinite ease;
		animation:3s arrow infinite ease;
	}
	.scroll:after {
		border-right:2px solid #FFF;
		border-bottom:2px solid #FFF;
		-ms-transform:rotate(45deg);
		-webkit-transform:rotate(45deg);
		transform:rotate(45deg);
	}
	.itemBox {
		margin: 0 auto 10%;
	}
	/*==========================

		section1

	============================*/
	.slider-pro {
		margin:0 auto 5%;
		overflow: hidden;
	}
	.section1 .itemBox {
		width: 95%;
	}
	.section1 h2 {
		float: none;
		margin: 0 0 3%;
	}
	.section1 p {
		float: none;
		margin: 0 auto;
		position: relative;
		width: 100%;
		z-index: 1;
	}
	/*==========================

		section2

	============================*/
	.section2 .img {
		display: none;
	}
	.section2 .bx-wrapper {
		border-top: 2px solid #ffffff;
		border-bottom: 2px solid #ffffff;
		margin: 0 auto 1%;
	}
	.section2 .systemList {
		margin: 0 auto;
		width: 95%;
	}
	.section2 h2 {
		float: none;
		margin: 0 0 3% 2%;
	}
	.section2 table {
		float: none;
		margin: 0 auto;
		position: relative;
		width: 100%;
		z-index: 1;
	}
	.section2 table th {
		font-size: 4.0vw;
		text-align: left;
		width: 40%;
	}
	.section2 table th span {
		background: none;
		color: #201716;
		display: inline-block;
		font-weight: bold;
		margin: 0;
		padding: 0;
	}
	.section2 table th, .section2 table td {
		border-bottom: none;
		display: block;
		padding: 0;
		vertical-align: middle;
	}
	.section2 table td {
		border-bottom: 1px solid #ffffff;
		padding: 0 0 2% 2%;
	}
	.section2 table th {
		padding: 2% 0 0 2%;
	}
	.lage {font-size: unset}
	.small {font-size: unset}
	.nostyle {
		border-bottom: 0!important;
	}
	/*==========================

		section3

	============================*/
	.section3 .itemBox {
		width: 95%;
	}
	.section3 h2 {
		float: none;
		margin: 0 0 3%;
	}
	.section3 h3 {
		float: none;
		font-size: 5vw;
		margin: 0 0 1% 0;
	}
	.section3 p {
		float: none;
		margin: 0 0 3%;
	}
	.section3 ul {
		clear: both;
		margin: auto;
		text-align: center;
	}
	.section3 ul li {
		margin: 0 auto 8%;
		width: 100%;
	}
	/*==========================

		section4

	============================*/
	#map_canvas {
		position: relative;
		margin: 0 auto 5%;
		width: 100%;
	}
	#map_canvas:after {
		content:"";
		display: block;
		padding-top: 70%;
	}
	.section4 .itemBox {
		width: 95%;
	}
	.section4 h2 {
		float: none;
		margin: 0 0 3% 2%;
	}
	.section4 .textBlock {
		float: none;
		margin: 0;
	}
	.section4 h3 span {
		border-left:12px solid #113127;
		display: block;
		line-height: 1;
		margin: 0 0 2% 0;
		padding: 0 0 0 10px;
	}
	.section4 p {
		margin: 0 0 5% 0;
	}
	.section4 strong {
		background: url(../img/bgTelIcon.png) no-repeat left 20%;
		background-size:9% auto;
		-webkit-background-size:9% auto;
		-moz-background-size:9% auto;
		-o-background-size:9% auto;
		display: block;
		font-size: 8vw;
		letter-spacing: 2px;
		line-height: 1;
		padding: 0 0 0 10%;
	}
	/*==========================

		section5

	============================*/
	.section5 .itemBox {
		padding: 0 0 30%;
		margin: 0 auto;
		width: 95%;
	}
	.section5 h2 {
		float: none;
		margin: 0 0 3%;
	}
	.section5 h3 {
		float: none;
		font-size: 5vw;
		margin: 0 0 1% 0;
	}
	.section5 p {
		float: none;
		margin: 0 0 3%;
		width: auto;
	}
	.section5 ul {
		clear: both;
		margin: 0 auto;
		text-align: center;
		width: 98%;
	}
	.section5 ul li {
		float: left;
		margin: 0 2%;
		width: 29.3%;
	}
}