/*popup*/
#cast_dt {padding:0; text-align:left;
background-image: -webkit-gradient(linear,left bottom,left center,from(rgba(98,6,8,0.5)),to(rgba(98,6,8,0))),
url(../img/bg.jpg);
/*background: -webkit-gradient(linear,left bottom,left center,from(rgba(98,6,8,0.5)),to(rgba(98,6,8,0)));*/}
@-moz-document url-prefix() {
#cast_dt{background:url(../img/bg.jpg);}
}

#cast_dt #mainbox {width:90%; height:auto; margin:10px auto 0; padding:0;}

#cast_dt h1 {width:95%; margin:0 0 .8em;}

#cast_dt h1 span.castname{ width:500px; height:64px; margin:0; display: block; text-indent: 100%; white-space: nowrap; overflow: hidden; background-repeat: no-repeat; background-position: 0 0; background-size: cover;}
#cast_dt h1#yuka span.castname { background-image: url(../img/chart/name_yuka.png);}
#cast_dt h1#zaitsu span.castname { background-image: url(../img/chart/name_zaitsu.png);}
#cast_dt h1#kazue span.castname { background-image: url(../img/chart/name_kazue.png);}
#cast_dt h1#satoshi span.castname { background-image: url(../img/chart/name_satoshi.png);}
#cast_dt h1#yuta span.castname { background-image: url(../img/chart/name_yuta.png);}
#cast_dt h1#ikumi span.castname { background-image: url(../img/chart/name_ikumi.png);}
#cast_dt h1#mari span.castname { background-image: url(../img/chart/name_mari.png);}
#cast_dt h1#gen span.castname { background-image: url(../img/chart/name_gen.png);}
#cast_dt h1#erina span.castname { background-image: url(../img/chart/name_erina.png);}
#cast_dt h1#wakamoto span.castname { background-image: url(../img/chart/name_wakamoto.png);}
#cast_dt h1#yuta span.castname { background-image: url(../img/chart/name_yuta.png);}
#cast_dt h1#koyume span.castname { background-image: url(../img/chart/name_koyume.png);}
#cast_dt h1#shino span.castname { background-image: url(../img/chart/name_shino.png);}
#cast_dt h1#shinobu span.castname { background-image: url(../img/chart/name_shinobu.png);}
#cast_dt h1#iori span.castname { background-image: url(../img/chart/name_iori.png);}
#cast_dt h1#kiyoshi span.castname { background-image: url(../img/chart/name_kiyoshi.png);}
#cast_dt h1#natsuko span.castname { background-image: url(../img/chart/name_natsuko.png);}

#cast_dt .prof { width:60%; margin:0 0 0;}
#cast_dt .photo {box-shadow:0 0 30px rgba(98,6,8,1); background-repeat: no-repeat; background-position: 0 0; background-size: cover;}
#cast_dt #mainbox .ovtxt {height:220px; overflow-x: hidden; overflow-y:scroll;}
#cast_dt #mainbox p {line-height:1.6;}
#cast_dt #mainbox p:first-letter {font-size: 180%; line-height: 1; color:#8f2426; font-weight:bold;}

#cast_dt #mainbox .ph_yuka {background-image: url(../img/chart/ph_yuka.jpg);}
#cast_dt #mainbox .ph_zaitsu {background-image: url(../img/chart/ph_zaitsu.jpg);}
#cast_dt #mainbox .ph_kazue {background-image: url(../img/chart/ph_kazue.jpg);}
#cast_dt #mainbox .ph_satoshi {background-image: url(../img/chart/ph_satoshi.jpg);}
#cast_dt #mainbox .ph_yuta {background-image: url(../img/chart/ph_yuta.jpg);}
#cast_dt #mainbox .ph_ikumi {background-image: url(../img/chart/ph_ikumi.jpg);}
#cast_dt #mainbox .ph_mari {background-image: url(../img/chart/ph_mari.jpg);}
#cast_dt #mainbox .ph_gen {background-image: url(../img/chart/ph_gen.jpg);}
#cast_dt #mainbox .ph_erina {background-image: url(../img/chart/ph_erina.jpg);}
#cast_dt #mainbox .ph_koyume {background-image: url(../img/chart/ph_koyume.jpg);}
#cast_dt #mainbox .ph_wakamoto {background-image: url(../img/chart/ph_wakamoto.jpg);}
#cast_dt #mainbox .ph_shino {background-image: url(../img/chart/ph_shino.jpg);}
#cast_dt #mainbox .ph_iori {background-image: url(../img/chart/ph_iori.jpg);}
#cast_dt #mainbox .ph_shinobu {background-image: url(../img/chart/ph_shinobu.jpg);}
#cast_dt #mainbox .ph_kiyoshi {background-image: url(../img/chart/ph_kiyoshi.jpg);}
#cast_dt #mainbox .ph_natsuko {background-image: url(../img/chart/ph_natsuko.jpg);}

@media all and (min-width: 768px) {
#cast_dt #mainbox {width:750px;}
#cast_dt .photo {width:250px; height:310px; padding:0; margin:0 0 0 10px;}
}
@media all and (max-width: 767px) {
#cast_dt h1 {width:95%; margin:0 auto 15px;}
#cast_dt h1 span.castname{ width:100%; height:0; padding:12.8% 0 0;}
#cast_dt .photo {width:60%; height:0; padding:70.8% 0 0; margin:0 auto;}
#cast_dt .photo,#cast_dt .prof {float:none;}
#cast_dt .prof {width:95%; margin:10px auto 0;}
#cast_dt #mainbox p {font-size:90%; line-height:1.5; padding:7px 0 0;}
}

#cast_dt {position:absolute;left:50%; z-index:5800 !important;}
#cast_dt .btn-w-close a{display:block; width:114px; height:47px; background:url(../img/chart/close.png) no-repeat; margin:20px auto; background-size: contain;}
#cast_dt .btn-w-close a{cursor:pointer;}

@media all and (min-width: 768px) {
#cast_dt {width:800px;margin-left:-430px;}
}

@media all and (max-width: 767px) {
#cast_dt {width:100%; margin-left:-50%;}
#cast_dt .btn-w-close a{width:80px; height:33px;}
}