/*
 * base css 
 * pc width 1000px fixed
 */

@media (max-width: 599px) {
}

@media (min-width: 600px) and (max-width:959px) {
}

@media (min-width: 960px) {
}

@media (max-width: 480px) {
}

@media (min-width: 481px) and (max-width:767px) {
}

@media (min-width: 768px) and (max-width:959px) {
}

@media (min-width: 960px) {
}

@media (max-width: 767px) {
}

@media (min-width: 768px) {
}

/*
 * pc 1 / .651
 * sp	320-375 1 / .853
 *		(375-767 1 / .489 , 2.045 / 1)
*/

/* ---------------------------------------- common */

/* 
----------- inner in style-base.css 
.inner {
	max-width: 1182px;
	margin: 0 auto;
}
rgb(200 187 162)

*/

@media (max-width: 767px) {
	html {
		scroll-padding-top: 80px;
	}
}
@media (min-width: 768px) {
	html {
		scroll-padding-top: 120px;
	}
}

footer { padding: 0; }

/* ---------------------------------------- visual */
/* dcd6ca */
#visual { position: relative; }
#visual .inner { position: relative; }
#visual::after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	/* background: rgba( 220, 214, 202, .8 ); */
	background: rgba( 92, 60, 12, .25 );
	/* mix-blend-mode: multiply; */
	position: absolute;
	top: 0;
	left: 0;
}

#visual.graduates::after {
	background-image: linear-gradient(90deg, rgba(200, 187, 162, 1), rgba(255, 255, 255, 0));
}

#maintt {
	position: absolute;
	top: 50%;
	left: 0;
	z-index: 3;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	color: #fff;
	font-family: "Lilita One", sans-serif;
	line-height: 1.2;
}
#maintt small {
	display: block;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
}

@media (max-width: 767px) {

	#visual { padding: 0 20px; }
	#visual .inner { 
		width: 100%;
		height: 7.5em;
		font-size: clamp(1.3rem, -0.278rem + 5.45vw, 1.6rem); 
	}
	#maintt {
		font-size: clamp(2.6rem, 0.17rem + 7.27vw, 3rem);
	}
	#maintt small {
		font-size: clamp(1.2rem, 0.023rem + 3.64vw, 1.4rem);
	}

}

@media (min-width: 500px) and (max-width:767px) {
	#visual .inner { 
		height: 10em;
	}
}


@media (min-width: 768px) {

	#visual { padding: 0 24px; }
	#visual .inner { 
		width: 100%;
		height: 16em;
		font-size: clamp(1.2rem, 0.23rem + 1.21vw, 1.8rem); 
	}
	#maintt {
		font-size: clamp(4.6rem, 0.079rem + 5.83vw, 7rem);
	}
	#maintt small {
		font-size: clamp(1.2rem, 0.051rem + 1.46vw, 1.8rem);
	}

}

/* ---------------------------------------- main */

main {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
}
.addentt h2 {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
}
.addentt p {
	color: var( --orange-color );
	font-family: "Lilita One", sans-serif;
	line-height: 1;
	position: relative;
}
.addentt p::after {
	content: "";
	display: block;
	width: 100%;
	height: .222222em;
	background: var( --orange-color );
	position: absolute;
	top: 50%;
	left: 0;
	z-index: -1;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
.addentt p span {
	display: inline-block;
	background: #fff;
	padding: 0 .25em 0 0;
}


@media (max-width: 767px) {

	main { 
		font-size: clamp(1.3rem, -0.278rem + 5.45vw, 1.6rem);
		padding: 3.125em 20px;
	}
	.addentt { margin: 0 0 1.875em; }
	.addentt p span {
		font-size: clamp(3.4rem, -0.057rem + 10.91vw, 4rem);
	}
	.addentt h2 {
		font-size: clamp(1.4rem, 0.236rem + 5.818vw, 1.6rem);
	}
	.addentt p small {
		display: block;
		color: #000;
		font-size: clamp(1.2rem, 0.517rem + 0.49vw, 1.4rem);
		line-height: 1.4;
		margin: 1em 0 0;
	}

	/* section, inner-s */

	main > section:not(:last-child),
	.headline {
		margin: 0 0 4em;
	}

}

@media (min-width: 768px) {

	main {
		font-size: clamp(1.2rem, 0.23rem + 1.21vw, 1.8rem);
		padding: 6em 24px;
	}
	.addentt { margin: 0 0 2.77777em; }
	.addentt h2 {
		font-size: clamp(1.2rem, 0.23rem + 1.21vw, 1.8rem);
		line-height: 1.4;
	}
	.addentt p span {
		font-size: clamp(5.2rem, -0.012rem + 6.8vw, 8rem);
	}
	.addentt p small {
		display: inline-block;
		color: #000;
		font-size: clamp(1.2rem, 0.517rem + 0.49vw, 1.4rem);
		-webkit-transform: translateY(10%);
		transform: translateY(10%);
	}

	/* section, inner-s */

	main > section:not(:last-child),
	.headline {
		margin: 0 0 5.5555em;
	}

	.inner-s {
		max-width: 1000px;
		margin: 0 auto;
	}


}

/* ---------------------------------------- breadcrumb */

#breadcrumbs {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
}

@media (max-width: 767px) {
	.breadcrumb { 
		padding: 0 20px; 
		margin: 0 0 2em;
	}
	#breadcrumbs { 
		font-size: clamp(1.2rem, 0.571rem + 0.89vw, 1.6rem);
	}
}

@media (min-width: 768px) {
	.breadcrumb { 
		padding: 0 24px;
		margin: 0 0 4em; 
	}
	#breadcrumbs {
		font-size: clamp(1.2rem, -0.078rem + 1.72vw, 1.6rem);
	}
}
