@charset "UTF-8";
@import url(base.css);
.ticketBtn, .blueBtn { text-align: center; }
.ticketBtn a, .blueBtn a { display: inline-block; background: -webkit-linear-gradient(#ea181f 0%, #52110c 100%); background: -o-linear-gradient(#ea181f 0%, #52110c 100%); background: linear-gradient(#ea181f 0%, #52110c 100%); color: #FFF; padding: 10px 30px; border-radius: 5px; }

.blueBtn a { background: -webkit-linear-gradient(#063277 0%, #011c45 100%); background: -o-linear-gradient(#063277 0%, #011c45 100%); background: linear-gradient(#063277 0%, #011c45 100%); }

.mt60 { margin-top: 60px; }

@media screen and (max-width: 759px) { .mt60 { margin-top: 7vw; } }
/*-------------------------------------------------
	++ BASE
-------------------------------------------------*/
body { background: #000; font-family: 'Noto Serif JP', serif; background: #000 url(../img/bg.jpg) center -470px repeat-y; }

#container { margin: 0 auto; text-align: center; position: relative; overflow-x: hidden; }

.cInner { display: block; clear: both; margin: 0 auto; text-align: center; position: relative; letter-spacing: 1px; }

@media screen and (min-width: 760px) { .sp { display: none !important; }
  .pc { display: block; }
  body { font-size: 18px; }
  #container { min-width: 1000px; }
  .cInner { width: 1000px; } }
@media screen and (max-width: 759px) { .img100 { width: 100%; height: auto; }
  .pc { display: none !important; }
  .sp { display: block; }
  body { font-size: 3.2vw; background-size: 120% auto; }
  #container { width: 100%; }
  .cInner { width: 100%; } }
/*-------------------------------------------------
	++ HEAD
-------------------------------------------------*/
#header { width: 100%; height: 60px; background-color: #FFF; }
#header h1 { float: left; }
#header h1 img { display: block; }
#header .link { float: right; padding: 15px; margin-top: 5px; font-family: 'Arial','游ゴシック体','YuGothic','游ゴシック','Yu Gothic','ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro','メイリオ',Meiryo,sans-serif; }
#header .link span { display: none; }
#header .link a { background-color: #9F291A; color: #FFF; font-size: 16px; padding: 5px 10px; }
#header .goods { float: right; width: 170px; border: 1px solid #CCC; margin-top: 10px;
  margin-right:10px; }
#header .goods img { display: block; width: 100%; height: auto; }

@media screen and (max-width: 759px) { #header { width: 100%; height: 10vw; background-color: #FFF; position: relative; z-index: 10; }
  #header h1 { margin: 0 auto; text-align: center; width: 60%; max-height: 10vw; }
  #header h1 img { display: block; width: auto; max-height: 10vw; margin: 0 auto; text-align: center; }
  #header .link { position: absolute; top: 2.2vw; right: 2.2vw; background-color: #9F291A; color: #FFF; padding: 0.5vw; border-radius: 3px; float: none; margin-top: 0; font-family: 'Arial','游ゴシック体','YuGothic','游ゴシック','Yu Gothic','ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro','メイリオ',Meiryo,sans-serif; }
  #header .link span, #header .link a { height: 5vw !important; padding: 0 1vw; }
  #header .link span { display: inline-block; }
  #header .link span img { display: inline-block; height: 3vw; width: auto; }
  #header .link a { display: none; color: #FFF; padding: 0 2vw; } }
/*-------------------------------------------------
	++ MAIN
-------------------------------------------------*/
.bgWrap1 { background: url(../img/bg_main.png) center top no-repeat; }

.section h1 img { mix-blend-mode: screen; }

@media screen and (max-width: 759px) { .bgWrap1 { background-size: 235% auto; } }
#main { margin-bottom: 50px; }
#main .cInner { padding-top: 37px; }
#main .cache { padding-top: 27px; }
#main .mainDate { display: block; position: relative; background: url(../img/date_panel_bg.png) center top no-repeat; width: 670px; margin: 10px auto; text-align: center; padding: 20px; margin-top: 30px; }
#main .mainDate:before, #main .mainDate:after { content: ""; width: 698px; height: 41px; display: block; position: absolute; left: -15px; background: url(../img/date_panel_frame.png) center top no-repeat; }
#main .mainDate:before { top: -24px; }
#main .mainDate:after { bottom: -24px; transform: rotate(180deg); }
#main .mainDate .date { font-size: 26px; }
#main .mainDate .date span { font-size: 38px; }
#main .mainDate .place { font-size: 26px; margin: 10px 0; }

@media screen and (max-width: 759px) { #main { margin-bottom: 5vw; }
  #main .cInner { padding: 12vw 3vw 0 3vw; }
  #main .cache { padding-top: 5vw; }
  #main .mainDate { margin: 8vw auto; background-size: 100%; width: 100%; padding: 5vw; }
  #main .mainDate:before, #main .mainDate:after { width: 100%; height: 6vw; background-size: 100% auto; left: 0; }
  #main .mainDate:before { top: -4vw; }
  #main .mainDate:after { bottom: -4vw; }
  #main .mainDate .date { font-size: 3.4vw; }
  #main .mainDate .date span { font-size: 6vw; }
  #main .mainDate .place { font-size: 6vw; } }
#menu { padding: 10px 0; z-index: 9998; }
#menu ul { display: inline-block; position: relative; font-size: 0; line-height: 0; }
#menu ul li { display: inline-block; position: relative; padding: 0 20px; }
#menu ul li img { display: block; }
#menu ul li:after { display: inline-block; content: ""; background: url(../img/menu_splt.png) center top no-repeat; width: 24px; height: 28px; position: absolute; top: 3px; right: -10px; }
#menu ul li.last:after, #menu ul li:nth-last-of-type(1):after { background: none; }
#menu ul li.sp { display: none; }
#menu ul:before, #menu ul:after { display: inline-block; content: ""; background: url(../img/menu_right.png) center top no-repeat; width: 5px; height: 47px; position: absolute; top: -5px; }
#menu ul:before { left: -7px; }
#menu ul:after { right: -7px; transform: rotate(180deg); }
#menu.move { width: 100%; height: 63px; background: rgba(0, 0, 0, 0.75); position: fixed; top: 0; left: 0; }

@media screen and (max-width: 759px) { #menu { padding: 0; width: 100%; position: fixed; top: 0; left: 0; }
  #menu .menuBtn { display: block; background: url(../img/burger.png) center top no-repeat; background-size: 8vw; width: 8vw; height: 8vw; position: fixed; top: 12vw; right: 2vw; z-index: 1; }
  #menu .menuBtn.current { background: url(../img/burger_close.png) center top no-repeat; background-size: 8vw; }
  #menu ul { display: none; border-top: 1px solid #999; padding-top: 22vw; background-color: rgba(0, 0, 0, 0.9); }
  #menu ul li { display: block; width: 100%; border-bottom: 1px solid #999; }
  #menu ul li:nth-of-type(1) { border-top: 1px solid #999; }
  #menu ul li:after { display: none; }
  #menu ul li img { display: block; margin: 0 auto; text-align: center; width: auto; height: 8vw; }
  #menu ul li a { display: block; font-family: "Arial"; color: #FFF; padding: 3vw 10vw; line-height: 1; text-shadow: 0 0 5px rgba(0, 0, 0, 0.7); }
  #menu ul li.sp { display: block; } }
#news .cInner { padding-top: 95px; }
#news .entryList { margin-top: 20px; text-align: left; }
#news .entryList ul li { padding: 9px 0; }
#news .entryList ul li .date { margin-right: 15px; }
#news .entryList ul li:nth-of-type(even) { background: url(../img/borderline1.png) left bottom repeat-x; }
#news .entryList ul li:nth-of-type(odd) { background: url(../img/borderline2.png) left bottom repeat-x; }
#news .link { margin-top: 15px; text-align: right; }
#news .link a { background: url(../img/arrow_red.png) right center no-repeat; padding-right: 40px; }

@media screen and (max-width: 759px) { #news .cInner { padding-top: 10vw; }
  #news .entryList { padding: 0 5vw; }
  #news .entryList ul li { padding: 1vw 0; }
  #news .entryList ul li .date { display: block; }
  #news .link { margin-top: 3vw; padding-right: 3vw; }
  #news .link a { background-size: 7vw; padding-right: 10vw; } }
#twitter { position: relative; }
#twitter .cInner { padding-top: 75px; }
#twitter .twBox { margin-top: 40px; }
#twitter:after { content: ""; display: block; background: url(../img/symb_kneight.png) center top no-repeat; width: 332px; height: 337px; position: absolute; bottom: -300px; left: 50%; margin-left: 400px; }

@media screen and (max-width: 759px) { #twitter .cInner { padding-top: 10vw; }
  #twitter .twBox { width: 90%; margin: 0 auto; text-align: center; }
  #twitter:after { background-size: 40vw; width: 40vw; height: 40vw; bottom: -37vw; left: auto; margin-left: 0; right: -10vw; } }
#intro { position: relative; background: url(../img/symb_book.png) center bottom no-repeat; padding-bottom: 315px; }
#intro .cInner { padding-top: 160px; }
#intro .text { margin-top: 30px; line-height: 195%; }
#intro:before { content: ""; display: block; background: url(../img/symb_horse.png) center top no-repeat; width: 377px; height: 451px; position: absolute; bottom: 490px; left: 50%; margin-left: -750px; }

@media screen and (max-width: 759px) { #intro { overflow-x: hidden; background-size: 150% auto; padding-bottom: 25vw; }
  #intro .cInner { padding: 10vw 5vw 5vw 5vw; }
  #intro .text { margin-top: 5vw; }
  #intro:before { display: none; } }
#story { position: relative; }
#story .text { margin-top: 30px; line-height: 195%; text-align: center; }

@media screen and (max-width: 759px) { #story .cInner { padding: 0 5vw 5vw 5vw; }
  #story .text { margin-top: 5vw; line-height: 195%; }
  #story:before { content: ""; display: block; background: url(../img/symb_horse.png) center top no-repeat; background-size: 50vw; width: 50vw; height: 64vw; position: absolute; bottom: -55vw; left: -10vw; } }
#cast { position: relative; }
#cast .cInner { padding-top: 85px; }
#cast:after { content: ""; display: block; background: url(../img/symb_magiccircle.png) center top no-repeat; width: 537px; height: 537px; position: absolute; bottom: -270px; left: 50%; margin-left: 300px; z-index: 0; }

@media screen and (max-width: 759px) { #cast .cInner { padding: 10vw 5vw 5vw 5vw; } }
#music .cInner { padding-top: 65px; }

@media screen and (max-width: 759px) { #music .cInner { padding: 10vw 5vw 5vw 5vw; } }
.photoPnl { margin-top: 30px; position: relative; z-index: 1; }
.photoPnl ul { font-size: 0; line-height: 0; }
.photoPnl ul li { display: inline-block; position: relative; width: 180px; margin: 0 25px 50px 25px; font-size: 14px; line-height: 120%; }
.photoPnl ul li a { display: block; }
.photoPnl ul li img { display: block; }
.photoPnl ul li .name { display: block; background: rgba(0, 0, 0, 0.75); width: 100%; padding: 5px; }
.photoPnl ul li .name.l2 { padding-top: 15px; }
.photoPnl ul li .name.l1 { padding-top: 20px; }
.photoPnl ul li .name.l3 { padding-top: 5px; }
.photoPnl ul li .name h2 { font-size: 14px; }
.photoPnl ul li .name .pl { font-size: 12px; }
.photoPnl ul li .name .pl span { display: block; }
.photoPnl ul li .name .crd { font-size: 9px; }

@media screen and (max-width: 759px) { .photoPnl { margin-top: 5vw; }
  .photoPnl ul li { display: inline-block; position: relative; width: 43%; margin: 0 2.5% 5vw 2.5%; font-size: 3.2vw; }
  .photoPnl ul li .name { padding: 2.5vw 1vw; }
  .photoPnl ul li .name.l3 { padding-top: 2vw; }
  .photoPnl ul li .name.l2 { padding-top: 2.8vw; }
  .photoPnl ul li .name.l1 { padding-top: 4.2vw; }
  .photoPnl ul li .name h2 { font-size: 3.2vw; }
  .photoPnl ul li .name .pl { font-size: 2.8vw; }
  .photoPnl ul li .name .crd { font-size: 2.2vw; }
  .photoPnl ul li.mc01 { margin: 0 25%; } }
#staff .cInner { padding-top: 25px; }
#staff .staffList { margin: 30px auto 0 auto; text-align: center; }
#staff .staffList ul li { display: table; margin: 0 auto; text-align: center; clear: both; font-size: 20px; background: url(../img/borderline1.png) left bottom repeat-x; padding: 6px 0; }
#staff .staffList ul.sublist { margin-top: 40px; }
#staff .staffList ul.sublist li { font-size: 16px; padding: 8px 0; }

@media screen and (max-width: 759px) { #staff .cInner { padding: 10vw 5vw 5vw 5vw; }
  #staff .staffList { width: 100%; margin: 0 auto 0 auto; }
  #staff .staffList ul li { font-size: 3.4vw; background: url(../img/borderline1.png) left bottom repeat-x; padding: 2vw 0; }
  #staff .staffList ul.sublist { margin-top: 40px; }
  #staff .staffList ul.sublist li { font-size: 3.2vw; padding: 2vw 0; } }
#movie .cInner { padding-top: 120px; }
#movie .youtube { margin-top: 55px; }

@media screen and (max-width: 759px) { #movie .cInner { padding: 10vw 5vw 5vw 5vw; }
  #movie .youtube { margin-top: 10vw; position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
  #movie .youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } }
#ticket .cInner { padding-top: 140px; }
#ticket .ticketWrap { margin-bottom: 40px; text-align: left; padding: 0 50px; }
#ticket .ticketWrap h2 { text-align: center; margin: 20px auto; font-size: 20px; }
#ticket .ticketWrap table { width: 100%; border: 1px solid #1f1513; margin-bottom: 20px; }
#ticket .ticketWrap table caption { display: none; }
#ticket .ticketWrap table th, #ticket .ticketWrap table td { border: 1px solid #1f1513; padding: 10px; background-color: #000; }
#ticket .ticketWrap table th { font-size: 16px; text-align: center; width: 40%; }
#ticket .ticketWrap table td { width: 40%; }
#ticket .ticketWrap table td.dn { text-align: center; width: 20%; }
#ticket .ticketWrap .infoText { position: relative; font-size: 16px; margin-bottom: 30px; }
#ticket .ticketWrap .infoText a { color: #FFF; text-decoration: underline; }
#ticket .ticketWrap .infoText a:hover { text-decoration: none; }
#ticket .ticketWrap .infoText span { font-size: 14px; }
#ticket iframe { margin-top: 50px; }

@media screen and (max-width: 759px) { #ticket .cInner { padding: 10vw 5vw 5vw 5vw; }
  #ticket .ticketWrap { margin-bottom: 7vw; padding: 0; }
  #ticket .ticketWrap:nth-last-of-type(1) { margin-bottom: 0; }
  #ticket .ticketWrap h2 { margin-bottom: 5vw; font-size: 3.6vw; }
  #ticket .ticketWrap table { margin-bottom: 5vw; }
  #ticket .ticketWrap table caption { display: table-caption; background-color: #3b0110; width: 100%; padding: 1vw 3vw; }
  #ticket .ticketWrap table th, #ticket .ticketWrap table td { padding: 2vw; }
  #ticket .ticketWrap table th { display: none; }
  #ticket .ticketWrap table td { width: 75%; }
  #ticket .ticketWrap table td.dn { width: 25%; text-align: center; }
  #ticket .ticketWrap .infoText { font-size: 3.2vw; margin-bottom: 5vw; }
  #ticket .ticketWrap .infoText span { font-size: 3.2vw; }
  #ticket iframe { width: 80%; height: 70vw; margin: 0 auto; text-align: center; } }
#footer { background: url("../img/footer_bg.png") center bottom no-repeat; min-height: 613px; font-size: 12px; }
#footer .cInner { padding-top: 530px; }
#footer .copyright { padding: 10px 0; }

@media screen and (max-width: 759px) { #footer { background-size: 150%; min-height: 50vw; font-size: 2.8vw; }
  #footer .cInner { padding-top: 40vw; }
  #footer .copyright { padding: 3vw 0; } }
/*-------------------------------------------------
	++ FOOTER
-------------------------------------------------*/
#spCover { display: none; }

#pageTop { position: fixed; bottom: 40px; right: 40px; z-index: 9997; }

@media screen and (max-width: 759px) { #pageTop { position: fixed; bottom: 5vw; right: 5vw; width: 13vw; }
  #pageTop img { display: block; width: 100%; height: auto; }
  #spCover { display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.8); z-index: 9; } }