/*chart*/
#chart #contents{padding:2em 0;}
#chart .diagram{ position:relative; margin:.5em auto; background:url(../chart/img/chart.png?9) no-repeat 0 0;}
#chart .diagram ul,#chart .diagram ul li {position: absolute;}
#chart .diagram ul li a{ display: block; text-decoration: none; overflow: hidden; text-indent: 100%; white-space: nowrap;
background:linear-gradient(to top, rgba(255,225,103,0.6) 0%,rgba(255,225,103,0) 100%);}
#chart .diagram ul li a img {display:block;}
#chart .diagram ul li.sz-l a img {width:154px; height:184px;}
#chart .diagram ul li.sz-m a img {width:140px; height:164px;}
#chart .diagram ul li.sz-s a img {width:119px; height:140px;}
#chart .diagram ul li a {
filter: alpha(opacity=0); -moz-opacity:0; opacity:0;
transition: 0.3s;}
#chart .diagram ul li a:hover { filter: alpha(opacity=100); -moz-opacity:100; opacity:100;}
#chart ul li.haruto {left:289px; top:275px;}
#chart ul li.michiru {left:495px; top:275px;}
#chart ul li.miwa {left:483px; top:72px;}
#chart ul li.satsuki {left:692px; top:8px;}
#chart ul li.yuzuki {left:692px; top:165px;}
#chart ul li.todo {left:310px; top:72px;}
#chart ul li.aki {left:123px; top:8px;}
#chart ul li.koharu {left:123px; top:165px;}
#chart ul li.makimura {left:692px; top:332px;}
#chart ul li.mayumi {left:123px; top:332px;}
#chart ul li.tomoka {left:458px; top:485px;}
#chart ul li.akutsu {left:617px; top:550px;}
#chart ul li.eri {left:796px; top:575px;}
#chart ul li.misaki {left:721px; top:748px;}
#chart ul li.tatewaki {left:288px; top:550px;}
#chart ul li.bizen {left:150px; top:574px;}
#chart ul li.suzuma {left:16px; top:574px;}
#chart ul li.yoshino {left:302px; top:786px;}
#chart ul li.katsuragi {left:472px; top:786px;}
#chart ul li.umeki {left:530px; top:973px;}
#chart ul li.washio {left:389px; top:973px;}
#chart ul li.kusakbe {left:246px; top:973px;}

@media all and (min-width: 768px) {
#chart .diagram{ width:920px; height:1134px; background-size:cover;}
}
@media all and (max-width: 767px) {
#chart #contents{padding:3% 0;}
#chart .diagram{margin:1% auto 3%; overflow:hidden; width:95%; height:0; padding:117.056074766% 0 0; background-size: cover;}
#chart .diagram ul {position: absolute; left:0; top:0; width:100%; height:100%;}
}


/*popup*/
#cast_dt {text-align:left; background-color:#f5eee7;
background-image:url(../img/tr2.svg),url(../img/bg4.png);
background-repeat:no-repeat,repeat;
background-position:right bottom,0 center;
background-size:50%,80%;}
#cast_dt #mainbox {width:100%; height:auto; margin:0 auto; padding:0; }

#cast_dt h1 {background-image:linear-gradient(to top, rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.8) 100%); 
background-repeat:no-repeat;
background-size:80% 30%;
background-position:left bottom;
padding:0 0 1% 3%;}
#cast_dt h1 span.castname{ width:100%; height:80px; display: block; text-indent: 100%; white-space: nowrap; overflow: hidden; background-repeat: no-repeat; background-position: 0 0; background-size: contain;}
#cast_dt h1#haruto span.castname {background-image: url(./img/haruto.png);}
#cast_dt h1#michiru span.castname {background-image: url(./img/michiru.png);}
#cast_dt h1#miwa span.castname {background-image: url(./img/miwa.png);}
#cast_dt h1#todo span.castname {background-image: url(./img/todo.png);}
#cast_dt h1#makimura span.castname {background-image: url(./img/makimura.png);}
#cast_dt h1#mayumi span.castname {background-image: url(./img/mayumi.png);}
#cast_dt h1#tomoka span.castname {background-image: url(./img/tomoka.png);}
#cast_dt h1#akutsu span.castname {background-image: url(./img/akutsu.png);}
#cast_dt h1#tatewaki span.castname {background-image: url(./img/tatewaki.png);}
#cast_dt h1#bizen span.castname {background-image: url(./img/bizen.png);}
#cast_dt h1#suzuma span.castname {background-image: url(./img/suzuma.png?1);}
#cast_dt h1#umeki span.castname {background-image: url(./img/umeki.png);}
#cast_dt h1#washio span.castname {background-image: url(./img/washio.png);}
#cast_dt h1#kusakabe span.castname {background-image: url(./img/kusakabe.png);}
#cast_dt h1#katsuragi span.castname {background-image: url(./img/katsuragi.png);}
#cast_dt h1#yoshino span.castname {background-image: url(./img/yoshino.png);}
#cast_dt h1#yuzuki span.castname {background-image: url(./img/yuzuki.png);}
#cast_dt h1#satsuki span.castname {background-image: url(./img/satsuki.png);}
#cast_dt h1#aki span.castname {background-image: url(./img/aki.png);}
#cast_dt h1#misaki span.castname {background-image: url(./img/misaki.png);}
#cast_dt h1#eri span.castname {background-image: url(./img/eri.png);}
#cast_dt h1#koharu span.castname {background-image: url(./img/koharu.png);}

#cast_dt .prof {width:100%;}
#cast_dt .photo {background-repeat: no-repeat; background-position:center bottom; background-size: cover;}

#cast_dt #mainbox .ph_haruto {background-image: url(./img/nino.png);}
#cast_dt #mainbox .ph_michiru {background-image: url(./img/tabe.png);}
#cast_dt #mainbox .ph_miwa {background-image: url(./img/kaku.png);}
#cast_dt #mainbox .ph_todo {background-image: url(./img/hamada.png);}
#cast_dt #mainbox .ph_makimura {background-image: url(./img/otomo.png);}
#cast_dt #mainbox .ph_mayumi {background-image: url(./img/kanno.png?1);}
#cast_dt #mainbox .ph_tomoka {background-image: url(./img/oshima.png);}
#cast_dt #mainbox .ph_akutsu {background-image: url(./img/matsumoto.png);}
#cast_dt #mainbox .ph_tatewaki {background-image: url(./img/takahashi.png);}
#cast_dt #mainbox .ph_bizen {background-image: url(./img/watanabe.png?1);}
#cast_dt #mainbox .ph_suzuma {background-image: url(./img/fujima.png);}
#cast_dt #mainbox .ph_umeki {background-image: url(./img/nasu.png);}
#cast_dt #mainbox .ph_washio {background-image: url(./img/yamada.png);}
#cast_dt #mainbox .ph_kusakabe {background-image: url(./img/sakota.png);}
#cast_dt #mainbox .ph_katsuragi {background-image: url(./img/tamaki.png);}
#cast_dt #mainbox .ph_yoshino {background-image: url(./img/tomizawa.png);}
#cast_dt #mainbox .ph_yuzuki {background-image: url(./img/yamazaki.png);}
#cast_dt #mainbox .ph_satsuki {background-image: url(./img/renbutsu.png);}
#cast_dt #mainbox .ph_aki {background-image: url(./img/tamakiryo.png);}
#cast_dt #mainbox .ph_misaki {background-image: url(./img/rimi.png);}
#cast_dt #mainbox .ph_eri {background-image: url(./img/moriwaki.png);}
#cast_dt #mainbox .ph_koharu {background-image: url(./img/nozawa.png);}

#cast_dt {position:absolute;left:50%; z-index:10001 !important;}
#cast_dt .btn-w-close a{display:block; width:140px; height:45px; background: url(./img/close.svg) no-repeat; background-size: contain; /*transform: rotate(5deg);*/ margin:0 auto;}
#cast_dt .btn-w-close a{cursor:pointer;}

@media all and (min-width: 768px) {
#cast_dt {width:750px; height:520px; margin-left:-350px;}
#cast_dt #mainbox {margin:0 auto;}
#cast_dt h1 {width:75%; margin:.5em 0 0 0;}
#cast_dt .prof{width:60%; margin-left:auto; position: relative;  z-index:2;}
#cast_dt .prof p{word-break: break-all; font-size:105%; line-height:160%; padding:1.2em 1.6em 1.5em 0; width:82%; margin:5% 7% 0 auto; position: relative; border-right:3px solid #eb6100;}
#cast_dt p.ovtxt {padding:.5em 1.6em 1.5em 0; height:300px; overflow-x: hidden; overflow-y:scroll; border-right:none;}
.ovtxt::-webkit-scrollbar{width:3px; background:none;}
.ovtxt::-webkit-scrollbar-thumb{background:#eb6100;}
#cast_dt .photo {width:370px; height:405px; position:absolute; left:0; bottom:0; z-index:1;}
#cast_dt .btn-w-close{position:absolute;right:3%; bottom:4%;}
}

@media all and (max-width: 767px) {
#cast_dt {width:100%; margin-left:-50%; margin-top:0 !important;
background-size:90%,100%;}
#cast_dt #mainbox {margin:0 auto; padding:3% 0 0;}
#cast_dt h1 {width:100%; margin:0 auto 5%; padding:0 0 2.5% 4%;}
#cast_dt h1 span.castname{height:0; padding:13.9% 0 0 0; background-size: contain;}
#cast_dt .photo {width:75%; height:0; padding:83% 0 0; margin:0 auto 5%; position: relative; border:5px solid rgba(255,255,255,0.8); box-shadow:12px 10px rgba(235,97,0,0.3); background-position:left bottom;}
#cast_dt .photo img{position:absolute;left:0;top:0; width:100%; height:100%;}
#cast_dt .prof {width:98%; margin:1em auto 0; padding: 0 5%; border-left:4px solid #eb6100;}
#cast_dt .prof p {font-size:100%; font-size:3.8vw; line-height:165%; padding:.5em 0 .5em; }
#cast_dt .btn-w-close a{width:28%; height:0; padding:9% 0 0; margin:4% auto 6%;}
}
.alt {position:absolute;top:-5000px;left:-9999px;}