@charset "UTF-8";

/* KV */
#kv {
	width: 100%;
	margin: 80px auto 0;
	padding: 0;
	display: flex;
	position: relative;
}
	#kv .kv_l {
		width: 50%;
		height: 693px;
		margin: 0;
		padding: 0;
		overflow: hidden;
	}
		#kv .kv_l img {
			width: 100%;
			height: 693px;
			object-fit: cover;
		}
	#kv .kv_r {
		width: 50%;
		height: 693px;
		margin: 0;
		padding: 0;
		overflow: hidden;
	}
		div.video-wrapper {
			aspect-ratio: 1 / 1;
			overflow: hidden;
			position: relative;
			width: 100%;
			height: 693px;
		}
			div.video-wrapper video {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}
				div.video-wrapper video .video-content {
					margin: 0;
					position: absolute;
					top: 43%;
					left: 50%;
					margin-right: -50%;
					transform: translate(-50%, -50%);
					color: #fff;
					text-align: center;
					z-index: -1;
				}
	
				div.video-wrapper-pc video .video-content p {
					max-width: 600px;
					padding: 0 2rem;
				}
	#kv h2 {
		position: absolute;
		width: 100%;
		margin: 0;
		padding: 0;
		font-size: 66px;
		line-height: 120%;
		font-weight: var(--weight-nomal);
		color: #fff;
		text-align: left;
		bottom: 90px;
		left: 25px;
	}
		#kv h2 span {
			display: block;
			margin: 0;
			padding: 0 0 0 5px;
			font-size: 32px;
			line-height: 160%;
			font-weight: var(--weight-nomal);
		}
	#kv h3 {
		position: absolute;
		display: inline-block;
		margin: 0;
		padding: 0;
		font-size: 28px;
		line-height: 100%;
		font-weight: var(--weight-bold2);
		color: #fff;
		text-align: left;
		letter-spacing: 0.1em;
		background: #8a93c8;
		bottom: 40px;
		left: 25px;
	}
	#kv .scroll {
		position: absolute;
		margin: 0;
		padding: 25px 0;
		bottom: 40px;
		right: 80px;
		z-index: 1;
	}
		#kv .scroll span {
			display: inline-block;
			margin: 0;
			padding: 10px 0;
			font-size: 13px;
			line-height: 120%;
			font-weight: var(--weight-nomal);
			color: #fff;
			writing-mode: vertical-rl;
			text-orientation: mixed;
			position: relative;
		}
		#kv .scroll :before {
			position: absolute;
			content: '';
			width: 1px;
			height: 145px;
			margin: 0;
			padding: 0;
			background: #777fbd;
			top: 0;
			left: -7px;
			z-index: 1;
		}
		#kv .scroll :after {
			position: absolute;
			content: '';
			width: 1px;
			height: 145px;
			margin: 0;
			padding: 0;
			background: #fff;
			top: 0;
			left: -7px;
			z-index: 1;
			-webkit-animation: kv_scroll 4s linear 0s infinite;
			animation: kv_scroll 4s linear 0s infinite;
		}

/* 共通 */
div.cont_ttl {
	margin: 0;
	padding: 0;
	text-align: left;
}
	div.cont_ttl h2 {
		margin: 0;
		padding: 0;
		font-size: 40px;
		line-height: 120%;
		font-weight: var(--weight-bold2);
		letter-spacing: 0.05em;
		display: flex;
		align-items: flex-end;
		position: relative;
	}
		div.cont_ttl h2:before {
			position: absolute;
			content: '';
			display: block;
			width: 1000px;
			height: 1px;
			margin: 0;
			padding: 0;
			background: #8a93c8;
			top: 25px;
			left: -1030px;
		}
		div.cont_ttl h2 small {
			margin: 0 0 0 15px;
			padding: 0 0 5px;
			font-size: 16px;
			line-height: 120%;
			font-weight: var(--weight-bold2);
			display: flex;
			align-items: flex-end;
		}
div.cont_txt_jp {
	padding: 0;
	font-size: 18px;
	line-height: 200%;
	font-weight: var(--weight-bold2);
}
div.cont_txt_en {
	padding: 0;
	font-size: 15px;
	line-height: 200%;
	font-weight: var(--weight-bold2);
}
div.contents_in {
	max-width: 1220px;
	margin: 0 auto;
	padding: 0;
}

/* 企業理念 */
#philosophy {
	max-width: 1220px;
	margin: 0 auto;
	padding: 100px 10px 0;
	text-align: left;
}
	#philosophy div.philosophy_cont {
		margin: 0 auto;
		padding: 40px 0 0;
	}
	#philosophy div.cont_txt_en {
		margin: 0;
	}
	#philosophy div.cont_txt_en {
		margin: 50px 0 0;
	}
	#philosophy div.img {
		margin: 100px 0 0;
		padding: 0;
	}

/* 事業概要 */
#business {
	max-width: 1220px;
	margin: 100px auto 0;
	padding: 100px 10px 200px;
	text-align: left;
}
	#business div.business_cont {
		height: 474px;
		margin: 145px auto 0;
		padding: 0;
		text-align: left;
		position: relative;
	}
		#business div.business_cont:nth-of-type(2) {
			margin: 100px auto 0;
		}
		#business div.business_cont div.cont_box {
			width: 628px;
			margin: 0;
			padding: 0 55px 50px 0;
			background: #fff;
			position: relative;
			z-index: 1;
		}
			#business div.business_cont div.cont_box .ttl {
				margin: 0;
				padding: 0;
				display: flex;
				align-items: center;
			}
				#business div.business_cont div.cont_box .ttl span {
					display: inline-block;
					width: 60px;
					height: 60px;
					margin: 0;
					padding: 0;
					font-size: 18px;
					color: #fff;
					display: flex;
					justify-content: center;
					align-items: center;
				}
					#business div.business_cont:nth-of-type(2) div.cont_box .ttl span {
						background: #8a93c8;
						border-radius: 50%;
					}
					#business div.business_cont:nth-of-type(3) div.cont_box .ttl span {
						background: #e5b905;
						border-radius: 50%;
					}
					#business div.business_cont:nth-of-type(4) div.cont_box .ttl span {
						background: #eb5d34;
						border-radius: 50%;
					}
				#business div.business_cont div.cont_box .ttl .sub_ttl {
					margin: 0 0 0 20px;
					padding: 0;
				}
					#business div.business_cont div.cont_box .ttl .sub_ttl h3 {
						margin: 0;
						padding: 0;
						font-size: 28px;
						line-height: 140%;
						font-weight: var(--weight-bold2);
					}
						#business div.business_cont div.cont_box .ttl .sub_ttl h3 small {
							display: block;
							margin: 0;
							padding: 0;
							font-size: 14px;
							line-height: 140%;
							font-weight: var(--weight-bold2);
						}
			#business div.business_cont div.cont_box div.cont_txt_jp {
				margin: 35px 0 0;
			}
			#business div.business_cont div.cont_box div.cont_txt_en {
				margin: 30px 0 0;
			}
		#business div.business_cont div.cont_img {
			position: absolute;
			width: 943px;
			margin: 0;
			padding: 0;
			text-align: right;
			bottom: 0;
			right: -100px;
		}

/* 会社概要 */
#company {
	margin: 0 auto;
	padding: 130px 10px 180px;
	text-align: left;
	background: rgba(216,216,216,0.28);
}
	#company dl {
		max-width: 1000px;
		margin: 50px auto 0;
		padding: 0;
		border-bottom: 1px solid rgba(0,0,0,0.3);
		display: flex;
		flex-wrap: wrap;
	}
		#company dl dt {
			width: 300px;
			margin: 0;
			padding: 40px 15px;
			font-size: 18px;
			line-height: 160%;
			font-weight: var(--weight-bold2);
			border-top: 1px solid rgba(0,0,0,0.3);
			display: flex;
			align-items: flex-start;
		}
			#company dl dt:first-of-type {
				border-top: none;
			}
			#company dl dt p {
				display: inline-block;
				width: 105px;
				margin: 0;
				padding: 0;
				float: left;
			}
			#company dl dt small {
				display: inline-block;
				margin: 0;
				padding: 0.3em 0 0;
				font-size: 14px;
				line-height: 160%;
				font-weight: var(--weight-bold2);
			}
		#company dl dd {
			width: calc(100% - 300px);
			margin: 0;
			padding: 40px 0 40px 10px;
			font-size: 18px;
			line-height: 160%;
			font-weight: var(--weight-bold2);
			border-top: 1px solid rgba(0,0,0,0.3);
			display: flex;
			flex-wrap: wrap;
			align-items: center;
		}
			#company dl dd:first-of-type {
				border-top: none;
			}
			#company dl dd small {
				display: inline-block;
				margin: 0 0 0 30px;
				font-size: 14px;
				line-height: 160%;
				font-weight: var(--weight-bold2);
			}
			#company dl dd ul {
				display: block;
				width: 100%;
				margin: 0;
				padding: 0;
				list-style: none;
			}
				#company dl dd ul li {
					width: 100%;
					margin: 15px 0 0;
					padding: 0 0 0 25px;
					display: flex;
					align-items: center;
					position: relative;
				}
					#company dl dd ul li:before {
						position: absolute;
						content: '・';
						display: inline-block;
						margin: 0;
						padding: 0;
						top: 0;
						left: 0;
					}
					#company dl dd ul li:first-of-type {
						margin-top: 0;
					}

/* お問い合わせ */
#contact {
	margin: 0 auto;
	padding: 130px 10px 180px;
}
	div.cont_tbl {
		width: 850px;
		margin: 80px auto 0;
		padding: 0;
	}
		p.form_top {
			margin: 0;
			padding: 0;
			font-size: 18px;
			line-height: 160%;
			font-weight: var(--weight-bold2);
			text-align: left;
		}
			p.form_top small {
				display: block;
				margin: 15px 0 0;
				font-size: 15px;
				line-height: 160%;
				font-weight: var(--weight-bold2);
			}
		div.form_cont {
			width: 660px;
			margin: 0 auto;
			padding: 0 100px 0;
		}
			div.form_cont dl {
				width: 100%;
				margin: 0 auto;
				padding: 60px 0 0;
				font-size: 18px;
				line-height: 180%;
				font-weight: var(--weight-bold1);
			}
				div.form_cont dl dt {
					width: 100%;
					margin: 40px auto 0;
					padding: 0;
					font-weight: var(--weight-bold2);
				}
					div.form_cont dl dt small {
						display: inline-block;
						margin: 0 0 0 20px;
						font-size: 14px;
						line-height: 160%;
						font-weight: var(--weight-bold2);
					}
				div.form_cont dl dd {
					width: 100%;
					margin: 10px auto 0;
					padding: 10px 0;
				}
					div.form_cont.frame dl dd {
						padding-top: 0;
					}
					div.form_cont dl dd input[type=text],
					div.form_cont dl dd input[type=tel],
					div.form_cont dl dd input[type=email] {
						width: 100%;
						height: 60px;
						padding: 10px 20px;
						font-size: 18px;
						line-height: 180%;
						font-weight: var(--weight-noaml);
						font-family	: inherit;
						border: 1px solid #b2b2b2;
						border-radius: 20px;
					}
					div.form_cont dl dd textarea {
						width: 100%;
						height: 295px;
						padding: 10px 20px;
						font-size: 18px;
						line-height: 180%;
						font-weight: var(--weight-noaml);
						font-family	: inherit;
						border: 1px solid #b2b2b2;
						border-radius: 20px;
					}
					div.form_cont input[type=radio] {
						margin: 0 10px 0 0;
						width: 40px;
						height: 40px;
						vertical-align: -1.8em;
					}
					div.form_cont input[type=checkbox] {
						margin: 0 10px 0 0;
						width: 40px;
						height: 40px;
						border: none;
						background: #e6e6e6;
						vertical-align: -1.8em;
						position: relative;
						-webkit-appearance: none;
						-moz-appearance: none;
						appearance: none;
					}
						div.form_cont input[type=checkbox]:checked:before {
							position: absolute;
							content: '';
							top: 8px;
							left: 16px;
							transform: rotate(50deg);
							width: 8px;
							height: 16px;
							border-right: 2px solid #000;
							border-bottom: 2px solid #000;
						}
					div.form_cont div.privacy_link {
						margin: 10px auto 0;
						padding: 0 0 0 30px;
						display: flex;
					}
						div.form_cont div.privacy_link label {
							margin: 0;
							padding: 0;
						}
						div.form_cont div.privacy_link p {
							display: inline-block;
							font-size: 18px;
							line-height: 120%;
							font-weight: var(--weight-bold2);
							text-align: left;
						}
							div.form_cont div.privacy_link p .openModal {
								display: inline-block;
								margin: 0;
								color: #3c51cb;
								text-decoration: underline;
								cursor: pointer;
							}
							div.form_cont div.privacy_link p small {
								display: block;
								margin: 0;
								font-size: 14px;
								line-height: 160%;
								font-weight: var(--weight-bold2);
							}
			#contact_btn {
				width: 100%;
				margin: 0 auto;
				padding: 70px 0 0;
				display: flex;
				justify-content: center;
			}
				#contact_btn div.form_btn1,
				#contact_btn div.form_btn2 {
					display: inline-block;
					width: 410px;
					height: 78px;
					margin: 0 10px;
					transition: 0.2s linear;
				}
					#contact_btn div.form_btn1 button {
						display: block;
						width: 410px;
						height: 78px;
						font-size: 20px;
						line-height: 180%;
						margin: 0 auto;
						padding: 0;
						font-family	: inherit;
						color: #1F1F1F;
						font-weight: var(--weight-bold2);
						background: #fff;
						border: 1px solid #232323;
						border-radius: 39px;
						cursor: pointer;
						transition: 0.2s linear;
					}
					#contact_btn div.form_btn1 button:hover {
						color: #fff;
						background: #232323;
					}
					#contact_btn div.form_btn2 button {
						display: block;
						width: 410px;
						height: 78px;
						font-size: 20px;
						line-height: 180%;
						margin: 0 auto;
						padding: 0;
						font-family	: inherit;
						color: #1F1F1F;
						font-weight: var(--weight-bold2);
						background: #eee;
						border: 1px solid #232323;
						border-radius: 39px;
						cursor: pointer;
						transition: 0.2s linear;
					}
					#contact_btn div.form_btn2 button:hover {
						color: #fff;
						background: #444;
					}

#copy {
	width: 100%;
	margin: 0 auto;
	padding: 0 60px 40px 0;
	font-size: 14px;
	line-height: 180%;
	font-family: "Roboto", sans-serif;
	text-align: right;
	font-style: italic;
}