@charset "utf-8";


/* 
company.php
--------------------------------------------------------*/
#company .content {
	padding-top: 80px;
}
#company #mainimage {
	height: 400px;
	background: url(../../img/company/bg_company_main.png) center;
	background-size: cover;
}
	#company #mainimage figure {
		float: right;
	}
	#company #mainimage h1 {
		padding: 50px 0 70px;
	}
	#company #mainimage p:last-child {
		padding: 70px 0 0 350px;
	}
@media screen and (max-width: 767px) {
	#company .content {
		padding-top: 56px;
	}
	#company #mainimage {
		height: 190px;
	}
		#company #mainimage figure img {
			height: 190px;
		}
		#company #mainimage h1 {
			padding: 11px 0 22px 10px;
		}
		#company #mainimage p {
			padding: 0 0 0 10px;
		}
		#company #mainimage p:last-child {
			padding: 35px 0 0 10px;
		}
}

#work {
	padding: 40px 0 70px;
}
	#work h1 {
		margin: 0 0 15px;
	}
	#work figure {
		margin: 90px 0;
		height: 400px;
		background:url(../../img/company/img_work_photo.jpg) center no-repeat;
	}
		#work figure span {
			display: none;
		}
	#profile {
		background:url(../../img/company/bg_profile.png) center no-repeat;
		height: 360px;
		color: #fff;
	}
		#profile .container div {
			float: left;
			margin: 45px 0 0 145px;
			width: 222px;
		}
			#profile .container div h2 {
				text-align: center;
			}
			#profile .container div table {
				margin: 35px 0 0;
			}
			#profile .container div table th {
				width: 60px;
				text-align: center;
			}
			#profile .container div table td em {
				font-size: 131%;
				display: block;
				font-style: normal;
			}
		#profile .container p {
			float: right;
			width: 570px;
			font-size: 91%;
			margin-top: 30px;
			line-height: 1.6;
		}
@media screen and (max-width: 767px) {
	#work {
		padding: 30px 10px;
	}
		#work h1 {
			margin: 0 0 5px;
		}
			#work h1 img {
				width: 84px;
			}
		#work > div > p {
			font-size: 12px;
			line-height: 1.5;
		}
	#work figure {
		margin: 25px -10px;
		height: 130px;
		background:url(../../img/company/img_work_photo.jpg) center no-repeat;
		background-size: auto 100%;
	}
	#profile {
		background: none;
		height: auto;
		color: #000;
	}
		#profile .container div {
			background: url(../../img/company/bg_profile_sp.png) center top no-repeat;
			background-size: 238px auto;
			float: none;
			margin: 20px auto;
			width: 238px;
			height: 180px;
		}
			#profile .container div h2 {
				text-align: left;
				padding: 12px 0 0 110px;
			}
			#profile .container div h2 img {
				width: 60px;
			}
			#profile .container div table {
				margin: 10px 0 0 85px;
				font-size: 9px;
				color: #fff;
				width: 120px;
			}
			#profile .container div table th {
				width: 40px;
			}
			#profile .container div table td em {
				font-size: 14px;
			}
		#profile .container p {
			float: none;
			width: 100%;
			font-size: 12px;
			line-height: 1.5;
		}
}

#about {
	background: url(../../img/company/bg_about.png) bottom repeat-x #d5ecf3;
}
	#about h1 {
		padding: 75px 0 30px;
	}
	#about figure {
		width: 1100px;
		margin-left: -141px;
	}
	#about h2 {
		padding: 50px 0 20px;
		text-align: center;
	}
	#about ul {
		text-align: center;
		padding-bottom: 60px;
	}
		#about ul li {
			vertical-align: top;
			display: inline-block;
			width: 250px;
			margin: 0 25px;
			font-size: 116%;
			line-height: 1.3;
		}
			#about ul li img {
				margin-bottom: 10px;
			}
			#about ul li span {
				display: block;
				font-size: 78%;
			}
@media screen and (max-width: 767px) {
	#about {
		padding: 30px 10px;
		background-size: 40px auto;
	}
		#about h1 {
			padding: 0 0 5px;
		}
			#about h1 img {
				width: 55px;
			}
		#about > div > p {
			font-size: 12px;
			line-height: 1.5;
		}
		#about figure {
			width: 100%;
			margin-left: 0;
		}
		#about h2 {
			padding: 25px 0 10px;
		}
			#about h2 img {
				width: 113px;
			}
		#about ul {
			padding-bottom: 10px;
		}
			#about ul li {
				width: 145px;
				margin: 0;
				font-size: 13px;
				line-height: 1.3;
			}
				#about ul li span {
					font-size: 10px;
				}
}

#vision {
	margin: 0 auto 0;
	padding: 60px 0 100px;
}
	#vision h1 {
		margin: 0 0 15px;
	}
	#vision ul {
		text-align: center;
		padding: 40px 0;
	}
		#vision ul li {
			display: inline-block;
			width: 290px;
			margin: 0 12px;
		}
@media screen and (max-width: 767px) {
	#vision {
		padding: 30px 0;
	}
		#vision h1 {
			margin: 0 10px 5px;
		}
			#vision h1 img {
				width: 91px;
			}
		#vision > p {
			margin: 10px;
			font-size: 12px;
			line-height: 1.5;
		}
	#vision ul {
		padding: 10px 0;
	}
		#vision ul li {
			display: inline-block;
			width: 140px;
			margin: 0 2px 5px;
		}
}

#base {
	background: #e6ebee;
	padding: 70px 0;
}
	#base h1 {
		margin: 0 0 30px;
	}
	.headoffice {
		width: 100%;
		height: 600px;
		position: relative;
	}
	.headoffice div {
		margin: 30px 0;
		padding: 0 10px;
		border-left: 8px solid #e2001e;
	}
		.headoffice div h2 {
			font-size: 116%;
		}
	.headoffice figure.map {
		position: absolute;
		bottom: 0;
		right: 0;
	}
@media screen and (max-width: 767px) {
	#base {
		padding: 30px 10px;
	}
		#base h1 {
			margin: 0 0 10px;
		}
			#base h1 img {
				width: 27px;
			}
		.headoffice {
			height: 430px;
			position: relative;
		}
		.headoffice div {
			margin: 25px 0;
			border-left: 5px solid #e2001e;
			font-size: 10px;
		}
			.headoffice div h2 {
				font-size: 13px;
			}
		.headoffice figure:last-child {
			position: absolute;
			bottom: 0;
			right: 0;
		}
		.headoffice figure:last-child img {
			width: 265px;
		}
		#base h2 {
			margin: 30px 0 10px;
		}
			#base h2 img {
				width: 156px;
			}
}
