
#cast_dt {
    font-family: ten-mincho-text, serif;
	font-weight: 400;
	font-style: normal;
	color: #fff;
	
}
div.charaBox {position: relative;}
div.charaBox:after {
	padding: 0;
	position: absolute;
    inset: -8px 8px 8px -8px;
    border: 1px solid rgba(251,232,0,1);
    content: '';
	}

.phArea{ position: relative;}

.data {background-position: top left; background-repeat: no-repeat;}
.chara_01 .data {background-image: url("../img/chart/name_01.png");}
.chara_02 .data {background-image: url("../img/chart/name_02.png");}
.chara_03 .data {background-image: url("../img/chart/name_03.png");}
.chara_04 .data {background-image: url("../img/chart/name_04.png");}
.chara_05 .data {background-image: url("../img/chart/name_05.png");}
.chara_06 .data {background-image: url("../img/chart/name_06.png");}
.chara_07 .data {background-image: url("../img/chart/name_07.png");}
.chara_08 .data {background-image: url("../img/chart/name_08.png");}
.chara_09 .data {background-image: url("../img/chart/name_09.png");}
.chara_10 .data {background-image: url("../img/chart/name_10.png");}
.chara_11 .data {background-image: url("../img/chart/name_11.png");}
.chara_13 .data {background-image: url("../img/chart/name_13.png?1");}
.chara_14 .data {background-image: url("../img/chart/name_14.png");}
.chara_15 .data {background-image: url("../img/chart/name_15.png");}
.chara_16 .data {background-image: url("../img/chart/name_16.png");}
.chara_17 .data {background-image: url("../img/chart/name_17.png");}
.chara_18 .data {background-image: url("../img/chart/name_18.png");}
.chara_19 .data {background-image: url("../img/chart/name_19.png");}
.chara_20 .data {background-image: url("../img/chart/name_20.png");}

p.name, p.actor, p.degree{
	height: 0; width: 0; text-indent: -9999px;
}

#cast_dt .txtArea .txt { text-align: left;}
.profArea .txtArea a{ position: absolute; bottom:0px; right:35px; z-index: 1000; padding: 1em 0; } 

@media all and (min-width: 768px) {
	#cast_dt{ padding: 0px;}
	div.character {position: relative; width: 730px; height: 470px; background-image: url("../img/chart/character_bg.jpg");}
	.sizeM div.character {height: 410px;}
	.sizeS div.character {height: 375px;}
	div.character .charaBox { height: 470px;　letter-spacing: -.4em;}

	.phArea{ width: 375px; height: 470px; display: inline-block;}
	#cast_dt .ph_cut, #cast_dt .ph_cut span, #cast_dt .ph_cut span img {
		width: 375px; height: 470px;
		background-position: center top;
	}
	#cast_dt.sizeM div.character .charaBox, #cast_dt.sizeM .phArea, #cast_dt.sizeM .ph_cut, #cast_dt.sizeM .ph_cut span, #cast_dt.sizeM .ph_cut span img {height: 410px;}
	#cast_dt.sizeS div.character .charaBox, #cast_dt.sizeS .phArea, #cast_dt.sizeS .ph_cut, #cast_dt.sizeS .ph_cut span, #cast_dt.sizeS .ph_cut span img {height: 375px;}
	#cast_dt .ph_cut {
		margin: 0 0!important; padding: 0!important; border: none; display: inline-block; vertical-align: top;
	}
	
	.profArea{ position: relative; width:355px; padding: 0px; letter-spacing: 0em; display: inline-block; vertical-align: top;}
	.data { width:355px; height: 165px; background-size: cover; margin: 0 0 0 auto;}
	#cast_dt .txtArea { padding:15px 30px 15px 5px; font-size: 1.0em;}
	#cast_dt .txtArea .txt {padding:0 0 0.5em; line-height: 2.0em;}
	#cast_dt.chara_01 .txtArea {font-size: 0.95em;}
	#cast_dt.chara_13 .txtArea {font-size: 0.9em;}
	#cast_dt.chara_01 .txtArea .txt, #cast_dt.chara_02 .txtArea .txt, #cast_dt.chara_20 .txtArea .txt { line-height: 1.6em;}
	#cast_dt.chara_05 .txtArea .txt, #cast_dt.chara_16 .txtArea .txt, #cast_dt.chara_18 .txtArea .txt { line-height: 1.8em;}
	#cast_dt.chara_13 .txtArea .txt { line-height: 1.5em;}
	

}
@media all and (max-width: 767px) {
	#cast_dt{}
	div.character {
		margin: 20px 10px 10px 20px;
		position: relative;
		background-image: url("../img/chart/character_bg_sp.jpg");
	}
div.charaBox:after {
    inset: -8px 8px 8px -8px;
	}
	#cast_dt .ph_cut {
		width: 100%;
		margin: 0 auto 0em;
		border: none; padding: 0;
	}
	#cast_dt .ph_cut span {
		padding-top: 125.333%;
	}
	
	#cast_dt.sizeM .ph_cut span {
		padding-top: 109.333%;
	}
	#cast_dt.sizeS .ph_cut span {
		padding-top: 100%;
	}
	#cast_dt.chara_05 .ph_cut span {
		background-position: center bottom;
	}
	
	div.character .profArea { padding: 0 0 0 10px;}
	.data { width:95%; height: 0; padding-top: 42%; background-position: top center; background-size: contain; margin: 0 auto;}
	.noDegree .data { padding-top: 34.269%;}
	.noActor .data { padding-top: 22.471%;}
	#cast_dt .txtArea { margin: 20px 5% 0 3%; padding:0 0 3.5em;}
	#cast_dt .txtArea .txt { line-height: 1.6em; padding-bottom: 0.5em; position: relative;}
	.profArea .txtArea a{right:10px;} 

}
