@charset "utf-8";


/* 
environment.php
--------------------------------------------------------*/
#environment .content {
	padding-top: 80px;
}
#environment #mainimage {
	height: 400px;
	background: url(../../img/environment/bg_environment_main.jpg) center;
	background-size: cover;
}
	#environment #mainimage h1 {
		padding: 50px 0 70px;
	}
@media screen and (max-width: 767px) {
	#environment .content {
		padding-top: 56px;
	}
	#environment #mainimage {
		height: 140px;
	}
		#environment #mainimage h1 {
			padding: 11px 0 22px 10px;
		}
}

#effort {
	padding: 40px 0 70px;
}
	#effort h1 {
		margin: 0 0 15px;
	}
@media screen and (max-width: 767px) {
	#effort {
		padding: 30px 0;
	}
		#effort h1 {
			margin: 0 10px 5px;
		}
			#effort h1 img {
				width: 169px;
			}
		#effort > p {
			font-size: 12px;
			line-height: 1.5;
			margin: 10px;
		}
}

#gallery {
	background: #000;
	position: relative;
	padding: 0 0 100px;
}
	#gallery h1 {
		text-align: center;
		padding: 75px 0 30px;
	}
		#gallery ul li {
			width: 390px;
			display: inline-block;
			margin: 0 5px 10px;
		}
		#gallery .simply-scroll:last-child li {
			position: relative;
		}
		#gallery .simply-scroll:last-child li img {
			position: absolute;
			left: -50%;
		}
@media screen and (max-width: 767px) {
	#gallery {
		padding: 30px 10px;
		background-size: 40px auto;
	}
		#gallery h1 {
			padding: 0 0 5px;
		}
			#gallery h1 img {
				width: 68px;
			}
		#gallery ul li {
			width: 185px;
			display: inline-block;
			margin: 0 3px 3px;
		}
		#gallery ul li img {
			width: 185px;
			height: auto;
		}
}

#career {
	background: #d5ecf3;
}
	#career h1 {
		padding: 75px 0 30px;
	}
	#career figure {
		padding: 30px 0 90px;
	}
@media screen and (max-width: 767px) {
	#career {
		padding: 30px 10px;
		background-size: 40px auto;
	}
		#career h1 {
			padding: 0 0 5px;
		}
			#career h1 img {
				width: 112px;
			}
		#career > div > p {
			font-size: 12px;
			line-height: 1.5;
		}
		#career figure {
			padding: 10px 0;
		}
}

#welfare {
	padding: 40px 0 70px;
}
	#welfare h1 {
		margin: 0 0 15px;
	}
	#welfare div {
		width: 100%;
		overflow: hidden;
		margin: 30px 0
	}
		#welfare div h2 {
			font-size: 116%;
			margin-bottom: 5px;
		}
		#welfare div figure {
			float: left;
			padding-top: 10px;
		}
		#welfare div p {
			float: right;
			width: 366px;
			height: 272px;
			padding: 30px 135px 0 20px;
			box-sizing: border-box;
		}
		#welfare div.block01 p {
			background: url(../../img/environment/bg_welfare01.png) no-repeat;
		}
		#welfare div.block02 p {
			background: url(../../img/environment/bg_welfare02.png) no-repeat;
		}
		#welfare div.block03 p {
			background: url(../../img/environment/bg_welfare03.png) no-repeat;
		}
@media screen and (max-width: 767px) {
	#welfare {
		padding: 30px 0;
	}
		#welfare h1 {
			margin: 0 10px 5px;
		}
			#welfare h1 img {
				width: 126px;
			}
		#welfare div {
			margin: 10px 0
		}
		#welfare div h2 {
			font-size: 13px;
			margin: 0 10px;
		}
		#welfare div figure {
			float: none;
			padding: 10px 10px 0;
		}
		#welfare div p {
			float: none;
			width: 94%;
			max-width: 300px;
			height: 230px;
			margin: 0 auto;
			padding: 20px 110px 0 15px;
			box-sizing: border-box;
			font-size: 12px;
			line-height: 1.5;
		}
		#welfare div.block01 p {
			background: url(../../img/environment/bg_welfare01.png) no-repeat;
			background-size: 100% auto;
		}
		#welfare div.block02 p {
			background: url(../../img/environment/bg_welfare02.png) no-repeat;
			background-size: 100% auto;
		}
		#welfare div.block03 p {
			background: url(../../img/environment/bg_welfare03.png) no-repeat;
			background-size: 100% auto;
		}
}