@charset "UTF-8";

/*--------------------------------------------------------------
#about-top-area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	#about-top-area {
		margin: 0;
		padding: 15vh 10% 0 5%;
		background: url("images/main_image_sp.jpg") bottom center no-repeat;
		background-size: cover;
		height: 90vh;
		position: relative;
	}
	
	#about-top-area dl {
		margin: 0;
		padding: 0;
		width: auto;
	}
	
	#about-top-area dt.topcopy span {
		margin: 0;
		padding: 20px 20px 0 20px;
		font-size: 16px;
		background: #294191;
		color: #FFF;
		font-weight: bold;
	}
	
	#about-top-area dt.subcopy span {
		margin: 0;
		padding: 20px 20px;
		font-size: 20px;
		background: #294191;
		color: #FFF;
		font-weight: bold;
		display: inline-block;
	}
	
	#about-top-area dd {
		margin: 15px 0 0 0;
		padding: 20px 20px;
		font-size: 14px;
		background: #FFF;
		display: inline-block;
		line-height: 1.8;
	}
}

/* Small than tablet */
@media (min-width: 768px) {
	
	#about-top-area {
		margin: 0;
		padding: 0;
		background: url("images/main_image.png") bottom center no-repeat;
		background-size: cover;
		height: 50vh;
		position: relative;
	}
	
	#about-top-area dl {
		margin: 0;
		padding: 0;
		position: absolute;
		top: 50%;
		left: 5%;
		-webkit-transform: translate(0, -50%);
		transform: translate(0, -50%);
		width: 50%;
	}
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	#about-top-area {
		margin: 0;
		padding: 0;
		background: url("images/main_image.png") bottom center no-repeat;
		background-size: cover;
		height: 50vh;
		position: relative;
	}
	
	#about-top-area dl {
		margin: 0;
		padding: 0;
		position: absolute;
		top: 50%;
		left: 10%;
		-webkit-transform: translate(0, -50%);
		transform: translate(0, -50%);
		width: 450px;
	}
	
	#about-top-area dt.topcopy span {
		margin: 0;
		padding: 20px 30px 0 30px;
		font-size: 20px;
		background: #294191;
		color: #FFF;
		font-weight: bold;
	}
	
	#about-top-area dt.subcopy span {
		margin: 0;
		padding: 20px 30px;
		font-size: 25px;
		background: #294191;
		color: #FFF;
		font-weight: bold;
		display: inline-block;
	}
	
	#about-top-area dd {
		margin: 15px 0 0 0;
		padding: 20px 30px;
		font-size: 15px;
		background: #FFF;
		display: inline-block;
		line-height: 1.8;
	}
	
}


/*--------------------------------------------------------------
#evaluation-area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	#evaluation-area {
		margin: 0;
		padding: 0 0 80px 0;
		background: #294191;
	}
	
	.photoslide img {
		width: 100%;
		height: auto;
	}

	.safety {
		margin: 0 10%;
		padding: 50px 0 50px 0;
		width: auto;
	}
	
	.safety dt {
		margin: 0 auto 20px auto;
		padding: 0;
		width: 60%;
	}
	
	.safety dd {
		margin: 0;
		padding: 0;
		color: #FFF;
		font-size: 14px;
		line-height: 1.8;
	}
	
	.safety dd span {
		margin: 0 0 20px 0;
		padding: 0;
		font-size: 18px;
		line-height: 1.5;
		font-weight: bold;
		display: block;
	}
	
	.service {
		margin: 0 10%;
		padding: 0;
		color: #FFF;
		width: auto;
	}
	
	.service dt {
		margin: 0 0 20px 0;
		padding: 0;
		width: auto;
		font-size: 16px;
		font-weight: bold;
	}
	
	.service dd {
		margin: 0;
		padding: 0;
		font-size: 14px;
		line-height: 1.8;
	}
}

/* Small than tablet */
@media (min-width: 768px) {
	
	.safety {
		margin: 0 10%;
		padding: 80px 0 50px 0;
		width: auto;
	}
	
	.safety dt {
		margin: 0;
		padding: 0;
		width: 235px;
		float: right;
	}
	
	.safety dd {
		margin: 0 300px 0 0;
		padding: 0;
		color: #FFF;
		font-size: 15px;
		line-height: 1.8;
	}
	
	.safety dd span {
		margin: 0 0 20px 0;
		padding: 0;
		font-size: 20px;
		line-height: 1.5;
		font-weight: bold;
		display: block;
	}
	
	.service {
		margin: 0 10%;
		padding: 0;
		color: #FFF;
		width: auto;
	}
	
	.service dt {
		margin: 0 0 20px 0;
		padding: 0;
		width: auto;
		font-size: 18px;
		font-weight: bold;
	}
	
	.service dd {
		margin: 0;
		padding: 0;
		font-size: 14px;
		line-height: 1.8;
	}
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	#evaluation-area {
		margin: 0;
		padding: 0 0 80px 0;
		background: #294191;
	}
	
	.photoslide img {
		width: 100%;
		height: auto;
	}

	.safety {
		margin: 0 auto;
		padding: 80px 0 50px 0;
		width: 920px;
	}
	
	.safety dt {
		margin: 0;
		padding: 0;
		width: 235px;
		float: right;
	}
	
	.safety dd {
		margin: 0 300px 0 0;
		padding: 0;
		color: #FFF;
		font-size: 18px;
		line-height: 1.8;
	}
	
	.safety dd span {
		margin: 0 0 20px 0;
		padding: 0;
		font-size: 25px;
		line-height: 1.5;
		font-weight: bold;
		display: block;
	}
	
	.service {
		margin: 0 auto;
		padding: 0;
		color: #FFF;
		width: 920px;
	}
	
	.service dt {
		margin: 0;
		padding: 0;
		width: 430px;
		float: left;
		font-size: 20px;
		font-weight: bold;
	}
	
	.service dd {
		margin: 0 0 0 450px;
		padding: 0;
		font-size: 15px;
		line-height: 1.8;
	}
	
}


/*--------------------------------------------------------------
#support-area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	#support-area {
		margin: 0;
		padding: 50px 5% 200px 5%;
		background: url("images/about_bg_sp.png") bottom center no-repeat;
		-webkit-background-size: 110% auto;
		background-size: 110% auto;
		background-color: #508fe4;
	}
	
	.bg_inner {
		margin: 0 auto;
		padding: 50px 10%;
		background: #FFF;
	}
	
	.bg_inner ul {
	}
	
	.bg_inner li {
		margin: 0 0 40px 0;
		padding: 0;
	}
	
	.bg_inner li:last-child {
		margin: 0;
		padding: 0;
	}
	
	.bg_inner dl {
		margin: 0;
		padding: 0;
		width: auto;
	}
	
	.bg_inner dt {
		margin: 0 10% 20px 10%;
		padding: 0;
	}
	
	.bg_inner dd {
		margin: 0;
		padding: 0;
		font-size: 14px;
		line-height: 1.8;
	}
	
	.bg_inner dd span {
		margin: 0;
		padding: 0;
		font-size: 18px;
		font-weight: bold;
		display: block;
		text-align: center;
	}
}

/* Small than tablet */
@media (min-width: 768px) {
	
	#support-area {
		margin: 0;
		padding: 50px 10% 30vw 10%;
	}
	
	.bg_inner dl {
		margin: 0;
		padding: 0;
		width: auto;
	}
	
	.bg_inner dt {
		margin: 0 auto 20px auto;
		padding: 0;
		width: 200px
	}
	
	.bg_inner dd {
		margin: 0;
		padding: 0;
		font-size: 14px;
		line-height: 1.8;
	}
	
	.bg_inner dd span {
		margin: 0;
		padding: 0;
		font-size: 18px;
		font-weight: bold;
		display: block;
		text-align: center;
	}
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	#support-area {
		margin: 0;
		padding: 100px 5% 25vw 5%;
		background: url("images/about_bg.png") bottom left no-repeat;
		background-size: cover;
	}
	
	.bg_inner {
		margin: 0 auto;
		padding: 100px 5%;
		background: #FFF;
	}
	
	.bg_inner ul {
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: center;
		justify-content: center;
	}
	
	.bg_inner li {
		margin: 0 5% 0 0;
		padding: 0;
	}
	
	.bg_inner li:last-child {
		margin: 0;
		padding: 0;
	}
	
	.bg_inner dl {
		margin: 0;
		padding: 0;
		width: 235px;
	}
	
	.bg_inner dt {
		margin: 0;
		padding: 0;
	}
	
	.bg_inner dd {
		margin: 0;
		padding: 0;
		font-size: 15px;
		line-height: 1.8;
	}
	
	.bg_inner dd span {
		margin: 0;
		padding: 0;
		font-size: 20px;
		font-weight: bold;
		display: block;
		text-align: center;
	}
	
}