@charset "utf-8";
/* CSS Document */
/*CAST一覧*/
#index-m{
	height: 0px;
	background-color: #1F1714;
}
.header img{
	width: 100%;
}

.cast{
	margin-bottom: 1.0rem;
}

.card{
	flex-direction:row;
}
.photo-area{
	width: 50%;
}
.photo-area img{
	width: 100%;
}
.data-area{
	width: 49%;
	position: relative;
}

.photo-thumb{
	width: 100%;
	display: flex;
	position: absolute;
	bottom: 0;
}
.photo-thumb img{
	width: 33.3%;
	padding: 0;
	margin: 0;
}

.cast a{
	color: #191919;
}
.cast div.frame{
	background-clip: border-box;
	border: 1px solid rgba(0,0,0,.125);
    border-radius: .25rem;
}
.cast table{
	width: 100%;
	table-layout: fixed;
	position: relative;
}
.cast table img{
	width: 100%;
}
.cast table th{
	width: 50%;
	height: 1.2rem;
	font-size: 1.2rem;
}
.cast table th span{
	font-weight: normal;
}
.cast table td.three{
	height: 1.2rem;
	vertical-align: top;
	font-size: 0.8rem;
}
.photo-thumb2{
	display: flex;
}
.cast table .photo-thumb2 img{
	width: 33.3%;
	padding: 0;
	margin: 0;
}
.cast table tr.data-area2 td{
	height: 20px;
}
.cast table tr td.com-area{
	overflow: hidden;
	word-wrap: break-word;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.cast table tr.thum-area td{
	position: absolute;
	bottom: 0;
}

@media screen and (max-width:768px) {
	.cast table tr td.com-area{
    	-webkit-line-clamp: 2;
	}
}
@media screen and (max-width:576px) {
	.cast table tr td.com-area{
    	-webkit-line-clamp: 4;
	}
}