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

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

	PC

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

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

	学生研究

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

	.student_top{
		max-width: 1600px;
		margin: 0 auto 45px;
		display: flex;
		justify-content: center;
		align-items: center;
		border-bottom: 1px solid #DDDDDD;
		padding-bottom: 35px;
	}

	/* ナビ
	---------------------------------------------- */
	.nav_student > div{
		display: flex;
		justify-content: center;
	}

	.nav_student .inner{margin: 0 15px;}

	.nav_student .inner .btn{
		font-family: "Roboto";
		font-size: 1.8rem;
		font-style: italic;
		padding-right: 15px;
	}

	.nav_student .inner .btn a{
		display: inline-block;
		background: url("../img/ico_arrow02.png") no-repeat right center;
		background-size: 10px;
		padding-right: 17px;
		color: #333;
		letter-spacing: 0.05em;
		font-family: "Roboto";
		font-style: italic;
		transition: color .3s;
	}

	.nav_student .inner .btn a:hover{color: #ffa500;}

	.nav_student .inner .desc{
		font-size: 1.3rem;
		color: #929292;
	}

	/* 絞り込み
	---------------------------------------------- */
	.search_area{
		width: 405px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.search_area .wrap_select{
		position: relative;
		width: 230px;
		background: #FFF;
		border: 1px solid #CCCCCC;
		border-radius: 4px;
		line-height: 1;
	}

	.search_area .wrap_select::after{
		content: "";
		background: url("../../img/ico_arrow02.png") no-repeat 0 0;
		background-size: contain;
		width: 10px;
		height: 6px;
		position: absolute;
		top: 50%;
		right: 10px;
		margin-top: -3px;
		transform: scale(1, -1);
	}

	.search_area .wrap_select select{
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		border: none;
		outline: none;
		width: 100%;
		padding: 12px 25px 12px 10px;
		background: transparent;
		cursor: pointer;
		color: #DDDDDD;
	}

	.search_area .wrap_select select option{color: #333;}

	.search_area .wrap_btn{display: flex;}

	.search_area .wrap_btn .btn{transition: opacity .3s;}

	.search_area .wrap_btn .btn:first-of-type{margin-right: 10px;}

	.search_area .wrap_btn .btn:hover{opacity: 0.8;}

	.search_area .wrap_btn .btn input[type="button"]{
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		border: none;
		outline: none;
		background: #ffa500;
		color: #FFF;
		padding: 8px 10px;
		border-radius: 3px;
		cursor: pointer;
	}

	/* コンテンツ
	---------------------------------------------- */
	.sec_student{
		border-bottom: 1px solid #DDDDDD;
		padding-bottom: 100px;
		margin-bottom: 50px;
	}

	.sec_student:last-of-type{
		border-bottom: none;
		margin-bottom: 0;
		padding-bottom: 0;
	}

	.sec_student h3{
		text-align: center;
		font-family: "Roboto";
		font-style: italic;
		line-height: 1;
		letter-spacing: 0.05em;
		font-size: 3.2rem;
		margin-bottom: 50px;
	}

	.wrap_item{
		display: flex;
		flex-wrap: wrap;
		margin: 0 -20px -40px;
	}

	.wrap_item .item{
		width: 25%;
		padding: 0 20px;
		margin-bottom: 40px;
	}

	.wrap_item .item .documnet{
		position: relative;
		padding-top: 141.14%;
	}

	.wrap_item .item .documnet iframe{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		display: block;
	}

	.wrap_item .item .inner{
		background: #FFF;
		padding: 20px;
	}

	.wrap_item .item .inner .summary{
		border-bottom: 1px solid #EEEEEE;
		padding-bottom: 15px;
		margin-bottom: 15px;
		position: relative;
	}

	.wrap_item .item .inner .summary h4{
		font-size: 1.8rem;
		font-weight: 700;
		line-height: 1.4;
		margin-bottom: 5px;
	}

	.wrap_item .item .inner .summary .movie{
		background: #45505A;
		border-radius: 3px;
		display: inline-block;
		position: absolute;
		right: 0;
		bottom: 10px;
	}

	.wrap_item .item .inner .summary .movie a{
		display: block;
		color: #FFF;
		font-weight: 700;
		line-height: 1;
		font-size: 1.2rem;
		padding: 10px 12px;
		transition: opacity .3s;
	}

	.wrap_item .item .inner .summary .movie a:hover{opacity: 0.8;}

	.wrap_item .item .inner .summary .movie a::before{
		content: "";
		display: inline-block;
		background: url("../img/ico_camera01.png") no-repeat 0 0;
		background-size: contain;
		width: 15px;
		height: 8px;
		margin-right: 5px;
	}

	.wrap_item .item .inner .tag ul{text-align: right;}

	.wrap_item .item .inner .tag ul{
		display: flex;
		justify-content: flex-end;
	}

	.wrap_item .item .inner .tag ul li{
		font-size: 1.2rem;
		color: #FFF;
		font-weight: 700;
		line-height: 1;
		padding: 3px 5px 3px 13px;
		margin-left: 5px;
		overflow: hidden;
		position: relative;
	}

	.wrap_item .item .inner .tag ul li::before,
	.wrap_item .item .inner .tag ul li::after{
		content: "";
		background: #FFF;
		width: 15px;
		height: 15px;
		display: inline-block;
		position: absolute;
		left: -7px;
	}

	.wrap_item .item .inner .tag ul li::before{
		top: -7px;
		transform: rotate(45deg);
	}

	.wrap_item .item .inner .tag ul li::after{
		bottom: -7px;
		transform: rotate(45deg);
	}


}/*--@media--*/


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

	/* コンテンツ
	---------------------------------------------- */
	.wrap_item .item{width: 33.33%;}



}/*--@media--*/


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

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

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

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

	学生研究

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

	.student_top{
		padding-bottom: 40px;
		margin-bottom: 40px;
		border-bottom: 2px solid #DDDDDD;
	}

	/* ナビ
	---------------------------------------------- */
	.nav_student{margin-bottom: 20px;}

	.nav_student > div{
		display: flex;
		justify-content: space-between;
	}

	.nav_student .inner{
		width: calc(50% - 7.5px);
		text-align: center;
	}

	.nav_student .inner .btn{
		font-family: "Roboto";
		font-size: 1.8rem;
		font-style: italic;
		padding-right: 12px;
	}

	.nav_student .inner .btn a{
		display: inline-block;
		background: url("../img/ico_arrow02.png") no-repeat right center;
		background-size: 10px;
		padding-right: 14px;
		color: #333;
		letter-spacing: 0.05em;
		font-family: "Roboto";
		font-style: italic;
	}

	.nav_student .inner .desc{
		font-size: 1.3rem;
		color: #929292;
		line-height: 1.4;
	}

	/* 絞り込み
	---------------------------------------------- */
	.search_area .wrap_select{
		position: relative;
		background: #FFF;
		border: 1px solid #CCCCCC;
		border-radius: 4px;
		line-height: 1;
		margin-bottom: 15px;
	}

	.search_area .wrap_select::after{
		content: "";
		background: url("../../img/ico_arrow02.png") no-repeat 0 0;
		background-size: contain;
		width: 10px;
		height: 6px;
		position: absolute;
		top: 50%;
		right: 10px;
		margin-top: -3px;
		transform: scale(1, -1);
	}

	.search_area .wrap_select select{
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		border: none;
		outline: none;
		width: 100%;
		padding: 12px 25px 12px 10px;
		background: transparent;
		cursor: pointer;
		color: #DDDDDD;
	}

	.search_area .wrap_select select option{color: #333;}

	.search_area .wrap_btn{
		display: flex;
		justify-content: space-between;
	}

	.search_area .wrap_btn .btn{width: calc(50% - 7.5px);}

	.search_area .wrap_btn .btn input[type="button"]{
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		border: none;
		outline: none;
		background: #ffa500;
		color: #FFF;
		width: 100%;
		padding: 8px 10px;
		border-radius: 3px;
		cursor: pointer;
	}

	/* コンテンツ
	---------------------------------------------- */
	.sec_student{
		border-bottom: 1px solid #DDDDDD;
		padding-bottom: 100px;
		margin-bottom: 50px;
	}

	.sec_student:last-of-type{
		border-bottom: none;
		margin-bottom: 0;
		padding-bottom: 0;
	}

	.sec_student h3{
		text-align: center;
		font-family: "Roboto";
		font-style: italic;
		line-height: 1;
		letter-spacing: 0.05em;
		font-size: 2.6rem;
		margin-bottom: 37px;
	}

	.wrap_item .item{margin-bottom: 40px;}

	.wrap_item .item:last-of-type{margin-bottom: 0;}

	.wrap_item .item .documnet{
		position: relative;
		padding-top: 141.14%;
	}

	.wrap_item .item .documnet iframe{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		display: block;
	}

	.wrap_item .item .inner{
		background: #FFF;
		padding: 20px 20px 10px;
	}

	.wrap_item .item .inner .summary{
		border-bottom: 1px solid #EEEEEE;
		padding-bottom: 15px;
		margin-bottom: 10px;
		position: relative;
	}

	.wrap_item .item .inner .summary h4{
		font-size: 1.6rem;
		font-weight: 700;
		line-height: 1.4;
		margin-bottom: 5px;
	}

	.wrap_item .item .inner .summary .movie{
		background: #45505A;
		border-radius: 3px;
		display: inline-block;
		position: absolute;
		right: 0;
		bottom: 10px;
	}

	.wrap_item .item .inner .summary .movie a{
		display: block;
		color: #FFF;
		font-weight: 700;
		line-height: 1;
		font-size: 1.2rem;
		padding: 10px 12px;
	}

	.wrap_item .item .inner .summary .movie a::before{
		content: "";
		display: inline-block;
		background: url("../img/ico_camera01.png") no-repeat 0 0;
		background-size: contain;
		width: 15px;
		height: 8px;
		margin-right: 5px;
	}

	.wrap_item .item .inner .tag ul{text-align: right;}

	.wrap_item .item .inner .tag ul{
		display: flex;
		justify-content: flex-end;
	}

	.wrap_item .item .inner .tag ul li{
		font-size: 1.2rem;
		color: #FFF;
		font-weight: 700;
		line-height: 1;
		padding: 3px 5px 3px 13px;
		margin-left: 5px;
		overflow: hidden;
		position: relative;
	}

	.wrap_item .item .inner .tag ul li::before,
	.wrap_item .item .inner .tag ul li::after{
		content: "";
		background: #FFF;
		width: 15px;
		height: 15px;
		display: inline-block;
		position: absolute;
		left: -7px;
	}

	.wrap_item .item .inner .tag ul li::before{
		top: -7px;
		transform: rotate(45deg);
	}

	.wrap_item .item .inner .tag ul li::after{
		bottom: -7px;
		transform: rotate(45deg);
	}


}/*--@media--*/