@charset "UTF-8";


/* +++.message+++ */
.message{
	padding-top: 0;
}
.message .pic{
	margin-bottom: 7.2rem;
}
.message .sec-title02{
	font-size: 2.4rem;
}
.message .sec-title02:not(:nth-of-type(1)){
	margin-top: 7.2rem;
}
.message p,
.reason{
	max-width: 96rem;
	margin-left: auto;
	margin-right: auto;
}
.message p{
	margin-bottom: 2em;
}
.mb0{
	margin-bottom: 0 !important;
}
.reason h4{
	color: #e60012;
	line-height: 1.5;
	font-size: 1.8rem;
	margin-bottom: 1.2rem;
}
.reason h4>span{
	padding-left: 1.75em;
	text-indent: -1.75em;
}
.reason h4>span:before{
	content: attr(data-no);
	font-family: 'Outfit', 'Zen Kaku Gothic New', YuGothic, 游ゴシック, メイリオ, Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
}



/* +++school-slide01+++ */
.school-slide01{
	transition: .8s all ease;
}
.portfolio{
	padding-inline: 0;
}




.school-slide01 a{
	display: block;
	position: relative;
}
.school-slide01 a h3{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	transition: .3s all ease;
	transition-delay: 0;
	visibility: hidden;
	opacity: 0;
	font-size: 1.6rem;
}
.school-slide01 a:hover h3{
	opacity: 1;
	visibility: visible;
	transition-delay: .3s;
}
.school-slide01 li .pic{
	position: relative;
	overflow: hidden;
}
.school-slide01 .pic{
	height: calc(100vw / 3.5 / 3 * 2);
}

.school-slide .pic img{
	height: 100%;
	object-position: center top;
}

.school-slide01 li .pic:before{
	font-family: 'Outfit', 'Zen Kaku Gothic New', YuGothic, 游ゴシック, メイリオ, Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
	--spacing: .1em;
	font-weight: 400;
	color: #fff;
	content: "";
	display: flex;
	justify-content: center;
	align-items: center;
	width: 120%;
	height: 100%;
	position: absolute;
	background: #3dd2b7;
	transform: skew(-15deg, 0) scale(0,1);
	left: -10%;
	top: 0;
	transition: .3s all ease;
	opacity: 0;
}
.school-slide01 li:hover .pic:before{
	transform: skew(-15deg, 0) scale(1,1);
	opacity: .85;
}



@media screen and (max-width: 768px){

/* +++.message+++ */
	.message .pic{
		margin-bottom: 3.6rem;
		height: 12rem;
	}
	.message .sec-title02{
		font-size: 1.7rem;
	}
	.message .sec-title02:not(:nth-of-type(1)){
		margin-top: 4.8rem;
	}
	.message p,
	.reason{
		max-width: 100%;
	}

	.reason h4{
		font-size: 1.6rem;
		margin-bottom: 1rem;
	}



/* +++school-slide01+++ */
	.school-slide01{
		padding-bottom: 0;
	}
	.school-slide01 .pic{
		height: calc(100vw / 1.25 / 3 * 2);
	}


}