/* CSS Document */

/*==================================================

contents
=================================================*/

#top-image {
	width: 100%;
	position: relative;
	overflow: hidden;
	z-index: 3;
}
#top-image .head-txt {
	width: 90%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -55%);
	z-index: 2;
}
#top-image.recruit {
	clip-path: polygon(0 0, 100% 0%, 100% 90%, 0% 100%);
}
#top-image.recruit .head-txt {
	top: initial;
	top: auto;
	bottom: 0;
	transform: translate(-50%, -40%);
	z-index: 2;
}
#top-image .head-txt h1 {
	color: #FFF;
	text-align: center;
	font-size: clamp(4rem, 9vw, 9rem);
	font-weight: 500;
	line-height: 140%;
}
#top-image .head-txt h2 {
	color: #FFF;
	text-align: center;
	font-size: clamp(1.8rem, 2.4vw, 2.4rem);
	font-weight: 500;
	line-height: 140%;
}
#top-image.recruit .head-txt h1 {
	text-align: left;
	font-size: clamp(4rem, 12vw, 15rem);
	font-style: italic;
	font-weight: 400;
	line-height: 110%;
}
#top-image.recruit .head-txt h1 span {
	display: block;
	text-align: left;
	font-size: clamp(2rem, 4.8vw, 4.8rem);
	font-style: normal;
	font-weight: 500;
	line-height: 140%;
	letter-spacing: .2em;
	margin-top: .5em;
}
#top-image #particles-js {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
#top-image img {
	width: 100%;
	max-width: 100%;
	height: auto;
}

.section-title {
	width: 100%;
	text-align: center;
	border: 1px solid #CCC;
	background-color: #fff;
	padding: .5em 1em;
}
.category-title {
	width: 100%;
	color: #FFF;
	text-align: center;
	background-color: #333;
	margin-top: 2em;
	padding: .5em 1em;
}

@media only screen and (min-width:1px) and (max-width: 768px) {
	
	#top-image.recruit .head-txt {
		top: initial;
		top: auto;
		bottom: 0;
		transform: translate(-50%, -35%);
		z-index: 2;
	}
	#top-image.recruit {
		clip-path: polygon(0 0, 100% 0%, 100% 95%, 0% 100%);
	}
	#top-image h1,#top-image .clone {
		font-size: 13vw;
		text-align: center;
	}
	#top-image img {
		width: 150%;
		max-width: 150%;
		height: auto;
		margin-left: -25%;
	}
}

@media only screen and (min-width:1px) and (max-width: 568px) {
	

}
	
@media only screen and (min-width:1px) and (max-width: 480px) {
	

}