@charset "utf-8";

/* __________ STAFF & CAST __________ */
/* 共通 */
.staff-block,
.cast-block {
	margin-top: calc(96 * var(--px));
}
.staff-list,
.cast-list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: calc(16 * var(--px));
	row-gap: calc(96 * var(--px));
}
.credits-item.-col-1,
.credits-item.-col-en-1:lang(en) {
	grid-column: 1 / -1;
}
.credits-item.-col-2 {
	grid-column: span 1 / span 1;
}
.role {
	display: grid;
	color: var(--color-red);
	font-size: calc(28 * var(--px));
	font-weight: 500;
}
.name {
	display: grid;
	color: var(--color-white);
	font-size: calc(40 * var(--px));
	font-weight: 500;
}
.credits-sub {
	font-size: calc(24 * var(--px));
	font-weight: 500;
}
.comment-btn {
	display: grid;
	grid-template-columns: max-content minmax(0, 1fr);
	align-items: baseline;
	column-gap: calc(16 * var(--px));
	width: fit-content;
}
.comment-btn .svg-icon {
	color: var(--color-white);
	font-size: calc(56 * var(--px));
	transform: scale(1);
	transform-origin: bottom left;
	transition: var(--trans-default);
}
.comment-btn .path-comment-balloon {
	fill: var(--color-red);
}
@media (any-hover: hover) {
	.comment-btn:hover .svg-icon {
		transform: scale(1.2) !important;
	}
}
/* CAST */
.cast-content {
	margin-top: calc(200 * var(--px));
}

@media (min-width: 960px) {
}