/*---------------------------------
	mainvisual start
---------------------------------*/
.mainvisual{
	position: relative;
	width: 100%;
	height: 85vh;
	overflow: hidden;
	background: url('../../../assets/images/pages/top/mainvisual/background/pc.jpg') no-repeat bottom right;
}

.mainvisual_bg{
	position: absolute;
	top: 0;
	right: 0;
	z-index: 10;
	width: 65%;
	height: 100%;
	clip-path: polygon(10% 0, 100% 0%, 100% 100%, 0% 100%);
}

@media(1024px >= width >= 601px){
	.mainvisual{
		
		background: url('../../../assets/images/pages/top/mainvisual/background/tb.jpg') no-repeat bottom right;
	}
}

@media(600px >= width){
	.mainvisual{
		
		background: url('../../../assets/images/pages/top/mainvisual/background/sp.jpg') no-repeat bottom right;
	}
	.mainvisual_bg{
		position: absolute;
		top: 0;
		right: 0;
		z-index: 10;
		width: 100%;
		height: 65%;
		clip-path:none;
	}
}

.mainvisualImage{
	position: relative;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: left center;
}

.mainvisual_inner{
	position: absolute;
	z-index: 20;
	max-width: 90%;
}

@media(min-width: 601px){
	.mainvisual_inner{
		top: 35%;
		left: 5%;
		padding: 1em;
		transform: translateY(-35%);
	}
}




@media(max-width: 600px){
	.mainvisual_inner{
		bottom: 10%;
		left: 5%;
	}
}

.mainvisual_catch{
	display: flex;
	font-weight:900;
	flex-direction: column;
	align-items: flex-start;
	margin: 0;
	text-align: left;
	font-size: 415%;
	line-height: 200%;
	text-shadow: 4px 4px 3px #868686;
	
	> span {
		line-height: 150%;
	}
}

@media(max-width: 600px){
	.mainvisual_catch{
		font-size: 9vw;
	}
}

@media(1024px >= width >= 601px){
	.mainvisual_inner{
		top: 40%;
		transform: translateY(-50%);
	}
	.mainvisual_catch{
		font-size: 6vw;
	}
}

/*---------------------------------
	mainvisual end
---------------------------------*/
/*---------------------------------
	photoTiles start
---------------------------------*/
.photoTiles{
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	flex-wrap: wrap;
}

@media(min-width: 1025px){
	.photoTiles_item{
		width: calc(100% / 2);
	}
}

@media(max-width: 1024px) and (min-width: 601px){
	.photoTiles_item{
		width: calc(100% / 2);
	}
}

@media(max-width: 600px){
	.photoTiles_item{
		width: 100%;
	}
}

.photoTiles_link,
.photoTiles_link:hover{
	text-decoration: none;
}

.photoTiles_inner{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100%;
	aspect-ratio: 5/2;
	overflow: hidden;
}

.photoTiles_bg{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.25s;
}

.photoTiles_link:hover .photoTiles_bg{
	transform: scale(1.1);
}

.photoTiles_title{
	position: relative;
	z-index: 20;
	font-size: 175%;
	color: #FFF;
	text-align: center;
	text-shadow: 1px 1px 2px #000;
}

.photoTiles_button{
	position: absolute;
	z-index: 20;
	bottom: 15%;
	display: block;
	max-width: 100%;
	min-width: 13em;
	padding: 0.75em 1.5em;
	margin: 0;
	color: #333;
	text-align: center;
	font-weight: var(--fontWeightBold);
	font-size: 115%;
	text-decoration: none;
	background-color: #FFF;
	border:  2px solid #FFF;
	border-radius: 5px;
	outline: none !important;
	transition: background-color 0.25s, color 0.25s;
}

.photoTiles_link:hover .photoTiles_button{
	text-decoration: none;
}

/*---------------------------------
	photoTiles end
---------------------------------*/
/*---------------------------------
	recruitTiles start
---------------------------------*/
.recruitTiles{
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	flex-wrap: wrap;
}

.recruitTiles_item{
	position:relative;
	
	&.recruit01::before{
		content: "";
		position:absolute;
		top:0;
		left:0;
		display: inline-block;
		background-image: url("../../../assets/images/pages/top/recruit/recruit01.jpg");
		background-size: cover;
		background-repeat: no-repeat;
		width: 100%;
		height: 100%;
	}
	
	&.recruit02::before{
		content: "";
		position:absolute;
		top:0;
		left:0;
		display: inline-block;
		background-image: url("../../../assets/images/pages/top/recruit/recruit02.jpg");
		background-size: cover;
		background-repeat: no-repeat;
		width: 100%;
		height: 100%;
	}
}

@media(min-width: 1025px){
	.recruitTiles_item{
		width: calc(100% / 2);
	}
	

}

@media(max-width: 1024px){
	.recruitTiles_item{
		width: 100%;
		
		&.recruit02{
			height: 15em;
		}
	}
}

.recruitTiles_link,
.recruitTiles_link:hover{
	text-decoration: none;
}

.recruitTiles_inner{
	position:relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100%;
	overflow: hidden;
	padding:2em;
}

.recruitTextArea {
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,0.8);
	padding: 2.5em;
	display: flex;
	flex-direction: column;
	gap: 1em;
}

.recruitTiles_bg{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.25s;
}

.recruitTiles_bg_ob_c20{
	object-position: center 20%;
}

.recruitTiles_link:hover .recruitTiles_bg{
	transform: scale(1.1);
}

.recruitTiles_title{
	position: relative;
	z-index: 20;
	font-size: 175%;
	color: #FFF;
	text-align: center;
	text-shadow: 1px 1px 2px #000;
}

.recruitTiles_button{
	position: absolute;
	z-index: 20;
	bottom: 15%;
	display: block;
	max-width: 100%;
	min-width: 13em;
	padding: 0.75em 1.5em;
	margin: 0;
	color: #333;
	text-align: center;
	font-weight: var(--fontWeightBold);
	font-size: 115%;
	text-decoration: none;
	background-color: #FFF;
	border:  2px solid #FFF;
	border-radius: 5px;
	outline: none !important;
	transition: background-color 0.25s, color 0.25s;
}

.recruitTiles_link:hover .recruitTiles_button{
	text-decoration: none;
}

/*---------------------------------
	recruitTiles end
---------------------------------*/

/*---------------------------------
	greetingSideWidePhotoLayout start
---------------------------------*/
.greetingSideWidePhotoLayout{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2em;
	
	& .photoLayoutReverse{
	
	}
}

@media(min-width: 1025px){
	.greetingSideWidePhotoLayout:not(.photoLayoutReverse) .greetingSideWidePhotoLayout_photoLayout{
		position: absolute;
		top: 0;
		left: 50%;
		width: 50%;
	}
	
	.photoLayoutReverse .greetingSideWidePhotoLayout_photoLayout{
		position: absolute;
		top: 0;
		right: 50%;
		width: 50%;
	}
}

@media(max-width: 1024px){
	.greetingSideWidePhotoLayout_photoLayout{
		width: 90%;
		max-width: 750px;
		order: 1;
	}

}

.greetingSideWidePhotoLayout_photoWrapper{
	position: relative;
	width: 100%;
	aspect-ratio: 4/1.5;
}

.greetingSideWidePhotoLayout_photoWrapper img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.greetingSideWidePhotoLayout_contentLayout{
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	width: 90%;
	max-width: 1500px;
	margin: 0 auto;
}

@media(width > 1024px){
	.photoLayoutReverse .greetingSideWidePhotoLayout_contentLayout{
		justify-content: flex-end;
	}
}

@media(min-width: 1025px){
	.greetingSideWidePhotoLayout_contentInner{
		width: calc(46% - 1em);
	}
}

.greetingSideWidePhotoLayout_rounded_corners_Right{
	border-radius: 2em 0 0 2em;
	overflow: hidden;
}

.greetingSideWidePhotoLayout_rounded_corners_Left{
	border-radius: 0 2em 2em 0;
	overflow: hidden;
}


@media(1024px >= width){

	.greetingSideWidePhotoLayout_rounded_corners_Right,
	.greetingSideWidePhotoLayout_rounded_corners_Left{
		border-radius: 2em;
	}

}


/*---------------------------------
	greetingSideWidePhotoLayout end
---------------------------------*/
/*---------------------------------
	topContents start
---------------------------------*/
.topContentsTitle{
	position: relative;
}

.topContentsTitle .jpTitle {
	font-size: 1.75em;
	font-weight: var(--fontWeightBold);
	position: relative;
	background: linear-gradient(90deg,rgba(227, 216, 0, 1) 0%, rgba(208, 0, 0, 1) 45%, rgba(212, 23, 24, 1) 84%, rgba(225, 111, 112, 1) 100%);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	z-index:2;

}

.enTitle{
	position: absolute;
	top:0;
	left:1rem;
	z-index:1;
	font-size:5em;
	line-height: 1.2;
	color:#DFDFDF;
	font-weight: var(--fontWeightBold);
}

@media(600px >= width){
	.enTitle{
		font-size:4em;
	}
}

/*---------------------------------
	topContents end
---------------------------------*/
/*---------------------------------
	GmapBand start
---------------------------------*/
.GmapBand{
	position: relative;
	width: 100%;
	padding-top: 400px;
}

.GmapBand iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	
}

/*---------------------------------
	topGmapBand start
---------------------------------*/