/* CSS Document */
/*==================================================

top-contents
=================================================*/

.education-cont .inner {
	width: 100%;
	position: relative;
	background-color: #ccecff;
	background-image: url("../../environment/images/env_bg.png");
	background-position: right bottom;
	background-repeat: no-repeat;
	background-size: 20%;
	margin-top: 80px;
	padding: 0 0 80px;
}
.education-cont .inner.fin {
	background-color: #fff600;
}
.education-cont .inner::before {
	content: " ";
	display: block;
	position: absolute;
	width: 100%;
	height: 3.2em;
	background-color: #fff;
	top: 0;
	left: 0;
	z-index: 1;
}
.education-cont .inner section {
	width: 90%;
	max-width: 1200px;
	position: relative;
	margin: 0 auto;
	z-index: 2;
}
.education-cont .inner section.list {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: flex-start;
	padding: 120px 0 0;
}
.education-cont .inner section.list h2 {
	width: 240px;
	color: #FFF;
	text-align: center;
	background-image: url("../../environment/images/title_bg2.png");
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 3.6em .5em;
}
.education-cont .inner section.list p {
	flex: 1;
	margin: 0;
	padding: 0 0 0 3em;
}
.education-cont .inner .member {
	width: 110%;
	max-width: 1400px;
	position: absolute;
	left: 50%;
	bottom: 0;
	-webkit-transform: translate(-50%, 0); 
	transform: translate(-50%, 0);
	z-index: 3;
}
.education-cont .inner .member > div {
	width: 18.3%;
}
.education-cont .inner .member > div.re {
	margin: 0 0 0 auto;
}
.education-cont .inner section h1 {
	color: #FFF;
	background-image: url("../../environment/images/title_bg.png");
	background-position: right center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: .8em 1em;
}
.education-cont .inner.fin section h1 {
	filter: grayscale(1)
}
.education-cont .inner section h1 strong {
	display: inline-block;
	border: 3px solid #FFF;
	margin-right: .5em;
	padding: .1em .3em;
}
.education-cont .inner section p {
	font-size: clamp(1.6rem, 2vw, 2rem);
	line-height: 180%;
	margin: 2.5em 0;
}
.education-cont .inner section dl {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center; 
	margin: 2.5em 0 0;
}
.education-cont .inner section dl.re {
	flex-direction: row-reverse;
}
.education-cont .inner section dl dt {
	width: 45.8%;
}
.education-cont .inner section dl dd {
	width: 50%;
}
.education-cont .inner section dl dd p {
	margin: 0;
}
.education-cont .inner section .graph {
	margin: 3em 0 0;
}
.education-cont .inner section .graph .option {
	max-width: 776px;
	margin: 2.5em auto 0;
}

.education-cont img {
	width: 100%;
	max-width: 100%;
	height: auto;
}

@media only screen and (min-width:1px) and (max-width: 768px) {
	
	.top-image .person img {
		width: 130%;
		max-width: 130%;
		height: auto;
		margin-left: -15%;
	}
	.education-cont .inner {
		width: 100%;
		margin-top: 10%;
		padding: 0 0 8%;
	}
	.education-cont .inner section h1 {
		text-align: center;
		background-position: center center;
	}
	.education-cont .inner section h1 strong {
		display: inline-block;
		border: 3px solid #FFF;
		margin-right: 0;
		margin-bottom: .5em;
		padding: .1em .3em;
	}
	.education-cont .inner section p {
		font-size: clamp(1.6rem, 2vw, 2rem);
		line-height: 180%;
		margin: 5% 0;
	}
	.education-cont .inner section dl {
		width: 100%;
		flex-direction: column-reverse;
		margin: 5% 0 0;
	}
	.education-cont .inner section dl.re {
		flex-direction: column-reverse;
	}
	.education-cont .inner section dl dt {
		width: 100%;
	}
	.education-cont .inner section dl dd {
		width: 100%;
	}
	.education-cont .inner section dl dd p {
		margin: 0 0 5%;
	}
	.education-cont .inner .member > div {
		width: 30%;
	}
	.education-cont .inner section.list {
		flex-direction: column;
		padding: 12% 0 0;
	}
	.education-cont .inner section.list h2 {
		width: 100%;
		color: #FFF;
		text-align: center;
		background-image: url("../../environment/images/title_bg.png");
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;
		margin-bottom: 1em;
		padding: .6em .5em;
	}
	.education-cont .inner section.list p {
		width: 100%;
		margin: 0;
		padding: 0;
	}
	.education-cont .inner section .graph {
		margin: 2em 0 0;
	}
	.education-cont .inner section .graph .option {
		width: 75%;
		margin: 1em auto 0;
	}
}
@media only screen and (min-width:1px) and (max-width: 568px) {}
@media only screen and (min-width:1px) and (max-width: 480px) {}