/*chart*/
#chart #contents{padding:2em 0;}
#chart .diagram{ position:relative; margin:1em auto; background:url(../chart/img/chart.png?8) 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,255,255,0.7) 0%,rgba(255,255,255,0) 100%);}
#chart .diagram ul li a img {display:block;}
#chart .diagram ul li.sz-l a img {width:188px; height:219px;}
#chart .diagram ul li.sz-m a img {width:161px; height:186px;}
#chart .diagram ul li.sz-s a img {width:141px; height:164px;}
#chart .diagram ul li.sz-ss a img {width:124px; height:145px;}
#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.keisuke {left:217px; top:331px;}
#chart ul li.takae {left:472px; top:331px;}
#chart ul li.mai {left:255px; top:617px;}
#chart ul li.marika {left:470px; top:617px;}
#chart ul li.chika {left:711px; top:585px;}
#chart ul li.koga {left:711px; top:331px;}
#chart ul li.moriya {left:80px; top:54px;}
#chart ul li.soejima {left:270px; top:76px;}
#chart ul li.uda {left:437px; top:76px;}
#chart ul li.kikuchi {left:22px; top:331px;}
#chart ul li.aikawa {left:1px; top:617px;}
#chart ul li.master {left:94px; top:886px;}
#chart ul li.yako {left:264px; top:886px;}
#chart ul li.nakamura {left:433px; top:886px;}
#chart ul li.izumo {left:626px; top:95px;}
#chart ul li.nazo {left:778px; top:95px;}

@media all and (min-width: 768px) {
#chart .diagram{ width:910px; height:1068px; background-size:cover;}
}
@media all and (max-width: 767px) {
#chart #contents{padding:3% 0;}
#chart .diagram{margin:0 auto .5em; overflow:hidden; width:95%; height:0; padding:111.515458692% 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:rgba(255,255,255,0.9);
border:5px solid rgba(255,255,255,0.6);
background-image:url(../img/circles.svg),url(../img/circles.svg),url(../img/top/bokeh.jpg);
background-repeat:no-repeat,no-repeat,no-repeat;
background-position:left 2% bottom,center center,center center;
background-size:35%,90%,cover;}
#cast_dt #mainbox {width:100%; height:auto; margin:0 auto; padding:0; }

#cast_dt h1 {background:none;}
#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#keisuke span.castname {background-image: url(./img/tsutsumi.png);}
#cast_dt h1#takae span.castname {background-image: url(./img/ishida.png);}
#cast_dt h1#mai span.castname {background-image: url(./img/makita.png);}
#cast_dt h1#konomi span.castname {background-image: url(./img/morita.png);}
#cast_dt h1#marika span.castname {background-image: url(./img/maida.png);}
#cast_dt h1#master span.castname {background-image: url(./img/yanagiya.png);}
#cast_dt h1#nakamura span.castname {background-image: url(./img/iizuka.png);}
#cast_dt h1#soejima span.castname {background-image: url(./img/baba.png);}
#cast_dt h1#uda span.castname {background-image: url(./img/tanaka.png);}
#cast_dt h1#kikuchi span.castname {background-image: url(./img/mizutani.png);}
#cast_dt h1#aikawa span.castname {background-image: url(./img/sugino.png?1);}
#cast_dt h1#yako span.castname {background-image: url(./img/ogura.png);}
#cast_dt h1#chika span.castname {background-image: url(./img/yoshida.png);}
#cast_dt h1#koga span.castname {background-image: url(./img/kamiki.png);}
#cast_dt h1#izumo span.castname {background-image: url(./img/touma.png);}
#cast_dt h1#mizukawa span.castname {background-image: url(./img/mizukawa.png?1);}

#cast_dt .prof {width:100%;}
#cast_dt .photo {background-repeat: no-repeat; background-position:center bottom; background-size: cover; border:1px solid rgba(255,255,255,0.8);
box-shadow:15px -12px rgba(154,148,174,0.3);}

#cast_dt #mainbox .ph_keisuke {background-image: url(./img/ph_keisuke.jpg);}
#cast_dt #mainbox .ph_takae {background-image: url(./img/ph_takae.jpg);}
#cast_dt #mainbox .ph_mai {background-image: url(./img/ph_mai.jpg);}
#cast_dt #mainbox .ph_konomi {background-image: url(./img/ph_konomi.jpg);}
#cast_dt #mainbox .ph_marika {background-image: url(./img/ph_marika.jpg);}
#cast_dt #mainbox .ph_master {background-image: url(./img/ph_master.jpg);}
#cast_dt #mainbox .ph_nakamura {background-image: url(./img/ph_nakamura.jpg);}
#cast_dt #mainbox .ph_soejima {background-image: url(./img/ph_soejima.jpg);}
#cast_dt #mainbox .ph_uda {background-image: url(./img/ph_uda.jpg);}
#cast_dt #mainbox .ph_kikuchi {background-image: url(./img/ph_kikuchi.jpg);}
#cast_dt #mainbox .ph_aikawa {background-image: url(./img/ph_aikawa.jpg?2);}
#cast_dt #mainbox .ph_yako {background-image: url(./img/ph_yako.jpg);}
#cast_dt #mainbox .ph_chika {background-image: url(./img/ph_chika.jpg);}
#cast_dt #mainbox .ph_koga {background-image: url(./img/ph_koga.jpg);}
#cast_dt #mainbox .ph_izumo {background-image: url(./img/ph_izumo.jpg);}
#cast_dt #mainbox .ph_mizukawa {background-image: url(./img/ph_mizukawa.jpg);}

#cast_dt {position:absolute;left:50%; z-index:10001 !important;}
#cast_dt .btn-w-close a{display:block; width:130px; height:41px; background:url(./img/close.png) 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:62%; margin:.6em 0 0 1.2em;}
#cast_dt h1 span.castname{ width:96%;}
#cast_dt .prof{width:60%; margin-left:auto; position: relative;}
#cast_dt .prof p{font-size:105%; line-height:160%; padding:2em 2em 3em 0; width:85%; margin-left:auto; position: relative;}
#cast_dt span.ovtxt {display:inline-block; height:230px; overflow-x: hidden; overflow-y:scroll; }
.ovtxt::-webkit-scrollbar{width:4px; background:none;}
.ovtxt::-webkit-scrollbar-thumb{background:#111;}
#cast_dt .photo {width:300px; height:354px; position:absolute; left:3.5%; bottom:7%; z-index:11;}
#cast_dt .btn-w-close{position:absolute;right:3%; bottom:5%;}
}

@media all and (max-width: 767px) {
#cast_dt {width:100%; margin-left:-50%; margin-top:0 !important;
background-position:left 2% bottom 10%,center top 5%,center center;
background-size:90%,95%,cover;}
#cast_dt #mainbox {margin:2px auto; padding:0 0 .5em;}
#cast_dt h1 {width:92%; margin:0 auto 6%; padding:3% 0 0 0;}
#cast_dt h1 span.castname{height:0; padding:18.4% 0 0 0; background-size: contain;}
#cast_dt .photo {width:67%; height:0; padding:79.142394822% 0 0; margin:0 auto 4%; position: relative; box-shadow:15px -15px rgba(154,148,174,0.3);}
#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%;}
#cast_dt .prof p {font-size:100%; font-size:3.8vw; line-height:165%; padding:0 0 .5em;}
#cast_dt .btn-w-close a{width:27%; height:0; padding:8.5% 0 0; margin:3.5% auto 6%;}
}
.alt {position:absolute;top:-5000px;left:-9999px;}