@charset "UTF-8";


	

	
/* pagetitle
--------------------- */
#pagetitle.work-flow {
	background: url("../img/work-flow/pagetitle_pht.webp") no-repeat center / cover;
}


	

	
/* visual
--------------------- */
#visual {
	padding-top: 170px;
	position: relative;
}
#visual:before {
	content: "";
	width: 100%;
	height: 15%;
	background: #fff;
	position: absolute;
	bottom: 0;
	left: 0;
}
	#visual .text {
		width: 47%;
	}
		#visual .text .head {
			font-size: 15.0rem;
			font-weight: 500;
			line-height: 1;
			letter-spacing: 0;
			margin-top: -90px;
			margin-left: -110px;
			margin-bottom: 50px;
		}

		#visual .text .catch {
			font-size: 4.0rem;
			font-weight: 700;
			line-height: 1.5em;
			border-left: solid 1px #fff;
			padding-left: 30px;
			margin-bottom: 70px;
		}

		#visual .text .info .name {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 50%;
			min-height: 220px;
			background: #0093D7;
			position: relative;
		}
		#visual .text .info .name:before {
			content: "Name";
			font-family: "Jost", sans-serif;
			font-size: 1.6rem;
			font-weight: 500;
			line-height: 1;
			color: #fff;
			opacity: 0.5;
			position: absolute;
			top: 10px;
			left: 10px;
		}
			#visual .text .info .name h1 {
				font-size: 4.0rem;
				font-weight: 500;
				line-height: 1;
			}

		#visual .text .info .profile {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 50%;
			min-height: 220px;
			background: #002153;
			position: relative;
			padding: 15px;
		}
		#visual .text .info .profile:before {
			content: "Profile";
			font-family: "Jost", sans-serif;
			font-size: 1.6rem;
			font-weight: 500;
			line-height: 1;
			color: #fff;
			opacity: 0.5;
			position: absolute;
			top: 10px;
			left: 10px;
		}
			#visual .text .info .profile .job {
				font-size: 1.4rem;
				font-weight: 500;
				line-height: 1.8em;
				text-align: center;
			}

	#visual .pht {
		width: 47%;
		overflow: hidden;
	}
		#visual .pht img {
			width: 100%;
			height: 100%;
			object-fit: cover;
		}
@media screen and (max-width: 1024px) {
	#visual {
		padding-top: 170px;
	}
	#visual:before {
		height: 15%;
	}
		#visual .text .head {
			font-size: 15.0vw;
			margin-left: -20%;
			margin-bottom: 5vw;
		}

		#visual .text .catch {
			font-size: 3.0vw;
			padding-left: 3vw;
			margin-bottom: 7vw;
		}

		#visual .text .info .name {
			min-height: 22vw;
		}
		#visual .text .info .name:before {
			font-size: 1.6vw;
			top: 1vw;
			left: 1vw;
		}
			#visual .text .info .name h1 {
				font-size: 4.0vw;
			}

		#visual .text .info .profile {
			min-height: 22vw;
			padding: 1.5vw;
		}
		#visual .text .info .profile:before {
			font-size: 1.6vw;
			top: 1vw;
			left: 1vw;
		}
			#visual .text .info .profile .job {
				font-size: 1.4vw;
			}
}
@media screen and (max-width: 767px) {
	#visual {
		padding-top: 60px;
	}
	#visual:before {
		height: 15%;
	}
		#visual .inner_full {
			display: block;
		}
			#visual .text {
				width: 100%;
			}
				#visual .text .head {
					font-size: 15.0vw;
					margin-left: -9%;
					margin-top: 0;
					margin-bottom: 6vw;
				}

				#visual .text .catch {
					font-size: 6.2vw;
					padding-left: 5vw;
					margin-bottom: 8vw;
				}

				#visual .text .info .name {
					width: 35%;
					min-height: 22vw;
				}
				#visual .text .info .name:before {
					font-size: 3.6vw;
					top: 2vw;
					left: 2vw;
				}
					#visual .text .info .name h1 {
						font-size: 7.0vw;
					}

				#visual .text .info .profile {
					width: 65%;
					min-height: 22vw;
					padding: 4vw 2vw;
				}
				#visual .text .info .profile:before {
					font-size: 3.6vw;
					top: 2vw;
					left: 2vw;
				}
					#visual .text .info .profile .job {
						font-size: 3.0vw;
					}
	
			#visual .pht {
				width: 100%;
			}
}


	

	
/* question
--------------------- */
.question .head {
	margin-bottom: 40px;
}
	.question .head .en {
		font-size: 1.6rem;
		line-height: 1;
	}

	.question .head .jp {
		font-size: 2.0rem;
		line-height: 1;
	}

.question h2 {
	font-size: 3.6rem;
	font-weight: 700;
	line-height: 1.5em;
	margin-bottom: 40px;
}

.question .txt {
	margin-bottom: 25px;
}
.question .txt:nth-last-child(1) {
	margin-bottom: 0;
}
@media screen and (max-width: 1024px) {
	.question .head {
		margin-bottom: 4vw;
	}
		.question .head .en {
			font-size: 1.6vw;
		}

		.question .head .jp {
			font-size: 2.0vw;
		}

	.question h2 {
		font-size: 3.6vw;
		margin-bottom: 4vw;
	}

	.question .txt {
		margin-bottom: 2.5vw;
	}
}
@media screen and (max-width: 767px) {
	.question .head {
		margin-bottom: 6vw;
	}
		.question .head .en {
			font-size: 3.6vw;
		}

		.question .head .jp {
			font-size: 4.0vw;
		}

	.question h2 {
		font-size: 5.8vw;
		margin-bottom: 6vw;
	}

	.question .txt {
		margin-bottom: 5vw;
	}
}


	

	
/* question01
--------------------- */
#question01 {
	position: relative;
}
	#question01 .text-pht .text {
		width: 46.5%;
		order: 2;
		padding-bottom: 170px;
	}

	#question01 .text-pht .pht {
		width: 46.5%;
		order: 1;
		margin-top: 10px;
		overflow: hidden;
	}
		#question01 .text-pht .pht img {
			width: 100%;
			height: 100%;
			object-fit: cover;
		}

	#question01 .marquee {
		display: flex;
		width: 100%;
		overflow: hidden;
		color: #0093D7;
		opacity: 0.1;
		letter-spacing: 0;
		position: absolute;
		bottom: 0;
		left: 0;
		z-index: -1;
	}
		#question01 .marquee .marquee__item {
			flex: 0 0 auto;
			overflow: hidden;
			font-size: 12.0rem;
			font-weight: 600;
			white-space: nowrap;
			line-height: 1;
			padding-right: 20px;
		}
		#question01 .marquee .marquee__item:nth-child(odd) {
			animation: loop 80s -40s linear infinite;
		}
		#question01 .marquee .marquee__item:nth-child(even) {
			animation: loop2 80s 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: 1024px) {
	#question01 .text-pht .text {
		padding-bottom: 17vw;
	}

	#question01 .text-pht .pht {
		margin-top: 1vw;
	}

	#question01 .marquee .marquee__item {
		font-size: 12.0vw;
		padding-right: 2vw;
	}
}
@media screen and (max-width: 767px) {
	#question01 .text-pht {
		display: block;
		padding-bottom: 10vw;
	}
		#question01 .text-pht .text {
			width: 100%;
			padding-bottom: 7vw;
		}

		#question01 .text-pht .pht {
			width: 100%;
			margin-top: 0;
		}

	#question01 .marquee {
		z-index: 1;
	}
		#question01 .marquee .marquee__item {
			font-size: 22.0vw;
			padding-right: 4vw;
		}
}


	

	
/* question02
--------------------- */
#question02 ul.pht-list {
	margin-top: 70px;
	position: relative;
	z-index: 2;
}
	#question02 ul.pht-list li:nth-child(1) {
		width: 55%;
		margin-left: -8%;
	}

	#question02 ul.pht-list li:nth-child(2) {
		width: 47%;
	}
@media screen and (max-width: 1024px) {
	#question02 ul.pht-list {
		margin-top: 7vw;
	}
}
@media screen and (max-width: 767px) {
	#question02 ul.pht-list {
		display: block;
		margin-top: 10vw;
	}
		#question02 ul.pht-list li:nth-child(1) {
			width: 108%;
			margin-left: -8%;
		}

		#question02 ul.pht-list li:nth-child(2) {
			width: 80%;
			margin-left: 20%;
			margin-top: 3vw;
		}
}


	

	
/* future
--------------------- */
#future {
	margin-top: -210px;
}
	#future .head {
		font-size: 15.0rem;
		font-weight: 500;
		line-height: 1;
		padding-top: 50px;
		margin-bottom: 50px;
		margin-left: -9%;
	}

	#future .text h2 {
		width: 260px;
		font-size: 3.6rem;
		font-weight: 700;
		line-height: 1;
	}

	#future .text .txt {
		width: -webkit-calc(100% - 260px);
		width: calc(100% - 260px);
		font-weight: 500;
		margin-top: -5px;
	}
@media screen and (max-width: 1024px) {
	#future {
		margin-top: -21vw;
	}
		#future .head {
			font-size: 15.0vw;
			padding-top: 5vw;
			margin-bottom: 5vw;
		}

		#future .text h2 {
			width: 30%;
			font-size: 3.6vw;
		}

		#future .text .txt {
			width: 70%;
			margin-top: -0.5vw;
		}
}
@media screen and (max-width: 767px) {
	#future {
		margin-top: -26vw;
	}
		#future .head {
			margin-bottom: 8vw;
		}

		#future .text {
			display: block;
		}
			#future .text h2 {
				width: 100%;
				font-size: 6.0vw;
				margin-bottom: 6vw;
			}

			#future .text .txt {
				width: 100%;
				margin-top: 0;
			}
}


	

	
/* message
--------------------- */
#message {
	background: #EBF7FC;
}
	#message h2 {
		text-align: center;
		line-height: 1;
		margin-bottom: 60px;
	}
		#message h2 .jp {
			font-size: 5.0rem;
			font-weight: 700;
			color: transparent;
			-webkit-text-stroke: 1px #0093D7;
			padding-right: 5px;
		}
		#message h2 .en {
			font-size: 5.6rem;
			font-weight: 600;
		}

	#message .list .box {
		width: 46.5%;
		position: relative;
		z-index: 2;
	}
	#message .list .box:before {
		content: "";
		width: 100%;
		height: 100%;
		background: url("../img/message_bg.webp") no-repeat center / cover;
		position: absolute;
		top: 20px;
		left: 20px;
		z-index: 0;
	}
		#message .list .box .white-bg {
			padding: 60px;
			height: 100%;
			border: solid 1px #fff;
			background: rgba(255, 255, 255,0.5);
			backdrop-filter: blur(20px);
			-webkit-backdrop-filter: blur(20px);
		}
			#message .list .box .white-bg h3 {
				font-size: 3.0rem;
				font-weight: 700;
				line-height: 1.4em;
				margin-bottom: 25px;
			}
@media screen and (max-width: 1024px) {
	#message h2 {
		margin-bottom: 6vw;
	}
		#message h2 .jp {
			font-size: 5.0vw;
			padding-right: 0.5vw;
		}
		#message h2 .en {
			font-size: 5.6vw;
		}

	#message .list .box:before {
		top: 2vw;
		left: 2vw;
	}
		#message .list .box .white-bg {
			padding: 5vw;
		}
			#message .list .box .white-bg h3 {
				font-size: 3.0vw;
				margin-bottom: 2.5vw;
			}
}
@media screen and (max-width: 767px) {
	#message h2 {
		margin-bottom: 8vw;
	}
		#message h2 .jp {
			font-size: 9.0vw;
			padding-right: 2vw;
		}
		#message h2 .en {
			font-size: 9.6vw;
		}

	#message .list {
		display: block;
	}
		#message .list .box {
			width: 100%;
			margin-bottom: 11vw;
		}
		#message .list .box:nth-last-child(1) {
			margin-bottom: 0;
		}
		#message .list .box:before {
			top: 3vw;
			left: 3vw;
		}
			#message .list .box .white-bg {
				padding: 8vw;
			}
				#message .list .box .white-bg h3 {
					font-size: 5.4vw;
					margin-bottom: 4vw;
				}
}


	

	
/* other
--------------------- */
#other {
	width: 100%;
	overflow: hidden;
}
	#other h2 {
		margin-bottom: 60px;
	}
		#other h2 .en {
			font-size: 1.6rem;
			line-height: 1;
		}

		#other h2 .jp {
			font-size: 2.0rem;
			line-height: 1;
		}

	#other .swiper-container {
		padding: 0 0 40px 0;
		position: relative;
	}
		#other .swiper-container a.linkbox {
			display: block;
		}
			#other .swiper-container a.linkbox .shadow {
				position: relative;
			}
			#other .swiper-container a.linkbox .shadow:before {
				content: "";
				width: 100%;
				height: 100%;
				background: #002153;
				opacity: 0.1;
				position: absolute;
				top: 10px;
				left: 10px;
				z-index: -1;
				transition: 0.3s;
				-webkit-transition: 0.3s;
			}
			#other .swiper-container a.linkbox:hover .shadow:before {
				top: 0;
				left: 0;
			}
				#other .swiper-container a.linkbox .shadow .pht span {
					display: inline-block;
					background: #002153;
					font-size: 1.6rem;
					font-weight: 500;
					line-height: 1;
					color: #fff;
					padding: 6px 12px 7px 12px;
					position: absolute;
					bottom: 0;
					left: 0;
					z-index: 2;
				}

			#other .swiper-container a.linkbox .text {
				padding: 25px 10px 0 10px;
			}
				#other .swiper-container a.linkbox .text h3 {
					font-size: 3.0rem;
					font-weight: 500;
					color: #0093D7;
					line-height: 1;
					background: url("../../common/img/icon_arrow_blue.svg") no-repeat right center / 18px;
					margin-bottom: 10px;
				}

				#other .swiper-container a.linkbox .text .join {
					font-size: 1.3rem;
					line-height: 1.6em;
				}

		#other .swiper-container .swiper-pagination {
			bottom: 0;
			z-index: 1;
		}
			#other .swiper-container .swiper-pagination .swiper-pagination-bullet {
				width: 10px;
				height: 10px;
				background: #002153;
				border: none;
				opacity: 0.3;
				transition: 0.3s;
				-webkit-transition: 0.3s;
			}
			#other .swiper-container .swiper-pagination .swiper-pagination-bullet-active {
				background: #002153;
				opacity: 1;
			}
@media screen and (max-width: 1024px) {
	#other h2 {
		margin-bottom: 6vw;
	}
		#other h2 .en {
			font-size: 1.6vw;
		}

		#other h2 .jp {
			font-size: 2.0vw;
		}

	#other .swiper-container {
		padding: 0 0 4vw 0;
	}
		#other .swiper-container a.linkbox .shadow:before {
			top: 1vw;
			left: 1vw;
		}
			#other .swiper-container a.linkbox .shadow .pht span {
				font-size: 1.6vw;
				padding: 0.6vw 1.2vw 0.7vw 1.2vw;
			}

			#other .swiper-container a.linkbox .text {
				padding: 2.5vw 1vw 0 1vw;
			}
				#other .swiper-container a.linkbox .text h3 {
					font-size: 3.0vw;
					background: url("../../common/img/icon_arrow_blue.svg") no-repeat right center / 1.8vw;
					margin-bottom: 1vw;
				}

				#other .swiper-container a.linkbox .text .join {
					font-size: 1.3vw;
				}
}
@media screen and (max-width: 767px) {
	#other h2 {
		margin-bottom: 6vw;
	}
		#other h2 .en {
			font-size: 3.6vw;
		}

		#other h2 .jp {
			font-size: 4.0vw;
		}

	#other .swiper-container {
		padding: 0 0 4vw 0;
	}
		#other .swiper-container a.linkbox .shadow:before {
			top: 2vw;
			left: 2vw;
		}
			#other .swiper-container a.linkbox .shadow .pht span {
				font-size: 3.2vw;
				padding: 1.6vw 3vw 1.6vw 3vw;
			}

			#other .swiper-container a.linkbox .text {
				padding: 4vw 2vw 0 2vw;
			}
				#other .swiper-container a.linkbox .text h3 {
					font-size: 6.0vw;
					background: url("../../common/img/icon_arrow_blue.svg") no-repeat right center / 4vw;
					margin-bottom: 2vw;
				}

				#other .swiper-container a.linkbox .text .join {
					font-size: 3.2vw;
				}
}


	

	
/* kv
--------------------- */
#kv {
	padding-top: 150px;
	padding-bottom: 130px;
}
	#kv .en {
		font-size: 2.0rem;
		font-weight: 500;
		line-height: 1;
		margin-bottom: 20px;
	}

	#kv h1 {
		font-size: 7.0rem;
		line-height: 1.3em;
		margin-bottom: 55px;
	}
@media screen and (max-width: 1024px) {
	#kv {
		padding-bottom: 13vw;
	}
		#kv .en {
			font-size: 2.0vw;
			margin-bottom: 2vw;
		}

		#kv h1 {
			font-size: 7.0vw;
			margin-bottom: 5.5vw;
		}
}
@media screen and (max-width: 767px) {
	#kv {
		padding-top: 80px;
		padding-bottom: 10vw;
	}
		#kv .en {
			font-size: 4.0vw;
			margin-bottom: 3vw;
		}

		#kv h1 {
			font-size: 8.0vw;
			margin-bottom: 7vw;
		}
}


	

	
/* interview
--------------------- */
#interview .keyword-head {
	width: 250px;
}
	#interview .keyword-head ul.keyword-box {
		width: 100%;
		position: sticky;
		top: 150px;
		left: 0;
	}
			#interview .keyword-head ul.keyword-box li {
				margin-bottom: 5px;
			}
			#interview .keyword-head ul.keyword-box li:nth-last-child(1) {
				margin-bottom: 0;
			}
				#interview .keyword-head ul.keyword-box li input[type="radio"] {
					display: none;
				}
				#interview .keyword-head ul.keyword-box li input[type="radio"] + label {
					display: flex;
					justify-content: flex-start;
					align-items: center;
					background: rgba(255, 255, 255,0.5);
					backdrop-filter: blur(20px);
					-webkit-backdrop-filter: blur(20px);
					height: 54px;
					position: relative;
					padding: 0 20px 0 44px;
					font-size: 1.6rem;
					font-weight: 500;
					line-height: 1.2em;
					text-align: left;
					letter-spacing: 0;
					cursor: pointer;
					-webkit-user-select: none;
					-moz-user-select: none;
					-ms-user-select: none;
				}
				#interview .keyword-head ul.keyword-box li input[type="radio"]:checked + label {
					background: #fff;
					color: #0093D7;
				}

				#interview .keyword-head ul.keyword-box li input[type="radio"] + label:before {
					content: '';
					display: block;
					width: 12px;
					height: 12px;
					border: 1px solid #fff;
					border-radius: 3px;
					background: #fff;
					position: absolute;
					left: 20px;
					top: 20px;
					opacity: 1;
					-webkit-transition: all .12s, border-color .08s;
					transition: all .12s, border-color .08s;
				}

				#interview .keyword-head ul.keyword-box li input[type="radio"]:checked + label:before {
					width: 6px;
					top: 16px;
					left: 25px;
					border-radius: 0;
					border: 1px solid #0093D7;
					background: none;
					opacity: 1;
					border-top-color: transparent;
					border-left-color: transparent;
					-webkit-transform: rotate(45deg);
					transform: rotate(45deg);
				}

#interview .keyword-list {
	width: -webkit-calc(100% - 250px);
	width: calc(100% - 250px);
	padding-left: 80px;
}
	#interview .keyword-list .is-hide {
		display: none;
	}
	#interview .keyword-list .list_item {
		width: 28.3%;
		margin-right: 2.5%;
		margin-left: 2.5%;
		margin-bottom: 50px;
	}
		#interview .keyword-list .list_item a.linkbox {
			display: block;
		}
			#interview .keyword-list .list_item a.linkbox .shadow {
				position: relative;
			}
			#interview .keyword-list .list_item a.linkbox .shadow:before {
				content: "";
				width: 100%;
				height: 100%;
				background: #002153;
				opacity: 0.1;
				position: absolute;
				top: 10px;
				left: 10px;
				z-index: -1;
				transition: 0.3s;
				-webkit-transition: 0.3s;
			}
			#interview .keyword-list .list_item a.linkbox:hover .shadow:before {
				top: 0;
				left: 0;
			}
				#interview .keyword-list .list_item a.linkbox .shadow .pht span {
					display: inline-block;
					background: #002153;
					font-size: 1.6rem;
					font-weight: 500;
					line-height: 1;
					color: #fff;
					padding: 6px 12px 7px 12px;
					position: absolute;
					bottom: 0;
					left: 0;
					z-index: 2;
				}

			#interview .keyword-list .list_item a.linkbox .text {
				padding: 25px 10px 0 10px;
			}
				#interview .keyword-list .list_item a.linkbox .text h3 {
					font-size: 3.0rem;
					font-weight: 500;
					line-height: 1;
					background: url("../../common/img/icon_arrow_black.svg") no-repeat right center / 18px;
					margin-bottom: 10px;
				}

				#interview .keyword-list .list_item a.linkbox .text .join {
					font-size: 1.3rem;
					line-height: 1.6em;
				}
@media screen and (max-width: 1024px) {
	#interview .keyword-head {
		width: 23%;
	}
		#interview .keyword-head ul.keyword-box {
			top: 150px;
		}
				#interview .keyword-head ul.keyword-box li {
					margin-bottom: 0.5vw;
				}
					#interview .keyword-head ul.keyword-box li input[type="radio"] + label {
						height: 5.4vw;
						padding: 0 2vw 0 4.4vw;
						font-size: 1.6vw;
					}

					#interview .keyword-head ul.keyword-box li input[type="radio"] + label:before {
						width: 1.2vw;
						height: 1.2vw;
						border-radius: 0.3vw;
						left: 2vw;
						top: 2vw;
					}

					#interview .keyword-head ul.keyword-box li input[type="radio"]:checked + label:before {
						width: 0.6vw;
						top: 1.6vw;
						left: 2.5vw;
					}

	#interview .keyword-list {
		width: 80%;
		margin-right: -3%;
		padding-left: 5vw;
	}
		#interview .keyword-list .list_item {
			width: 42%;
			margin-right: 4%;
			margin-left: 4%;
			margin-bottom: 5vw;
		}
			#interview .keyword-list .list_item a.linkbox .shadow:before {
				top: 1vw;
				left: 1vw;
			}
				#interview .keyword-list .list_item a.linkbox .shadow .pht span {
					font-size: 1.6vw;
					padding: 0.6vw 1.2vw 0.7vw 1.2vw;
				}

			#interview .keyword-list .list_item a.linkbox .text {
				padding: 2.5vw 1vw 0 1vw;
			}
				#interview .keyword-list .list_item a.linkbox .text h3 {
					font-size: 3.0vw;
					background: url("../../common/img/icon_arrow_black.svg") no-repeat right center / 1.8vw;
					margin-bottom: 1vw;
				}

				#interview .keyword-list .list_item a.linkbox .text .join {
					font-size: 1.3vw;
				}
}
@media screen and (max-width: 767px) {
	#interview .inner_full{
		display: block;
	}
	#interview .keyword-head {
		width: 100%;
		margin-bottom: 8vw;
	}
		#interview .keyword-head ul.keyword-box {
			display: flex;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			top: 0;
			position: static;
		}
				#interview .keyword-head ul.keyword-box li {
					width: 49%;
					margin-right: 2%;
					margin-bottom: 2%;
				}
				#interview .keyword-head ul.keyword-box li:nth-child(2n) {
					margin-right: 0;
				}
					#interview .keyword-head ul.keyword-box li input[type="radio"] + label {
						height: 8vw;
						padding: 0 2vw 0 6vw;
						font-size: 2.8vw;
					}

					#interview .keyword-head ul.keyword-box li input[type="radio"] + label:before {
						width: 2vw;
						height: 2vw;
						border-radius: 0.6vw;
						left: 2vw;
						top: 2.6vw;
					}

					#interview .keyword-head ul.keyword-box li input[type="radio"]:checked + label:before {
						width: 1.2vw;
						top: 1.8vw;
						left: 2vw;
					}

	#interview .keyword-list {
		width: 108%;
		margin-right: -4%;
		margin-left: -4%;
		padding-left: 0;
	}
		#interview .keyword-list .list_item {
			width: 42%;
			margin-right: 4%;
			margin-left: 4%;
			margin-bottom: 8vw;
		}
			#interview .keyword-list .list_item a.linkbox .shadow:before {
				top: 2vw;
				left: 2vw;
			}
				#interview .keyword-list .list_item a.linkbox .shadow .pht span {
					font-size: 3.0vw;
					padding: 1.6vw 2.5vw 1.6vw 2.5vw;
				}

			#interview .keyword-list .list_item a.linkbox .text {
				padding: 4vw 0 0 0;
			}
				#interview .keyword-list .list_item a.linkbox .text h3 {
					font-size: 6.0vw;
					background: url("../../common/img/icon_arrow_black.svg") no-repeat right center / 4vw;
					margin-bottom: 2vw;
				}

				#interview .keyword-list .list_item a.linkbox .text .join {
					font-size: 2.8vw;
				}
}


	

	
/* job-area
--------------------- */
.job-area {
	overflow: hidden;
}
#job02,
#job05 {
	background: #002153;
}
#job03,
#job06 {
	background: #EBF7FC;
}
	.job-area .job-ttl {
		margin-bottom: 35px;
		text-align: center;
	}
		.job-area .job-ttl .en {
			font-size: 1.6rem;
			font-weight: 500;
			line-height: 1;
			margin-bottom: 10px;
		}

		.job-area .job-ttl h3 {
			font-size: 3.0rem;
			font-weight: 700;
			line-height: 1.3em;
		}

	.job-area .flow {
		margin-bottom: 80px;
	}
		.job-area .flow .area {
			display: flex;
			justify-content: space-between;
			align-items: flex-start;
		}
			.job-area .flow .area ul.tab {
				width: 250px;
				border: solid 1px #41536A;
			}
				.job-area .flow .area ul.tab li {
					padding: 25px 20px;
					border-bottom: solid 1px #41536A;
					background: #fff url("../../common/img/icon_arrow_black.svg") no-repeat right 20px center / 18px;
					cursor: pointer;
					transition: 0.3s;
					-webkit-transition: 0.3s;
				}
				.job-area .flow .area ul.tab li.select {
					background: #EBF7FC url("../../common/img/icon_arrow_blue.svg") no-repeat right 20px center / 18px;
					color: #0093D7;
				}
				.job-area .flow .area ul.tab li:nth-last-child(1) {
					border-bottom: none;
				}
					.job-area .flow .area ul.tab li .en {
						display: block;
						font-size: 1.2rem;
						line-height: 1;
						margin-bottom: 8px;
					}
					.job-area .flow .area ul.tab li p {
						display: block;
						font-size: 1.6rem;
						font-weight: 700;
						line-height: 1;
					}

			.job-area .flow .area .content {
				width: -webkit-calc(100% - 320px);
				width: calc(100% - 320px);
				border-top: solid 1px #ddd;
				padding-top: 10px;
			}
				.job-area .flow .area .content .hide {
					display: none;
				}
					.job-area .flow .area .content .head {
						font-size: 1.2rem;
						font-weight: 500;
						line-height: 1;
						margin-bottom: 15px;
					}

					.job-area .flow .area .content h4 {
						font-size: 2.4rem;
						font-weight: 700;
						line-height: 1.3em;
						margin-bottom: 12px;
					}

					.job-area .flow .area .content .txt {
						margin-bottom: 30px;
					}

	.job-area .movie {
		margin-bottom: 80px;
	}
		.job-area .movie .video {
			max-width: 800px;
			margin: 0 auto;
			position: relative;
		}
			.job-area .movie .video iframe {
				width: 100%;
				height: 100%;
				aspect-ratio: 16 / 9;
			}

	.job-area .explanation {
		margin-bottom: 80px;
	}
		.job-area .explanation .pht {
			width: 44%;
			margin-left: -14%;
		}
		#job02  .explanation .pht,
		#job04  .explanation .pht,
		#job06  .explanation .pht {
			order: 2;
			margin-left: 0;
			margin-right: -14%;
		}

		.job-area .explanation .text {
			width: 64%;
		}
		#job02  .explanation .text,
		#job04  .explanation .text,
		#job06  .explanation .text {
			order: 1;
		}
			.job-area .explanation .text h3 {
				font-size: 3.0rem;
				font-weight: 700;
				line-height: 1.4em;
				margin-bottom: 20px;
			}

			.job-area .explanation .text h4.head {
				padding-top: 20px;
				margin-bottom: 5px;
				font-size: 1.8rem;
				font-weight: 700;
				line-height: 1.3em;
			}

			.job-area .explanation .text .keyword {
				margin-top: 45px;
				padding: 21px 0 16px 0;
				border-top: solid 1px #ddd;
				border-bottom: solid 1px #ddd;
				position: relative;
			}
				.job-area .explanation .text .keyword h4 {
					display: inline-block;
					background: #fff;
					padding-right: 12px;
					font-size: 2.0rem;
					font-weight: 700;
					line-height: 1;
					position: absolute;
					top: -12px;
					left: 0;
				}
				#job02 .explanation .text .keyword h4,
				#job05 .explanation .text .keyword h4 {
					background: #002153;
				}
				#job03 .explanation .text .keyword h4,
				#job06 .explanation .text .keyword h4 {
					background: #EBF7FC
				}

				.job-area .explanation .text .keyword ul.list li {
					font-size: 1.5rem;
					position: relative;
					padding-left: 35px;
					margin-top: 8px;
					margin-right: 25px;
					margin-bottom: 8px;
				}
				.job-area .explanation .text .keyword ul.list li:before {
					content: "＃";
					width: 30px;
					height: 30px;
					border-radius: 50%;
					background: #EBF7FC;
					font-size: 1.6rem;
					text-align: center;
					color: #002153;
					position: absolute;
					top: 50%;
					left: 0;
					margin-top: -15px;
				}
				#job03 .explanation .text .keyword ul.list li:before,
				#job06 .explanation .text .keyword ul.list li:before {
					background: #fff;
				}

	.job-area .interview .list .list_item {
		width: 30%;
		margin-right: 5%;
		margin-bottom: 50px;
	}
	.job-area .interview .list .list_item:nth-child(3n) {
		margin-right: 0;
	}
		.job-area .interview .list .list_item a.linkbox {
			display: block;
		}
			.job-area .interview .list .list_item a.linkbox .shadow {
				position: relative;
			}
			.job-area .interview .list .list_item a.linkbox .shadow:before {
				content: "";
				width: 100%;
				height: 100%;
				background: #002153;
				opacity: 0.1;
				position: absolute;
				top: 10px;
				left: 10px;
				z-index: -1;
				transition: 0.3s;
				-webkit-transition: 0.3s;
			}
			#job02 .interview .list .list_item a.linkbox .shadow:before,
			#job05 .interview .list .list_item a.linkbox .shadow:before {
				background: #fff;
			}
			.job-area .interview .list .list_item a.linkbox:hover .shadow:before {
				top: 0;
				left: 0;
			}
				.job-area .interview .list .list_item a.linkbox .shadow .pht span {
					display: inline-block;
					background: #002153;
					font-size: 1.6rem;
					font-weight: 500;
					line-height: 1;
					color: #fff;
					padding: 6px 12px 7px 12px;
					position: absolute;
					bottom: 0;
					left: 0;
					z-index: 2;
				}

			.job-area .interview .list .list_item a.linkbox .text {
				padding: 25px 10px 0 10px;
			}
				.job-area .interview .list .list_item a.linkbox .text h3 {
					font-size: 3.0rem;
					font-weight: 500;
					color: #0093D7;
					line-height: 1;
					background: url("../../common/img/icon_arrow_blue.svg") no-repeat right center / 18px;
					margin-bottom: 10px;
				}

				.job-area .interview .list.list_item a.linkbox .text .join {
					font-size: 1.3rem;
					line-height: 1.6em;
				}
@media screen and (max-width: 1024px) {
	.job-area .job-ttl {
		margin-bottom: 3.5vw;
	}
		.job-area .job-ttl .en {
			font-size: 1.6vw;
			margin-bottom: 1vw;
		}

		.job-area .job-ttl h3 {
			font-size: 3.0vw;
		}

	.job-area .flow {
		margin-bottom: 8vw;
	}
		.job-area .flow .area ul.tab {
			width: 23%;
		}
			.job-area .flow .area ul.tab li {
				padding: 2.2vw 2vw;
				background: #fff url("../../common/img/icon_arrow_black.svg") no-repeat right 2vw center / 1.8vw;
			}
			.job-area .flow .area ul.tab li.select {
				background: #EBF7FC url("../../common/img/icon_arrow_blue.svg") no-repeat right 2vw center / 1.8vw;
			}
				.job-area .flow .area ul.tab li .en {
					font-size: 1.2vw;
					margin-bottom: 0.8vw;
				}
				.job-area .flow .area ul.tab li p {
					font-size: 1.6vw;
				}

		.job-area .flow .area .content {
			width: 70%;
			padding-top: 1vw;
		}
			.job-area .flow .area .content .head {
				font-size: 1.2vw;
				margin-bottom: 1.5vw;
			}

			.job-area .flow .area .content h4 {
				font-size: 2.4vw;
				margin-bottom: 1.2vw;
			}

			.job-area .flow .area .content .txt {
				margin-bottom: 3vw;
			}

	.job-area .movie {
		margin-bottom: 8vw;
	}
		.job-area .movie .video {
			max-width: 100%;
		}

	.job-area .explanation {
		margin-bottom: 8vw;
	}
		.job-area .explanation .pht {
			width: 40%;
			margin-left: -8%;
		}
		#job02  .explanation .pht,
		#job04  .explanation .pht,
		#job06  .explanation .pht {
			margin-right: -8%;
		}

		.job-area .explanation .text {
			width: 62%;
		}
			.job-area .explanation .text h3 {
				font-size: 2.8vw;
				margin-bottom: 2vw;
			}

			.job-area .explanation .text h4.head {
				padding-top: 2vw;
				margin-bottom: 0.6vw;
				font-size: 1.8vw;
			}

			.job-area .explanation .text .keyword {
				margin-top: 4.5vw;
				padding: 2.1vw 0 1.6vw 0;
			}
				.job-area .explanation .text .keyword h4 {
					padding-right: 1.2vw;
					font-size: 2.0vw;
					top: -1.2vw;
				}

				.job-area .explanation .text .keyword ul.list li {
					font-size: 1.5vw;
					padding-left: 3.5vw;
					margin-top: 0.8vw;
					margin-right: 2.5vw;
					margin-bottom: 0.8vw;
				}
				.job-area .explanation .text .keyword ul.list li:before {
					width: 3vw;
					height: 3vw;
					font-size: 1.6vw;
					margin-top: -1.5vw;
				}

	.job-area .interview .list .list_item {
		margin-bottom: 5vw;
	}
		.job-area .interview .list .list_item a.linkbox .shadow:before {
			top: 1vw;
			left: 1vw;
		}
			.job-area .interview .list .list_item a.linkbox .shadow .pht span {
				font-size: 1.6vw;
				padding: 0.6vw 1.2vw 0.7vw 1.2vw;
			}

		.job-area .interview .list .list_item a.linkbox .text {
			padding: 2.5vw 1vw 0 1vw;
		}
			.job-area .interview .list .list_item a.linkbox .text h3 {
				font-size: 3.0vw;
				background: url("../../common/img/icon_arrow_blue.svg") no-repeat right center / 1.8vw;
				margin-bottom: 1vw;
			}

			.job-area .interview .list.list_item a.linkbox .text .join {
				font-size: 1.3vw;
			}
}
@media screen and (max-width: 767px) {
	.job-area .job-ttl {
		margin-bottom: 6vw;
	}
		.job-area .job-ttl .en {
			font-size: 3.8vw;
			margin-bottom: 1vw;
		}

		.job-area .job-ttl h3 {
			font-size: 6.0vw;
		}

	.job-area .flow {
		margin-bottom: 12vw;
	}
		.job-area .flow .area ul.tab {
			width: 23%;
		}
			.job-area .flow .area ul.tab li {
				padding: 2.2vw 2vw;
				background: #fff url("../../common/img/icon_arrow_black.svg") no-repeat right 2vw center / 1.8vw;
			}
			.job-area .flow .area ul.tab li.select {
				background: #EBF7FC url("../../common/img/icon_arrow_blue.svg") no-repeat right 2vw center / 1.8vw;
			}
				.job-area .flow .area ul.tab li .en {
					font-size: 1.2vw;
					margin-bottom: 0.8vw;
				}
				.job-area .flow .area ul.tab li p {
					font-size: 1.6vw;
				}

		.job-area .flow .area .content {
			width: 70%;
			padding-top: 1vw;
		}
			.job-area .flow .area .content .head {
				font-size: 1.2vw;
				margin-bottom: 1.5vw;
			}

			.job-area .flow .area .content h4 {
				font-size: 2.4vw;
				margin-bottom: 1.2vw;
			}

			.job-area .flow .area .content .txt {
				margin-bottom: 3vw;
			}

	.job-area .movie {
		margin-bottom: 12vw;
	}
		.job-area .movie .video {
			max-width: 100%;
		}

	.job-area .explanation {
		display: block;
		margin-bottom: 12vw;
	}
		.job-area .explanation .pht {
			width: 108%;
			margin-left: -8%;
			margin-bottom: 8vw;
		}
		#job02  .explanation .pht,
		#job04  .explanation .pht,
		#job06  .explanation .pht {
			margin-right: -8%;
		}

		.job-area .explanation .text {
			width: 100%;
		}
			.job-area .explanation .text h3 {
				font-size: 5.0vw;
				margin-bottom: 4vw;
			}

			.job-area .explanation .text h4.head {
				padding-top: 4vw;
				margin-bottom: 1.5vw;
				font-size: 4.4vw;
			}

			.job-area .explanation .text .keyword {
				margin-top: 9vw;
				padding: 4vw 0 2.6vw 0;
			}
				.job-area .explanation .text .keyword h4 {
					padding-right: 3vw;
					font-size: 4.0vw;
					top: -2.4vw;
				}

				.job-area .explanation .text .keyword ul.list li {
					font-size: 3.4vw;
					padding-left: 6.5vw;
					margin-top: 0.8vw;
					margin-right: 2.5vw;
					margin-bottom: 0.8vw;
				}
				.job-area .explanation .text .keyword ul.list li:before {
					width: 5vw;
					height: 5vw;
					font-size: 3.6vw;
					line-height: 5vw;
					margin-top: -2.5vw;
				}

	.job-area .interview .list .list_item {
		width: 46.5%;
		margin-right: 7%;
		margin-bottom: 5vw;
	}
	.job-area .interview .list .list_item:nth-child(3n) {
		margin-right: 7%;
	}
	.job-area .interview .list .list_item:nth-child(2n) {
		margin-right: 0;
	}
		.job-area .interview .list .list_item a.linkbox .shadow:before {
			top: 2vw;
			left: 2vw;
		}
			.job-area .interview .list .list_item a.linkbox .shadow .pht span {
				font-size: 3.6vw;
				padding: 1.2vw 2.4vw 1.4vw 2.4vw;
			}

		.job-area .interview .list .list_item a.linkbox .text {
			padding: 5vw 0 0 0;
		}
			.job-area .interview .list .list_item a.linkbox .text h3 {
				font-size: 6.0vw;
				background: url("../../common/img/icon_arrow_blue.svg") no-repeat right center / 4vw;
				margin-bottom: 2vw;
			}

			.job-area .interview .list .list_item a.linkbox .text .join {
				font-size: 3.0vw;
			}
}