@charset "UTF-8";
/*==============
    paage staff
================*/
@media screen and (min-width: 769px) {

}
@media screen and (max-width: 768px) {
}


/* ------------------------------
    stafflist
------------------------------ */
.staffblk{

}
.stafflist{
	flex-wrap: wrap;
}
.stafflist .catchbox{
	z-index: 1;
	position: relative;
	margin-bottom: 14px;
}
.stafflist .ph{
	overflow: hidden;
	border-radius: 15px;
}
.stafflist .catch{
	z-index: 2;
	position: relative;
	line-height: 1;
	font-size: 2rem;
	margin-top: -0.6em;
}
.stafflist .catch span{
	display: inline-block;
	background: #000;
	color: #fff;
	min-width: 10.7em;
	white-space: nowrap;
	padding: 0.3em 0.5em 0.05em;
}
	.safari .stafflist .catch span{
		padding: 0.25em 0.5em 0.15em;
	}
.stafflist .catch span:nth-of-type(2){
	min-width: 10em;
	margin-top: 6px;
}
	.staff1 .catch span{min-width: 8.5em;}
	.staff1 .catch span:nth-of-type(2){width: 10.5em;}


	.staff1 .illust{width: 90px;}
	.staff2 .illust{width: 90px;}
	.staff3 .illust{width: 90px;}
	.staff4 .illust{width: 90px;}
	.staff5 .illust{width: 90px;}
	.staff6 .illust{width: 90px;}
	.staff7 .illust{width: 90px;}

.stafflist .name{
	font-size: 1.6rem;
	line-height: 1;
	margin-bottom: 1.25em;
}

.stafflist .dept{
	display: block;
	font-size: 1.18rem;
	margin-bottom: 1.1em;
}
.stafflist .intro{
	font-size: 1.1rem;
	line-height: 1.6;
	height: 130px;
}
.stafflist .txt{
	line-height: 1.8;
}
@media screen and (min-width: 769px) {
	.staffblk{
		max-width: 1098px;
		padding: 0 20px 240px;
	}

	.stafflist{
		flex-wrap: wrap;
		padding-top: 15px;
	}
	.stafflist li{
		width: 27.5%;
	}
	.stafflist li:nth-child(n+4){
		margin-top: 140px;
	}

	.stafflist .catch{
		margin-left: 6px;
	}
	.stafflist .illust{
		position: absolute;
		right: 0;
	}
	.staff1 .illust{bottom: -123px;}
	.staff2 .illust{bottom: -131px;}
	.staff3 .illust{bottom: -121px; right: 6px;}
	.staff4 .illust{bottom: -137px; right: 12px;}
	.staff5 .illust{bottom: -133px; right: -4px;}
	.staff6 .illust{bottom: -125px; right: -20px;}
	.staff7 .illust{bottom: -137px; right: 7px;}
	.stafflist .namebox{
		margin-left: 5px;
		width: 150px;
	}
	.stafflist .txt{
		padding: 0 5.3%;
	}
}
@media screen and (min-width: 769px) and (max-width: 1139px) {
	.stafflist li{
		width: 32%;
	}
}
@media screen and (min-width: 769px) and (max-width: 979px) {
	.stafflist .catch{
		font-size: 1.9vw;
	}
}
@media screen and (max-width: 768px) {
	.staffblk{
		padding-bottom: 20vw;
	}
	.stafflist{
		padding-top: 7vw;
	}
	.stafflist li{
	
	}
	.stafflist li+li{
		margin-top: 23vw;
	}
	.stafflist .catchbox{
		margin-bottom: 4.6vw;
	}
	.stafflist .ph{
		width:51.5vw;
	}
	.stafflist .catch{
		font-size: 4.6vw;
		margin-top: calc(-1.8em - 0.8vw);
	}
	.stafflist .catch span{
		padding: 0.25em 0.5em 0.15em;
	}
	.stafflist .catch span:nth-of-type(2){
		margin-top: 0.8vw;
	}
	.stafflist .catch span:nth-of-type(1){
		min-width:8em;
	}

	.stafflist .illust{
		position: absolute;
		bottom: 0;
		right: 0;
	}
	.staff1 .illust{width: 28.3vw;}
	.staff2 .illust{width: 17.8vw; right: 3vw;}
	.staff3 .illust{width: 15.5vw; right: 5vw;}
	.staff4 .illust{width: 19vw; right: 5vw;}
	.staff5 .illust{width: 23.5vw; right: 3vw;}
	.staff6 .illust{width: 28.6vw; right: -3vw;}
	.staff7 .illust{width: 25.6vw; right: 2vw;}

	.stafflist .name{
		font-size: 6.6vw;
		margin-bottom: 6vw;
	}

	.stafflist .dept{
		font-size: 4.4vw;
		margin-bottom: 1.6vw;
	}
	.stafflist .intro{
		display: none;
	}
	.stafflist .txt{
		line-height: 1.4;
	}
}