@charset "UTF-8";

/* caststaff
------------------------------------------ */
.caststaff-area {}
.caststaff-inner {
	background: url(../images/caststaff/caststaff-bg.png) no-repeat 100% 12.5% transparent;
	background-size: 66% auto;
}
.caststaff-box {}
.caststaff-box .d-box-body {
	margin: 0 auto;
	font-family: 'FOT-テロップ明朝 Pro D';
	text-align: center;
}
.caststaff-title {
	margin-bottom: 35px;
	font-size: 4.2rem;
	font-weight: bold;
	text-align: center;
}
.caststaff-title:first-letter {
	color: #e02020;
}


/* cast
------------------------------------------ */
.cast-area {}
.cast-inner {}

.cast-list {
	display: flex;
	flex-flow: column nowrap;
	justify-content: center;
}
.cast-item {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	position: relative;
}
.cast-item:not(:first-child) {
	margin-top: 10px;
}
.cast-item.separator {
	margin-top: 75px;
}
.cast-item.separator:before {
	content: '・';
	display: block;
	width: 100%;
	height: 40px;
	line-height: 40px;
	font-size: 2.4rem;
	position: absolute;
	bottom: 66px;
	text-align: center;
	font-weight: bold;
	margin-left: -20px;
}

.cast-title {
	width: 50%;
	padding-right: 40px;
	color: #ae0000;
	font-size: 3rem;
	font-weight: bold;
	text-align: right;
}
.cast-text {
	width: 50%;
	font-size: 3rem;
	font-weight: bold;
	text-align: left;
}
.cast-text span {
	font-size: 2rem;
}



/* staff
------------------------------------------ */
.staff-area {
	margin-top: 70px;
}
.staff-inner {}

.staff-list {
	display: flex;
	flex-flow: column nowrap;
	justify-content: center;
}
.staff-item {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: baseline;
	line-height: 2;
}
.staff-item:not(:first-child) {
	margin-top: 8px;
}
.staff-item.separator {
	margin-top: 40px;
}
.staff-title {
	width: 50%;
	padding-right: 40px;
	font-size: 3rem;
	font-weight: bold;
	text-align: right;
}
.staff-text {
	width: 50%;
	font-size: 3rem;
	font-weight: bold;
	text-align: left;
}
.staff-text span {
	font-size: 2rem;
}
.staff-item.theme .staff-text {
	line-height: 1.2;
}
.staff-item.reference .staff-text {
	font-size: 3.2rem;
	font-family: 'FOT-テロップ明朝 Pro D';
	line-height: 1.2;
}
.staff-item.reference .staff-text span {
	display: inline-block;
	font-size: 2rem;
}




/* ---------------------------------
	SP用
--------------------------------- */
@media only screen and (max-width: 600px) {
	/* caststaff
	------------------------------------------ */
	.caststaff-area {}
	.caststaff-inner {
		background-position: 1300% 14%;
		background-size: 98% auto;
	}
	.caststaff-box .d-box-body {}
	.caststaff-title { margin-bottom: 12px; font-size: 1.9rem; }

	/* cast
	------------------------------------------ */
	.cast-area {}
	.cast-inner {}
	.cast-box {}
	.cast-list {}
	.cast-item:not(:first-child) { margin-top: 5px; }
	.cast-item.separator {
		margin-top: 30px;
	}
	.cast-item.separator:before {
		height: 30px;
		line-height: 30px;
		font-size: 1.2rem;
		bottom: 25px;
		margin-left: -10px;
	}
	.cast-title { padding-right: 20px; font-size: 1.4rem; }
	.cast-text { font-size: 1.4rem; }
	.cast-text span { font-size: 0.8rem; }


	/* staff
	------------------------------------------ */
	.staff-area { margin-top: 9%;}
	.staff-inner {}
	.staff-box {}
	.staff-list { margin-top: 3%; }
	.staff-item {
		display: flex;
		flex-flow: row nowrap;
		justify-content: space-between;
		line-height: 2;
	}
	.staff-item:not(:first-child) { margin-top: 0; }
	.staff-item.separator { margin-top: 20px; }
	.staff-title { padding-right: 20px; font-size: 1.35rem; }
	.staff-text { font-size: 1.35rem; }
	.staff-text span { font-size: 0.8rem; }
	.staff-item.theme .staff-text { line-height: 1.2; }
	.staff-item.reference .staff-text { font-size: 1.3rem; line-height: 1.6; }
	.staff-item.reference .staff-text span { display: block; font-size: 0.8rem; }
}



/* ---------------------------------
 SP 〜 tablet（〜992px）
--------------------------------- */
@media screen and (min-width: 601px) and (max-width: 992px) {
	/* staff
	------------------------------------------ */
	.staff-item.reference .staff-text { font-size: 2.4rem; line-height: 1.2; }
	.staff-item.reference .staff-text span { font-size: 1.5rem; }
}

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



/* ---------------------------------
 PC（993px〜）
--------------------------------- */
@media screen and (min-width: 993px) {}


