@charset "UTF-8";
/*
 * company.css
 *
 */

/* !代表挨拶
---------------------------------------------------------- */
.greeting {
	width:100%;
	padding:0 50px 50px 50px;
}
	.greeting div.inner {
		width:100%;
		max-width:1240px;
		margin:0 auto;
	}
		.greeting div.inner p.enTit {
			font-size:16px;
			font-weight: 600;
			color: #007EC0;
			letter-spacing: 0.04em;
			position: relative;
			padding-left:16px;
		}
			.greeting div.inner p.enTit:before {
				position: absolute;
				content:"";
				width:5px;
				height: 5px;
				background: #FDD000;
				border-radius: 50%;
				top:47%;
				left:0;
			}
		.greeting div.inner h2 {
			font-size:40px;
			font-weight: 600;
			line-height: 1.6;
			margin-bottom: 50px;
		}
		.greeting div.inner h3.philosophy {
			font-size:60px;
			font-weight: 600;
			line-height: 1.6;
			color: #004E8A;
			margin-bottom: 50px;
		}
			.greeting div.inner h3.philosophy br {
				display: none;
			}
		.greeting div.inner h3.copy {
			font-size:30px;
			font-weight: 600;
			line-height: 1.6;
			margin-bottom: 40px;
		}
			.greeting div.inner h3.copy br {
				display: none;
			}
		.greeting div.inner p.read {
			margin-bottom: 30px;
		}

.greeting2 {
	width:100%;
	height: 500px;
	background: url("../../company/img/greeting_img.jpg") 50% 50% no-repeat;
	background-size: cover;
	padding:0 50px;
	position: relative;
}
	.greeting2 div.inner {
		width:100%;
		max-width: 1240px;
		padding-top:180px;
		margin: 0 auto;
		position: relative;
		z-index: 1;
	}
		.greeting2 div.inner p.sign {
			font-size:18px;
			color: #004E8A;
			letter-spacing: 0.04em;
			margin-left: 30%;
		}
			.greeting2 div.inner p.sign span {
				font-size:140%;
			}
	.greeting2 div.bgBtm {
		position: absolute;
		display: block;
		width:100%;
		line-height: 1;
		bottom: -2px;
		left: 0;
		z-index: 2;
	}

@media screen and (max-width:1039px){
.greeting {
	padding:0 30px 40px 30px;
}
		.greeting div.inner p.enTit {
			font-size:15px;
			padding-left:16px;
		}
		.greeting div.inner h2 {
			font-size:36px;
			margin-bottom: 45px;
		}
		.greeting div.inner h3.philosophy {
			font-size:50px;
			margin-bottom: 45px;
		}
		.greeting div.inner h3.copy {
			font-size:26px;
			margin-bottom: 35px;
		}
	
.greeting2 {
	height: 350px;
	padding:0 30px;
}
	.greeting2 div.inner {
		padding-top:140px;
	}
		.greeting2 div.inner p.sign {
			font-size:16px;
			margin-left: 24%;
		}
}

@media screen and (max-width:767px){
.greeting {
	padding:0 25px 10px 25px;
}
		.greeting div.inner p.enTit {
			font-size:14px;
			padding-left:14px;
		}
			.greeting div.inner p.enTit:before {
				top:48%;
			}
		.greeting div.inner h2 {
			font-size:26px;
			margin-bottom: 35px;
		}
		.greeting div.inner h3.philosophy {
			font-size:34px;
			margin-bottom: 35px;
		}
			.greeting div.inner h3.philosophy br {
				display: inherit;
			}
		.greeting div.inner h3.copy {
			font-size:20px;
			margin-bottom: 30px;
		}
			.greeting div.inner h3.copy br {
				display: inherit;
			}
	
.greeting2 {
	height: 200px;
	padding:0 25px;
}
	.greeting2 div.inner {
		padding-top:80px;
	}
		.greeting2 div.inner p.sign {
			font-size:14px;
			margin-left: 0;
		}
			.greeting2 div.inner p.sign span {
				font-size:140%;
			}
}

/* !ミッション
---------------------------------------------------------- */
.missionWrap {
	width:100%;
	position: relative;
}
.missionWrap div.bgTop {
	display: block;
	width:100%;
	line-height: 1;
	margin-bottom: -2px;
}
.missionWrap div.bgBtm {
	display: block;
	width:100%;
	line-height: 1;
}
.mission {
	width:100%;
	background: #EFF7FC;
	padding:80px 50px 80px 50px;
}
	.mission div.missionBox {
		width:100%;
		max-width: 1240px;
		background: #FFF;
		display: flex;
		padding:60px 60px 60px 60px;
		border-radius: 16px;
		margin: 0 auto 30px auto;
	}
		.mission div.missionBox div.left {
			width:32%;
		}
		.mission div.missionBox div.left p.enTit {
			font-size:16px;
			font-weight: 600;
			color: #007EC0;
			letter-spacing: 0.04em;
			position: relative;
			padding-left:16px;
		}
			.mission div.missionBox div.left p.enTit:before {
				position: absolute;
				content:"";
				width:5px;
				height: 5px;
				background: #FDD000;
				border-radius: 50%;
				top:47%;
				left:0;
			}
		.mission div.missionBox div.left h2 {
			font-size:40px;
			font-weight: 600;
			line-height: 1.6;
		}
		.mission div.missionBox div.right {
			width:68%;
		}
		.mission div.missionBox div.right h3 {
			font-size:20px;
			font-weight: 600;
			line-height: 1.8;
			margin-bottom: 30px;
		}
		.mission div.missionBox div.right img.visionFig {
			display: block;
			max-width:270px;
			margin: 30px auto 0 auto;
		}
		.mission div.missionBox div.right ul.valueBox {
			width:100%;
		}
			.mission div.missionBox div.right ul.valueBox li {
				width:100%;
				padding:20px;
				background: #EFF7FC;
				border-radius: 4px;
				display: flex;
				margin-bottom: 10px;
			}
			.mission div.missionBox div.right ul.valueBox li:last-child {
				margin-bottom: 0;
			}
				.mission div.missionBox div.right ul.valueBox li h4 {
					width:130px;
					font-size:20px;
					font-weight: 600;
					color: #004E8A;
					line-height: 1.3;
				}
				.mission div.missionBox div.right ul.valueBox li p {
					display: block;
					width:calc(100% - 130px);
					padding-left:40px;
					line-height: 1.6;
					position: relative;
				}
					.mission div.missionBox div.right ul.valueBox li p:before {
						position: absolute;
						content:"";
						width:20px;
						height: 1px;
						background: #2E363B;
						top:14px;
						left:0;
					}

@media screen and (max-width:1039px){
.mission {
	padding:70px 30px 70px 30px;
}
	.mission div.missionBox {
		padding:50px 40px 50px 40px;
		margin: 0 auto 30px auto;
	}
		.mission div.missionBox div.left {
			width:30%;
		}
		.mission div.missionBox div.left p.enTit {
			font-size:15px;
		}
		.mission div.missionBox div.left h2 {
			font-size:32px;
		}
		.mission div.missionBox div.right {
			padding-left:40px;
		}
		.mission div.missionBox div.right h3 {
			font-size:18px;
		}
		.mission div.missionBox div.right img.visionFig {
			max-width:250px;
		}
				.mission div.missionBox div.right ul.valueBox li h4 {
					width:110px;
					font-size:18px;
				}
				.mission div.missionBox div.right ul.valueBox li p {
					width:calc(100% - 110px);
					padding-left:35px;
				}
					.mission div.missionBox div.right ul.valueBox li p:before {
						top:13px;
					}
}
	
@media screen and (max-width:767px){
.mission {
	padding:60px 25px 60px 25px;
}
	.mission div.missionBox {
		flex-wrap: wrap;
		padding:30px 20px 30px 20px;
		border-radius: 12px;
		margin: 0 auto 20px auto;
	}
		.mission div.missionBox div.left {
			width:100%;
			margin-bottom: 30px;
		}
		.mission div.missionBox div.left p.enTit {
			font-size:14px;
			padding-left:14px;
		}
			.mission div.missionBox div.left p.enTit:before {
				top:48%;
			}
		.mission div.missionBox div.left h2 {
			font-size:26px;
		}
		.mission div.missionBox div.right {
			width:100%;
			padding-left:0;
			border-left:0;
		}
		.mission div.missionBox div.right h3 {
			font-size:16px;
			margin-bottom: 25px;
		}
		.mission div.missionBox div.right img.visionFig {
			max-width:200px;
			margin: 20px auto 0 auto;
		}
				.mission div.missionBox div.right ul.valueBox li h4 {
					width:80px;
					font-size:15px;
					line-height: 1.4;
				}
				.mission div.missionBox div.right ul.valueBox li p {
					width:calc(100% - 80px);
					padding-left:20px;
				}
					.mission div.missionBox div.right ul.valueBox li p:before {
						display: none;
					}
}


/* !会社概要
---------------------------------------------------------- */
.profile {
	width:100%;
	padding:80px 50px 0 50px;
}
	.profile div.inner {
		width:100%;
		max-width:1240px;
		margin:0 auto;
	}
		.profile div.inner p.enTit {
			font-size:16px;
			font-weight: 600;
			color: #007EC0;
			letter-spacing: 0.04em;
			position: relative;
			padding-left:16px;
		}
			.profile div.inner p.enTit:before {
				position: absolute;
				content:"";
				width:5px;
				height: 5px;
				background: #FDD000;
				border-radius: 50%;
				top:47%;
				left:0;
			}
		.profile div.inner h2 {
			font-size:40px;
			font-weight: 600;
			line-height: 1.6;
			margin-bottom: 50px;
		}

@media screen and (max-width:1039px){
.profile {
	padding:70px 30px 0 30px;
}
		.profile div.inner p.enTit {
			font-size:15px;
			padding-left:16px;
		}
		.profile div.inner h2 {
			font-size:36px;
			margin-bottom: 45px;
		}
}

@media screen and (max-width:767px){
.profile {
	padding:60px 25px 0 25px;
}
		.profile div.inner p.enTit {
			font-size:14px;
			padding-left:14px;
		}
			.profile div.inner p.enTit:before {
				top:48%;
			}
		.profile div.inner h2 {
			font-size:26px;
			margin-bottom: 35px;
		}
}

/* !沿革
---------------------------------------------------------- */
.history {
	width:100%;
	padding:100px 50px 0 50px;
}
	.history div.inner {
		width:100%;
		max-width:1240px;
		margin:0 auto;
	}
		.history div.inner p.enTit {
			font-size:16px;
			font-weight: 600;
			color: #007EC0;
			letter-spacing: 0.04em;
			position: relative;
			padding-left:16px;
		}
			.history div.inner p.enTit:before {
				position: absolute;
				content:"";
				width:5px;
				height: 5px;
				background: #FDD000;
				border-radius: 50%;
				top:47%;
				left:0;
			}
		.history div.inner h2 {
			font-size:40px;
			font-weight: 600;
			line-height: 1.6;
			margin-bottom: 50px;
		}
		.history div.inner dl {
			width:100%;
			position: relative;
			display: flex;
			flex-wrap: wrap;
		}
		.history div.inner dl:before {
			position: absolute;
			content:"";
			width:24px;
			height: 100%;
			background: #EFF7FC;
			border-radius: 12px;
			top:0;
			left:0;
		}
			.history div.inner dl dt {
				width:260px;
				position: relative;
				padding-left:60px;
				font-size:20px;
				color: #004E8A;
				line-height: 1.5;
				margin: 10px 0;
			}
				.history div.inner dl dt:before {
					position: absolute;
					content:"";
					width:16px;
					height: 16px;
					background: #0B6DA1;
					border-radius: 50%;
					top:10px;
					left:4px;
				}
			.history div.inner dl dd {
				width:calc(100% - 260px);
				margin: 10px 0;
			}

@media screen and (max-width:1039px){
.history {
	padding:80px 30px 0 30px;
}
		.history div.inner p.enTit {
			font-size:15px;
			padding-left:16px;
		}
		.history div.inner h2 {
			font-size:36px;
			margin-bottom: 45px;
		}
			.history div.inner dl dt {
				width:200px;
				font-size:18px;
				line-height: 1.6;
			}
				.history div.inner dl dt:before {
					top:10px;
				}
			.history div.inner dl dd {
				width:calc(100% - 200px);
			}
}

@media screen and (max-width:767px){
.history {
	padding:70px 25px 0 25px;
}
		.history div.inner p.enTit {
			font-size:14px;
			padding-left:14px;
		}
			.history div.inner p.enTit:before {
				top:48%;
			}
		.history div.inner h2 {
			font-size:26px;
			margin-bottom: 35px;
		}
		.history div.inner dl:before {
			width:20px;
		}
			.history div.inner dl dt {
				width:120px;
				padding-left:30px;
				font-size:14px;
				line-height: 1.8;
			}
				.history div.inner dl dt:before {
					width:12px;
					height: 12px;
					top:8px;
					left:4px;
				}
			.history div.inner dl dd {
				width:calc(100% - 120px);
				line-height: 1.8;
			}
}

/* !グループ企業
---------------------------------------------------------- */
.group {
	width:100%;
	padding:100px 50px 20px 50px;
}
	.group div.inner {
		width:100%;
		max-width:1240px;
		margin:0 auto;
	}
		.group div.inner p.enTit {
			font-size:16px;
			font-weight: 600;
			color: #007EC0;
			letter-spacing: 0.04em;
			position: relative;
			padding-left:16px;
		}
			.group div.inner p.enTit:before {
				position: absolute;
				content:"";
				width:5px;
				height: 5px;
				background: #FDD000;
				border-radius: 50%;
				top:47%;
				left:0;
			}
		.group div.inner h2 {
			font-size:40px;
			font-weight: 600;
			line-height: 1.6;
			margin-bottom: 50px;
		}
		.group div.inner img.groupFig {
			display: block;
			width:100%;
			max-width: 500px;
			margin: 0 auto;
		}

@media screen and (max-width:1039px){
.group {
	padding:80px 30px 10px 30px;
}
		.group div.inner p.enTit {
			font-size:15px;
			padding-left:16px;
		}
		.group div.inner h2 {
			font-size:36px;
			margin-bottom: 45px;
		}
		.group div.inner img.groupFig {
			max-width: 400px;
			margin: 0 auto;
		}
}

@media screen and (max-width:767px){
.group {
	padding:70px 25px 10px 25px;
}
		.group div.inner p.enTit {
			font-size:14px;
			padding-left:14px;
		}
			.group div.inner p.enTit:before {
				top:48%;
			}
		.group div.inner h2 {
			font-size:26px;
			margin-bottom: 35px;
		}
		.group div.inner img.groupFig {
			max-width: 320px;
		}
}
