/*///////////////////////////////////////////////////////////////////////// default_CSS /////////////////////////////////////////////////////////////////////////*/ body { font-family: Garamond , "Times New Roman" , "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; -webkit-text-size-adjust: 100%;} body, h1, h2, h3, h4, h5, div, p, dl, dt, dd, ol, ul, li, form, table, caption, tbody, tfoot, thead, tr, th, td, article { margin:0; padding:0; font-weight: normal; font-size:100%; box-sizing: border-box;} h1,h2,h3,h4,h5,p {background-color:rgba(255,255,255,.01);} img,iframe { border:none;} ol,ul { list-style:none; list-style-type: none;} .alt{ position:absolute; top:-5000px; left:-9999px;} .relative { position: relative;} .hid{visibility: hidden;} /*画像保護用*/ .cover {width:100%; height:100%;} /*float*/ .floatL { float:left;} .floatR { float:right;} .clearfloat { height:1px; font-size:1%; clear:both; display:block; background: transparent;} .clearfix:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;} .clearfix { min-height:1px;} * html .clearfix {height: 1px; /*¥*//*/ height: auto; overflow: hidden; /**/ } /*font*/ .tCenter { text-align:center !important} .tRight { text-align:right !important} .tLeft { text-align:left !important} /*font-size*/ html { font-size: 62.5%;} /* = 10px */ body { font-size: 1.6rem; } /* = 16px */ h1 { font-size: 3.2rem; } h2 { font-size: 2.3rem; } h3 { font-size: 2.1rem; } h4 { font-size: 2.0rem; } p { font-size: 1.6rem; } .f140 { font-size:140%;} .f120 { font-size:120%;} .f110 { font-size:110%;} .f90 { font-size:90%;} .f85 { line-height:normal; font-size:85% !important} .styel{color:#cebf00;} .stred{color:#ce4328;} .stblu{color:#0067c0;} /*link*/ a { text-decoration:none; color:#1d1d1d;} a:hover { text-decoration:none; color:#1d1d1d;} #menu li a,#gotop a,header a,#form #agree a,#msg #writeBtn a,#bknm li a,.bn_tw a,a.btn_prev,a.btn_ap,a.btn_s,a.btn_i,#btnBn a,#prevnext ul li a,.sns img,.update li a,#top #pre a,#cast h2 a {text-decoration:none; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } #menu li a:hover,#gotop a:hover,header a:hover,#form #agree a:hover,#msg #writeBtn a:hover,#bknm li a:hover,a.btn_ap:hover,a.btn_s:hover,a.btn_i:hover,#btnBn a:hover,#prevnext ul li a:hover,.sns img:hover,#top #pre a:hover{text-decoration:none; filter:alpha(opacity=70); -moz-opacity:0.70; opacity:0.70;} .no-link{ pointer-events: none; cursor: default; text-decoration:none; filter:alpha(opacity=90); -moz-opacity:0.90; opacity:0.90;} .fade { -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; } .fade:hover { opacity: 0.5; filter: alpha(opacity=60); } /*///////////////////////////////////////////////////////////////////////// コンテンツ用CSS／オリジナル設定 /////////////////////////////////////////////////////////////////////////*/ html, body, div#con-body {background: url(../img/bg.jpg) ; color:#1d1d1d;} #con-body {background-color:transparent;} #container { max-height: 100%;} #top header {width:100%; /*height:430px;*/ background:#fff url(../img/hdbk.png) repeat-x 0 bottom; padding:0 0 1em;} #top h1{width:980px; height:606px; margin:0 auto; position: relative; background: url(../img/top/main.png) no-repeat 0 0;} /*#top header .inner{width:940px; margin:0 auto; padding:2em 0 0;} #top h1{width:527px; height:355px; margin:0 auto; float:left; position: relative;} #top h1 .img2,#top h1 .img3,#top h1 .img4{position: absolute;top: 0;left:0;} #top h1 img{ animation-name: kira; -webkit-animation-name: kira; animation-duration: 2.5s; -webkit-animation-duration: 2.5s; animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; } #top h1 .img1{animation-delay:0s; -webkit-animation-delay:0s;} #top h1 .img2{animation-delay:0.5s; -webkit-animation-delay:0.5s;} #top h1 .img3{animation-delay:1s; -webkit-animation-delay:1s;} #top h1 .img4{animation-delay:2s; -webkit-animation-delay:2s;} @keyframes kira { 0% { opacity: 1; } 25% { opacity: 0; } } @-webkit-keyframes kira { 0% { opacity: 1; } 25% { opacity: 0; } } @-moz-keyframes kira { 0% { opacity: 1; } 25% { opacity: 0; } }*/ #count{ font-family: Garamond , "游明朝" , "Yu Mincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho ProN" , "HG明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif; color:#2a281b; line-height:1; text-align:center; /*margin:11em 0 0; float:right;*/ margin:.8em auto 0; width:980px;} #cdday{width:353px; background:url(../img/top/cd.png) no-repeat 0 bottom; color:#ecdf00; font-size: 4rem; font-weight:bold; text-shadow:2px 3px #2a281b; margin:0 .3em 0; padding:0 .8em 0 0; text-align:right; text-shadow: #2a281b 3px 4px 0px, #2a281b -1px 2px 0px, #2a281b 2px -1px 0px, #2a281b -1px -1px 0px; display:inline-block;} #cdday span.day{font-size: 9rem;} #count span.cdtxt{padding:0 .2em 0 0;} #CDT{font-size: 3.5rem; font-weight:bold;} #CDT .day,#CDT .hour,#CDT .min,#CDT .sec{font-size:7rem;} #CDT .min,#CDT .sec{padding:0 0 0 .1em;} /*.oad{background:#2d2a1d url(../img/top/oad.png) no-repeat center center; height:100px;} .oad{ background:#2d2a1d url(../img/top/oad2.png) no-repeat center center; height:150px;}*/ .oad{ background:#2d2a1d url(../img/top/oad3.png) no-repeat center center; height:85px;} #top #pre a{width:950px; height:135px; margin:2em auto; background:url(../img/top/pre.jpg) no-repeat center center; box-shadow:3px 3px #010101; border:1px solid #010101; display:block;} #mov,#bnmenu1,#bnmenu1-2,#bnmenu1-3,#bnmenu2,#bnmenu3 {width:950px; margin:0 auto; line-height: 1.5;} #mov{margin:2em auto 1em;} .spot{width:550px; height:309px; background:url(../img/top/mov.jpg) no-repeat 0 0;} .update{width:380px; background:#fff url(../img/top/update.jpg) no-repeat center top; box-shadow:3px 3px #010101; border:1px solid #010101; margin:0 0 1.5em;} .update h2{height:50px;} .update ul{width:92%; margin:0 auto; height:155px; font-size:90%; overflow-y: auto;} .update li{border-bottom:1px solid rgba(218,202,0,0.7); margin:0 0 .3em; padding:0 0 .3em; line-height: 1.4;} .update li a:hover{color:#cebf00;} .update li span.ymd,#todayp li span.ymd{background:#f0e67a; font-size:110%;} .update ul::-webkit-scrollbar{width: 5px; background: none;} .update ul::-webkit-scrollbar-thumb{background: #010101;} .sns{height:64px;} .sns p{float:left; font-size:75%; margin:1em 1.2em 0 .5em; vertical-align:middle; font-family: Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho ProN" , "HG明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;} .sns strong{font-size:2.1rem;} #todayp{width:950px; background: url(../img/bg2.jpg); box-shadow:3px 3px #010101; border:1px solid #010101; margin:1em auto 0; font-size:90%; padding:.2em 0;} #todayp h2{text-align:center; text-shadow:1px 1px 0 #fff; font-weight:bold; -webkit-box-reflect: below -15px -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(0.5, transparent), to(rgba(0,0,0,0.3)));} #todayp h2 span {color:#cebf00; font-size:4rem; } #todayp ul{width:95%; margin:.5em auto 0;} #todayp ul li{line-height: 1.4; margin:0 0 .5em; padding:0 0 .5em; border-bottom:1px solid rgba(218,202,0,0.7);} #todayp ul li:last-child{border:none;} #todayp li span.cast{background:#302e20; color:#f0e67a; padding:0 .2em; display:inline-block; margin:.25em .3em 0 0;} #todayp li strong{color:#c2b631; font-size:120%;} /*cts*/ .bn_itr a,.bn_str a,.bn_cast a,.bn_staff a,.bn_msg a,.bn_news a,.bn_ch a,.bn_repo a,.bn_free a,.bn_odm a,.bn_ts a,.bn_int a,.bn_ishop a,.bn_sp1 a,.bn_pre a,.bn_book a,.bn_file a,.bn_gl a,.bn_pd a,.bn_clm a,.bn_mov a,.bn_ext a,.bn_line a {display: block; width:300px; height:135px; box-shadow:3px 3px #010101; border:1px solid #010101; background-repeat: no-repeat; background-position: center center; background-size: cover;} .bn_itr a{background: url(../img/top/intro.jpg);} .bn_str a{background: url(../img/top/story.jpg);} .bn_cast a{background: url(../img/top/cast.jpg);} .bn_staff a{background: url(../img/top/staff.jpg);} .bn_msg a{background: url(../img/top/msg.jpg);} .bn_news a{background: url(../img/top/news.jpg);} .bn_ch a{background: url(../img/top/chart.jpg);} .bn_repo a{background: url(../img/top/repo.jpg);} .bn_ts a{background: url(../img/top/ts.jpg);} .bn_int a{background: url(../img/top/int6.jpg);} .bn_ishop a{background: url(../img/top/ishop.jpg);} .bn_free a{background: url(../img/top/free.jpg);} .bn_sp1 a{background: url(../img/top/sp1.jpg);} .bn_pre a{background: url(../img/top/pre.jpg);} .bn_file a{background: url(../img/top/file2.jpg);} .bn_gl a{background: url(../img/top/gl.jpg);} /*.bn_book a{background: url(../img/top/pre2.jpg);}*/ .bn_book a{background: url(../img/top/book2.jpg);} .bn_pd a{background: url(../img/top/pd.jpg);} .bn_clm a{background: url(../img/top/clm.jpg);} .bn_odm a{background: url(../img/top/odm.jpg);} .bn_mov a{background: url(../img/top/spmov.jpg);} .bn_ext a{background: url(../img/top/extra.jpg);} .bn_line a{background: url(../img/top/line.jpg);} .bna {position: relative; overflow: hidden;} .bna:before { content: ""; background-image: -webkit-linear-gradient( 130deg, rgba(243,235,82,0) 20%, rgba(243,235,82,0.6) 50%, rgba(243,235,82,0) 80% ); background-image: linear-gradient( 130deg, rgba(243,235,82,0) 20%, rgba(243,235,82,0.6) 50%, rgba(243,235,82,0) 80% ); width: 200%; height: 200%; position: absolute; top: -100%; left: -200%; -webkit-transition: all 0.5s; transition: all 0.5s; } .bna:hover:before {top: 0%; left: 100%;} .bn_repo_s span {color:#e4007f; position: absolute; bottom: .8em; left: 0; padding:0 0 .6em; display:inline-block; width:100%; text-align:center;} #word {width:300px; height:288px; /*box-shadow:3px 3px #010101; border:1px solid #010101;*/ margin:0 5px 0 0; background-size: cover; background-repeat: no-repeat; background-position: center center; background-image:url(../img/top/word/word2.jpg);} p.caution{width:950px; margin:1em auto 0;} #bnmenu1-2{margin:1em auto 0;} #bnmenu1-3{margin:0 auto 1em;} #twTL {width:300px; height:290px; box-shadow:3px 3px #010101; border:1px solid #010101; margin:0 5px 0 0;} #twTL h3{width:298px; height:50px; background:url(../img/top/tw.jpg) no-repeat 0 0;} /*footer*/ footer {margin:2em auto 0; position: relative; padding:2.5em 0; background-image:linear-gradient(to top,rgba(248,244,169,1),rgba(248,244,169,0));} footer .inner {width:950px; margin:0 auto; } footer p {padding:15px 0; font-size:1.5rem;} footer .copy { padding:5em 0 0;} #rect {width:300px; height: 250px; background:#111;} /*------------------　2nd　------------------ */ header {width:100%; background:#fff url(../img/hdbk.png) repeat-x 0 0; padding:0;} header a {width:980px; height:270px; margin:0 auto; background: url(../img/logo.png) no-repeat center center; display:block;} #contents{width:960px; background: url(../img/bg2.jpg); margin:3em auto; padding:0 0 3em; box-shadow:3px 3px #010101; border:1px solid #010101;} #contents p {padding:1em 3.5em .5em; line-height:1.4;} #contents h1{width:960px; height:300px; background-size: cover; margin:0 auto; background-repeat: no-repeat; background-position: 0 0;} h1.intro{background-image:url(../img/intro/ttl.jpg);} h1.story{background-image:url(../img/story/ttl.jpg);} h1.info{background-image:url(../img/news/ttl.jpg);} h1.staff{background-image:url(../img/staff.jpg);} h1.cast{background-image:url(../img/cast.jpg);} h1.fmsg{background-image:url(../img/msg.jpg);} h1.chart{background-image:url(../img/chart_ttl.jpg); height:220px !important;} h1.theme{background-image:url(../img/ts_ttl.jpg); height:220px !important; margin:0 auto 1em !important;} h1.pre{background-image:url(../img/pre_ttl.jpg); height:220px !important; margin:0 auto 1em !important;} h1.gl{background-image:url(../img/gallery/ttl.jpg); height:220px !important; margin:0 auto .5em !important;} h1.ex{background-image:url(../img/extra/ttl.jpg); height:220px !important; margin:0 auto !important;} h1.spmov{background-image:url(../img/mov_ttl.jpg); height:220px !important; margin:0 auto !important;} h1.repo{background-image:url(../img/repo/ttl.jpg);} h1.file{background-image:url(../img/file/ttl.jpg); height:290px !important; margin:0 auto 1em !important;} h1.file2{background-image:url(../img/file/ttl2.jpg); height:290px !important; margin:0 auto 1em !important;} h1.pd{background-image:url(../img/pd/ttl.jpg); height:260px !important; margin:0 auto 1em !important;} h1.clm{background-image:url(../img/clm_ttl.jpg); height:260px !important; margin:0 auto !important;} .ffmc{font-family: Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho ProN" , "HG明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;} #btnBn{margin:1em auto 0; width:940px;} #bknm{width:960px; margin:3em auto;} #bknm h3{font-size:3rem; border-bottom:1px solid rgba(218,202,0,0.7); padding:0 0 .1em; letter-spacing:.1em;} #bknm h3:first-letter {font-size: 130%; line-height: 1; color:#cbb600;} .ph_cut {width:600px; height:400px; box-shadow:0 0 10px rgba(80,76,76,0.2); margin:1em auto; background-size: cover; background-repeat: no-repeat; background-position: center center;} .ph_cut_l {width:400px; height:600px; box-shadow:0 0 10px rgba(80,76,76,0.2); margin:1em auto; background-size: cover; background-repeat: no-repeat; background-position: center top;} /*intro*/ #intro h2{width:579px; height:277px; background: url(../img/intro/h2.png) no-repeat 0 0; margin:1em auto;} #intro h3{font-weight:bold; text-align:center; padding:1.6em 1em 2em;} #intro .main {background-image:url(../img/intro/main.jpg);} #intro #contents strong{font-size:110%;} #intro .bdr p,#theme .bdr p{padding:0;} #intro h2.comme{width:auto; height:auto; margin:-1em 0 .2em 1em; background:#2a281b; font-size:3.5rem; padding:0 1em 0; font-weight:bold; color:#cebf00; display:inline-block; box-shadow:1px 1px 0 #fff; -webkit-transform: rotate(-2deg); -ms-transform: rotate(-2deg); transform: rotate(-2deg); } #intro h3.name,#theme h4.name{font-weight:bold; text-align:left; padding:.2em 0; border-bottom:1px solid rgba(226,211,0,0.8); margin:0 0 .5em; text-shadow:1px 1px 0 #fff;} .bdr{border:1px solid rgba(226,211,0,0.8); padding:1em 1.5em ; margin:1em auto 2em; width:90%; border-top:3px double rgba(226,211,0,0.8); border-bottom:3px double rgba(226,211,0,0.8);} .bdr2{border:1px solid rgba(226,211,0,0.8); padding:1em !important; margin:.5em 0 0;} /*theme*/ #theme p{line-height:1.6;} #theme h2{width:93%; color:#cebf00; font-weight: bold; background: #2d2a1d; padding: 15px 30px; margin:1.5em 30px 0 0; position: relative; letter-spacing:1px;} #theme h2:after { width: 0; height: 0; content: " "; position: absolute; top: 0px; left: 100%; border-width: 28px 15px; border-style: solid; border-color: #2d2a1d; border-right-color: transparent; } #theme h3{width:90%; margin:1em auto .5em; font-weight:bold; font-size:2.3rem; border-left:4px solid rgba(226,211,0,0.8); padding:0 .5em;} #theme h5{font-weight:bold; color:#cebf00; padding:0 0 .2em;} .bgr{padding:.5em 1em 1em; margin:1em auto 0; width:100%; background:rgba(226,211,0,0.1);} #theme .bgr p{padding:0; font-size:90%;} #theme .hirai {background-image:url(../img/news/hirai.jpg);} #theme .jkt {background-image:url(../img/jkt.jpg); width:400px; height:397px; margin:1em auto 0;} /*story*/ #story #detail{padding:2em 0 0;} #story #trailer,#info #trailer,#mov_fp{width:600px; height:338px; margin:0 auto;} #story #trailer {margin:1em auto 1em;} #story h2{text-align:center; text-shadow:1px 1px 0 #fff; font-weight:bold; -webkit-box-reflect: below -15px -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(0.5, transparent), to(rgba(0,0,0,0.8)));} #story h2 span,#gallery h2 span {color:#cebf00; font-size:4rem; } #story #contents p a {color:#a69930;} #story .ph_area{margin:1.5em auto 0; width:90%;} #story .ph_s,#file .ph_s{width:49%; padding:32.6666% 0 0; background-size: cover; background-repeat: no-repeat; background-position: center center; position: relative;} #story .ph_s img,#file .ph_s img {position:absolute;left:0;top:0; width:100%; height:100%;} #story #bknm h3{padding:0 0 .1em 1em;} #story #bknm ul {margin:1em auto; width:91%; padding:0 0 1em;} #story #bknm li{display:inline-block; width:210px; margin:0 0 .7em .3em; text-align:center; background-size: cover; background-repeat: no-repeat; background-position: center top;} #story #bknm li a {color:#fff; display:block; background:rgba(45,42,29,0.7); width:100%; height:140px; } #story #bknm li span {line-height: 149px;} #story #bknm li span.epi {background:#a69930; padding:.2em; margin:0 .5em 0 0; color:#fff;} #story #bknm li span.date {padding:.2em; } #story #contents{padding:0 0 0;} #movlist{padding:1em 0 1.5em; background-image:linear-gradient(to top,rgba(255,255,255,1),rgba(255,255,255,0));} #movlist h3,#file article h3{text-align:center; margin:0 auto 1em; border-top:1px solid rgba(226,211,0,0.8); border-bottom:1px solid rgba(226,211,0,0.8); text-shadow:1px 1px 0 #fff; padding:.3em 0; font-weight:bold; font-size:2.3rem;} #movlist h3:first-letter,#file h3:first-letter {font-size: 125%; line-height: 1; font-weight:bold; color:#cebf00;} #movlist ul {width:90%; margin:0 auto;} #movlist ul li {width:270px; margin:0 5px 1em; background-size: contain; text-align:center; background-repeat: no-repeat; background-position: 0 0; position: relative; display: inline-block;} #movlist ul li a img {width:100%; height:auto;} #movlist ul li a:hover img {-webkit-filter: saturate(300%);filter: saturate(300%);} #movlist ul li span.new {position: absolute; top: 5px; left: 0; background:rgba(226,211,0,0.8); padding:0 .3em; color:#fff; font-size:1.6rem; border-bottom:1px solid rgba(255,255,255,0.5); border-right:1px solid rgba(255,255,255,0.5);} #movlist ul li span.ttl { display: inline-block; background:rgba(226,211,0,0.3); text-align:center; padding:.2em .5em;} #spmov #movlist{padding:0; background-image:none;} #spmov #movlist h3{margin:1.5em auto 1em;} /*news*/ #promo,#info article {width:90%; margin:0 auto 1em;} #promo {padding:0 0 .5em; margin:1em auto 3em; background-color:rgba(255,255,255,0.3); box-shadow:0 5px 10px rgba(80,76,76,0.1);} #promo h2 {color:#fff; text-align:center; letter-spacing:.3em; padding:.2em 0; margin:0 0 1em; font-weight:bold; background-color:rgba(42,40,27,0.8); text-shadow:1px 0 0 #2a281b; box-shadow:1px 1px 0 #fff; background-image:-webkit-gradient(linear,left bottom,left center,from(rgba(226,211,0,0.5)),to(rgba(226,211,0,0)));} #promo h3 {font-size:1.8rem; padding:.5em 0 .3em;} #promo li {padding:0; border-bottom:1px solid rgba(226,211,0,0.5); margin:0 1em .5em;} #promo p.txt{padding:0 .5em .5em; font-size:90%; color:#7e7525;} #promo p.add {font-size:1.2rem !important; border:none !important; padding:.8em 2em;} #promo .pdate{background:rgba(226,211,0,0.3); padding:.1em;} #info span.date,#report article span.date {padding:2px 3px; background:#f0e67a; display:inline-block; font-size:105%; margin:0 0 0 -.5em; -webkit-transform: rotate(-2deg); -ms-transform: rotate(-2deg); transform: rotate(-2deg); } #info article {border-bottom:1px solid rgba(226,211,0,0.5); padding:0 0 2em;} #info article:last-child{border:0; padding:0;} #info article h2,#report article h2,#file article h2{text-shadow:1px 1px 0 #fff; line-height: 1.4; border-left: solid 5px #cebf00; border-bottom: solid 1px #dedbae; padding: 0.4em 0.5em; margin:.3em 0 .5em; background:rgba(235,224,27,0.2);} #info article h2:first-letter {font-size: 130%; line-height: 1; font-weight:bold;} #info article h3{font-size: 120%; line-height: 1.4;} #info article h3.bd{border-bottom:1px dotted #cebf00; margin:.5em 0 -.5em;} #info article h3.bd2{border-left:4px solid #cebf00; margin:.5em 0 0; font-weight:bold; padding:0 0 0 .5em;} #info article p {padding:1em 0;} #info #trailer {margin:2em auto .5em;} /*gallery*/ #gallery h2{text-align:center; text-shadow:1px 1px 0 #fff; font-weight:bold; padding:0 0 .2em;} #gallery ul#show{font-size:0; margin-left:35px;} #gallery ul#show li{ display:inline-block; margin:0 0 -1px -1px;} #gallery ul#show li span,#extra ul#show li span {background-size: cover; background-repeat: no-repeat; background-position: center center;} #gallery ul#show li span.lazy,#extra ul#show li span.lazy {position:relative; display:block;} #gallery ul#show li span a {width:225px; height:150px; display:block;} #gallery ul#show li span a:hover,#extra ul#show li span.lazy a:hover{ background:rgba(226,211,0,0.3);} #gallery ul#show li img,#extra ul#show li span.lazy img {position:absolute;left:0;top:0; width:100%; height:100%;} #gallery .lbg-pics,#extra .lbg-pics{background-color:none !important; box-shadow:none !important;} #bknm{margin:3em auto 0;} #gallery #bknm h3{padding:0 0 .1em 1em;} #gallery #bknm ul {margin:1em auto 0; width:95%; padding:0 0 1em;} #gallery #bknm li{display:inline-block; width:19%; margin:0 0 1% 0.5%; text-align:center; position:relative;} #gallery #bknm li a {color:#fff; display:block; width:100%; height:0; padding:66.5% 0 0; background-size: cover; background-repeat: no-repeat; background-position: center top;} #gallery #bknm li span.epi {position:absolute;left:0;bottom:0; background:#a69930; background:rgba(166,153,48,0.8); padding:.1em 0; color:#fff; width:100%;} #gallery #bknm li.ep1 a{background-image:url(../img/gallery/ep1/ep1_1.jpg);} #gallery #bknm li.ep2 a{background-image:url(../img/gallery/ep2/ep2_1.jpg);} #gallery #bknm li.ep3 a{background-image:url(../img/gallery/ep3/ep3_1.jpg);} #gallery #bknm li.ep4 a{background-image:url(../img/gallery/ep4/ep4_1.jpg);} #gallery #bknm li.ep5 a{background-image:url(../img/gallery/ep5/ep5_1.jpg);} #gallery #bknm li.ep6 a{background-image:url(../img/gallery/ep6/ep6_1.jpg);} #gallery #bknm li.ep7 a{background-image:url(../img/gallery/ep7/ep7_1.jpg);} #gallery #bknm li.ep8 a{background-image:url(../img/gallery/ep8/ep8_1.jpg);} #gallery #bknm li.ep9 a{background-image:url(../img/gallery/ep9/ep9_1.jpg);} #gallery #bknm li.ep10 a{background-image:url(../img/gallery/ep10/ep10_1.jpg);} /*extra*/ #extra h2{padding:.8em 1em; font-size:1.8rem;} #extra ul#show {width:94%; margin:0 auto; font-size:0;} #extra ul#show li {vertical-align: top; display:inline-block; font-size:1.55rem; width:31%; margin:0 1% 2%;} #extra ul#show li span{border:1px solid #cebf00; box-shadow:0px 0px 0px 2px #fff inset;} #extra ul#show li span.lazy a { display:block; width:100%; height:0; padding:75% 0 0;} #extra ul#show li span.date{border:none; box-shadow:none; background:rgba(226,211,0,0.5); margin:0 .2em 0 0; padding:0 .15em;} /*file*/ #file article h3{margin:1.8em auto 1em;} #file article h4 span{background: linear-gradient(transparent 50%, rgba(226,211,0,0.5) 0%);} #file article {width:95%; margin:0 auto; background:url(../img/file/bg.png) repeat-y 0 0; padding:.5em 1.3em 2em 4em; } #file article p {padding:.5em .8em;} #file article p.bdb{border-bottom:1px dotted rgba(166,153,48,0.6); font-size:90%;} span.bdb{border-bottom:1px solid #1d1d1d;} #file article ul {width:95%; margin:0 auto;} #file article ul li {position: relative; margin:0 0 1em;} #file article ul li p{font-size:90%; display:inline; border-bottom:1px #bbb dashed; padding:.1em 0 .2em; line-height:1.7;} #file article ul li::after { display: block; content: ''; position: absolute; top: .3em; left: -1.3em; width: 12px; height: 5px; border-left: 2px solid #CE4328; border-bottom: 2px solid #CE4328; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } .bgr2{padding:.5em 1em 1em; margin:1em auto 0; width:100%; background:rgba(42,40,27,0.05); border-bottom:1px solid rgba(204,204,204,0.5); border-right:1px solid rgba(204,204,204,0.5); font-size:90%;} .bgr3{padding:.5em 1em 1em; margin:1em auto; width:95%; background:rgba(42,40,27,0.05); border-bottom:1px solid rgba(204,204,204,0.5); border-right:1px solid rgba(204,204,204,0.5); font-size:90%;} #file .ph_area{margin:0 auto; width:98%;} #file .ph_s{margin:1.5em auto; box-shadow:2px 4px 10px rgba(80,76,76,0.2);} .talc{width:100%; text-align:center; display:inline-block; padding:.1em 0;} /*interview*/ #interview h2{color:#a69930; font-size:2rem; margin:2em 0 0; border-left:4px solid #cebf00; padding:.1em 0 .1em .5em;} #interview h2:first-of-type{margin:0;} #interview .ph_s{width:40%; padding:26% 0 0; background-size: cover; background-repeat: no-repeat; background-position: center center; position: relative; border:2px solid #cebf00; box-shadow:0px 0px 0px 1px #fff inset;} #interview .ph_s2{width:30%; padding:41% 0 0; background-size: cover; background-repeat: no-repeat; background-position: center center; position: relative; border:2px solid #cebf00; box-shadow:0px 0px 0px 1px #fff inset;} #interview article {width:90%; margin:0 auto;} #interview article p{padding:.5em 0;} #interview article img {position:absolute;left:0;top:0; width:100%; height:100%;} #interview #bknm{width:100%; margin:3em auto 0;} #interview #bknm ul {margin:1.5em 0 0 1.5em;} #interview #bknm h3{padding:0 0 .1em 1em;} #interview #bknm ul li{float:left; margin:0 0 .5em .5em; font-size:105%; line-height:56px;} #interview #bknm ul li a{width:265px; color:#111; height:55px; text-decoration:none; padding:15px 15px 15px 10px; display: block; border:1px solid rgba(218,202,0,0.7); background:rgba(255,255,255,0.3); background-image:linear-gradient(to top,rgba(226,211,0,0.3),rgba(226,211,0,0));} #interview #bknm li span.epi {width:56px; height:56px; line-height:56px; padding:5px; margin:-5px 15px 0 0; border-radius: 50%; display: block; float:left; color:#fff; background-repeat: no-repeat; background-position: center center; background-size: cover;} /*present*/ #present h3{font-size:3rem; text-align:center; text-shadow:1px 1px 0 #fff; font-weight:bold; border-top:1px solid rgba(226,211,0,0.5);} #present h3 span {color:#cebf00; font-size:6rem;} #present .que{font-size:140%; padding:0 1em .5em; margin:-.2em auto 2em; text-align:center; border-bottom:1px solid rgba(226,211,0,0.5);} #present .ph_pre{width:891px; height:396px; background:url(../img/pre.jpg) no-repeat 0 0; margin:2em auto;} #present .ans{width:92%; margin:0 auto;} #present .ans h3{font-size:2.5rem; text-shadow:1px 1px 0 #fff; border:none; position: relative; background:rgba(218,202,0,0.5); padding: .3em 0; margin:1.5em 0 .5em;} #present .ans h3:after { content: ""; position: absolute; top: 100%; left: 50%; height: 0; width: 0; border: 8px solid transparent; border-top: 12px solid rgba(218,202,0,0.5); } #present .ans p{padding:0 1em 0;} #present .ans span.ep{background: rgba(226,211,0,0.3); padding:.2em;} #present .ans ul li{padding:.7em 0 .5em 1em; border:1px solid rgba(226,211,0,0.5); margin:0 0 .5em; border-left:4px solid rgba(226,211,0,0.5); background: rgba(255,255,255,0.5);} /*#present .ans ul li:last-child{border:none;}*/ /*column*/ #column .bgr,#extra .bgr{margin:0 auto 2em;} #column h2{padding:1em 0; font-size:2rem; text-align:center;} #column h3{font-size:1.65rem; text-align:right; padding:1em 5% 0 0;} #column h3 span{font-size:85%; color:#6a6a6a;} #column article{background-image:url(../img/cbk.jpg); width:90%; margin:.5em auto; box-shadow:5px 5px 10px rgba(80,76,76,0.2); padding:1.5em 1.5em 2em; border:1px solid #cebf00; border-bottom:3px solid #cebf00; border-top:3px solid #cebf00;} #column article p{font-size:95%; display:inline; border-bottom:1px rgba(206,191,0,0.5) solid; padding:.1em 0 .2em; line-height:1.7;} #column article p strong{font-size:110%; color:#a69930;} #column #bknm,#file #bknm{width:90%; margin:2em auto 0;} #column #bknm h4,#file #bknm h4{text-align:center; font-size:3rem; border-bottom:1px solid #cebf00; border-top:1px solid #cebf00; padding:.1em 0 .2em; letter-spacing:.1em; margin:0 0 .5em;} #column #bknm h4:first-letter,#file #bknm h4:first-letter {font-size: 130%; line-height: 1; color:#cbb600;} #column #bknm ul li,#file #bknm ul li {float:left; text-align:center; width:10%; margin:0 1% 1% 0;} #column #bknm ul li a,#file #bknm ul li a {width:100%; display:block; padding:1.5em 0; color:#a69930; border:1px solid #cebf00;} #column #bknm ul li a:hover,#file #bknm ul li a:hover{color:#fff; background:rgba(206,191,0,0.7);} /*caststaff*/ #staff #contents{ line-height:1.8em;text-align:center; font-size:2.3rem;} #staff h2 {padding:.2em 0 0; color:#cebf00; font-weight:bold; margin:0; font-size:2.7rem; text-shadow:1px 1px 0 #fff;} /*#staff h2:nth-child(3){margin:1em 0 0;} #staff h2:last-child{margin:1em 0 0;}*/ #cast nav#part{margin:-2em 0 1em .5em;} #cast h2 {display:inline-block; margin:0 .12em;} #cast h2 a{display:block; width:100%;} #cast h2.toyosu{width:178px; height:56px; background:url(../img/toyosu.png) no-repeat 0 0; background-size: contain; } #cast h2.shiba{width:150px; height:56px; background:url(../img/shiba.png) no-repeat 0 0; background-size: contain;} #cast h2.toyosu a,#cast h2.shiba a{height:56px; background-color:rgba(66,64,29,0.6);} #cast h2 a:hover{filter:alpha(opacity=30); -moz-opacity:0.30; opacity:0.30;} #cast h3{text-align:center; color:#a69930; font-weight:bold; font-size:2.7rem; margin:0 0 1em; letter-spacing:.2em; text-shadow:1px 1px 0 #fff;} #cast h3 span{padding:.1em 3em; border-bottom:1px solid rgba(166,153,48,0.5);} #cast table{width:80%; margin:0 auto 1.5em;} #cast table td{text-align:center; padding:.25em 0;} #cast table td.cname{text-align:left; font-size:2rem; width:45%;} #cast table td.chara{text-align:right; font-size:2rem; width:45%; color:#a69930;} #cast table td.naka{padding:0.05em 0; font-weight:bold; font-size:2rem;} /*report*/ #report .ph_cut,#report .ph_cut_l{margin:1em auto .5em;} #report #contents .inner{width:95%; margin:0 auto;} #report #entry{float:left; width:600px;} #report #bknm{float:right; width:275px; margin:.5em auto;} #report article {width:98%; margin:-.5em 0 0 2%; background: url(../img/repo/bg.png); padding:.5em 1em 1em; box-shadow:2px 3px 10px rgba(80,76,76,0.1);} #report article p{padding:1em .1em 1em; line-height:1.5; font-size:95%;} #report article a {text-decoration: underline;} #report article a:hover {color:#cebf00;} /*#report article p:first-of-type{padding:2em 0 0;}*/ #report article p.cap { width:100%; text-align:center; margin:0 0 1em; display: inline-block; padding:0;} #report article p.cap span {font-size:1.5rem; background:rgba(226,211,0,0.3); padding:.1em; } #report #bknm ul{margin:.3em 0 0;} #report #bknm li{width:100%; line-height: 1.4em; margin:0 0 .1em 0; font-size:95%; } #report #bknm li a {display:block; padding:.5em; background:rgba(226,211,0,0.2); border-bottom:1px solid #fff;} /*#report #bknm li span.epi {width:11%; height:100%; line-height: 70px; text-align:center !important; font-size:150%; font-weight:bold; display: block; float:left; margin:0 .5em 0 0; background:#967a96; background:-webkit-gradient(linear,left bottom,left top,from(rgba(89,86,98,0.3)),to(rgba(89,86,98,0)));}*/ #report #bknm li span.date {padding:0 .1em; background:#f0e67a; display:inline-block;} #push{ cursor:pointer; } #report #prevnext {width:98%; margin:2em 0 0 2%;} /*msg*/ iframe#iframe {width:100%; border:none; padding:0; margin:0;} #msg #contents .inner {width:90%; margin:0 auto;} #form .inner{ margin:2em auto 0; padding:0 0 1em; text-align:left; background: url(../img/bg2.jpg); width:590px; box-shadow:3px 3px #010101; border:1px solid #010101;} #form h1{width:100%; height:200px; margin:0 auto .5em; background-repeat: no-repeat; background-position: center center; background-image:url(../img/form.jpg);} #form h2{color:#cebf00; margin:1em 0 .5em; text-shadow:1px 1px 0 #fff; font-weight:bold;} #form .inner p { line-height:1.6; text-align:left; padding:.5em 1em;} #form .inner ul {width:90%; margin:0 auto;} #form .inner ul li{margin:0 0 .7em 1em; font-size:90%; text-indent: -1em;} #form .inner ul li:before { content: ''; display: inline-block; width: 0; height: 0; margin-right: 4px; margin-left: 4px; border: transparent solid 5px; border-left-color: #cebf00;} #form #close { margin:40px auto 0; text-align:center;} #form #close a{ font-size:120%; border:1px solid #1d1d1d; padding:12px 60px; text-decoration:none; color:#1d1d1d;} #prevnext { padding:0; margin:0 0 1em; text-align:center;} #prevnext ul li {width:50px; height:50px; font-size:2.5rem; font-weight:bold; font-family:arial black,Verdana; background:#eee; color:#fff; line-height:50px; text-align:center;} #prevnext ul li a {color:#fff; background:#2a281b; display:block; width:50px; height:50px;} #prevnext ul li.prev { float:left; } #prevnext ul li.next { float:right; } #msg label { position: relative; display: block; width: 35%; margin:10px 0 10px 0; border: 1px solid #a69930; background: #fff; } #msg label:before { content: ""; position: absolute; top: 50%; right: 10px; display: block; width: 0; height: 0; margin: -2px 0 0 0; border: 5px solid transparent; border-top: 7px solid #a69930; } #msg select#backnum { font-size:110%; cursor: pointer; position: relative; -webkit-appearance: none; -moz-appearance: none; appearance: none; display: block; width: 98%; padding: 0.5em 1em; color: #a69930; border: none; border-radius: 5px; background: transparent; text-indent: .01px; text-overflow: ""; } ::-ms-expand { display: none; } /*chart*/ #chart .diagram{ position:relative; margin:1.5em auto 4em; position:relative; /*background: url(../img/chart/dia.jpg) no-repeat 0 0;*/} #chart #part1.diagram{background: url(../img/chart/dia.jpg) no-repeat 0 0;} #chart #part2.diagram{background: url(../img/chart/dia2.jpg) no-repeat 0 0;} #chart .diagram ul,#chart .diagram ul li {position: absolute;} #chart .diagram ul li a { display: block; background:rgba(243,235,82,0.4); text-decoration: none; overflow: hidden; text-indent: 100%; white-space: nowrap;} #chart .diagram ul li a img {display:block;} #chart .diagram ul li.sz-l a img {width:172px; height:235px; } #chart .diagram ul li.sz-m a img {width:156px; height:212px; } #chart .diagram ul li.sz-s a img {width:134px; height:182px; } #chart .diagram ul li.sz-ss a img {width:117px; height:165px; } #chart .diagram ul li.sz-xs a img {width:103px; height:151px; } #chart .diagram ul li a { filter: alpha(opacity=0); -moz-opacity:0; opacity:0; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; -ms-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;} #chart .diagram ul li a:hover { filter: alpha(opacity=100); -moz-opacity:100; opacity:100;} #chart ul li.kosaka { left:475px; top:465px;} #chart ul li.yamada { left:241px; top:465px;} #chart ul li.onoda { left:241px; top:126px;} #chart ul li.mishima { left:28px; top:75px;} #chart ul li.mikasa { left:474px; top:126px;} #chart ul li.sugimoto { left:691px; top:126px;} #chart ul li.watabe { left:688px; top:362px;} #chart ul li.yanagisawa { left:48px; top:344px;} #chart ul li.katayama { left:105px; top:769px;} #chart ul li.fujikura { left:267px; top:769px;} #chart ul li.nakamura { left:712px; top:610px;} #chart ul li.higashiyama { left:483px; top:810px;} #chart ul li.ishikura { left:604px; top:810px;} #chart ul li.kamioka { left:726px; top:810px;} #chart ul li.nakata { left:18px; top:1049px;} #chart ul li.nakatar { left:207px; top:1063px;} #chart ul li.nazo { left:177px; top:1323px;} #chart ul li.igarashi { left:6px; top:1323px;} #chart ul li.kosakaa { left:412px; top:1071px;} #chart ul li.kosakam { left:715px; top:1071px;} #chart ul li.kosakama { left:563px; top:1071px;} #chart ul li.ikezawa { left:330px; top:1323px;} #chart ul li.kazami { left:495px; top:1354px;} #chart ul li.kazamik { left:619px; top:1354px;} #chart ul li.sagawa { left:764px; top:1354px;} /*toyosu*/ #chart ul li.kosaka2 { left:462px; top:395px;} #chart ul li.yamada2 { left:462px; top:76px;} #chart ul li.onoda2 { left:217px; top:126px;} #chart ul li.mishima2 { left:462px; top:701px;} #chart ul li.watabe2 { left:226px; top:415px;} #chart ul li.sudo { left:690px; top:129px;} #chart ul li.eguchi { left:16px; top:734px;} #chart ul li.yamadai { left:386px; top:1045px;} #chart ul li.kanezaki { left:16px; top:1045px;} #chart ul li.tominaga { left:190px; top:1045px;} #chart ul li.sagawa2 { left:394px; top:1326px;} #chart ul li.kosakaa2 { left:558px; top:1072px;} #chart ul li.kosakam2 { left:708px; top:1299px;} #chart ul li.kosakama2 { left:708px; top:1072px;} #chart ul li.sekiguchi { left:699px; top:369px;} #chart ul li.shinohara { left:699px; top:565px;} #chart ul li.terai { left:699px; top:760px;} #chart ul li.yanagisawa2 { left:38px; top:76px;} #chart ul li.katayama2 { left:38px; top:291px;} #chart ul li.matsuoka { left:38px; top:508px;} #chart ul li.fujikura2 { left:239px; top:691px;} #chart ul li.yokozawa { left:25px; top:1309px;} #chart ul li.yokozawaa { left:206px; top:1309px;} /*btn*/ #form #agree a,#msg #writeBtn a,a.btn_prev,a.btn_ap,#push {font-size:150%; color:#fff; display:block; font-weight:bold; box-shadow:0 0 5px rgba(80,76,76,0.4); text-align:center; width:70%; padding:.8em; margin:0 auto 1.5em; text-shadow:1px 1px 0 #2a281b; background-color:#2a281b; background-image:linear-gradient(to top,rgba(226,211,0,0.4),rgba(226,211,0,0)); background-image:-webkit-gradient(linear,left bottom,left center,from(rgba(226,211,0,0.4)),to(rgba(226,211,0,0)));} a.btn_ap {width:50%;} a.btn_s {background: rgba(226,211,0,0.4); padding:.2em;} a.btn_i {color:#c6478d; padding:1em; border:1px solid #da88b5; border-radius: 5px; margin:.5em 0; display:inline-block; text-shadow:1px 1px 0 rgba(255,255,255,0.8); box-shadow:0 0 5px rgba(80,76,76,0.2); background:-webkit-gradient(linear,left bottom,left center,from(rgba(215,125,175,0.2)),to(rgba(215,125,175,0)));} #msg #writeBtn a {width:45%; padding:1em 0; margin:.5em auto 1em;} #form #agree a:hover,#msg #writeBtn a:hover,#intro #commeBtn a:hover {color:#fff;} /*//////pc//////*/ @media all and (min-width: 768px) { #cts1{width:630px; float:left;} #bnmenu1 div,#bnmenu3 div{margin:15px 0 0;} #bnmenu1 div:nth-child(2),#bnmenu3 div:nth-child(2){margin:15px 20px 0;} #bnmenu1-3 div:nth-child(2){margin:0 20px 0;} #bnmenu1-3 div:nth-child(4),#bnmenu1-3 div:nth-child(6){margin:15px 0 0;} #bnmenu1 div:nth-child(5),#bnmenu1-3 div:nth-child(5){margin:15px 20px 0;} /*#bnmenu2{margin:2em auto 0;}*/ #cts1 div {margin:0 0 15px 0;} #cts1 div:nth-child(odd){margin:0 20px 15px 0;} /*#cdday span.cdtxt{display:none;}*/ #menu { width:100%; box-shadow:0 8px 10px rgba(80,76,76,0.3); height:70px; background:#2a281b url(../img/menubg.png) repeat-x 0 0;} #menu ul {width:970px; margin:0 auto; background:url(../img/menu.png) no-repeat center center;} #menu li { height:70px; display:inline-block; padding:0; margin:0 -2px 0; } #menu li a { height:70px; display: block; padding:0; margin:0; text-indent: 100%; white-space: nowrap; text-decoration:none; overflow: hidden; width:145px;} #menu li.btn1 a { width:145px;} #menu li.btn2 a { width:155px;} #menu li.btn3 a { width:150px;} #menu li.btn4 a { width:138px;} #menu li.btn5 a { width:138px;} #menu li.btn6 a { width:244px;} #menu li a:hover{background-image:linear-gradient(to top,rgba(226,211,0,0.5),rgba(226,211,0,0)); background:-webkit-gradient(linear,left bottom,left center,from(rgba(226,211,0,0.5)),to(rgba(226,211,0,0)));} #gotop {position: fixed; bottom: 20px; right: 20px;} #gotop span { display:none;} #gotop a {display:block; width:84px; height: 84px; background:url(../img/gotop.png) no-repeat 0 0;} #btnBn div{margin:15px 20px 0 0;} #btnBn div:nth-child(3n) {margin:15px 0 0 0;} #btnBn .bn_line{display:none;} #chart #part1.diagram{ width:874px; height:1529px;} #chart #part2.diagram{ width:861px; height:1525px;} /*#chart .diagram{ width:874px; height:1529px;}*/ #report .ph_cut{width:450px; height:300px;} #report .ph_cut_l{width:300px; height:450px;} #push {width:900px;} } /*//////smp//////*/ @media all and (max-width: 767px) { body,p { font-size: 1.35rem;} h1 { font-size: 2.6rem; } h2 { font-size: 2rem; line-height:1.5em;} h3 { font-size: 1.6rem; } h4 { font-size: 1.4rem; } .f90 { font-size: 1.2rem;} .hidtxt{visibility: visible;} .hid_sp{display:none;} .inner {width:90%;} #top header{height:auto; padding:0 0 .5em;} #top header .inner{width:90%; padding:1em 0 1.5em;} #count{float:none; margin:.5em auto 0; width:100%;} #cdday{width:100%;background:none; text-align:center; margin:0 auto; text-shadow:none; color:#2a281b;} /*#cdday span.cdtxt{background:#2a281b; font-size: 2.5rem; padding:.1em; color:#ecdf00; display:inline-block; margin:0 .2em .5em 0;}*/ #count span.cdtxt{font-size: 2.3rem; padding:0 0 .2em 0; display:block;} #cdday span.day{font-size: 8.5rem; color:#ecdf00; text-shadow: #2a281b 2px 3px 0px, #2a281b -1px 2px 0px, #2a281b 2px -1px 0px, #2a281b -1px -1px 0px;} /*#CDT{font-size: 2.8rem; font-weight:bold;} #CDT .day,#CDT .hour,#CDT .min,#CDT .sec{font-size:5.7rem;}*/ #CDT{font-size: 2.3rem; font-weight:bold;} #CDT .day,#CDT .hour,#CDT .min,#CDT .sec{font-size:4.8rem;} #CDT .min,#CDT .sec{padding:0 0 0 .08em;} #top h1{width:98%; height:0; padding:60.6% 0 0; background-size: cover;} /*#top h1{width:85%; height:auto; float:none;} #top h1 img{width:100%;} #top h1 .img2{display:none;}*/ /*.oad{ height:0; padding:15% 0 0; background-size:90%;}*/ .oad{ height:0; padding:12% 0 0; background-size:65%;} p.caution{width:95%; margin:.5em auto 0; line-height:1.4; font-size:95%; padding:0;} #top header h1 img,header a img,.ph_cut img,.ph_cut_l img,#word img {position:absolute;left:0;top:0; width:100%; height:100%;} #top #pre a{width:90%; height:0; padding:13.5% 0 0; margin:1em auto; box-shadow:2px 2px #010101; background-size:cover;} #mov,#bnmenu1,#bnmenu1-2,#bnmenu1-3,#bnmenu2,#bnmenu3,footer .inner,#cts1 {width:95%; margin:0 auto; float:none;} .spot,.latest {float:none; width:96%; margin:0 auto;} #bnmenu1,#bnmenu3,#bnmenu1-3{width:90.5%;} #mov{margin:1em auto 0;} #trailer {width:100%; position: relative; padding: 56.25% 0 0; height: 0; overflow: hidden; margin:0 auto 1.5em;} /*#trailer {width:90%; position: relative; padding: 50.7% 0 0; height: 0; overflow: hidden; margin:1em auto;}*/ #trailer iframe{ position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important;} #top .spot{display:none;} .update{width:100%; margin:0 auto; background:#fff url(../img/top/upbk.png) no-repeat center top; background-size:100%; box-shadow:2px 2px #010101;} .update h2{height:0; padding:6.4150% 0 0; width:30%; background:url(../img/top/uph2.png) no-repeat 0 0; margin:.5em auto; background-size: contain;} .update ul{height:100px;} .sns {height:50px; width:300px; margin:1em auto;} .sns p{line-height: 1.3; margin:.7em .7em 0 0;} .sns strong{font-size:1.8rem;} .sns img{height:50px;} #todayp{width:91%; box-shadow:2px 2px #010101; padding:.5em 0 0;} #todayp h2{font-size:1.5rem; -webkit-box-reflect: below -10px -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(0.5, transparent), to(rgba(0,0,0,0.3)));} #todayp h2 span{font-size:3rem;} #todayp li span.ymd{display:inline-block; font-size:100%;} #todayp li strong{font-size:110%;} .bn_itr,.bn_str,.bn_cast,.bn_staff,.bn_odm,.bn_msg,.bn_news,.bn_ch,.bn_repo,.bn_ts,.bn_int,.bn_ishop,.bn_free,.bn_sp1,.bn_pre,.bn_file,.bn_gl,.bn_book,.bn_pd,.bn_clm,.bn_mov,.bn_ext,.bn_line{width:48.5%;} .bn_itr a,.bn_str a,.bn_cast a,.bn_staff a,.bn_odm a,.bn_msg a,.bn_news a,.bn_ch a,.bn_ts a,.bn_repo a,.bn_int a,.bn_ishop a,.bn_free a,.bn_sp1 a,.bn_pre a,.bn_file a,.bn_gl a,.bn_book a,.bn_pd a,.bn_clm a,.bn_mov a,.bn_ext a,.bn_line a{width:100%; height:0; padding:45% 0 0; background-size: cover; box-shadow:2px 2px #010101;} #cts1 div,#bnmenu1 div,#bnmenu3 div,#bnmenu1-3 div{margin:0 0 2.5%;} #bnmenu1 div:nth-child(odd),#bnmenu3 div:nth-child(odd),#cts1 div:nth-child(odd),#bnmenu1-3 div:nth-child(odd){margin:0 3% 2.5% 0;} #word{float:none; margin:.3em auto 3%; position: relative; width:60%; height:0; padding:57.6% 0 0;} #twTL { float:none; width:300px; margin:.5em auto 1em; height:290px; overflow:hidden;} footer {padding:0 0 2em; text-align:center;} footer p {font-size:1.3rem;} footer .copy { padding:3em 0 0;} #rect {margin:0 auto; float:none;} #gotop {position: fixed; bottom: 0; left:0; width:100%; text-align:center; font-size:1.5rem; letter-spacing:.5em;} #gotop a {width:100%; height: 60px; display:block; line-height:60px; font-weight:bold; background: -moz-linear-gradient(bottom,#fff,rgba(225,255,255,0.1)); background: -webkit-gradient(linear,left bottom,left top,from(#fff),to(rgba(225,255,255,0.1)));} #gotop a:hover,#gotop a:visited,#gotop a:active {color:#e4007f;} /*------------------　2nd　------------------ */ header{background:#fff url(../img/hdbk.png) repeat-x 0 bottom; padding:0 0 .5em;} header a {width:100%; height:0; padding:70.3125% 0 0; background: url(../img/smp.png) no-repeat 0 0; background-size: cover;} #menu ul {width:100%; text-align:center; font-size:0; background:#2a281b url(../img/menubg.png) repeat-x center bottom;} #menu li {font-size: 14px; float:left; border-top:1px solid rgba(255,255,255,0.2); text-shadow:1px 0 0 #2a281b;} #menu li.btn2,#menu li.btn5{border-left:1px solid rgba(255,255,255,0.2); border-right:1px solid rgba(255,255,255,0.2);} #menu ul li {width : 33.33333%; width: -webkit-calc(100% / 3) ; width: calc(100% / 3) ;} #menu li a {height:auto; color:#cebf00; display: block; width:100%; margin:0; padding:0.9em 0; font-weight:bold;} #menu li span.lss {letter-spacing: -1px; font-size: 98%;} #menu li a:hover{background-image:linear-gradient(to top,rgba(226,211,0,0.5),rgba(226,211,0,0)); background:-webkit-gradient(linear,left bottom,left center,from(rgba(226,211,0,0.5)),to(rgba(226,211,0,0)));} #contents{width:95%; margin:2em auto; padding:0 0 2em;} #contents h1{width:100%; height:0; padding:31.25% 0 0;} #contents p {padding:.5em 1.5em 1em; line-height:1.4;} .ph_cut {width:88%; height:0; padding:58.6666% 0 0; position: relative; margin:1em auto .5em;} .ph_cut_l {width:60%; height:0; padding:90.225% 0 0; position: relative; margin:1em auto .5em;} #btnBn{width:95%; margin:1em auto 0;} #btnBn div{margin:2% 0 0 0;} #btnBn div:nth-child(odd){margin:2% 2% 0 0;} #bknm{width:100%; margin:2em auto 1em;} #bknm h3{font-size:2.2rem; padding:0 .3em .1em;} #intro h2{width:75%; height:0; padding:35.8808% 0 0; background-size: cover; } #intro h2.comme{margin:-.2em 0 0 .5em; font-size:1.8rem;} .bdr{padding:.5em 1.2em 1em; margin:1em auto 1.5em;} .bdr p{font-size:95%;} #theme h2{width:88%; padding: 8px 20px; margin:1em 30px 0 0;} #theme h2:after{border-width: 23px 12px;} #theme h3{width:90%; margin:.5em auto 0; font-size:1.8rem;} #theme .bgr p{font-size:85%;} #theme .jkt {width:55%; height:0; padding:54.56% 0 0; margin:0 auto;} #story h2 span{font-size:2.5rem;} #story .ph_cut {/*width:100%; height:0; padding:66.5% 0 0; position: relative;*/ box-shadow:none; margin:.5em auto 1em;} #story .ph_area{margin:1em auto .5em;} #story p.fp-causion{text-align:center; font-size:70%; line-height:1.5; padding:0 0 10px 1em !important; text-indent: -1em;} #sentence p {padding:0 0 1em;} #mov_fp{width:90%; height:auto; box-shadow:none; margin:.5em auto 1em;} .tbs-player{background-size: cover !important;} #story #mov{width:100%; padding:.5em 0 .5em; margin:1em 0 0;} #story #trailer,#info #trailer {width:90%; position: relative; padding: 50.7% 0 0; height: 0; overflow: hidden; margin:.5em auto 1em;} #story #trailer iframe,#info #trailer iframe{ position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important;} #story #bknm ul {margin:1em auto; width:90%; padding:0 0 1em;} #story #bknm li{float:left; width:48%; margin:0 4% 4% 0;} #story #bknm li:nth-child(even) {margin:0 0 4% 0;} #story #bknm li a {height:80px; } #story #bknm li span {line-height: 80px; font-size:1.25rem;} #movlist h3{font-size:1.8rem;} #movlist ul {margin:1em auto 1em;} #movlist ul li {width:49%; height:auto; margin:0 2% 2% 0; float:left;} #movlist ul li img{position: absolute; top: 0; left: 0;} #movlist ul li a{display:block; width:100%; padding:56.25% 0 0;} #movlist ul li:nth-child(even) {margin:0;} #movlist ul li span.ttl { padding:.1em .5em; font-size:90%; margin:.2em 0 0;} #movlist ul li span.new{z-index:1;} #spmov #movlist h3{font-size:1.6rem; text-align:left; padding:.3em 1em; line-height:1.4;} #spmov #movlist h3:first-of-type{margin:.8em auto 1em;} #spmov #movlist ul li span { text-align:left; font-size:85%; line-height:1.3;} #info article h2,#report article h2,#file article h2{padding: .3em .5em .2em; border-left: solid 3px #cebf00; font-size: 1.6rem;} #promo h2 {padding:.1em 0; margin:0 0 .6em;} #promo{padding:0 0 .5em; background:none;} #promo p.add {font-size:1rem !important; padding:.8em 1.5em;} #promo .pdate{font-size:90%;} #promo h3,#info article h3 { font-size: 1.45rem;} #promo h3 {padding:.2em 0 .5em;} #info #trailer {margin:2em auto .5em;} #gallery ul#show{width:95%; margin:0 0 0 3.2%;} #gallery ul#show li {width : 33.33333%; width: -webkit-calc(100% / 3) ; width: calc(100% / 3) ;} #gallery ul#show li span.lazy {width:100%; height:0; padding:66.5% 0 0;} #gallery ul#show li span a {width:100%; height:100%;} #gallery #bknm li{width : 24%; margin:0 0.1% 0.5%; width: -webkit-calc(95% / 4) ; width: calc(95% / 4) ;} #gallery #bknm li span.epi{padding:0 0; font-size:88%;} #extra h2{padding:.5em 1em; font-size:1.2rem;} #extra .bgr{margin:0 auto 1em;} #extra ul#show {width:95%;} #extra ul#show li {font-size:1rem; line-height:1.3;} #file article h3{font-size:1.6rem;} #file article {width:93%; margin:0 auto; padding:.5em 2.5% 2em 7%; background-size: 100%;} #file article ul {width:95%; margin:0 0 0 4%;} #file article ul li::after { width: 10px; height: 4px; left: -1.1em; } #file .ph_s{margin:1em auto;} .bgr2{font-size:90%;} #interview h2{font-size:1.45rem; margin:2em 0 0; padding:.1em 0 .1em .5em;} #interview .ph_s,#interview .ph_s2{float:none;} #interview .ph_s{width:80%; padding:52% 0 0;} #interview .ph_s2{width:55%; padding:76% 0 0;} #interview article .floatL,#interview article .floatR{margin:.8em auto .5em;} #interview article p{font-size:1.3rem;} #interview #bknm ul {margin:1em auto; width:90%; padding:0 0 1em;} #interview #bknm ul li {float:none; margin:0 0 1.5%; font-size:100%; line-height:45px; width:100%;} #interview #bknm ul li a {width:100%; height:45px; padding:.5em 0;} #interview #bknm li span.epi {width:45px; height:45px; line-height:45px; margin:0 .6em 0 .5em; padding:0;} #present h3{font-size:2rem;} #present h3 span {font-size:3.5rem;} #present .que{font-size:100%; padding:0 1em .5em; margin:0 auto; text-align:left;} #present .ph_pre{width:90%; height:0; padding:40% 0 0; background-size: cover;} #present .ans h3{font-size:1.55rem; padding: .2em 0;} #present .ans h3:after{ border: 6px solid transparent; border-top: 10px solid rgba(218,202,0,0.5);} #present .ans ul li{font-size:90%; padding:.5em 0 .5em .8em;} h1.clm{padding:27.0833% 0 0 !important;} #column .bgr{margin:0 auto 1em;} #column h2{padding:.7em 1em; font-size:1.3rem; text-align:left;} #column h3{font-size:1.2rem;} #column article{box-shadow:2px 3px 10px rgba(80,76,76,0.2);} #column #bknm h4,#file #bknm h4{font-size:2.2rem; padding:.1em 0;} #column #bknm ul li,#file #bknm ul li {width:18%; margin:0 1% 1% 1%;} #column #bknm ul li a,#file #bknm ul li a{padding:1em 0;} #staff #contents{ line-height:1.5em;text-align:center; font-size:1.5rem;} #staff h2 {padding:.2em 0 0; font-size:1.7rem;} #cast nav#part{margin:-.5em 0 1em 0;} #cast h2 {margin:0 .1em 0 0;} #cast h2.toyosu{width:95px; height:30px; } #cast h2.shiba{width:80px; height:30px; } #cast h2.toyosu a,#cast h2.shiba a{height:29px; background-color:rgba(66,64,29,0.6);} #cast h3{font-size:1.75rem;} #cast table{width:100%; margin:.5em auto; font-size:80%;} #cast table td.cname{text-align:left; font-size:1.35rem;} #cast table td.chara{text-align:right; font-size:1.35rem;} #cast table td.naka{padding:0; font-size:1.3rem;} h1.chart,h1.theme,h1.cs,h1.pre,h1.file,h1.file2,h1.gl,h1.gl,h1.pd,h1.clm,h1.spmov,h1.ex{height:0 !important; background-position: center bottom !important;} /*#chart .diagram { width:90%; background-size: cover; height:0; padding:157.7319% 0 0; overflow:hidden;}*/ #chart .diagram { overflow:hidden; margin:1.5em auto 2em;} #chart #part1.diagram{width:90%; height:0; padding:157.4485% 0 0; background-size: cover;} #chart #part2.diagram{width:90%; height:0; padding:159.4076% 0 0; background-size: cover;} /*#chart .diagram img {position:absolute;left:0;top:0; width:100%; height:100%;}*/ #chart .diagram ul {position: absolute; left:0; top:0; width:100%; height:100%;} #report #contents .inner{width:92%;} #report #entry{float:none; width:100%;} #report #bknm{float:none; width:100%; margin:2.5em auto 1em;} #report article{background:none; padding:0; box-shadow:none;} #report article p.cap span { font-size:1.2rem;} #report #bknm li{width:100%; line-height: 1.4em; margin:0 0 .1em;} #report #prevnext {width:98%; margin:1em auto 0;} #form h1{height:0; padding:30% 0 0; background-size: cover; margin:0 auto;} #form h2{font-size:1.7rem; padding:0 .5em;} #form .inner{ width:90%;} #form .inner ul li:before{margin:0;} #msg p.notice { text-align:left !important; margin:0 0 5px; font-size:80%;} #form #agree a,#msg #writeBtn a,a.btn_prev,a.btn_ap {width:75%; font-size:1.5rem;} #prevnext { padding:0; margin:0;} #prevnext ul li { font-size:2rem;} #msg label {width: 99.8%; margin:10px auto;} #msg select#backnum{font-size:90%;} #msg .att{font-size:85%; text-align:left !important;} a.btn_i {margin:0 0 .5em;} } @media all and (max-width: 320px) { body,p { font-size: 1.3rem;} #cdday{font-size: 3rem;} #cdday span.cdtxt{font-size: 2.3rem;} #cdday span.day{font-size: 7rem;} #CDT{font-size: 2rem; font-weight:bold;} #CDT .day,#CDT .hour,#CDT .min,#CDT .sec{font-size:5rem;} #CDT .day,#CDT .hour,#CDT .min,#CDT .sec{font-size:4rem;} #CDT .min,#CDT .sec{padding:0 0 0 .05em;} #menu li span.lss {letter-spacing: -1px; font-size: 95%;} #form #agree a,#msg #writeBtn a,a.btn_prev,a.btn_ap {width:85%; font-size:1.7rem;} #cast table td.cname,#cast table td.chara{font-size:1.2rem;} }