.character{
font-family: fot-tsukubrdgothic-std, sans-serif;
font-style: normal;
font-weight: 400;
}
#cast_dt .ph_cut span {
	background-color: #fff;
}

.data {background-position: top right; background-repeat: no-repeat;}
.chara_a .data {background-image: url("../img/chart/name_a.png");}
.chara_b .data {background-image: url("../img/chart/name_b.png");}
.chara_c .data {background-image: url("../img/chart/name_c.png");}
.chara_d .data {background-image: url("../img/chart/name_d.png");}
.chara_e .data {background-image: url("../img/chart/name_e.png");}
.chara_f .data {background-image: url("../img/chart/name_f.png");}
.chara_g .data {background-image: url("../img/chart/name_g.png");}
.chara_h .data {background-image: url("../img/chart/name_h.png");}
.chara_i .data {background-image: url("../img/chart/name_i.png");}
.chara_j .data {background-image: url("../img/chart/name_j.png");}
.chara_k .data {background-image: url("../img/chart/name_k.png");}
.chara_l .data {background-image: url("../img/chart/name_l.png");}
.chara_m .data {background-image: url("../img/chart/name_m.png");}
.chara_n .data {background-image: url("../img/chart/name_n.png");}
.chara_o .data {background-image: url("../img/chart/name_o.png");}
.chara_p .data {background-image: url("../img/chart/name_p.png");}
.chara_q .data {background-image: url("../img/chart/name_q.png");}
.chara_r .data {background-image: url("../img/chart/name_r.png");}
.chara_s .data {background-image: url("../img/chart/name_s.png");}
.chara_t .data {background-image: url("../img/chart/name_t.png");}

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


#cast_dt .txtArea .txt {}

@media all and (min-width: 768px) {
	#cast_dt{
		background-color: #fff;
		padding: 5px;
	}
	div.character {
		padding: 0px 0px;
	}
	.chart div.character,
	.story div.character {
		padding: 0px 0px 0px;
		background-color: white;
	}
	#cast_dt .ph_cut, #cast_dt .ph_cut span, #cast_dt .ph_cut span img {
		width: 250px;
		height: 270px;
		background-position: center top;
	}
	#cast_dt .ph_cut {
		margin: 0 0!important; padding: 0!important; border: none; display: inline-block; vertical-align: top;
	}
.profArea{ display: inline-block; width:490px; vertical-align: top;}
.data { width:100%; height: 75px; }
.txtArea { padding: 20px 5px 20px 25px; }
}
@media all and (max-width: 767px) {
	div.character {
		padding: 0.5em 0;
		margin: 0;
		background-color: #fff;
	}

	#cast_dt .ph_cut {
		width: 70%;
		margin: 0.5em auto 0.5em;
		border: none; padding: 0;
	}
	#cast_dt .ph_cut span {
		padding-top: 100%;
	}
.profArea { padding: 0 0.5em; }
#cast_dt .txtArea { padding: 1em 1em 0; }
.data { width:100%; height: 0; padding-top: 15.306%; background-size: cover; margin: 0 auto; }
}
