@charset "UTF-8";
/*--------------------------------------------------
**************************************************
  PC用
**************************************************
--------------------------------------------------*/
@media screen and (min-width: 768px) {
	/*
	** 1 スタッフ一覧
	** 2 スタッフ詳細
	**/

	/* 1 スタッフ一覧 */
	.staff.subpage .h1_sub{
		border:none;
	}
	.staff.subpage .h1_sub span{
		line-height:1.9;
		border-bottom:#0057b8 2px dashed;
	}
	
	.staff .list{
		max-width:1200px;
		width:95%;
		margin-left:auto;
		margin-right:auto;
	}
	.staff .list li{
		width:396px;
		margin:0 6px 10px;
	}
		.staff .list li:nth-child(3n-2),
		.staff .list li:nth-child(3n){
			margin-right:0;
			margin-left:0;
		}
		.staff .list li:nth-child(2n):last-child{ /* 奇数個だった場合 */
			margin-right:0;
			margin-left:0;
		}
	.staff .list li a{
		position:relative;
		display:block;
	}
	.staff .list li a .pic img{
		object-fit:cover;
		width:396px;
		height:297px;
	}
	.staff .list li a .txt{
		position:absolute;
		top:70px;
		left:70px;
		z-index:1;
		color:#333;
	}
	.staff .list li a .txt .location{
		white-space:nowrap;
		display:inline-block;
		padding:1px 20px;
		border:#333 1px solid;
		font-size:12px;
	}
	.staff .list li a .txt .name_ja{
		white-space:nowrap;
		margin-top:5px;
		font-size:22px;
	}
	.staff .list li a .txt .name_en{
		white-space:nowrap;
		font-size:12px;
	}
	
	.bnr_staff {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
	}
	
	.bnr_staff li:first-child{
		margin-right: 30px;
			
	}
	
	/* 2 スタッフ詳細 */
	.staff_detail div.flexbox-pc{
		max-width:1200px;
		width:95%;
		margin-left:auto;
		margin-right:auto;
	}
	.staff_detail h1{
		font-size:40px;
	}
	.staff_detail h1 .name_en{
		margin-left:15px;
		font-family:TBUDGothic R;
		font-size:16px;
		font-weight:400;
	}
	.staff_detail .year{
		font-size:16px;
	}
	.staff_detail .pic{
		width:680px;
	}
	.staff_detail .pic img{
		border-radius:15px;
	}
	.staff_detail .prof{
		width:540px;
		margin-left:-60px;
		padding:15px 0 20px 5%;
		background-color:#ffe44f;
		border-radius:0 15px 15px 0 / 0 15px 15px 0;
	}
	.staff_detail .prof li{
		width:90%;
		padding:15px 0 15px 40px;
		background:url(../imgs/other/pc/icon-check_1.png) no-repeat left center;
		background-size:26px;
		border-bottom:#ffed8a 1px solid;
		font-size:16px;
	}
	.staff_detail .msg{
		max-width:1100px;
		margin-left:auto;
		margin-right:auto;
	}
	.staff_detail .msg dt span{
		position:relative;
		z-index:1;
		display:inline-block;
		padding:3px 40px;
		background-color:#0057b8;
		border-radius:20px;
		font-size:14px;
	}
		.staff_detail .msg dt span:before {
			content: "";
			position: absolute;
			top: 100%;
			left: 50%;
			z-index:1;
			margin-left: -10px;
			border: 10px solid transparent;
			border-top:#0057b8 10px solid;
		}
	.staff_detail .msg dd{
		position:relative;
		top:-14px;
		display:block;
		max-width:1100px;
		margin-left:auto;
		margin-right:auto;
		padding:30px 30px 20px;
		background-color:#ececec;
		border-radius:15px;
		font-size:15px;
	}
	
	

}/* End PC */



/*--------------------------------------------------
**************************************************
  SP用
**************************************************
--------------------------------------------------*/
@media screen and (max-width: 767px) {
	/*
	** 1 スタッフ一覧
	** 2 スタッフ詳細
	**/
	
	/* 1 スタッフ一覧 */
	.staff.subpage .h1_sub{
		border:none;
	}
	.staff.subpage .h1_sub span{
		line-height:1.9;
		border-bottom:#0057b8 2px dashed;
	}
	
	.staff .list li{
		width:49%;
		margin-bottom:2%;
	}
		.staff .list li:nth-child(odd){
			margin-right:1%;
		}
		.staff .list li:nth-child(even){
			margin-left:1%;
		}
		.staff .list li:nth-child(2n+1):last-child{ /* 奇数個だった場合 */
			margin-right:0;
		}
	.staff .list li a{
		position:relative;
		display:block;
	}
	.staff .list li a .pic img{
		object-fit:cover;
		height:137px;
	}
	.staff .list li a .txt{
		position:absolute;
		top:4vw;
		left:4vw;
		z-index:1;
		color:#333;
	}
	.staff .list li a .txt .location{
		white-space:nowrap;
		display:inline-block;
		padding:1px 2.5vw;
		border:#333 1px solid;
		font-size:3vw;
	}
	.staff .list li a .txt .name_ja{
		white-space:nowrap;
		margin-top:5px;
		font-size:4.5vw;
	}
	.staff .list li a .txt .name_en{
		white-space:nowrap;
		font-size:2.5vw;
	}
	
	
	.bnr_staff {
        width: 90%;
   		margin: 0 auto;
	}
	
	.bnr_staff li:first-child{
		margin-bottom: 10px;
			
	}
	
	/* 2 スタッフ詳細 */
	.staff_detail h1{
		width:90%;
		margin-left:auto;
		margin-right:auto;
		font-size:23px;
	}
	.staff_detail h1 .name_en{
		margin-left:15px;
		font-family:TBUDGothic R;
		font-size:12px;
		font-weight:400;
	}
	.staff_detail .year{
		width:90%;
		margin-left:auto;
		margin-right:auto;
		font-size:13px;
	}
	.staff_detail .pic{
		width:90%;
		margin-left:auto;
		margin-right:auto;
	}
	.staff_detail .pic img{
		border-radius:15px;
	}
	.staff_detail .prof{
		width:95%;
		padding:15px 0 20px 5%;
		background-color:#ffe44f;
		border-radius:0 15px 15px 0 / 0 15px 15px 0;
	}
	.staff_detail .prof li{
		width:90%;
		padding:7px 0 7px 30px;
		background:url(../imgs/other/sp/icon-check_1.png) no-repeat left center;
		background-size:auto 14px;
		border-bottom:#ffed8a 1px solid;
		font-size:14px;
	}
	.staff_detail .msg{
		width:90%;
		margin-left:auto;
		margin-right:auto;
	}
	.staff_detail .msg dt span{
		position:relative;
		z-index:1;
		display:inline-block;
		padding:3px 30px;
		background-color:#0057b8;
		border-radius:20px;
		font-size:13px;
	}
		.staff_detail .msg dt span:before {
			content: "";
			position: absolute;
			top: 100%;
			left: 50%;
			z-index:1;
			margin-left: -10px;
			border: 10px solid transparent;
			border-top:#0057b8 10px solid;
		}
	.staff_detail .msg dd{
		position:relative;
		top:-13px;
		display:block;
		width:100%;
		padding:30px 15px 20px;
		background-color:#ececec;
		border-radius:15px;
		font-size:13px;
	}

	.staff_detail .back_btn{
		width:90%;
		margin-left:auto;
		margin-right:auto;
	}
	

}/* End SP */