@charset "utf-8";
/*-----------------------------------------------
 * STAFF&CAST
-------------------------------------------------*/
@media screen and (min-width:769px){
	.pMain{
		padding-top: min(calc(160 / var(--vw-min) * 100vw), calc(160px * var(--max-percent)));
	}
}

.pContent{
	width: min(calc(960 / var(--vw-min) * 100vw), calc(960px * var(--max-percent)));
	min-width: min(960px, 100%);
}
.pContentIn{
	padding: 0 12.5%;/* 0 120 */
	display: flex;
}

.pContentTitle.-p_t{
	justify-content: flex-start;
}
.pContentTitle{
	width: 20%;/* 144 */
	flex-shrink: 0;
	order: 1;
}

.pContentIncont{
	width: 80%;/* 576 */
	padding-top: min(calc(48 / var(--vw-min) * 100vw), 48px);
}

@media screen and (max-width:768px){
	.pContent{
		width: 100%;
		min-width: 100%;
		padding-top: calc(48 / var(--vw-min) * 100vw);
	}
	.pContentIn{
		display: block;
		padding: 0;
	}
	.pContentTitle{
		width: 100%;
	}
	.pContentIncont{
		width: 100%;
		padding-top: 0;
	}
}



/**
** STAFFCAST CONT
**/
.staffcastCont{
	width: 100%;
	display: flex;
}
.staffcast_h3{
	min-width: 33.3334%;/* 192 */
	font-family: var(--font-en-sub);
	font-size: min(calc(56 / var(--vw-min) * 100vw), calc(56px * var(--max-percent)));
	font-style: italic;
	line-height: 0.8;
	color: var(--color-gold);
}


.staffcastList{
	width: 100%;
	line-height: 1.5;
}
.staffcastList:not(:last-child){
	margin-bottom: min(calc(24 / var(--vw-min) * 100vw), 24px);
}
.staffcastList__dl{
	display: flex;
}
.staffcastList__dt{
	flex-shrink: 0;
	font-size: min(calc(17 / var(--vw-min) * 100vw), 17px);
	font-weight: 500;
	letter-spacing: 0;
	padding-right: 0.75em;
	padding-top: min(calc(6 / var(--vw-min) * 100vw), 6px);
}
.staffcastList__dd{
	font-size: min(calc(22 / var(--vw-min) * 100vw), 22px);
}
.commentSet{
	display: inline-flex;
	align-items: flex-end;
}
.staffcastComBtn{
	display: inline-block;
	padding-left: min(calc(10 / var(--vw-min) * 100vw), 10px);
	transform: translateY(max(calc(-8 / var(--vw-min) * 100vw), -8px));
}
.btn_comment{
	display: block;
	width: min(calc(20 / var(--vw-min) * 100vw), 20px);
	height: min(calc(20 / var(--vw-min) * 100vw), 20px);
	-webkit-mask: url(../img/common/icon_comment.svg) no-repeat center / contain;
	mask: url(../img/common/icon_comment.svg) no-repeat center / contain;
	background-color: var(--color-gold);
}
.staffcastList__en{
	font-family: var(--font-en-main);
	font-size: min(calc(12 / var(--vw-min) * 100vw), 12px);
	margin-top: min(calc(4 / var(--vw-min) * 100vw), 4px);
	display: flex;
}
.staffcastList__en > dt{
	flex-shrink: 0;
	padding-right: 0.25em;
}

@media screen and (max-width:768px){
	.staffcastCont{
		display: block;
		position: relative;
		padding: calc(56 / var(--vw-min) * 100vw) calc(48 / var(--vw-min) * 100vw) 0;
	}
	.staffcastCont:not(:last-child){
		padding-bottom: calc(16 / var(--vw-min) * 100vw);
	}
	.staffcast_h3{
		width: calc(34 / var(--vw-min) * 100vw);
		min-width: unset;
		overflow: hidden;
		display: flex;
		writing-mode: vertical-rl;
		font-size: calc(40 / var(--vw-min) * 100vw);
		position: absolute;
		top: 0;
		margin-top: calc(56 / var(--vw-min) * 100vw);
	}

	.staffcastList{
		text-align: center;
	}
	.staffcastList:not(:last-child){
		margin-bottom: calc(32 / var(--vw-min) * 100vw);
	}
	.staffcastList__dl{
		flex-direction: column;
		align-items: center;
	}
	.staffcastList__dt{
		font-size: calc(14 / var(--vw-min) * 100vw);
		padding-right: 0;
		padding-top: 0;
		padding-bottom: calc(2 / var(--vw-min) * 100vw);
	}
	.staffcastList__dd{
		font-size: calc(20 / var(--vw-min) * 100vw);
	}
	.staffcastComBtn{
		padding-left: calc(8 / var(--vw-min) * 100vw);
		transform: translateY(calc(-6 / var(--vw-min) * 100vw));
	}
	.btn_comment{
		width: calc(18 / var(--vw-min) * 100vw);
		height: calc(18 / var(--vw-min) * 100vw);
	}
	.staffcastList__en{
		justify-content: center;
		font-size: calc(11 / var(--vw-min) * 100vw);
		margin-top: calc(8 / var(--vw-min) * 100vw);
	}
}

@media screen and (hover:hover) and (pointer: fine){
	.btn_comment{
		transition: background-color .3s ease;
	}
	.btn_comment:hover {
		background-color: #FFF;
	}
}

@media screen and (max-width:768px){
	#staff .staffcast_h3{
		left: 0;
	}
}

#cast{
	padding-top: min(calc(64 / var(--vw-min) * 100vw), 64px);
}
@media screen and (max-width:768px){
	#cast{
		padding-top: calc(56 / var(--vw-min) * 100vw);
	}
	#cast .staffcast_h3{
		width: calc(30 / var(--vw-min) * 100vw);
		right: 0;
		align-items: flex-end;
		line-height: 0.9;
	}
}



/**
* InPage - Loading
**/
/* PC -p_t */
@media screen and (min-width:769px){
	.pContentTitle.-p_t .pContentTitle--title{
		transform: translateX(50%);
	}
	.pContentTitle.-p_t .pContentTitle--txt{
		transform: translateX(80%);
	}
}


/* ページの内容 */
.staffcastContIn{
	opacity: 0;
	filter: blur(4px);
	transition: opacity .45s ease, filter .8s cubic-bezier(.31,.57,.62,1) .2s;
}
.staffcast_h3 span{
	display: inline-block;
	transform: translateY(50%);
	opacity: 0;
	filter: blur(6px);
	transition: opacity .4s ease, filter .8s cubic-bezier(.31,.57,.62,1), transform .6s cubic-bezier(.31,.57,.62,1);
}


body.--load.--is-loaded .staffcastContIn{
	opacity: 1;
	filter: blur(0px);
}
body.--load.--is-loaded .staffcast_h3 span{
	transform: translateY(0%);
	opacity: 1;
	filter: blur(0px);
}