@charset "UTF-8";
/* CSS Document */





	
	
/* pagetitle
--------------------- */
#pagetitle {
	background: url("../img/pagetitle_img.jpg") no-repeat center / cover;
}




	
	
/* set
--------------------- */
.set .column3 li {
	width: 32%;
	margin-right: 2%;
	margin-bottom: 30px;
	border-bottom: solid 1px #ddd;
	position: relative;
}
.set .column3 li:nth-child(3n) {
	margin-right: 0;
}
.set .column3 li:before {
	content: "";
	width: 30px;
	height: 1px;
	background: #8EC21F;
	position: absolute;
	bottom: -0.5px;
	right: 0;
}
.set .column3 li:nth-child(3n) {
	margin-right: 0;
}
	.set .column3 li a {
		display: block;
	}
		.set .column3 li a .pht {
			overflow: hidden;
		}
			.set .column3 li a .pht img {
				-moz-transition: -moz-transform 0.2s linear;
				-webkit-transition: -webkit-transform 0.2s linear;
				-o-transition: -o-transform 0.2s linear;
				-ms-transition: -ms-transform 0.2s linear;
				transition: transform 0.2s linear;
			}
			.set .column3 li a:hover .pht img {
				-webkit-transform: scale(1.05);
				-moz-transform: scale(1.05);
				-o-transform: scale(1.05);
				-ms-transform: scale(1.05);
				transform: scale(1.05);
			}

		.set .column3 li a h3 {
			display: flex;
			justify-content: flex-start;
			align-items: center;
			text-align: left;
			height: 60px;
			font-size: 1.6rem;
			line-height: 1.4em;
			padding-right: 40px;
			background: url("../../common/img/icon_arrow_green.svg") no-repeat right 10px center / 8px;
		}



.set .box {
	margin-bottom: 30px;
}
	.set .box .pht {
		width: 200px;
	}
		.set .box .pht p.caption {
			text-align: center;
			font-size: 1.5rem;
		}


	.set .box .text {
		width: -webkit-calc(100% - 200px);
		width: calc(100% - 200px);
		padding-left: 20px;
	}
		.set .box .text h3 {
			font-size: 2.0rem;
			line-height: 1.4em;
			color: #8EC21F;
			margin-bottom: 5px;
		}

	.set .box .text_left {
		width: -webkit-calc(100% - 200px);
		width: calc(100% - 200px);
		padding-right: 20px;
	}
		.set .box .text_left h3 {
			font-size: 2.0rem;
			line-height: 1.4em;
			color: #8EC21F;
			margin-bottom: 5px;
		}

	.set .box .text_all {
		width: 100%;
	}
		.set .box .text_all h3 {
			font-size: 2.0rem;
			line-height: 1.4em;
			color: #8EC21F;
			margin-bottom: 5px;
		}


.graduate .set .position {
	width: 18%;
	padding-left: 20px;
}
.graduate .set .staff {
	width: 24%;
	padding-left: 20px;
}
.graduate .set .subject {
	width: 57%;
	padding-left: 20px;
}



.graduate .set .name {
	text-align: right;
}
	.graduate .set .name span {
		font-size: 3.0rem;
		font-weight: 500;
		line-height: 1.4em;
	}
	.graduate .set .en {
		text-align: right;
		font-size: 1.4rem;
		font-weight: 500;
		line-height: 2.0em;
		letter-spacing: 0.20em;
		font-family: 'Cormorant Infant', serif;
	}



.graduate .set .btn {
	position: relative;
	margin: 10px auto;
}



.graduate .set .photo {
	width: 300px;
	margin: 10px auto 10px auto;
}
	.graduate .set .photo img {
		width: 100%;
	}
	.graduate .set .photo p.caption {
		text-align: center;
		font-size: 1.5rem;
	}



.graduate .set .study {
	width: 140px;
	padding-left: 0;
}

.graduate .set .theme {
	width: -webkit-calc(100% - 140px);
	width: calc(100% - 140px);
/* 	padding-left: 20px; */
	margin-bottom: 8px;
}




.tab-area {
	display: flex;/* flexで横並び */
	border: solid 1px #ddd;
	cursor: pointer;/* カーソルポインターに */
	margin-bottom: 50px;
}

.tab {
	width: calc(100%/2);/* calc関数を使用し、均等に2分割する */
	padding: 5px;
	text-align: center;/* 文字を中央に。 */
	font-size: 1.5rem;
	font-weight: 300;
}

.tab:nth-child(n+2) {
	border-left: solid 1px #ddd;
}

.tab.active {
	background-color: #8EC21F;
	color: #fff;
	font-weight: 600;
}


.panel {
	display: none;
}

.panel.active {
	display: block;
}



/* 1024px */
@media screen and (max-width: 1024px) {


}

	







/* max 767px */
@media screen and (max-width: 767px) {





	
	
/* set
--------------------- */
.set .column3 li {
	width: 48%;
	margin-right: 4%;
	margin-bottom: 30px;
	border-bottom: solid 1px #ddd;
	position: relative;
}
.set .column3 li:nth-child(2n) {
	margin-right: 0;
}
.set .column3 li:nth-child(3) {
	margin-right: 4%;
}
.set .column3 li:before {
	width: 20px;
}
	.set .column3 li a h3 {
		height: 54px;
		font-size: 1.4rem;
		padding-right: 30px;
		background: url("../../common/img/icon_arrow_green.svg") no-repeat right 7px center / 8px;
	}



.set .box {
	margin-bottom: 30px;
}
	.set .box .pht {
		width: 35%;
	}
		.set .box .pht p.caption {
			text-align: center;
			font-size: 1.5rem;
		}

	.set .box .text {
		width: 65%;
		padding-left: 20px;
	}
		.set .box .text h3 {
			font-size: 1.8rem;
		}

	.set .box .text_left {
		width: 65%;
		padding-right: 20px;
	}
		.set .box .text_left h3 {
			font-size: 1.8rem;
		}

	.set .box .text_all {
		width: 100%;
	}
		.set .box .text_all h3 {
			font-size: 1.8rem;
		}



.graduate .set .position {
	width: 18%;
	padding-left: 10px;
	font-size: 1.4rem;
}
.graduate .set .staff {
	width: 24%;
	padding-left: 10px;
	font-size: 1.4rem;
}
.graduate .set .subject {
	width: 57%;
	padding-left: 10px;
	font-size: 1.4rem;
}



.graduate .set .name {
	text-align: right;
	font-size: 1.4rem;
}
	.graduate .set .name span {
		font-size: 2.0rem;
		font-weight: 500;
		line-height: 1.4em;
	}
	.graduate .set .en {
		text-align: right;
		font-size: 1.2rem;
		font-weight: 500;
		line-height: 2.0em;
		letter-spacing: 0.14em;
		font-family: 'Cormorant Infant', serif;
	}



.graduate .set .photo {
	width: 50%;
	margin: 10px auto 10px auto;
}
	.graduate .set .photo img {
		width: 100%;
	}
	.graduate .set .photo p.caption {
		text-align: center;
		font-size: 1.4rem;
	}



.graduate .set .study {
	width: 100%;
	font-size: 1.4rem;
	padding-left: 0;
}

.graduate .set .theme {
	width: 100%;
	font-size: 1.4rem;
	padding-left: 0;
	margin-bottom: 20px;
}





.tab-area {
	display: flex;/* flexで横並び */
	border: solid 1px #ddd;
	cursor: pointer;/* カーソルポインターに */
	margin-bottom: 50px;
}

.tab {
	width: calc(100%/2);/* calc関数を使用し、均等に2分割する */
	padding: 5px;
	text-align: center;/* 文字を中央に。 */
	font-size: 1.4rem;
	font-weight: 300;
}

.tab:nth-child(n+2) {
	border-left: solid 1px #ddd;
}

.tab.active {
	background-color: #8EC21F;
	color: #fff;
	font-weight: 600;
}


.panel {
	display: none;
}

.panel.active {
	display: block;
}





}