@charset "UTF-8";

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
pagetitle
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.pagetitle{
	img{
		max-width: 100%;
		height: auto;
	}
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
intro_sec
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#intro_sec{
	text-align: center;
	
	@media only screen and (max-width: 767px) {
		.vi_text02{
			text-align: left;
		}
	}
}



/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
performers_sec
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#performers_sec{
	.vi_hd02{
		line-height: 1;
	}
	
	@media only screen and (max-width: 767px) {
		.box_bg{
			padding-left: 20px;
			padding-right: 20px;
		}
	}
}
.performers_list{
	max-width: 750px;
	margin: 0 auto 35px;
	&:last-of-type{
		margin-bottom: 0;
	}
	dt{
		font-weight: 700;
		line-height: 1.5;
		margin-bottom: 7px;
	}
	dd{
		margin: 5px 0 0 1em;
	}
}



/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
page_anchor_block
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.page_anchor_block{
	.disabled{
		.btn_inner{
			pointer-events: none;
			background: #D2D7DA;
			color: #828487;
			border-color: #D2D7DA;
			&:after{
				border-color: #828487 !important;
			}
		}
	}
}



/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
movie_list
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.movie_list{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	&:after{
		content: "";
		display: block;
		width: 32%;
		max-width: 400px;
	}
	li{
		max-width: 400px;
		width: 32%;
		margin: 0 0 30px;
	}
	a{
		display: block;
		text-decoration: none !important;
		&:after{
			position: absolute;
			right: 0;
			bottom: 8px;
		}
	}
	.img{
		border-radius: 10px;
		overflow: hidden;
		img{
			width: 100%;
			height: auto;
		}
	}
	.txt_area{
		margin-top: 10px;
		color: #222426;
		line-height: 1.6;
		padding-right: 15px;
		.sub{
			font-size: 1.5rem;
		}
		.name{
			font-size: 2rem;
			font-weight: 700;
		}
	}
	
	a.none{
		pointer-events: none;
		.img{
			background: #000;
			img{
				opacity: 0.5;
			}
		}
		.txt_area{
			opacity: 0.4;
		}
		&:after{
			content: none !important;
		}
	}
	
	@media only screen and (max-width: 767px) {
		&:after{
			content: none;
		}
		li{
			width: 48%;
		}
		.txt_area{
			margin-top: 10px;
			color: #222426;
			line-height: 1.6;
			padding-right: 15px;
			.sub{
				font-size: 1.2rem;
			}
			.name{
				font-size: 1.7rem;
			}
		}
	}
	@media only screen and (max-width: 550px) {
		li{
			width: 100%;
			max-width: inherit;
		}
		
	}
}
.movie_list.center{
	text-align: left;
	@media only screen and (min-width: 768px) {
		justify-content: center;
		&:after{
			content: none;
		}
	}
}