@charset "UTF-8";
/* CSS Document */
.h2Area {
	background-image: url(../img/company/h2_bg.jpg);
}
.companyBox01 .h3Area {
	padding: 80px 0 100px;
	text-align: center;
}
.companyBox01 .h3Area .ttl {
	padding-bottom: 20px;
}
.companyBox01 .h3Area h3 {
	font-size: 37px;
	color: #0099CC;
}
.companyBox01 .h3Area .txt {
	padding-top: 30px;
	font-size: 16px;
}
.companyBox01 .introduction .inner {
	padding: 20px 25px 80px;
}
.companyBox01 .introduction .inner .right {
	float: right;
	width: 50%;
	text-align: left;
}
.companyBox01 .introduction .inner .right .ttl {
	padding: 20px 10px 25px 10px;
	font-size: 19px;
	color: #FF9999;
	font-weight: bold;
}
.companyBox01 .introduction .inner .right .txt {
	padding: 15px 10px 0;
	font-size: 13px;
}
.companyBox01 .introduction .inner .left {
	float: left;
	width: 50%;
	padding-top: 200px;
	position: relative;
}
.companyBox01 .introduction .inner .left:after {
	content: "";
	position: absolute;
	top: 0;
	right: 75px;
	width: 750px;
	height: 450px;
	background-image: url(../img/company/img.jpg);
	background-repeat: no-repeat;
	background-position: left center;
	z-index: -100;
}
.companyBox02 {
	background-color: #F6F6ED;
}
.companyBox02 .inner {
	padding: 50px 25px;
}
.companyBox02 .inner .profArea {
	overflow: hidden;
	padding: 50px 100px 10px;
}
.companyBox02 .inner .profArea .left {
	float: left;
	width: 50%;
	position: relative;
}
.companyBox02 .inner .profArea .left:before {
	content: "Hiroya Fujiwara";
	position: absolute;
	bottom: 0;
	left: -75px;
	font-size: 36px;
	color: #0099CC;
	letter-spacing: 0.16em;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
	transform: rotate(180deg);
}
.companyBox02 .inner .profArea .right {
	float: right;
	width: 50%;
	padding-left: 10px;
	text-align: left;
}
.companyBox02 .inner .profArea .right .nameArea p {
	display: inline-block;
}
.companyBox02 .inner .profArea .right .nameArea .position {
	font-size: 15px;
}
.companyBox02 .inner .profArea .right .nameArea .name {
	padding-left: 50px;
	font-size: 28px;
	font-weight: bold;
}
.companyBox02 .inner .profArea .right .part {
	padding-bottom: 10px;
	font-size: 13px;
}
.companyBox02 .inner .profArea .right .prof {
	padding-top: 15px;
}
.companyBox02 .inner .profArea .right .prof li {
	font-size: 13px;
}
.companyBox02 .inner .profArea .right .freee {
	padding-top: 25px;
}
.companyBox02 .inner .profArea .right .freee a {
	display: inline-block;
}
.companyBox02 .inner .profArea .right .freee a:hover {
	opacity: 0.7;
}
.companyBox03 .inner {
	padding: 50px 25px;
	text-align: center;
}
.companyBox03 .inner .map_a {
	padding: 30px 0;
}
.companyBox03 .inner .mapTxt {
	padding: 30px 145px 0;
	font-size: 13px;
	text-align: left;
}
.companyBox03 .inner .add {
	padding-bottom: 40px;
}
.companyBox03 .inner .transpor {
	overflow: hidden;
}
.companyBox03 .inner .transpor li {
	float: left;
	width: 50%;
	margin-bottom: 30px;
}
.companyBox03 .inner .transpor li:nth-child(2n+1) {
	clear: both;
}
.companyBox03 .inner .transpor li .ttl {
	color: #0099CC;
	padding-bottom: 10px;
}
.mapArea {
	height: 400px;
	padding-top: 45px;
}

@media screen and (max-width: 768px) {
	.companyBox01 .h3Area {
		padding: 15px 5vw 10px;
	}
	.companyBox01 .h3Area .ttl {
		width: 85%;
		margin: 0 auto;
		padding-bottom: 10px;
	}
	.companyBox01 .h3Area h3 {
		font-size: 4vw;
	}
	.companyBox01 .h3Area .txt {
		padding-top: 15px;
		font-size: 3.4vw;
		line-height: 1.3;
		text-align: left;
	}
	.companyBox01 .introduction .inner {
		padding: 40px 5vw;
		margin-bottom: 50px;
	}
	.companyBox01 .introduction .inner .right {
		float: none;
		width: 100%;
		padding-bottom: 30px;
	}
	.companyBox01 .introduction .inner .right .ttl {
		padding: 30px 0 10px;
		font-size: 4vw;
		line-height: 1.3;
	}
	.companyBox01 .introduction .inner .right .txt {
		padding: 8px 0 0;
		font-size: 3.4vw;
		line-height: 1.6;
	}
	.companyBox01 .introduction .inner .left {
		float: none;
		width: 100%;
		padding: 45px 2vw 0;
		text-align: center;
	}
	.companyBox01 .introduction .inner .left img {
		width: 80%;
	}
	.companyBox01 .introduction .inner .left:after {
		right: 0;
		width: 100%;
		height: 120px;
	}
	.companyBox02 .inner {
		padding: 40px 5vw;
	}
	.companyBox02 .inner .profArea {
		padding: 30px 0 10px;
	}
	.companyBox02 .inner .profArea .left {
		float: none;
		width: 100%;
		text-align: center;
	}
	.companyBox02 .inner .profArea .left img {
		width: 80%;
	}
	.companyBox02 .inner .profArea .left:before {
		display: none;
	}
	.companyBox02 .inner .profArea .right {
		float: none;
		width: 100%;
		padding-left: 0;
		padding-top: 30px;
	}
	.companyBox02 .inner .profArea .right .nameArea .position {
		font-size: 3.5vw;
	}
	.companyBox02 .inner .profArea .right .nameArea .name {
		padding-left: 2vw;
		font-size: 7vw;
	}
	.companyBox02 .inner .profArea .right .part {
		padding-bottom: 8px;
		font-size: 3.4vw;
	}
	.companyBox02 .inner .profArea .right .prof {
		padding-top: 10px;
	}
	.companyBox02 .inner .profArea .right .prof li {
		font-size: 3.4vw;
	}
	.companyBox02 .inner .profArea .right .freee {
		padding-top: 35px;
		text-align: center;
	}
	.companyBox02 .inner .profArea .right .freee a {
		width: 50%;
	}
	.companyBox03 .inner {
		padding: 40px 5vw 30px;
	}
	.companyBox03 .inner .mapTxt {
		padding: 0 0 0;
		font-size: 3.4vw;
	}
	.companyBox03 .inner .add {
		padding-bottom: 30px;
	}
	.companyBox03 .inner .transpor li {
		float: none;
		width: 100%;
		margin-bottom: 20px;
		line-height: 1.3;
	}
	.companyBox03 .inner .transpor li .ttl {
		font-size: 3.5vw;
		padding-bottom: 8px;
	}
	.companyBox03 .inner .transpor li .txt {
		padding-left: 3.5vw;
	}
	.mapArea {
		height: 300px;
		margin-bottom: 20px;
		padding-top: 30px;
	}
}