@charset "UTF-8";
/* CSS Document */


.sp {
	display: none;
}




/* flex
--------------------- */
.flex {
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.flex-start {
	display: flex;
	display: -webkit-flex;
	justify-content: space-between;
}
.flex-end {
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: reverse;
	 -ms-flex-direction: row-reverse;
		 flex-direction: row-reverse;
}
.flex-center {
	display: flex;
	justify-content: center;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}


	
	
/* fonts
--------------------- */
#main {
	font-family: YakuHanJP, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}
.en {
	font-family: "Manrope", sans-serif;
	font-weight: 700;
}
.blue {
	color: #0055B8;
}


	
	
/* inner
--------------------- */
.inner {
	width: 1100px;
	margin: 0 auto;
}


	
	
/* fv
--------------------- */
#fv {
	width: 100%;
	padding: 10px 0 0 0;
	background: #F2F6FB;
}
	#fv .loopSlider {
		height: 500px;
		overflow: hidden;
		position: relative;
	}
		#fv .loopSlider .loopslider_wrap {
			height: 500px;
			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: 480px;
					margin: 0 5px;
					overflow: hidden;
				}


	#fv .inner {
		padding-top: 40px;
		padding-bottom: 30px;
	}
		#fv .inner .text {
			display: inline-block;
			position: relative;
		}
			#fv .inner .text .en {
				font-size: 50px;
				font-weight: 700;
				line-height: 1.1em;
				letter-spacing: 0.02em;
			}

			#fv .inner .text h1 {
				font-size: 20px;
				font-weight: 700;
				line-height: 1;
				position: absolute;
				top: 0;
				right: 0;
			}

		#fv .inner .txt {
			padding-top: 25px;
			font-size: 16px;
			letter-spacing: 0.02em;
			line-height: 1.8em;
		}


	
	
/* overall-picture
--------------------- */
#overall-picture {
	background: #F2F6FB;
	padding: 70px 0;
	border-radius: 0 0 0 80px;
}
#overall-picture .inner {
	display: flex;
	justify-content: center;
	align-items: center;
}
	#overall-picture .pht {
		width: 35%;
		order: 1;
	}
		#overall-picture .pht img {
			width: 100%;
			height: auto;
		}

	#overall-picture .text {
		width: 65%;
		padding-left: 4%;
		order: 2;
	}
		#overall-picture .text p.en {
			font-size: 14px;
			line-height: 1;
			margin-bottom: 6px;
		}

		#overall-picture .text h2 {
			font-size: 34px;
			line-height: 1.3em;
			padding: 0;
			margin-bottom: 15px;
			border: none;
		}

		#overall-picture .text .txt {
			font-size: 16px;
			line-height: 1.8em;
		}


	
	
/* company
--------------------- */
#company {
	width: 100%;
	padding: 100px 0;
}
	#company .keyword-head {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		border-bottom: solid 1px #ddd;
		padding: 20px 0;
	}
	#company .keyword-head:nth-child(1) {
		border-top: solid 1px #ddd;
	}
		#company .keyword-head .ttl {
			width: 200px;
			box-sizing: border-box;
			font-size: 24px;
			font-weight: 700;
			line-height: 1.3em;
			padding-left: 10px;
		}

		#company .keyword-head ul.keyword-box {
			display: flex;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			width: -webkit-calc(100% - 200px);
			width: calc(100% - 200px);
		}
		#company .keyword-head.trigger {
			pointer-events: none;
			opacity: 0.5;
		}
			#company .keyword-head ul.keyword-box li {
				width: 18.2%;
				list-style: none;
				margin-right: 2%;
			}
			#company .keyword-head ul.keyword-box li:nth-child(5n) {
				margin-right: 0;
			}
				#company .keyword-head ul.keyword-box li input {
					clip: rect(1px, 1px, 1px, 1px);
					position: absolute;
				}

				#company .keyword-head ul.keyword-box li label.keyword_tag {
					display: flex;
					justify-content: center;
					align-items: center;
					box-sizing: border-box;
					padding: 0 8px;
					height: 56px;
					border-radius: 28px;
					font-size: 16px;
					line-height: 1.2em;
					text-align: center;
					background: none;
					border: solid 1px #ddd;
					transition: all .2s;
					cursor: pointer;
				}
				#company .keyword-head ul.keyword-box li input[type="radio"]:checked + label {
					background: #0055B8;
					border: solid 1px #0055B8;
					color: #fff;
				}



	#company .keyword-list .list_item {
		display: inline-block;
		width: 46%;
		background: #F2F6FB;
		border-radius: 10px 10px 10px 50px;
		margin: 80px 2% 0 2%;
		box-sizing: border-box;
		padding: 20px 40px 60px 40px;
		position: relative;
		transition: 0.3s;
		-webkit-transition: 0.3s;
	}
	#company .keyword-list .is-hide {
		display: none;
/*
		opacity: 0;
		visibility: hidden;
		transform: scale(0);
		position: absolute;
		z-index: -1;
*/
	}
		#company .keyword-list .list_item h2 {
			font-size: 24px;
			font-weight: 700;
			line-height: 1.3em;
			text-align: center;
			border: none;
			padding: 0;
			margin-bottom: 10px;
		}

		#company .keyword-list .list_item ul.tags li {
			display: inline-block;
			background: #0055B8;
			height: 22px;
			border-radius: 11px;
			font-size: 12px;
			color: #fff;
			text-align: center;
			margin: 4px;
			line-height: 20px;
			padding: 0 8px;
			list-style: none;
		}

		#company .keyword-list .list_item .pht {
			margin-top: 15px;
			margin-bottom: 15px;
		}
			#company .keyword-list .list_item .pht img {
				width: 48%;
				height: auto;
				border-radius: 6px;
			}

		#company .keyword-list .list_item h3 {
			font-size: 18px;
			font-weight: 700;
			line-height: 1.4em;
			color: #2C2C2C;
			border: none;
			padding: 0;
			margin-bottom: 10px;
		}

		#company .keyword-list .list_item .txt {
			font-size: 14px;
			line-height: 1.6em;
		}

		#company .keyword-list .list_item ul.btn-list {
			width: 420px;
			position: absolute;
			bottom: -28px;
			left: 50%;
			margin-left: -210px;
		}
			#company .keyword-list .list_item ul.btn-list li {
				width: 48%;
				list-style: none;
			}
				#company .keyword-list .list_item ul.btn-list li a {
					display: flex;
					justify-content: center;
					align-items: center;
					box-sizing: border-box;
					height: 56px;
					background: #0055B8 url("/img/jobs/icon_arrow_white.svg") no-repeat right 15px center;
					border-radius: 28px;
					font-size: 16px;
					font-weight: 600;
					color: #fff;
					line-height: 1.2em;
					text-align: center;
					text-decoration: none;
					transition: 0.3s;
					-webkit-transition: 0.3s;
				}
				#company .keyword-list .list_item ul.btn-list li a:hover {
					opacity: 0.7;
				}
				#company .keyword-list .list_item ul.btn-list li.off a {
					background: #ddd none;
					color: rgba(0,0,0,0.5);
					pointer-events: none;
				}






/* max 768px */
@media screen and (max-width: 768px) {

.pc {
	display: none;
}
.sp {
	display: block;
}


	
	
/* inner
--------------------- */
.inner {
	width: 90%;
}


	
	
/* fv
--------------------- */
#fv .loopSlider {
	height: 300px;
}
	#fv .loopSlider .loopslider_wrap {
		height: 300px;
	}
		#fv .loopSlider .loopslider_wrap ul li {
			width: 288px;
		}


	#fv .inner {
		padding: 25px 0 20px 0;
	}
		#fv .inner .text .en {
			font-size: 25px;
		}

		#fv .inner .text h1 {
			font-size: 10px;
			top: -10px;
			right: 0;
		}


		#fv .inner .txt {
			font-size: 14px;
			line-height: 1.6em;
			padding-top: 15px;
		}


	
	
/* overall-picture
--------------------- */
#overall-picture {
	padding: 50px 0;
	border-radius: 0 0 0 40px;
}
#overall-picture .inner {
	display: block;
}
	#overall-picture .pht {
		width: 100%;
	}
		#overall-picture .pht img {
			width: 100%;
			height: auto;
		}

	#overall-picture .text {
		width: 100%;
		padding-bottom: 20px;
		padding-left: 0;
	}
		#overall-picture .text p.en {
			font-size: 12px;
		}

		#overall-picture .text h2 {
			font-size: 24px;
			margin-bottom: 12px;
		}

		#overall-picture .text .txt {
			font-size: 14px;
			line-height: 1.6em;
		}


	
	
/* company
--------------------- */
#company {
	padding: 60px 0;
}
	#company .keyword-head {
		display: block;
		padding: 0 0 0 0;
		border-bottom: none;
	}
	#company .keyword-head:nth-child(1) {
		border-top: none;
		margin-bottom: 25px;
	}
		#company .keyword-head .ttl {
			width: 100%;
			font-size: 20px;
			margin-bottom: 3px;
			padding-left: 0;
			text-align: center;
		}

		#company .keyword-head ul.keyword-box {
			width: 100%;
		}
			#company .keyword-head ul.keyword-box li {
				width: 49%;
				list-style: none;
				margin-right: 2%;
				margin-top: 2%;
			}
			#company .keyword-head ul.keyword-box li:nth-child(1) {
				width: 100%;
				margin-right: 0;
			}
			#company .keyword-head ul.keyword-box li:nth-child(4n) {
				margin-right: 2%;
			}
			#company .keyword-head ul.keyword-box li:nth-child(2n) {
				margin-right: 2%;
			}
			#company .keyword-head ul.keyword-box li:nth-child(3) {
				margin-right: 0;
			}
				#company .keyword-head ul.keyword-box li label.keyword_tag {
					height: 40px;
					border-radius: 5px;
					font-size: 14px;
				}



	#company .keyword-list {
		display: block;
		margin-top: 20px;
	}
	#company .keyword-list .list_item {
		width: 100%;
		border-radius: 6px 6px 6px 40px;
		margin: 30px 0 0 0;
		padding: 20px 25px 25px 25px;
	}
		#company .keyword-list .list_item h2 {
			font-size: 20px;
		}

		#company .keyword-list .list_item .pht {
			margin-top: 15px;
			margin-bottom: 15px;
		}
			#company .keyword-list .list_item .pht img {
				width: 48%;
				height: auto;
				border-radius: 6px;
			}

		#company .keyword-list .list_item h3 {
			font-size: 16px;
		}
			#company .keyword-list .list_item h3 br {
				display: none;
			}

		#company .keyword-list .list_item .txt {
			font-size: 13px;
		}

		#company .keyword-list .list_item ul.btn-list {
			width: 100%;
			position: static;
			margin-left: 0;
			margin-top: 20px;
		}
			#company .keyword-list .list_item ul.btn-list li {
				width: 49%;
				list-style: none;
			}
				#company .keyword-list .list_item ul.btn-list li a {
					height: 50px;
					background: #0055B8 url("../img/icon_arrow_white.svg") no-repeat right 10px center;
					border-radius: 25px;
					font-size: 13px;
					line-height: 1.3em;
				}










}
