@charset "utf-8";
/* Copyright 2019 FSFIELD All Rights Reserved. */

@media screen and (min-width:768px){ /* 表示領域が768px以上の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	PC

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

	/* ------------------------------------------------------------

	コース選択

	------------------------------------------------------------ */

	/* グローバルナビアクティブ
	---------------------------------------------- */
	.nav_global ul li.s04::before{background: #00AE8F;}
	
	.nav_global ul li.s04 a:hover{opacity: 1;}
	
	/* ページタイトル
	---------------------------------------------- */
	.pagettl_course00::before{background: url("../course/img/pc/bg_pagettl00.png") no-repeat 0 center;}
	.pagettl_course01::before{background: url("../course/img/pc/bg_pagettl01.png") no-repeat 0 center;}
	.pagettl_course02::before{background: url("../course/img/pc/bg_pagettl02.png") no-repeat 0 center;}
	.pagettl_course03::before{background: url("../course/img/pc/bg_pagettl03.png") no-repeat 0 center;}
	.pagettl_course04::before{background: url("../course/img/pc/bg_pagettl04.png") no-repeat 0 center;}
	.pagettl_course05::before{background: url("../course/img/pc/bg_pagettl05.png") no-repeat 0 center;}
	.pagettl_course06::before{background: url("../course/img/pc/bg_pagettl06.png") no-repeat 0 center;}

	/* コンテンツ共通
	---------------------------------------------- */
	.lead{
		padding-bottom: 70px;
		margin-bottom: 40px;
		border-bottom: 1px solid #E0E0D8;
	}
	
	.lead p{
		margin-bottom: 20px;
	}
	.lead.course00 p{
		max-width: 860px;
		margin:0 auto;
	}
	.lead p:last-of-type{margin-bottom: 0;}

	.sec_course01{
		padding-bottom: 80px;
		border-bottom: 1px solid #E0E0D8;
	}
	
	.txt_course01{
		text-align: center;
		padding: 80px 0;
	}

	.txt_course02{margin-bottom: 30px;}

	.link_course01 a{
		background: url("../img/ico_arrow07.png") no-repeat right 0.45em;
		background-size: 14px;
		display: inline-block;
		color: #333;
		padding-right: 22px;
		text-decoration: underline;
	}
	
	.link_course01 a:hover{color: #8DBEDB;}

	/*--リスト--*/
	.list_course01{
		display:-webkit-flex;/*--safari用--*/
		display:flex;
		-webkit-flex-wrap:wrap;/*--safari用--*/
		flex-wrap:wrap;
		-webkit-align-items:center;/*--safari用--*/
		align-items:center;
		margin-bottom: -10px;
	}
	
	.list_course01 li{
		display: inline-block;
		font-size: 1.8rem;
		line-height: 37px;
		min-height: 37px;
		background-image: url("../img/ico_circle01.png"), url("../img/bg_bdr01.png");
		background-repeat: no-repeat, no-repeat;
		background-position: left center, right center;
		background-size: 8px, 14px;
		padding: 0 25px 0 14px;
		margin: 0 10px 10px 0;
	}
	
	.list_course01 li:last-of-type{
		background-image: url("../img/ico_circle01.png");
		background-repeat: no-repeat;
		background-position: left center;
		padding-right: 0;
		margin-right: 0;
	}
	
	/*--主な教員--*/
	.main_staff{
		max-width: 860px;
		margin: 0 auto 80px;
	}
	
	.wrap_staff{
		display:-webkit-flex;/*--safari用--*/
		display:flex;
		-webkit-flex-wrap:wrap;/*--safari用--*/
		flex-wrap:wrap;
		margin-right: -10px;
	}
	
	.staff{
		width: 206px;
		margin: 0 10px 10px 0;
	}
	
	.staff a{
		display: block;
		color: #333;
		text-align: center;
	}
	
	.staff a .photo{
		display: block;
		width: 100%;
		padding-top: 122.81%;
		background-size: cover !important;
		position: relative;
	}
	
	.staff a .txt{
		background: #FFF;
		padding: 10px 0 13px;
	}
	
	.staff a .name{
		color: #1F4352;
		font-size: 1.8rem;
		line-height: 1.2;
		font-weight: bold;
		margin-bottom: 6px;
	}
	
	.staff a .subject{
		color: #868686;
		font-size: 1.3rem;
		line-height: 1.2;
	}

	.staff a .photo .arrow{
		display: block;
		background: url(../img/img_arrow_base01.png) no-repeat;
		background-size: 60px;
		margin: -60px 0 0 auto;
		font-size: 0;
		width: 60px;
		height: 60px;
		overflow:hidden;
		position: relative;
	}

	.staff a .photo .arrow::before,
	.staff a .photo .arrow::after{
		content:"";
		background:url(../img/ico_arrow01.png) no-repeat;
		background-size: 48px;
		display: block;
		width: 51px;
		height: 12px;
		position: absolute;
		left: 0;
		bottom: 10px;
	}

	.staff a .photo .arrow::before{
		transform: translate3d(0,0,0);
		opacity: 1;
	}

	.staff a:hover .photo .arrow::before{
		transform: translate3d(20px,0,0);
		opacity: 0;
		transition: all .3s;
	}

	.staff a .photo .arrow::after{
		transform: translate3d(-20px,0,0);
		opacity: 0;
	}

	.staff a:hover .photo .arrow::after{
		transform: translate3d(0,0,0);
		opacity: 1;
		transition: all .3s;
	}

	/* コース選択
	---------------------------------------------- */
	.lead.course00{
		text-align: center;
		padding: 0;
		margin-bottom: 80px;
		border: none;
	}
	
	.course{
		background-size: cover !important;
		background-attachment: fixed !important;
		width: 100%;
		height: 500px;
		position: relative;
		display:-webkit-flex;/*--safari用--*/
		display:flex;
		-webkit-justify-content:center;/*--safari用--*/
		justify-content:center;
		-webkit-align-items:center;/*--safari用--*/
		align-items:center;
		color: #FFF;
	}
	
	.course::before{
		content: "";
		display: block;
		width: 80%;
		height: 100%;
		margin: 0 10%;
		background: radial-gradient(circle farthest-side, rgba(0, 0, 0, 0.3),rgba(0, 0, 0, 0));
		position: absolute;
		top: 0;
		left: 0;
	}
	
	#course01{background: url("../course/img/pc/bg_course00_01.jpg") no-repeat 110px 0;}
	#course02{background: url("../course/img/pc/bg_course00_02.jpg") no-repeat 110px 0;}
	#course03{background: url("../course/img/pc/bg_course00_03.jpg") no-repeat 110px 0;}
	#course04{background: url("../course/img/pc/bg_course00_04.jpg") no-repeat 110px 0;}
	#course05{background: url("../course/img/pc/bg_course00_05.jpg") no-repeat 110px 0;}
	#course_globe{background: url("../course/img/pc/bg_course00_06.jpg") no-repeat 110px 0;}

	.course_inner{
		position: relative;
		z-index: 1;
	}

	.course h3{
		font-size: 3.2rem;
		font-weight: bold;
		line-height: 1.4;
		margin-bottom: 40px;
		text-align: center;
	}
	
	.btn_course01{text-align: center;}
	
	.btn_course01 a{
		display: inline-block;
		color: #FFF;
		text-align: center;
		font-size: 1.6rem;
		line-height: 1;
		border: 2px solid #FFF;
		border-radius: 50px;
		padding: 12px 22px 14px;
	}
	
	.btn_course01 a:hover{opacity: 0.7;}


}/*--@media--*/


@media screen and (max-width:767px){ /* 表示領域が767px以下の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	スマートフォン（iPhone,Android)

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

	/* ------------------------------------------------------------

	コース選択

	------------------------------------------------------------ */

	/* ページタイトル
	---------------------------------------------- */
	.pagettl_course00 .pagettl_inner{background: url("../course/img/sp/bg_pagettl00.jpg") no-repeat center center;}
	.pagettl_course01 .pagettl_inner{background: url("../course/img/sp/bg_pagettl01.jpg") no-repeat center center;}
	.pagettl_course02 .pagettl_inner{background: url("../course/img/sp/bg_pagettl02.jpg") no-repeat center center;}
	.pagettl_course03 .pagettl_inner{background: url("../course/img/sp/bg_pagettl03.jpg") no-repeat center center;}
	.pagettl_course04 .pagettl_inner{background: url("../course/img/sp/bg_pagettl04.jpg") no-repeat center center;}
	.pagettl_course05 .pagettl_inner{background: url("../course/img/sp/bg_pagettl05.jpg") no-repeat center center;}
	.pagettl_course06 .pagettl_inner{background: url("../course/img/sp/bg_pagettl06.jpg") no-repeat center center;}

	/* コンテンツ共通
	---------------------------------------------- */
	.lead{
		padding-bottom: 45px;
		margin-bottom: 20px;
		border-bottom: 1px solid #E0E0D8;
	}
	
	.lead p{margin-bottom: 20px;}
	
	.lead p:last-of-type{margin-bottom: 0;}

	.sec_course01{
		padding-bottom: 40px;
		border-bottom: 1px solid #E0E0D8;
	}
	
	.txt_course01{padding: 50px 30px;}

	.txt_course02{margin-bottom: 30px;}

	.link_course01 a{
		color: #333;
		text-decoration: underline;
		position: relative;
	}
	
	.link_course01 a::after{
		content: "";
		display: inline-block;
		width: 14px;
		height: 16px;
		background: url("../img/ico_arrow07.png") no-repeat right 2px;
		background-size: 14px;
		padding-left: 8px;
	}
	
	/*--リスト--*/
	.list_course01{
		display:-webkit-flex;/*--safari用--*/
		display:flex;
		-webkit-flex-wrap:wrap;/*--safari用--*/
		flex-wrap:wrap;
		-webkit-align-items:center;/*--safari用--*/
		align-items:center;
		margin-bottom: -10px;
	}
	
	.list_course01 li{
		display: inline-block;
		font-size: 1.6rem;
		line-height: 37px;
		min-height: 37px;
		background-image: url("../img/ico_circle01.png"), url("../img/bg_bdr01.png");
		background-repeat: no-repeat, no-repeat;
		background-position: left center, right center;
		background-size: 8px, 14px;
		padding: 0 22px 0 14px;
		margin: 0 8px 10px 0;
	}
	
	.list_course01 li:last-of-type{
		background-image: url("../img/ico_circle01.png");
		background-repeat: no-repeat;
		background-position: left center;
		padding-right: 0;
		margin-right: 0;
	}
	
	/*--主な教員--*/
	.main_staff{margin-bottom: 55px;}
	
	.main_staff h3{padding: 0 30px;}

	/* 主な教員 人間生物コース */
	.main_staff_course05{padding: 0 30px;}
	
	.main_staff_course05 h3{padding: 0;}
	
	.wrap_staff{
		display:-webkit-flex;/*--safari用--*/
		display:flex;
		-webkit-flex-wrap:wrap;/*--safari用--*/
		flex-wrap:wrap;
		padding: 0 2.5px;
		margin-bottom: -5px;
	}
	
	.staff{
		width: 33.3%;
		padding: 0 2.5px;
		margin: 0 0 5px;
	}
	
	.staff a{
		display: block;
		color: #333;
		text-align: center;
	}
	
	.staff a .photo{
		display: block;
		width: 100%;
		padding-top: 122.81%;
		background-size: cover !important;
		position: relative;
	}
	
	.staff a .txt{
		background: #FFF;
		padding: 10px 0;
	}
	
	.staff a .name{
		color: #1F4352;
		line-height: 1.2;
		font-weight: bold;
		margin-bottom: 6px;
	}
	
	.staff a .subject{
		color: #868686;
		font-size: 1.1rem;
		line-height: 1.2;
	}

	.staff a .photo .arrow{
		display: block;
		background: url(../img/img_arrow_base01.png) no-repeat;
		background-size: 35px;
		margin: -35px 0 0 auto;
		font-size: 0;
		width: 35px;
		height: 35px;
		overflow:hidden;
		position: relative;
	}

	.staff a .photo .arrow::before{
		content:"";
		background:url(../img/ico_arrow01.png) no-repeat;
		background-size: 30px;
		display: block;
		width: 30px;
		height: 7px;
		position: absolute;
		left: 0;
		bottom: 10px;
	}

	/* コース選択
	---------------------------------------------- */
	.lead.course00{
		padding: 0 30px;
		margin-bottom: 55px;
		border: none;
	}
	
	.course{
		background-size: cover !important;
		width: 100%;
		height: 100vw;
		display:-webkit-flex;/*--safari用--*/
		display:flex;
		-webkit-justify-content:center;/*--safari用--*/
		justify-content:center;
		-webkit-align-items:center;/*--safari用--*/
		align-items:center;
		color: #FFF;
	}
	
	#course01{background: url("../course/img/sp/bg_course00_01.jpg") no-repeat 0 0;}
	#course02{background: url("../course/img/sp/bg_course00_02.jpg") no-repeat 0 0;}
	#course03{background: url("../course/img/sp/bg_course00_03.jpg") no-repeat 0 0;}
	#course04{background: url("../course/img/sp/bg_course00_04.jpg") no-repeat 0 0;}
	#course05{background: url("../course/img/sp/bg_course00_05.jpg") no-repeat 0 0;}
	#course_globe{background: url("../course/img/sp/bg_course00_06.jpg") no-repeat 0 0;}

	.course h3{
		font-size: 6.14vw;
		font-weight: bold;
		line-height: 1.4;
		margin-bottom: 40px;
		text-align: center;
	}
	
	.btn_course01{text-align: center;}
	
	.btn_course01 a{
		display: inline-block;
		min-width: 144px;
		color: #FFF;
		text-align: center;
		font-size: 1.6rem;
		line-height: 1;
		border: 2px solid #FFF;
		border-radius: 50px;
		padding: 11px 16px 14px;
	}


}/*--@media--*/


