@charset "UTF-8";


	
	
/* fv
--------------------- */
#fv {
	overflow: hidden;
	position: relative;
}
	#fv .text {
		position: absolute;
		bottom: calc(80 * var(--vw-ratio));
		left: 0;
		z-index: 3;
	}
		#fv .text h2 {
			font-size: calc(60 * var(--vw-ratio));
			font-weight: 700;
			line-height: calc(80 * var(--vw-ratio));
			padding-left: calc(100 * var(--vw-ratio));
			position: relative;
		}
		#fv .text h2:before {
			content: "";
			width: calc(390 * var(--vw-ratio));
			height: calc(75 * var(--vw-ratio));
			background-image: linear-gradient(90deg, transparent, #1481c2 83% 100%);
			position: absolute;
			top: calc(85 * var(--vw-ratio));
			left: 0;
			z-index: -1;
		}
			#fv .text h2 span {
				font-size: calc(48 * var(--vw-ratio));
				padding: 0 calc(20 * var(--vw-ratio)) 0 calc(10 * var(--vw-ratio));
			}

	#fv .loopSlider {
		height: calc(780 * var(--vw-ratio));
		overflow: hidden;
		position: relative;
	}
		#fv .loopSlider .loopslider_wrap {
			height: calc(780 * var(--vw-ratio));
			display: -webkit-flex;
			display: flex;
			position: absolute;
			top: 0;
			left: 0;
			z-index: 1;
		}
			#fv .loopSlider .loopslider_wrap ul {
				display: -webkit-flex;
				display: flex;
			}
				#fv .loopSlider .loopslider_wrap ul li {
					width: calc(780 * var(--vw-ratio));
					border-radius: calc(20 * var(--vw-ratio));
					overflow: hidden;
					margin: calc(10 * var(--vw-ratio)) calc(5 * var(--vw-ratio)) 0 calc(5 * var(--vw-ratio));
					background: #000;
				}
					#fv .loopSlider .loopslider_wrap ul li img {
						opacity: 0.95;
					}
@media screen and (max-width: 767px) {
	#fv .text {
		bottom: calc(30 * var(--vw-ratio));
	}
		#fv .text h2 {
			font-size: calc(40 * var(--vw-ratio));
			line-height: calc(56 * var(--vw-ratio));
			padding-left: calc(30 * var(--vw-ratio));
		}
		#fv .text h2:before {
			width: calc(244 * var(--vw-ratio));
			height: calc(60 * var(--vw-ratio));
			top: calc(58 * var(--vw-ratio));
		}
			#fv .text h2 span {
				font-size: calc(36 * var(--vw-ratio));
			}

	#fv .loopSlider {
		height: calc(600 * var(--vw-ratio));
	}
		#fv .loopSlider .loopslider_wrap {
			height: calc(600 * var(--vw-ratio));
		}
			#fv .loopSlider .loopslider_wrap ul li {
				width: calc(600 * var(--vw-ratio));
			}
}


	
	
/* message
--------------------- */
#message {
	position: relative;
	overflow: hidden;
	background: url("../img/recruit/message_bg.svg") no-repeat center / 100%;
}
	#message .motif01 {
		top: calc(200 * var(--vw-ratio));
		left: calc(-200 * var(--vw-ratio));
	}
	#message .motif02 {
		bottom: calc(234 * var(--vw-ratio));
		right: calc(220 * var(--vw-ratio));
	}

	#message .inner {
		display: flex;
		justify-content: center;
		align-items: center;
	}
		#message .text .txt-18 {
			margin-bottom: calc(20 * var(--vw-ratio));
		}
		#message .text .txt-18:nth-last-child(1) {
			margin-bottom: 0;
		}

	#message .marquee {
		display: flex;
		width: 100%;
		overflow: hidden;
		color: #1481C2;
		position: absolute;
		top: 50%;
		left: 0;
		margin-top: calc(-80 * var(--vw-ratio));
		z-index: -1;
	}
		#message .marquee .marquee__item {
			flex: 0 0 auto;
			overflow: hidden;
			font-size: calc(150 * var(--vw-ratio));
			font-weight: 700;
			white-space: nowrap;
			line-height: 1;
			padding-right: calc(20 * var(--vw-ratio));
		}
		#message .marquee .marquee__item:nth-child(odd) {
			animation: loop 100s -50s linear infinite;
		}
		#message .marquee .marquee__item:nth-child(even) {
			animation: loop2 100s linear infinite;
		}
		@keyframes loop {
			0% {
				transform: translateX(100%);
			}
			to {
				transform: translateX(-100%);
			}
		}
		@keyframes loop2 {
			0% {
				transform: translateX(0);
			}
			to {
				transform: translateX(-200%);
			}
		}
@media screen and (max-width: 767px) {
	#message {
		background: none;
	}
		#message .motif01 {
			top: calc(81 * var(--vw-ratio));
			left: calc(-20 * var(--vw-ratio));
		}
		#message .motif02 {
			bottom: calc(252 * var(--vw-ratio));
			right: 0;
		}

		#message .inner {
			display: block;
			padding-bottom: calc(40 * var(--vw-ratio));
		}
			#message .text .txt-18 {
				font-size: calc(16 * var(--vw-ratio));
				line-height: 1.8em;
				margin-bottom: calc(15 * var(--vw-ratio));
			}
			#message .text .txt-18:nth-last-child(1) {
				margin-bottom: 0;
			}

		#message .marquee {
			top: auto;
			bottom: calc(-10 * var(--vw-ratio));
			margin-top: 0;
		}
			#message .marquee .marquee__item {
				font-size: calc(80 * var(--vw-ratio));
			}
}


	
	
/* about
--------------------- */
#about {
	width: -webkit-calc(100% - calc(15 * var(--vw-ratio)));
	width: calc(100% - calc(15 * var(--vw-ratio)));
	border-radius: calc(30 * var(--vw-ratio));
	background: #1481C2;
	margin: 0 auto;
	position: relative;
}
#about:before {
	content: "";
	width: 100%;
	height: 30%;
	background: #EDF5FA;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: -1;
}
#about .inner {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
	#about .motif01 {
		top: calc(120 * var(--vw-ratio));
		right: calc(260 * var(--vw-ratio));
	}
	#about .motif02 {
		bottom: calc(200 * var(--vw-ratio));
		left: calc(220 * var(--vw-ratio));
	}

	#about .text {
		width: 35%;
	}
		#about .text .pht {
			margin-top: calc(60 * var(--vw-ratio));
			margin-left: calc(-110 * var(--vw-ratio));
			overflow: hidden;
			border-radius: 0 calc(30 * var(--vw-ratio)) calc(30 * var(--vw-ratio)) 0;
		}

	#about .list {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		width: 57%;
		margin-top: calc(150 * var(--vw-ratio));
	}
		#about .list a.linkbox {
			display: block;
			width: 47%;
			border: solid 1px #fff;
			border-radius: calc(20 * var(--vw-ratio));
			padding: 0 calc(35 * var(--vw-ratio)) calc(35 * var(--vw-ratio)) calc(35 * var(--vw-ratio));
		}
		#about .list a.linkbox:nth-last-child(1) {
			margin-top: calc(80 * var(--vw-ratio));
		}
		#about .list a.linkbox:hover {
			background: #fff;
			color: #1481C2;
		}
			#about .list a.linkbox .head {
				font-weight: 700;
				line-height: 1;
				margin-bottom: calc(30 * var(--vw-ratio));
			}

			#about .list a.linkbox h3 {
				font-size: calc(24 * var(--vw-ratio));
				font-weight: 700;
				line-height: 1.3em;
				margin-bottom: calc(30 * var(--vw-ratio));
			}

			#about .list a.linkbox .read {
				margin-bottom: calc(30 * var(--vw-ratio));
			}

			#about .list a.linkbox:hover .more {
				background: url("../img/common/icon_external_blue.svg") no-repeat right center / calc(50 * var(--vw-ratio));
				color: #1481C2;
			}
@media screen and (max-width: 767px) {
	#about .inner {
		display: block;
	}
		#about .motif01 {
			top: calc(78 * var(--vw-ratio));
			left: 0;
			right: auto;
		}
		#about .motif02 {
			top: calc(540 * var(--vw-ratio));
			bottom: auto;
			left: auto;
			right: 0;
			z-index: 2;
		}

		#about .text {
			width: 100%;
		}
			#about .text .pht {
				margin-top: calc(35 * var(--vw-ratio));
				margin-left: calc(-40 * var(--vw-ratio));
				border-radius: 0 calc(20 * var(--vw-ratio)) calc(20 * var(--vw-ratio)) 0;
			}

		#about .list {
			display: block;
			width: 100%;
			margin-top: calc(40 * var(--vw-ratio));
		}
			#about .list a.linkbox {
				width: 100%;
			}
			#about .list a.linkbox:nth-last-child(1) {
				margin-top: calc(35 * var(--vw-ratio));
			}
				#about .list a.linkbox .head {
					margin-bottom: calc(25 * var(--vw-ratio));
				}

				#about .list a.linkbox h3 {
					margin-bottom: calc(25 * var(--vw-ratio));
				}

				#about .list a.linkbox .read {
					margin-bottom: calc(25 * var(--vw-ratio));
				}
}


	
	
/* work-people
--------------------- */
#work-people {
	background: #EDF5FA url("../img/recruit/bg_circle.svg") no-repeat center bottom / 100%;
	position: relative;
}
	#work-people .motif01 {
		top: calc(510 * var(--vw-ratio));
		left: calc(-280 * var(--vw-ratio));
		z-index: 2;
	}
	#work-people .motif02 {
		top: calc(170 * var(--vw-ratio));
		right: 0;
		z-index: 2;
	}

	#work-people .head-tit {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: calc(30 * var(--vw-ratio));
		position: relative;
	}
		#work-people .head-tit .en {
			font-size: calc(54 * var(--vw-ratio));
			font-weight: 700;
			line-height: 1.0em;
		}
		#work-people .head-tit h2 {
			font-size: calc(24 * var(--vw-ratio));
			font-weight: 700;
			line-height: 1;
		}

	#work-people .job {
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: calc(-30 * var(--vw-ratio));
		padding-bottom: calc(130 * var(--vw-ratio));
		margin-bottom: calc(70 * var(--vw-ratio));
		border-bottom: dashed 2px #D0E6F4;
		position: relative;
	}
		#work-people .job .pht {
			border-radius: calc(20 * var(--vw-ratio));
			position: absolute;
		}
		#work-people .job .pht01 {
			width: calc(270 * var(--vw-ratio));
			top: calc(60 * var(--vw-ratio));
			left: 0;
		}
		#work-people .job .pht02 {
			width: calc(270 * var(--vw-ratio));
			top: calc(-190 * var(--vw-ratio));
			right: calc(130 * var(--vw-ratio));
		}
		#work-people .job .pht03 {
			width: calc(190 * var(--vw-ratio));
			bottom: calc(60 * var(--vw-ratio));
			right: calc(30 * var(--vw-ratio));
		}

		#work-people .job .text {
			width: calc(420 * var(--vw-ratio));
		}
			#work-people .job .text .head-tit h2 {
				position: absolute;
				top: calc(15 * var(--vw-ratio));
				left: calc(120 * var(--vw-ratio));
			}

			#work-people .job .text .txt-16 {
				margin-bottom: calc(35 * var(--vw-ratio));
			}

	#work-people .interview .list a.linkbox {
		display: block;
		width: 31%;
	}
		#work-people .interview .list a.linkbox .pht {
			border-radius: calc(20 * var(--vw-ratio));
			position: relative;
		}
			#work-people .interview .list a.linkbox .pht .label {
				width: calc(150 * var(--vw-ratio));
				height: calc(38 * var(--vw-ratio));
				background: #fff;
				font-weight: 700;
				line-height: calc(37 * var(--vw-ratio));
				text-align: center;
				border-radius: 0 calc(20 * var(--vw-ratio)) 0 calc(20 * var(--vw-ratio));
				position: absolute;
				bottom: 0;
				left: 0;
				z-index: 2;
			}

		#work-people .interview .list a.linkbox .text {
			padding-top: calc(12 * var(--vw-ratio));
		}
			#work-people .interview .list a.linkbox .text h3 {
				font-size: calc(30 * var(--vw-ratio));
				font-weight: 700;
				line-height: 1.3em;
				margin-bottom: calc(3 * var(--vw-ratio));
			}

			#work-people .interview .list a.linkbox .text .txt-18 {
				line-height: 1;
				margin-bottom: calc(15 * var(--vw-ratio));
			}
@media screen and (max-width: 767px) {
	#work-people {
		background: #EDF5FA url("../img/recruit/bg_circle.svg") no-repeat center bottom / 100%;
	}
		#work-people .motif01 {
			top: calc(80 * var(--vw-ratio));
			left: 0;
			z-index: 0;
		}
		#work-people .motif02 {
			top: calc(570 * var(--vw-ratio));
		}

		#work-people .head-tit {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-bottom: calc(25 * var(--vw-ratio));
		}
			#work-people .head-tit .en {
				font-size: calc(38 * var(--vw-ratio));
				line-height: 1.1em;
			}
			#work-people .head-tit h2 {
				font-size: calc(20 * var(--vw-ratio));
			}

		#work-people .job {
			display: block;
			margin-top: 0;
			padding-bottom: calc(50 * var(--vw-ratio));
			margin-bottom: calc(40 * var(--vw-ratio));
		}
			#work-people .job .pht01 {
				width: 100%;
				position: relative;
				top: auto;
				margin-top: calc(35 * var(--vw-ratio));
			}
			#work-people .job .pht02,
			#work-people .job .pht03 {
				display: none;
			}

			#work-people .job .text {
				width: 100%;
			}
				#work-people .job .text .head-tit h2 {
					top: calc(12 * var(--vw-ratio));
					left: calc(95 * var(--vw-ratio));
				}

				#work-people .job .text .txt-16 {
					margin-bottom: calc(30 * var(--vw-ratio));
				}

		#work-people .interview .list {
			display: block;
		}
			#work-people .interview .list a.linkbox {
				width: 100%;
				margin-bottom: calc(40 * var(--vw-ratio));
			}
			#work-people .interview .list a.linkbox:nth-last-child(1) {
				margin-bottom: 0;
			}
				#work-people .interview .list a.linkbox .pht .label {
					width: calc(140 * var(--vw-ratio));
					height: calc(34 * var(--vw-ratio));
					font-size: calc(16 * var(--vw-ratio));
					line-height: calc(34 * var(--vw-ratio));
				}
}


	
	
/* environment
--------------------- */
#environment {
	position: relative;
}
	#environment .motif01 {
		bottom: calc(280 * var(--vw-ratio));
		left: 0;
		z-index: 2;
	}
	#environment .motif02 {
		bottom: calc(100 * var(--vw-ratio));
		right: calc(200 * var(--vw-ratio));
		z-index: 2;
	}

	#environment .area {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: calc(65 * var(--vw-ratio));
	}

	#environment .pht {
		width: 100%;
		height: 100%;
		border-radius: calc(30 * var(--vw-ratio));
		overflow: hidden;
		aspect-ratio: 16 / 6;
	}
		#environment .pht img {
			width: 100%;
			height: 100%;
			object-fit: cover;
		}
@media screen and (max-width: 767px) {
	#environment .motif01 {
		top: calc(80 * var(--vw-ratio));
		bottom: auto;
		left: 0;
		z-index: 0;
	}
	#environment .motif02 {
		bottom: calc(100 * var(--vw-ratio));
		right: 0;
		z-index: 2;
	}

	#environment .area {
		display: block;
		margin-bottom: calc(35 * var(--vw-ratio));
	}
		#environment .area .txt-16 {
			margin-bottom: calc(30 * var(--vw-ratio));
		}

	#environment .pht {
		border-radius: calc(20 * var(--vw-ratio));
		aspect-ratio: 4 / 3;
	}
}


	
	
/* recruit
--------------------- */
#recruit .list a.linkbox {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-top: solid 1px #ddd;
	padding: calc(60 * var(--vw-ratio)) calc(30 * var(--vw-ratio));
}
#recruit .list a.linkbox:hover {
	background: #EDF5FA;
}
#recruit .list a.linkbox:nth-last-child(1) {
	border-bottom: solid 1px #ddd;
}
	#recruit .list a.linkbox h3 {
		width: calc(280 * var(--vw-ratio));
		font-size: calc(24 * var(--vw-ratio));
		font-weight: 700;
		line-height: 1.3em;
	}

	#recruit .list a.linkbox .txt-14 {
		width: calc(560 * var(--vw-ratio));
		transition: 0.3s;
		-webkit-transition: 0.3s;
	}
	#recruit .list a.linkbox:hover .txt-14 {
		width: calc(565 * var(--vw-ratio));
	}

	#recruit .list a.linkbox .more {
		width: calc(150 * var(--vw-ratio));
	}
	#recruit .list a.linkbox:hover .more {
		width: calc(145 * var(--vw-ratio));
	}
@media screen and (max-width: 767px) {
	#recruit .list a.linkbox {
		display: block;
		padding: calc(40 * var(--vw-ratio)) calc(30 * var(--vw-ratio));
	}
		#recruit .list a.linkbox h3 {
			width: 100%;
			font-size: calc(22 * var(--vw-ratio));
			margin-bottom: calc(15 * var(--vw-ratio));
		}

		#recruit .list a.linkbox .txt-14 {
			width: 100%;
		}
		#recruit .list a.linkbox:hover .txt-14 {
			width: 100%;
		}

		#recruit .list a.linkbox .more {
			width: auto;
			margin-top: calc(25 * var(--vw-ratio));
		}
		#recruit .list a.linkbox:hover .more {
			width: auto;
		}
}