﻿/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

@charset   "UTF-8";
#kyosai h2 {
	margin:				50px auto;
	font-size:			27px;
	font-weight:		bold;
}
#kyosai p {
	width:				70%;
	margin:				50px auto;
	font-size:			16px;
	text-align:			left;
	line-height:		23px;
}
#kyosai img {
	width:				100%;
}
#kyosai section {
	width:				100%;
}
#kyosai .wrapper {
	width:				80%;
	max-width:			1440px;
	margin:				0 auto;
	padding:			50px 0 20px 0;
}
#kyosai h3 {
	width:				100%;
	margin:				30px auto;
	text-align:			left;
	font-size:			21px;
	font-weight:		bold;
}
@media screen and ( max-width:768px ) {
	#kyosai h2 {
		font-size:			20px;
	}
	#kyosai p {
		width:				80%;
		font-size:			15px;
		line-height:		23px;
	}
	#kyosai .wrapper {
		width:				90%;
		padding-top:		40px;
	}
	#kyosai h3 {
		font-size:			17px;
	}
}

/* 紹介エリア ***********************************/
#intro {
	background-color:	#007c64;
}
#intro h3 {
	color:				#f0f0f0;
}
#intro .iwrap {
	width:				100%;
	display:			-webkit-box;
	display:			-ms-flexbox;
	display:			flex;
	-webkit-box-orient:			horizontal;
	-webkit-box-direction:			normal;
	    -ms-flex-flow:			row wrap;
	        flex-flow:			row wrap;
	-ms-flex-pack:	distribute;
	    justify-content:	space-around;
}
#intro .iwrap div {
	width:				200px;
	margin:				40px 0px;
	display:			-webkit-box;
	display:			-ms-flexbox;
	display:			flex;
	-webkit-box-orient:			vertical;
	-webkit-box-direction:			normal;
	    -ms-flex-flow:			column nowrap;
	        flex-flow:			column nowrap;
	-webkit-box-align:		center;
	    -ms-flex-align:		center;
	        align-items:		center;
	-webkit-box-pack:	center;
	    -ms-flex-pack:	center;
	        justify-content:	center;
/*border:1px lime solid;*/
}
#intro .iwrap a {
	width:				190px;
	height:				190px;

	display:			-webkit-box;

	display:			-ms-flexbox;

	display:			flex;
	-webkit-box-align:		center;
	    -ms-flex-align:		center;
	        align-items:		center;
	-webkit-box-pack:	center;
	    -ms-flex-pack:	center;
	        justify-content:	center;

	overflow:			hidden;
	-webkit-box-sizing: 		border-box;
	        box-sizing: 		border-box;
	border-radius:		50%;
	background-color:	white;
/*border:1px red solid;*/
}
#intro .iwrap a:hover {
	background-color:	#d0d0d0;
	-webkit-transition:			.3s background-color ease 0s;
	-o-transition:			.3s background-color ease 0s;
	transition:			.3s background-color ease 0s;
}
#intro .iwrap .human img {
	width:				40%;
}
#intro .iwrap .house img {
	width:				70%;
}
#intro .iwrap .car img {
	width:				70%;
}
#intro .iwrap p {
	margin:				0;
	padding:			15px 0px;
	color:				#f0f0f0;
	text-align:			center;
/*border:1px blue solid;*/
}
@media screen and ( max-width:428px ) {
	#intro .iwrap div {
		margin:				10px 0px;
	}
	#intro .iwrap p {
		line-height:		6.5vw;
	}
}
@media screen and ( max-width:210px ) {
	#intro .iwrap div {
		width:				95vw;
	}
	#intro .iwrap a {
		width:				90vw;
		height:				90vw;
	}
	#intro .iwrap p {
		padding:			8vw 0px;
		font-size:			7vw;
	}
}

/* 規定エリア ***************************************/
#kitei .wrap {
	width:				100%;
	display:			-webkit-box;
	display:			-ms-flexbox;
	display:			flex;
	-webkit-box-orient:			horizontal;
	-webkit-box-direction:			normal;
	    -ms-flex-flow:			row wrap;
	        flex-flow:			row wrap;
	-webkit-box-pack:	start;
	    -ms-flex-pack:	start;
	        justify-content:	flex-start;
}
#kitei .commonBtn_P {
	width:				350px;
	margin:				5px;
	padding:			20px 10px;
	font-size:			19px;
}
@media screen and ( max-width:768px ) {
	#kitei .wrap {
		-webkit-box-pack:	center;
		    -ms-flex-pack:	center;
		        justify-content:	center;
	}
	#kitei .commonBtn_P {
		width:				90%;
		font-size:			17px;
	}
}
@media screen and ( max-width:428px ) {
	#kitei .commonBtn_P {
		width:				100%;
		font-size:			15px;
		padding:			20px 5px;
	}
}
