@charset "utf-8";
/* Copyright 2019 FSFIELD All Rights Reserved. */

@media screen and (min-width:768px){ /* 表示領域が768px以上の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	PC

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

	/* ------------------------------------------------------------

	生物学類について

	------------------------------------------------------------ */

	/* グローバルナビアクティブ
	---------------------------------------------- */
	.nav_global ul li.s03::before{background: #00AE8F;}
	
	.nav_global ul li.s03 a:hover{opacity: 1;}
	
	/* ページタイトル
	---------------------------------------------- */
	.pagettl::before{background: url("../about/img/pc/bg_pagettl01.png") no-repeat 0 center;}
	
	/* コンテンツ
	---------------------------------------------- */
	.lead{margin-bottom: 55px;}
	
	.about{
		display:-webkit-flex;/*--safari用--*/
		display:flex;
		-webkit-justify-content:space-between;/*--safari用--*/
		justify-content:space-between;
		margin-bottom: 50px;
	}
	
	.about:last-of-type{margin-bottom: 80px;}
	
	.about .image{
		width: 286px;
		height: 192px;
		background-size: cover !important;
		margin-top: 10px;
		position: relative;
	}
	
	#about01 .image{background: url("../about/img/img_about01.jpg") no-repeat 0 center;}
	#about02 .image{background: url("../about/img/img_about02.jpg") no-repeat 0 center;}
	#about03 .image{background: url("../about/img/img_about03.jpg") no-repeat 0 center;}
	#about04 .image{background: url("../about/img/img_about04.jpg") no-repeat 0 center;}
	#about05 .image{background: url("../about/img/img_about05.jpg") no-repeat 0 center;}
	#about06 .image{background: url("../about/img/img_about06.jpg") no-repeat 0 center;}
	#about07 .image{background: url("../about/img/img_about07.jpg") no-repeat 0 center;}
	#about08 .image{background: url("../about/img/img_about08.jpg") no-repeat 0 center;}
	#about09 .image{background: url("../about/img/img_about09.jpg") no-repeat 0 center;}

	#about10 .image{
		background: url("../about/img/img_about10.jpg") no-repeat 0 center;
		height: 252px;
	}
	
	#about10 .image .image_note{
		width: 132px;
		font-size: 1.2rem;
		line-height: 1.4;
		position: absolute;
		top: 155px;
		right: 0;
	}

	#about11 .image{background: url("../about/img/img_about11.jpg") no-repeat 0 center;}
	
	.about_inner{width: 530px;}
	
	.about_inner h3{
		color: #214354;
		font-size: 2rem;
		font-weight: bold;
		margin-bottom: 18px;
	}

	/*--卒業後の進路ボタン--*/
	.btn_course01{margin-top: 20px;}
	
	.btn_course01 a{
		background: url("../img/ico_arrow09.png") no-repeat 0 0.3em;
		background-size: 17px;
		color: #333;
		display: inline-block;
		padding-left: 25px;
		text-decoration: underline !important;
	}
	
	.btn_course01 a:hover{color: #00AE8F;}
	
	/*--学年進行--*/
	.progress{
		background: #FFF;
		padding: 60px 30px 0;
	}
	
	.progress h3{
		color: #224355;
		font-size: 3.2rem;
		font-weight: bold;
		line-height: 1.2;
		margin-bottom: 50px;
	}
	
	.grade{
		border-top:1px solid #EEEEEE;
		padding: 15px 0 50px;
	}
	
	.grade:first-of-type .explanation{margin-bottom: 20px;}
	
	.grade h4{
		color: #224355;
		font-weight: bold;
		font-size: 2rem;
		margin-bottom: 10px;
	}
	

}/*--@media--*/


@media screen and (max-width:767px){ /* 表示領域が767px以下の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	スマートフォン（iPhone,Android)

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

	/* ------------------------------------------------------------

	生物学類について

	------------------------------------------------------------ */

	/* ページタイトル
	---------------------------------------------- */
	.pagettl_inner{background: url("../about/img/sp/bg_pagettl01.jpg") no-repeat center center;}

	/* コンテンツ
	---------------------------------------------- */
	.lead{margin-bottom: 50px;}
	
	.about{margin-bottom: 50px;}
	
	.about:last-of-type{margin-bottom: 60px;}
	
	.about .image{
		width: 100%;
		background-size: cover !important;
		padding-top: 50%;
		margin-bottom: 20px;
		position: relative;
	}
	
	#about01 .image{background: url("../about/img/img_about01.jpg") no-repeat 0 center;}
	#about02 .image{background: url("../about/img/img_about02.jpg") no-repeat 0 center;}
	#about03 .image{background: url("../about/img/img_about03.jpg") no-repeat 0 center;}
	#about04 .image{background: url("../about/img/img_about04.jpg") no-repeat 0 center;}
	#about05 .image{background: url("../about/img/img_about05.jpg") no-repeat 0 center;}
	#about06 .image{background: url("../about/img/img_about06.jpg") no-repeat 0 center;}
	#about07 .image{background: url("../about/img/img_about07.jpg") no-repeat 0 center;}
	#about08 .image{background: url("../about/img/img_about08.jpg") no-repeat 0 center;}
	#about09 .image{background: url("../about/img/img_about09.jpg") no-repeat 0 center;}

	#about10 .image{
		background: url("../about/img/img_about10.jpg") no-repeat 0 center;
		padding-top: 88%;
	}
	
	#about10 .image .image_note{
		font-size: 3vw;
		line-height: 1.4;
		position: absolute;
		top: 60%;
		right: 0;
	}

	#about11 .image{background: url("../about/img/img_about11.jpg") no-repeat 0 center;}
		
	.about_inner h3{
		color: #214354;
		font-size: 1.8rem;
		font-weight: bold;
		margin-bottom: 15px;
	}

	/*--卒業後の進路ボタン--*/
	.btn_course01{margin-top: 20px;}
	
	.btn_course01 a{
		background: url("../img/ico_arrow09.png") no-repeat 0 0.3em;
		background-size: 15px;
		color: #333;
		padding-left: 20px;
		display: inline-block;
		text-decoration: underline !important;
	}
	
	.btn_course01 a:hover{color: #00AE8F;}
	
	/*--学年進行--*/
	.progress{
		background: #FFF;
		padding: 40px 20px 0;
	}
	
	.progress h3{
		color: #224355;
		font-size: 2.3rem;
		font-weight: bold;
		line-height: 1.2;
		margin-bottom: 35px;
	}
	
	.grade{
		border-top:1px solid #EEEEEE;
		padding: 15px 0 40px;
	}
	
	.grade:first-of-type .explanation{margin-bottom: 30px;}
	
	.grade h4{
		color: #224355;
		font-weight: bold;
		font-size: 1.8rem;
		margin-bottom: 10px;
	}


}/*--@media--*/


