#cast_dt{
	}
div.character {
	padding: 4px;
	background: linear-gradient(to right, rgba(255,173,92,1), rgba(255,132,156,1));
	border-radius: 10px;
	position: relative;
	font-family: iroha-26tubaki-stdn, sans-serif;
	font-weight: 400;
	font-style: normal;
	filter: drop-shadow(5px 5px 5px rgba(0,0,0,0.2));
	}
div.character .charaBox {}

.phArea{ position: relative;}
/*.data { position: absolute; }*/

.data {background-position: top left; 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");}

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

#cast_dt .txtArea  {}
#cast_dt .txtArea .txt { line-height: 1.8em; text-align: left; font-feature-settings: "palt";}

@media all and (min-width: 768px) {
	#cast_dt{ padding: 0px;}
	div.character {position: relative; width: 720px; min-height: 410px; background-position: top left; background-repeat: no-repeat;}
	div.character .charaBox { height: 410px; border-radius: 10px;}
	.chara_e div.character, .chara_i div.character {min-height: 340px;}
	.chara_e div.character .charaBox, .chara_i div.character .charaBox { height: 340px;}
	.chara_d div.character, .chara_o div.character {min-height: 370px;}
	.chara_d div.character .charaBox, .chara_o div.character .charaBox { height: 370px;}
.chara_a div.character .charaBox {background-image: url("../img/chart/chara_a_pc.jpg");}
.chara_b div.character .charaBox {background-image: url("../img/chart/chara_b_pc.jpg");}
.chara_c div.character .charaBox {background-image: url("../img/chart/chara_c_pc.jpg");}
.chara_d div.character .charaBox {background-image: url("../img/chart/chara_d_pc.jpg");}
.chara_e div.character .charaBox {background-image: url("../img/chart/chara_e_pc.jpg");}
.chara_f div.character .charaBox {background-image: url("../img/chart/chara_f_pc.jpg");}
.chara_g div.character .charaBox {background-image: url("../img/chart/chara_g_pc.jpg");}
.chara_h div.character .charaBox {background-image: url("../img/chart/chara_h_pc.jpg");}
.chara_i div.character .charaBox {background-image: url("../img/chart/chara_i_pc.jpg");}
.chara_j div.character .charaBox {background-image: url("../img/chart/chara_j_pc.jpg");}
.chara_k div.character .charaBox {background-image: url("../img/chart/chara_k_pc.jpg");}
.chara_l div.character .charaBox {background-image: url("../img/chart/chara_l_pc.jpg");}
.chara_m div.character .charaBox {background-image: url("../img/chart/chara_m_pc.jpg");}
.chara_n div.character .charaBox {background-image: url("../img/chart/chara_n_pc.jpg");}
.chara_o div.character .charaBox {background-image: url("../img/chart/chara_o_pc.jpg?1");}
	
.phArea{ display: none;}
.profArea{width:100%; height: 408px;}
.data { width:434px; height: 156px; background-size: cover; margin: 0 0 0 auto;}
#cast_dt .txtArea {width:344px; background-color: rgba(255,255,255,0.75); border-radius: 10px; padding: 18px; margin: 0 6px 6px auto;}
	#cast_dt .txtArea .txt { min-height: 210px;}
	#cast_dt.chara_e .txtArea .txt, #cast_dt.chara_i .txtArea .txt { min-height: 140px;}
	#cast_dt.chara_d .txtArea .txt, #cast_dt.chara_o .txtArea .txt { min-height: 170px;}
}
@media all and (max-width: 767px) {
	div.character {
		margin: 10px;
		position: relative;
	}
	div.character .charaBox { padding-bottom: 0.5em; background: linear-gradient(to right, rgba(255,180,109,1), rgba(255,144,166,1));}

	#cast_dt .ph_cut {
		width: 100%;
		margin: 0 auto 0em;
		border: none; padding: 0;
	}
	#cast_dt .ph_cut span {
		padding-top: 96.103%;
	}
	#cast_dt.chara_d .ph_cut span, #cast_dt.chara_o .ph_cut span {
		padding-top: 85.714%;
	}
	#cast_dt.chara_e .ph_cut span, #cast_dt.chara_i .ph_cut span {
		padding-top: 77.922%;
	}
#cast_dt .txtArea { background-color: rgba(255,255,255,0.75); border-radius: 10px; padding: 1em; margin: 0 0.5em 0.5em; }
.data { width:100%; height: 0; padding-top: 35.944%; background-size: cover; margin: 0 auto;}

}