@charset "UTF-8";
/* tag reset
##################################### */
/*! 
	html5doctor.com Reset Stylesheet
	v1.6.1
	Last Updated: 2010-09-17
	Author: Richard Clark - http://richclarkdesign.com 
	Twitter: @rich_clark
	*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

/* font setting
##################################### */
html {
  font-size: 62.5%;
}

/* base
##################################### */
body {
  background: #000;
  font-family: 'Roboto', "Hiragino Mincho ProN", "Hiragino Mincho Pro", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  color: #fff;
  text-align: left;
  -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
          text-size-adjust: 100%;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.7;
  font-weight: normal;
}

table {
  font-size: inherit;
  /* for modern browser */
  width: 100%;
  border-collapse: collapse;
  border: 0;
}

pre, code, kbd, samp, tt {
  font-family: inherit;
  *font-size: 108%;
  /* for IE whole */
  line-height: 100%;
}

img {
  vertical-align: bottom;
}

strong {
  font-weight: bold;
}

object {
  margin: 0;
  padding: 0;
}

a {
  color: #91130f;
  text-decoration: none;
  outline: none;
}

a:active {
  text-decoration: none;
}

ul, ol {
  list-style: none;
}

::-moz-selection {
  background: rgba(150, 6, 0, 0.4);
}

::selection {
  background: rgba(150, 6, 0, 0.4);
}

/* module
##################################### */
.m_disnon {
  display: none;
}

.m_box_pd10 {
  padding: 10px;
}

.m_box_pd20 {
  padding: 20px;
}

.m_box_pd30 {
  padding: 30px;
}

.m_box_pd40 {
  padding: 40px;
}

.m_box_pd50 {
  padding: 50px;
}

.m_center {
  text-align: center;
}

.m_left {
  text-align: left;
}

.m_right {
  text-align: right;
}

.m_va_top {
  vertical-align: top;
}

.m_va_middle {
  vertical-align: middle;
}

.m_font_b {
  font-weight: bold;
}

.m_fontS, #index_news ol a .date, #news #list_news a .date, #package #list_package a .date, #package #list_package a .detail, #special #list_special a .date {
  font-size: 10px;
  font-size: 1rem;
  line-height: 1.7;
  font-weight: normal;
}

.m_fontSM, #index_news ol a, #news #list_news a, #news .box_news .inner .date, #news .box_news .inner .detail, #onair .list_schedule li p, #story #list_story, #story .box_story .img .txt, #story .box_story .keyperson p, #story .staff ul, .list_staffcast li .part, #music .box_music dd, #music .profile, #music .comment, #package #list_package a, #package .box_package dd, #package .txt, #package .box01, #package .box02, #special #list_special a, #special .box_special .inner .date, #special .box_special .inner .detail {
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.7;
  font-weight: normal;
}

.m_fontM, #news .box_news .inner .ttl, #onair .list_schedule li h4, #movie #list_movie .ttl, #music .box_music dt span, #music .box_music .name, #music .profile .ttl, #music .comment .ttl, #package .box_package dt span, #package .box_package .name, #package .box01 .ttl, #package .box02 .ttl, #special .box_special .inner .ttl {
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 1.7;
  font-weight: normal;
}

.m_fontLM, .list_staffcast li > p {
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.7;
  font-weight: normal;
}

.m_fontL {
  font-size: 20px;
  font-size: 2rem;
  line-height: 1.7;
  font-weight: normal;
}

.m_fontLL {
  font-size: 22px;
  font-size: 2.2rem;
  line-height: 1.7;
  font-weight: normal;
}

.m_word_break {
  word-break: break-all;
}

.m_mb0 {
  margin-bottom: 0 !important;
}

.m_mb10 {
  margin-bottom: 10px;
}

.m_mb20 {
  margin-bottom: 20px;
}

.m_mb30 {
  margin-bottom: 30px;
}

.m_mb40 {
  margin-bottom: 40px;
}

.m_mb50 {
  margin-bottom: 50px;
}

.m_mb60 {
  margin-bottom: 60px;
}

.m_mb70 {
  margin-bottom: 70px;
}

.m_mb80 {
  margin-bottom: 80px;
}

.m_mb90 {
  margin-bottom: 90px;
}

.m_mb100 {
  margin-bottom: 100px;
}

.m_ml10 {
  margin-left: 10px;
}

.m_ml20 {
  margin-left: 20px;
}

.m_ml30 {
  margin-left: 30px;
}

.m_ml40 {
  margin-left: 40px;
}

.m_ml50 {
  margin-left: 50px;
}

.m_mr10 {
  margin-right: 10px;
}

.m_mr20 {
  margin-right: 20px;
}

.m_mr30 {
  margin-right: 30px;
}

.m_mr40 {
  margin-right: 40px;
}

.m_mr50 {
  margin-right: 50px;
}

/*-------------------------------------------*/
/* [マウスオンで下線が伸びる] */
/*-------------------------------------------*/
/* [ロールオーバーで画像の4辺に枠線が伸びる] */
/* @MEMO */
/* <div><a><span><img src=""></span></a></div> */
/* <div>は、width指定もしくはdisplay:inline-block */
/*-------------------------------------------*/
/* [ロールオーバーで枠線が太くなる] */
/* @MEMO */
/* <div><a><img src=""></a></div> */
/* <div>は、width指定もしくはdisplay:inline-block */
/*-------------------------------------------*/
/* [ロールオーバーでマーカーが伸びる(ver.1行)] */
/*-------------------------------------------*/
/* [ロールオーバーで揺らす] */
@-webkit-keyframes shakeAction {
  0% {
    -webkit-transform: rotate(1.2deg);
    -ms-transform: rotate(1.2deg);
    transform: rotate(1.2deg);
  }
  20% {
    -webkit-transform: rotate(-0.8deg);
    -ms-transform: rotate(-0.8deg);
    transform: rotate(-0.8deg);
  }
  40% {
    -webkit-transform: rotate(0.4deg);
    -ms-transform: rotate(0.4deg);
    transform: rotate(0.4deg);
  }
  60% {
    -webkit-transform: rotate(-0.75deg);
    -ms-transform: rotate(-0.75deg);
    transform: rotate(-0.75deg);
  }
  70% {
    -webkit-transform: rotate(0.375deg);
    -ms-transform: rotate(0.375deg);
    transform: rotate(0.375deg);
  }
  80% {
    -webkit-transform: rotate(-0.25deg);
    -ms-transform: rotate(-0.25deg);
    transform: rotate(-0.25deg);
  }
  90% {
    -webkit-transform: rotate(0.125deg);
    -ms-transform: rotate(0.125deg);
    transform: rotate(0.125deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes shakeAction {
  0% {
    -webkit-transform: rotate(1.2deg);
    -ms-transform: rotate(1.2deg);
    transform: rotate(1.2deg);
  }
  20% {
    -webkit-transform: rotate(-0.8deg);
    -ms-transform: rotate(-0.8deg);
    transform: rotate(-0.8deg);
  }
  40% {
    -webkit-transform: rotate(0.4deg);
    -ms-transform: rotate(0.4deg);
    transform: rotate(0.4deg);
  }
  60% {
    -webkit-transform: rotate(-0.75deg);
    -ms-transform: rotate(-0.75deg);
    transform: rotate(-0.75deg);
  }
  70% {
    -webkit-transform: rotate(0.375deg);
    -ms-transform: rotate(0.375deg);
    transform: rotate(0.375deg);
  }
  80% {
    -webkit-transform: rotate(-0.25deg);
    -ms-transform: rotate(-0.25deg);
    transform: rotate(-0.25deg);
  }
  90% {
    -webkit-transform: rotate(0.125deg);
    -ms-transform: rotate(0.125deg);
    transform: rotate(0.125deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-webkit-keyframes shakeActionHard {
  0% {
    -webkit-transform: rotate(2.4deg);
    -ms-transform: rotate(2.4deg);
    transform: rotate(2.4deg);
  }
  20% {
    -webkit-transform: rotate(-1.6deg);
    -ms-transform: rotate(-1.6deg);
    transform: rotate(-1.6deg);
  }
  40% {
    -webkit-transform: rotate(0.8deg);
    -ms-transform: rotate(0.8deg);
    transform: rotate(0.8deg);
  }
  60% {
    -webkit-transform: rotate(-1.5deg);
    -ms-transform: rotate(-1.5deg);
    transform: rotate(-1.5deg);
  }
  70% {
    -webkit-transform: rotate(0.7deg);
    -ms-transform: rotate(0.7deg);
    transform: rotate(0.7deg);
  }
  80% {
    -webkit-transform: rotate(-0.5deg);
    -ms-transform: rotate(-0.5deg);
    transform: rotate(-0.5deg);
  }
  90% {
    -webkit-transform: rotate(0.25deg);
    -ms-transform: rotate(0.25deg);
    transform: rotate(0.25deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes shakeActionHard {
  0% {
    -webkit-transform: rotate(2.4deg);
    -ms-transform: rotate(2.4deg);
    transform: rotate(2.4deg);
  }
  20% {
    -webkit-transform: rotate(-1.6deg);
    -ms-transform: rotate(-1.6deg);
    transform: rotate(-1.6deg);
  }
  40% {
    -webkit-transform: rotate(0.8deg);
    -ms-transform: rotate(0.8deg);
    transform: rotate(0.8deg);
  }
  60% {
    -webkit-transform: rotate(-1.5deg);
    -ms-transform: rotate(-1.5deg);
    transform: rotate(-1.5deg);
  }
  70% {
    -webkit-transform: rotate(0.7deg);
    -ms-transform: rotate(0.7deg);
    transform: rotate(0.7deg);
  }
  80% {
    -webkit-transform: rotate(-0.5deg);
    -ms-transform: rotate(-0.5deg);
    transform: rotate(-0.5deg);
  }
  90% {
    -webkit-transform: rotate(0.25deg);
    -ms-transform: rotate(0.25deg);
    transform: rotate(0.25deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

/*-------------------------------------------*/
/* [揺らぎ演出] */
@-webkit-keyframes yuragiSSsizeFrame {
  0% {
    clip: rect(0, 9999px, 0, 0);
  }
  1% {
    clip: rect(5px, 9999px, 10px, 0);
  }
  2% {
    clip: rect(10px, 9999px, 17px, 0);
  }
  3% {
    clip: rect(15px, 9999px, 20px, 0);
  }
  5% {
    clip: rect(0, 9999px, 5px, 0);
  }
  8% {
    clip: rect(30px, 9999px, 40px, 0);
  }
  10% {
    clip: rect(10px, 9999px, 20px, 0);
  }
  11% {
    clip: rect(45px, 9999px, 50px, 0);
  }
  12% {
    clip: rect(30px, 9999px, 40px, 0);
  }
  13% {
    clip: rect(0, 9999px, 0, 0);
  }
  32% {
    clip: rect(0, 9999px, 0, 0);
  }
  33% {
    clip: rect(10px, 9999px, 15px, 0);
  }
  35% {
    clip: rect(15px, 9999px, 25px, 0);
  }
  36% {
    clip: rect(0, 9999px, 0, 0);
  }
}

@keyframes yuragiSSsizeFrame {
  0% {
    clip: rect(0, 9999px, 0, 0);
  }
  1% {
    clip: rect(5px, 9999px, 10px, 0);
  }
  2% {
    clip: rect(10px, 9999px, 17px, 0);
  }
  3% {
    clip: rect(15px, 9999px, 20px, 0);
  }
  5% {
    clip: rect(0, 9999px, 5px, 0);
  }
  8% {
    clip: rect(30px, 9999px, 40px, 0);
  }
  10% {
    clip: rect(10px, 9999px, 20px, 0);
  }
  11% {
    clip: rect(45px, 9999px, 50px, 0);
  }
  12% {
    clip: rect(30px, 9999px, 40px, 0);
  }
  13% {
    clip: rect(0, 9999px, 0, 0);
  }
  32% {
    clip: rect(0, 9999px, 0, 0);
  }
  33% {
    clip: rect(10px, 9999px, 15px, 0);
  }
  35% {
    clip: rect(15px, 9999px, 25px, 0);
  }
  36% {
    clip: rect(0, 9999px, 0, 0);
  }
}

@-webkit-keyframes yuragiSSsizeFrame2 {
  0% {
    clip: rect(0, 9999px, 0, 0);
  }
  1% {
    clip: rect(30px, 9999px, 40px, 0);
  }
  2% {
    clip: rect(0, 9999px, 10px, 0);
  }
  3% {
    clip: rect(10px, 9999px, 20px, 0);
  }
  5% {
    clip: rect(5px, 9999px, 15px, 0);
  }
  9% {
    clip: rect(10px, 9999px, 20px, 0);
  }
  10% {
    clip: rect(40px, 9999px, 50px, 0);
  }
  11% {
    clip: rect(0, 9999px, 0, 0);
  }
  34% {
    clip: rect(0, 9999px, 0, 0);
  }
  35% {
    clip: rect(20px, 9999px, 45px, 0);
  }
  36% {
    clip: rect(50px, 9999px, 60px, 0);
  }
  40% {
    clip: rect(9999px, 9999px, 9999px, 0);
  }
  41% {
    clip: rect(0, 9999px, 0, 0);
  }
}

@keyframes yuragiSSsizeFrame2 {
  0% {
    clip: rect(0, 9999px, 0, 0);
  }
  1% {
    clip: rect(30px, 9999px, 40px, 0);
  }
  2% {
    clip: rect(0, 9999px, 10px, 0);
  }
  3% {
    clip: rect(10px, 9999px, 20px, 0);
  }
  5% {
    clip: rect(5px, 9999px, 15px, 0);
  }
  9% {
    clip: rect(10px, 9999px, 20px, 0);
  }
  10% {
    clip: rect(40px, 9999px, 50px, 0);
  }
  11% {
    clip: rect(0, 9999px, 0, 0);
  }
  34% {
    clip: rect(0, 9999px, 0, 0);
  }
  35% {
    clip: rect(20px, 9999px, 45px, 0);
  }
  36% {
    clip: rect(50px, 9999px, 60px, 0);
  }
  40% {
    clip: rect(9999px, 9999px, 9999px, 0);
  }
  41% {
    clip: rect(0, 9999px, 0, 0);
  }
}

@-webkit-keyframes yuragiMsizeFrame {
  0% {
    clip: rect(0, 9999px, 0, 0);
  }
  1% {
    clip: rect(30px, 9999px, 50px, 0);
  }
  2% {
    clip: rect(10px, 9999px, 35px, 0);
  }
  3% {
    clip: rect(40px, 9999px, 70px, 0);
  }
  5% {
    clip: rect(150px, 9999px, 200px, 0);
  }
  8% {
    clip: rect(100px, 9999px, 160px, 0);
  }
  10% {
    clip: rect(40px, 9999px, 90px, 0);
  }
  11% {
    clip: rect(150px, 9999px, 220px, 0);
  }
  12% {
    clip: rect(140px, 9999px, 160px, 0);
  }
  13% {
    clip: rect(0, 9999px, 0, 0);
  }
  32% {
    clip: rect(0, 9999px, 0, 0);
  }
  33% {
    clip: rect(40px, 9999px, 50px, 0);
  }
  35% {
    clip: rect(80px, 9999px, 100px, 0);
  }
  36% {
    clip: rect(0, 9999px, 0, 0);
  }
}

@keyframes yuragiMsizeFrame {
  0% {
    clip: rect(0, 9999px, 0, 0);
  }
  1% {
    clip: rect(30px, 9999px, 50px, 0);
  }
  2% {
    clip: rect(10px, 9999px, 35px, 0);
  }
  3% {
    clip: rect(40px, 9999px, 70px, 0);
  }
  5% {
    clip: rect(150px, 9999px, 200px, 0);
  }
  8% {
    clip: rect(100px, 9999px, 160px, 0);
  }
  10% {
    clip: rect(40px, 9999px, 90px, 0);
  }
  11% {
    clip: rect(150px, 9999px, 220px, 0);
  }
  12% {
    clip: rect(140px, 9999px, 160px, 0);
  }
  13% {
    clip: rect(0, 9999px, 0, 0);
  }
  32% {
    clip: rect(0, 9999px, 0, 0);
  }
  33% {
    clip: rect(40px, 9999px, 50px, 0);
  }
  35% {
    clip: rect(80px, 9999px, 100px, 0);
  }
  36% {
    clip: rect(0, 9999px, 0, 0);
  }
}

@-webkit-keyframes yuragiMsizeFrame2 {
  0% {
    clip: rect(0, 9999px, 0, 0);
  }
  1% {
    clip: rect(320px, 9999px, 350px, 0);
  }
  2% {
    clip: rect(300px, 9999px, 335px, 0);
  }
  3% {
    clip: rect(250px, 9999px, 270px, 0);
  }
  5% {
    clip: rect(400px, 9999px, 420px, 0);
  }
  9% {
    clip: rect(400px, 9999px, 420px, 0);
  }
  10% {
    clip: rect(300px, 9999px, 340px, 0);
  }
  11% {
    clip: rect(0, 9999px, 0, 0);
  }
  34% {
    clip: rect(0, 9999px, 0, 0);
  }
  35% {
    clip: rect(490px, 9999px, 510px, 0);
  }
  36% {
    clip: rect(540px, 9999px, 580px, 0);
  }
  40% {
    clip: rect(9999px, 9999px, 9999px, 0);
  }
  41% {
    clip: rect(0, 9999px, 0, 0);
  }
}

@keyframes yuragiMsizeFrame2 {
  0% {
    clip: rect(0, 9999px, 0, 0);
  }
  1% {
    clip: rect(320px, 9999px, 350px, 0);
  }
  2% {
    clip: rect(300px, 9999px, 335px, 0);
  }
  3% {
    clip: rect(250px, 9999px, 270px, 0);
  }
  5% {
    clip: rect(400px, 9999px, 420px, 0);
  }
  9% {
    clip: rect(400px, 9999px, 420px, 0);
  }
  10% {
    clip: rect(300px, 9999px, 340px, 0);
  }
  11% {
    clip: rect(0, 9999px, 0, 0);
  }
  34% {
    clip: rect(0, 9999px, 0, 0);
  }
  35% {
    clip: rect(490px, 9999px, 510px, 0);
  }
  36% {
    clip: rect(540px, 9999px, 580px, 0);
  }
  40% {
    clip: rect(9999px, 9999px, 9999px, 0);
  }
  41% {
    clip: rect(0, 9999px, 0, 0);
  }
}

@-webkit-keyframes yuragiLsizeFrame {
  0% {
    clip: rect(0, 9999px, 0, 0);
  }
  1% {
    clip: rect(80px, 9999px, 110px, 0);
  }
  2% {
    clip: rect(30px, 9999px, 65px, 0);
  }
  3% {
    clip: rect(100px, 9999px, 140px, 0);
  }
  5% {
    clip: rect(390px, 9999px, 450px, 0);
  }
  8% {
    clip: rect(250px, 9999px, 320px, 0);
  }
  10% {
    clip: rect(140px, 9999px, 180px, 0);
  }
  11% {
    clip: rect(400px, 9999px, 440px, 0);
  }
  12% {
    clip: rect(280px, 9999px, 310px, 0);
  }
  13% {
    clip: rect(0, 9999px, 0, 0);
  }
  32% {
    clip: rect(0, 9999px, 0, 0);
  }
  33% {
    clip: rect(45px, 9999px, 100px, 0);
  }
  35% {
    clip: rect(150px, 9999px, 200px, 0);
  }
  36% {
    clip: rect(0, 9999px, 0, 0);
  }
}

@keyframes yuragiLsizeFrame {
  0% {
    clip: rect(0, 9999px, 0, 0);
  }
  1% {
    clip: rect(80px, 9999px, 110px, 0);
  }
  2% {
    clip: rect(30px, 9999px, 65px, 0);
  }
  3% {
    clip: rect(100px, 9999px, 140px, 0);
  }
  5% {
    clip: rect(390px, 9999px, 450px, 0);
  }
  8% {
    clip: rect(250px, 9999px, 320px, 0);
  }
  10% {
    clip: rect(140px, 9999px, 180px, 0);
  }
  11% {
    clip: rect(400px, 9999px, 440px, 0);
  }
  12% {
    clip: rect(280px, 9999px, 310px, 0);
  }
  13% {
    clip: rect(0, 9999px, 0, 0);
  }
  32% {
    clip: rect(0, 9999px, 0, 0);
  }
  33% {
    clip: rect(45px, 9999px, 100px, 0);
  }
  35% {
    clip: rect(150px, 9999px, 200px, 0);
  }
  36% {
    clip: rect(0, 9999px, 0, 0);
  }
}

@-webkit-keyframes yuragiLsizeFrame2 {
  0% {
    clip: rect(0, 9999px, 0, 0);
  }
  1% {
    clip: rect(680px, 9999px, 710px, 0);
  }
  2% {
    clip: rect(630px, 9999px, 665px, 0);
  }
  3% {
    clip: rect(500px, 9999px, 540px, 0);
  }
  5% {
    clip: rect(890px, 9999px, 950px, 0);
  }
  9% {
    clip: rect(890px, 9999px, 950px, 0);
  }
  10% {
    clip: rect(700px, 9999px, 780px, 0);
  }
  11% {
    clip: rect(0, 9999px, 0, 0);
  }
  34% {
    clip: rect(0, 9999px, 0, 0);
  }
  35% {
    clip: rect(980px, 9999px, 1010px, 0);
  }
  36% {
    clip: rect(1045px, 9999px, 1180px, 0);
  }
  40% {
    clip: rect(9999px, 9999px, 9999px, 0);
  }
  41% {
    clip: rect(0, 9999px, 0, 0);
  }
}

@keyframes yuragiLsizeFrame2 {
  0% {
    clip: rect(0, 9999px, 0, 0);
  }
  1% {
    clip: rect(680px, 9999px, 710px, 0);
  }
  2% {
    clip: rect(630px, 9999px, 665px, 0);
  }
  3% {
    clip: rect(500px, 9999px, 540px, 0);
  }
  5% {
    clip: rect(890px, 9999px, 950px, 0);
  }
  9% {
    clip: rect(890px, 9999px, 950px, 0);
  }
  10% {
    clip: rect(700px, 9999px, 780px, 0);
  }
  11% {
    clip: rect(0, 9999px, 0, 0);
  }
  34% {
    clip: rect(0, 9999px, 0, 0);
  }
  35% {
    clip: rect(980px, 9999px, 1010px, 0);
  }
  36% {
    clip: rect(1045px, 9999px, 1180px, 0);
  }
  40% {
    clip: rect(9999px, 9999px, 9999px, 0);
  }
  41% {
    clip: rect(0, 9999px, 0, 0);
  }
}

/*-------------------------------------------*/
/* [スノーノイズ] */
@-webkit-keyframes snowNoiseFrame {
  0% {
    background-position: 50px 0;
  }
  40% {
    background-position: 10px 50%;
  }
  80% {
    background-position: 300px 100%;
  }
  100% {
    background-position: 0 0;
  }
}

@keyframes snowNoiseFrame {
  0% {
    background-position: 50px 0;
  }
  40% {
    background-position: 10px 50%;
  }
  80% {
    background-position: 300px 100%;
  }
  100% {
    background-position: 0 0;
  }
}

/*----------------------------------*/
/* [BLINK EFFECT] */
/* @MEMO */
.blinkEf {
  display: block;
  width: 0;
  overflow: hidden;
}

.blinkEf .blinkEfC {
  display: block;
  background-color: white;
}

.blinkEf.is-render {
  -webkit-animation: blinkEfWidthFrame 0.2s ease-out;
  animation: blinkEfWidthFrame 0.2s ease-out;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

.blinkEf.is-render .blinkEfC {
  -webkit-animation: blinkEfCFrame 0.2s ease-out;
  animation: blinkEfCFrame 0.2s ease-out;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

@-webkit-keyframes blinkEfWidthFrame {
  0% {
    width: 0;
  }
  1% {
    width: 100%;
  }
  20% {
    width: 100%;
  }
  50% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}

@keyframes blinkEfWidthFrame {
  0% {
    width: 0;
  }
  1% {
    width: 100%;
  }
  20% {
    width: 100%;
  }
  50% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}

@-webkit-keyframes blinkEfCFrame {
  0% {
    background-color: white;
  }
  50% {
    background-color: white;
  }
  100% {
    background-color: rgba(255, 255, 255, 0);
  }
}

@keyframes blinkEfCFrame {
  0% {
    background-color: white;
  }
  50% {
    background-color: white;
  }
  100% {
    background-color: rgba(255, 255, 255, 0);
  }
}

/* structure
##################################### */
img {
  width: 100%;
}

#stage {
  position: relative;
  overflow: hidden;
}

#logo {
  position: absolute;
  bottom: 10vw;
  right: 5vw;
  width: 12%;
  z-index: 1;
}

#logo a {
  display: block;
  width: 100%;
  padding-top: 100%;
  font-size: 0;
  text-indent: -9999px;
  background: url("../../img/common/logo.jpg") no-repeat 0 0;
  background-size: contain;
}

#index h1#logo {
  width: 30%;
}

#index div#logo {
  display: none;
  opacity: 0;
}

#header #logo {
  top: 4vw;
  left: 4vw;
}

#header {
  position: fixed;
  top: 0;
  left: 0;
  box-sizing: border-box;
  width: 100%;
  z-index: 50;
}

#header #gnav_layer {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  opacity: 0;
}

#header .inner {
  position: relative;
  display: none;
  opacity: 0;
}

#header #gnav {
  padding: 23% 8% 8%;
}

#header #gnav ul {
  overflow: hidden;
}

#header #gnav li {
  float: right;
  width: 13%;
  margin-bottom: 8%;
  background: #91130f;
}

#header #gnav li:not(:nth-child(6n)) {
  margin-left: 4%;
}

#header .share {
  text-align: center;
}

.btn_gnav {
  position: fixed;
  top: 4vw;
  right: 4vw;
  width: 12%;
  z-index: 50;
}

.btn_gnav::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../img/common/btn_menu_on.png");
  background-size: contain;
  opacity: 0;
  transition: all 0.4s;
}

.btn_gnav.on {
  position: absolute;
}

.btn_gnav.on::after {
  opacity: 1;
}

.ttl_page {
  padding: 25% 5% 6%;
  background: url("../img/common/bg_header.jpg") no-repeat;
  background-size: cover;
}

.ttl_sub {
  position: relative;
  top: -2vw;
  margin-bottom: 9%;
  text-align: center;
}

.ttl_sub img {
  width: 9%;
}

.ttl_elem {
  padding-bottom: .3em;
  margin-bottom: 10px;
  border-bottom: 1px solid #c3ba78;
}

.ttl_elem::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 24px;
  margin-right: .5em;
  background: url("../../img/common/ico01.png") no-repeat;
  vertical-align: text-bottom;
}

#main_inner {
  padding: 9% 5% 60%;
  background-color: #000;
  background-image: url("../img/common/bg_flower01.png"), url("../img/common/bg_cor01.png");
  background-repeat: no-repeat,
 no-repeat;
  background-position: 50% 100%,
 0 0;
  background-size: contain,
 66% auto;
}

.box_on {
  padding-bottom: 60%;
  background-color: #91130f;
  background-image: url("../img/common/bg_flower02.png");
  background-repeat: no-repeat;
  background-position: 50% 100%;
  background-size: contain;
}

.share {
  margin-bottom: 5%;
}

.share ul {
  display: inline-block;
  overflow: hidden;
  margin: 0 auto;
}

.share li {
  float: left;
  height: 16vw;
  letter-spacing: normal;
}

.share li img {
  width: auto;
  height: 100%;
}

#index #share {
  top: inherit;
  bottom: 215px;
  left: 100px;
  z-index: inherit;
}

#bnr {
  margin-bottom: 9%;
}

#bnr ul li:not(:last-child) {
  margin-bottom: 6%;
}

#index #bnr {
  margin-bottom: 0;
}

#footer {
  position: relative;
  padding: 10% 5% 4%;
  background: #1a1a1a;
  border-top: 2px solid #c3ba78;
  text-align: center;
  font-size: 8px;
  font-size: 0.8rem;
  line-height: 1.7;
  font-weight: normal;
}

#footer #fnav {
  margin: 5% 0;
  letter-spacing: -.4em;
}

#footer #fnav li {
  display: inline-block;
  padding: 0 1.5em;
  border-right: 1px solid #2e2e2e;
  letter-spacing: normal;
}

#footer #fnav li:first-child {
  border-left: 1px solid #2e2e2e;
}

#footer #fnav a {
  color: #fff;
}

#btn_ptop {
  position: absolute;
  top: -7vw;
  right: 50%;
  -webkit-transform: translateX(50%);
      -ms-transform: translateX(50%);
          transform: translateX(50%);
  display: block;
  width: 10%;
}

/* parts
##################################### */
.inner {
  padding: 0 5%;
}

.box_movie {
  position: relative;
  padding-top: 56.25%;
}

.box_movie iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.btn01 {
  display: inline-block;
  padding: .2em 1em;
  border: 1px solid #fff;
  color: #fff;
}

/* index
##################################### */
#index_main {
  position: relative;
}

#index_main #mainvisual {
  position: relative;
}

#index_main #mainvisual #img_copy01 {
  position: absolute;
  top: 14vw;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
      -ms-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  width: 10%;
}

#index_main #mainvisual #img_copy02 {
  position: absolute;
  bottom: 8vw;
  right: 5%;
  width: 20%;
}

#index_main #mainvisual #releaseday {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 50%;
}

#index_bnr {
  padding-top: 5%;
  padding-bottom: 5%;
}

#index_bnr ul {
  overflow: hidden;
}

#index_bnr ul li {
  float: left;
  width: 47.5%;
}

#index_bnr ul li:nth-child(odd) {
  margin-right: 5%;
}

#index_news {
  padding-bottom: 20%;
  background: url("../img/common/bg_cor01.png") no-repeat -40% 0 #91130f;
  background-size: 66% auto;
}

#index_news ol {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-bottom: 9%;
}

#index_news ol li {
  width: 47.5%;
  margin-top: 5%;
}

#index_news ol li:nth-child(1), #index_news ol li:nth-child(2) {
  margin-top: 0;
}

#index_news ol li:nth-child(odd) {
  margin-right: 5%;
}

#index_news ol li.new .thum::before {
  content: '';
  position: absolute;
  bottom: -25px;
  right: 0;
  width: 34px;
  height: 17px;
  background: url("../img/common/ico_new.png") no-repeat 0 0;
  background-size: contain;
}

#index_news ol a {
  display: block;
  color: #000;
}

#index_news ol a .thum {
  position: relative;
  padding-top: 100%;
  margin-bottom: 10px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

#index_news ol a .date {
  display: block;
  color: #c3ba78;
}

#index_movie {
  padding-bottom: 20%;
  background: url("../img/common/bg_cor03.png") no-repeat 100% 100% #1a1a1a;
  background-size: 50% auto;
}

#index_movie .box_movie {
  margin-bottom: 10%;
}

#index_tw {
  padding-bottom: 22%;
  background: url("../img/common/bg_flower01.png") no-repeat 50% 100% #000;
  background-size: contain;
}

#index_tw #widget {
  box-sizing: border-box;
  width: 320px;
  height: 327px;
  margin: 0 auto 9%;
  padding: 48px 45px 40px;
  background: url("../img/index/bg_widget.png") no-repeat;
  background-size: contain;
}

#index.april .btn_gnav, #index.april #index_movie, #index.april #index_tw {
  display: none !important;
}

#index.april h1#logo {
  width: 39%;
  top: 0;
  left: 0;
}

#index.april h1#logo a {
  background: url("../../img/index_april/logo.png") no-repeat 0 0/"contain";
}

#index.april #index_news {
  padding: 10% 0 15%;
}

/* news
##################################### */
#news #list_news {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-bottom: 9%;
}

#news #list_news li {
  width: 47.5%;
  margin-top: 5%;
}

#news #list_news li:nth-child(1), #news #list_news li:nth-child(2) {
  margin-top: 0;
}

#news #list_news li:nth-child(odd) {
  margin-right: 5%;
}

#news #list_news li.new .thum::before {
  content: '';
  position: absolute;
  bottom: -25px;
  right: 0;
  width: 34px;
  height: 17px;
  background: url("../img/common/ico_new.png") no-repeat 0 0;
  background-size: contain;
}

#news #list_news a {
  display: block;
}

#news #list_news a .thum {
  position: relative;
  padding-top: 100%;
  margin-bottom: 10px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

#news #list_news a .date {
  display: block;
  color: #c3ba78;
}

#news #pager {
  text-align: center;
  overflow: hidden;
}

#news #pager ol {
  display: inline-block;
  overflow: hidden;
  margin: 0 auto;
}

#news #pager li {
  float: left;
  width: 14vw;
  height: 16vw;
  background: url("../img/common/bg_pager.png") no-repeat;
  background-size: cover;
}

#news #pager li:first-child {
  background-image: url("../img/common/bg_pager_first.png");
}

#news #pager li:last-child {
  width: 16vw;
  background-image: url("../img/common/bg_pager_last.png");
}

#news #pager li a {
  display: inline-block;
  margin: 5vw 0 0 2vw;
  padding: 0 2vw;
  color: #fff;
}

#news #pager li:last-child a {
  margin-left: 0;
}

#news #pager li.btn_arrow a {
  width: 7vw;
  padding: 0;
}

#news #pager li.btn_arrow.btn_arrow:first-child a {
  margin-left: 3vw;
}

#news #pager li.btn_arrow img {
  vertical-align: top;
}

#news #pager li.is-active a {
  color: #c3ba78;
  font-weight: bold;
}

#news #pager .pager_side, #news #pager .pager_center {
  float: left;
  width: 30%;
  height: 2.3vw;
}

#news #pager .pager_side img, #news #pager .pager_center img {
  width: auto;
  height: 100%;
  vertical-align: top;
}

#news #pager .pager_side {
  width: 30%;
}

#news #pager .pager_center {
  width: 40%;
}

#news .btn_back {
  width: 43%;
  margin-bottom: 9%;
}

#news .box_news {
  margin-bottom: 9%;
}

#news .box_news::before {
  content: '';
  display: inline-block;
  width: 100%;
  height: 5px;
  background: url("../img/common/frame_t.png");
  background-size: 100% 5px;
  vertical-align: bottom;
}

#news .box_news::after {
  content: '';
  display: inline-block;
  width: 100%;
  height: 5px;
  background: url("../img/common/frame_b.png");
  background-size: 100% 5px;
  vertical-align: top;
}

#news .box_news .inner {
  padding: 10%;
  background: url("../img/common/frame_m.png") repeat-y #000;
  background-size: 100% 2px;
}

#news .box_news .inner .date {
  display: block;
  margin-bottom: 5%;
  color: #c3ba78;
}

#news .box_news .inner .ttl {
  margin-bottom: 10%;
  background: #91130f;
  color: #000;
}

#news .box_news .inner .detail {
  padding-bottom: 12%;
  margin-bottom: 12%;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  font-family: 'Roboto', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", 'Hiragino Sans', "游ゴシック", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}

#news .box_news .inner #news_share {
  letter-spacing: -.4em;
}

#news .box_news .inner #news_share img {
  vertical-align: middle;
}

#news .box_news .inner #news_share ul {
  display: inline-block;
  overflow: hidden;
  margin-top: 9%;
}

#news .box_news .inner #news_share li {
  float: left;
  height: 16vw;
  letter-spacing: normal;
}

#news .box_news .inner #news_share li img {
  width: auto;
  height: 100%;
}

/* intro
##################################### */
#intro #main_inner {
  position: relative;
  padding: 0;
}

#intro #bg_set {
  position: absolute;
  top: 0;
  left: 0;
}

#intro #bg_set img {
  vertical-align: middle;
}

#intro .txt {
  position: relative;
}

/* onair
##################################### */
#onair #main_inner {
  padding: 9% 0 0;
}

#onair .box_on {
  padding-left: 5%;
  padding-right: 5%;
  margin-top: 20%;
}

#onair .list_schedule {
  font-family: 'Roboto', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", 'Hiragino Sans', "游ゴシック", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}

#onair .list_schedule:not(:last-child) {
  margin-bottom: 9%;
}

#onair .list_schedule ul {
  margin-bottom: 6%;
}

#onair .list_schedule li {
  padding: 5%;
}

#onair .list_schedule li:first-child {
  border-top: 2px solid #000;
}

#onair .list_schedule li:not(:first-child) {
  border-top: 1px solid #000;
}

#onair .list_schedule li:last-child {
  border-bottom: 1px solid #000;
}

/* story
##################################### */
#story #main_inner {
  font-family: 'Amiri', "Hiragino Mincho ProN", "Hiragino Mincho Pro", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}

#story #list_story {
  margin-bottom: 40px;
  text-align: center;
  letter-spacing: -.4em;
}

#story #list_story li {
  display: inline-block;
  width: 23.5%;
  letter-spacing: normal;
}

#story #list_story li a {
  display: block;
  box-sizing: border-box;
  padding-top: .2em;
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid #fff;
  color: #fff;
}

#story #list_story li:not(:nth-child(4n)) {
  margin-right: 2%;
}

#story #list_story li:nth-child(n+5) {
  margin-top: 2%;
}

#story #list_story li.is-active a {
  background: #91130f;
  border: 1px solid #91130f;
}

#story .box_story .hl {
  color: #91130f;
}

#story .box_story .ttl {
  position: relative;
  margin-bottom: 10px;
  font-size: 56px;
  font-size: 5.6rem;
  line-height: 56px;
  font-weight: normal;
  text-align: center;
  color: #4c0604;
}

#story .box_story .ttl span {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  color: #fff;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 56px;
  font-weight: normal;
}

#story .box_story .img {
  position: relative;
  margin-bottom: 10px;
}

#story .box_story .img .bg {
  display: none;
}

#story .box_story .img ul {
  margin-bottom: 20px;
  overflow: hidden;
}

#story .box_story .img li {
  position: relative;
  float: left;
  width: 20%;
  background: #000;
  cursor: pointer;
}

#story .box_story .img li::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #960600;
  opacity: 0;
  transition: all 0.4s;
}

#story .box_story .img li img {
  width: 100%;
  opacity: .4;
  transition: all 0.4s;
}

#story .box_story .img li.is-active::after {
  opacity: .2;
}

#story .box_story .img li.is-active img {
  opacity: 1;
}

#story .box_story .keyperson {
  min-height: 96px;
  margin-bottom: 20px;
  background: url("../img/story/img01.png") no-repeat 50% 50%;
  background-size: 80px 96px;
  letter-spacing: -.4em;
  text-align: center;
}

#story .box_story .keyperson p {
  display: inline-block;
  padding-top: 20px;
  letter-spacing: normal;
  vertical-align: top;
}

#story .box_story .keyperson p span {
  display: block;
}

#story .box_story .keyperson p span:first-child::after {
  content: '';
  display: block;
  width: 20px;
  height: 1px;
  margin: 5px auto 10px;
  background: #fff;
}

#story .box_story .keyperson .client {
  padding-right: 45px;
}

#story .box_story .keyperson .target {
  padding-left: 45px;
}

#story .staff::before {
  content: '';
  display: inline-block;
  width: 100%;
  height: 5px;
  background: url("../img/common/frame_t.png");
  background-size: 100% 5px;
  vertical-align: bottom;
}

#story .staff::after {
  content: '';
  display: inline-block;
  width: 100%;
  height: 5px;
  background: url("../img/common/frame_b.png");
  background-size: 100% 5px;
  vertical-align: top;
}

#story .staff ul {
  padding: 5%;
  background: url("../img/common/frame_m.png") repeat-y #000;
  background-size: 100% 2px;
  letter-spacing: -.4em;
  text-align: center;
}

#story .staff ul li {
  letter-spacing: normal;
}

#story .staff ul li:nth-child(1) {
  display: inline-block;
}

#story .staff ul li:nth-child(2) {
  display: inline-block;
  margin-left: 1.5em;
}

#story .staff ul li:nth-child(n+3) {
  margin-top: .5em;
}

/* chara
##################################### */
#chara #main_inner {
  position: relative;
  padding: 0 0 60%;
  background-image: url("../img/common/bg_flower01.png"), url("../img/common/bg_cor02.png");
  background-size: contain,
 52% auto;
}

#chara .ttl_page img {
  position: relative;
  z-index: 1;
}

#cnav {
  position: absolute;
  top: 6vw;
  left: 5%;
  width: 50%;
  margin-bottom: 80px;
  z-index: 1;
}

#cnav ul {
  margin-bottom: 30px;
  letter-spacing: -.4em;
}

#cnav li {
  display: inline-block;
  width: 32%;
  margin-top: 2%;
  letter-spacing: normal;
}

#cnav li:not(:nth-child(5n)) {
  margin-right: 2%;
}

#cnav li:nth-child(1), #cnav li:nth-child(6n) {
  margin-left: 17%;
}

#cnav li:nth-child(1), #cnav li:nth-child(2) {
  margin-top: 0;
}

#cnav li a {
  position: relative;
  display: block;
}

#cnav li a::after {
  content: '';
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  opacity: 0;
}

#cnav li a#chara1::after {
  background-image: url("../../img/chara/btn_cnav01_on.png");
}

#cnav li a#chara2::after {
  background-image: url("../../img/chara/btn_cnav02_on.png");
}

#cnav li a#chara3::after {
  background-image: url("../../img/chara/btn_cnav03_on.png");
}

#cnav li a#chara4::after {
  background-image: url("../../img/chara/btn_cnav04_on.png");
}

#cnav li a#chara5::after {
  background-image: url("../../img/chara/btn_cnav05_on.png");
}

#cnav li a#chara6::after {
  background-image: url("../../img/chara/btn_cnav06_on.png");
}

#cnav li a#chara7::after {
  background-image: url("../../img/chara/btn_cnav07_on.png");
}

#cnav li a.is-active img {
  opacity: 0;
}

#cnav li a.is-active::after {
  opacity: 1;
}

.box_chara {
  position: relative;
  top: -4vw;
  display: none;
  text-align: right;
}

.box_chara::before {
  content: '';
  position: absolute;
  top: 3vw;
  left: 5%;
  width: 40%;
  padding-top: 47.53%;
  background: url("../../img/chara/bg_chara.png") no-repeat;
  background-size: contain;
}

.box_chara .img_line {
  position: absolute;
  top: -55vw;
  left: 20%;
  width: 80%;
  opacity: 0;
  transition: all .6s ease-out;
}

.box_chara.chara1 .img_line {
  top: -58vw;
}

.box_chara.chara2 .img_line {
  top: -54vw;
  left: 22%;
  width: 110%;
}

.box_chara.chara3 .img_line {
  top: -65vw;
  left: 29%;
}

.box_chara.chara4 .img_line {
  top: -47vw;
  left: 28%;
  width: 70%;
}

.box_chara.chara5 .img_line {
  top: -53vw;
  left: 32%;
  width: 100%;
}

.box_chara.chara6 .img_line {
  top: -50vw;
  left: 40%;
  width: 52%;
}

.box_chara.chara7 .img_line {
  left: 23%;
}

.box_chara .img_stand {
  display: inline-block;
  width: 100%;
  height: 100vw;
  margin-bottom: 9%;
  text-align: right;
  -webkit-transform: translateX(50px);
      -ms-transform: translateX(50px);
          transform: translateX(50px);
  opacity: 0;
  transition: all .6s ease-out;
}

.box_chara .img_stand img {
  width: auto;
  height: 100%;
}

.box_chara.chara4 .img_stand img,
.box_chara.chara6 .img_stand img,
.box_chara.chara7 .img_stand img {
  margin-right: 9vw;
}

.box_chara.chara5 .img_stand img {
  margin-right: -7vw;
}

.box_chara .img_name {
  position: absolute;
  bottom: 0;
  left: 5vw;
  width: 10vw;
  -webkit-transform: translateY(-50px);
      -ms-transform: translateY(-50px);
          transform: translateY(-50px);
  opacity: 0;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  transition: all .6s ease-out;
}

.box_chara.chara5 .img_name {
  width: 5vw;
}

.box_chara .img_cv {
  position: absolute;
  bottom: 0;
  left: 19vw;
  width: auto;
  height: 6vw;
  -webkit-transform: translateX(20px);
      -ms-transform: translateX(20px);
          transform: translateX(20px);
  opacity: 0;
  transition: all .3s .8s ease-out;
}

.box_chara.chara5 .img_cv {
  left: 13vw;
}

.box_chara .img_face {
  opacity: 0;
  transition: all .3s 1.5s ease-out;
}

.box_chara .box_txt {
  padding-left: 5%;
  margin-bottom: 5%;
  text-align: left;
  overflow: hidden;
}

.box_chara .box_txt dl {
  text-align: left;
}

.box_chara .box_txt dl dt {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 49%;
  height: 100vw;
}

.box_chara .box_txt dl dd {
  opacity: 0;
}

.box_chara .box_txt dl dd:not(.img_stand) {
  padding-right: 5%;
  transition: all .3s 1.5s ease-out;
}

.box_chara.is-active .img_line {
  opacity: 1;
}

.box_chara.is-active .img_stand {
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0);
  opacity: 1;
}

.box_chara.is-active .img_name {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}

.box_chara.is-active .img_cv {
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0);
  opacity: 1;
}

.box_chara.is-active .img_face {
  opacity: 1;
}

.box_chara.is-active .box_txt dd {
  opacity: 1;
}

/* staffcast
##################################### */
#staffcast #main_inner {
  padding: 0;
}

.list_staffcast {
  text-align: center;
}

.list_staffcast li:not(:last-child) {
  margin-bottom: 30px;
}

.list_staffcast li .part {
  font-family: 'Roboto', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", 'Hiragino Sans', "游ゴシック", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
  color: rgba(255, 255, 255, 0.8) !important;
}

#list_staff {
  margin-bottom: 20%;
}

#list_staff li > p {
  color: #91130f;
}

#list_cast li > p {
  color: #000;
}

/* movie
##################################### */
#movie #list_movie li:not(:first-child) {
  margin-top: 9%;
}

#movie #list_movie .box_movie {
  margin-bottom: 4%;
}

#movie #list_movie .ttl {
  color: #91130f;
}

/* music
##################################### */
#music #main_inner {
  padding: 0;
}

#music .box_music {
  margin-bottom: 30px;
}

#music .box_music dt, #music .box_music dd {
  margin-bottom: 15px;
}

#music .box_music .thum {
  margin-bottom: 20px;
}

#music .box_music dt span {
  display: inline-block;
  padding: 0 .3em;
  background: #91130f;
  color: #000;
}

#music .box_music .name {
  margin-bottom: 10px;
}

#music .profile, #music .comment {
  margin-bottom: 15px;
  line-height: 2;
}

#music .profile .ttl, #music .comment .ttl {
  display: inline-block;
  padding: 0 .3em;
  margin-bottom: 10px;
  background: #91130f;
  color: #000;
}

#music .comment::before {
  content: '';
  display: inline-block;
  width: 100%;
  height: 5px;
  background: url("../img/common/frame_t.png");
  background-size: 100% 5px;
  vertical-align: bottom;
}

#music .comment::after {
  content: '';
  display: inline-block;
  width: 100%;
  height: 5px;
  background: url("../img/common/frame_b.png");
  background-size: 100% 5px;
  vertical-align: top;
}

#music .comment .inner {
  padding: 7%;
  background: url("../img/common/frame_m.png") repeat-y;
  background-size: 100% 2px;
}

#music .box_on {
  margin-top: 20%;
}

#music .box_on .box_music dt span {
  background: #000;
  color: #91130f;
}

#music .box_on .profile .ttl, #music .box_on .comment .ttl {
  background: #000;
  color: #91130f;
}

#music .box_on .comment {
  margin-bottom: 0;
}

/* package
##################################### */
#package #list_package {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

#package #list_package li {
  width: 47.5%;
  margin-top: 5%;
}

#package #list_package li:nth-child(1), #package #list_package li:nth-child(2) {
  margin-top: 0;
}

#package #list_package li:nth-child(odd) {
  margin-right: 5%;
}

#package #list_package a {
  display: block;
}

#package #list_package a .thum {
  position: relative;
  padding-top: 134%;
  margin-bottom: 10px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

#package #list_package a .date {
  display: block;
  color: #c3ba78;
}

#package #list_package a .detail {
  margin-top: 5px;
  font-family: 'Roboto', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", 'Hiragino Sans', "游ゴシック", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
  color: #fff;
}

#package .box_package {
  margin-bottom: 30px;
}

#package .box_package dt, #package .box_package dd {
  margin-bottom: 15px;
}

#package .box_package .thum {
  margin-bottom: 20px;
}

#package .box_package dt span {
  display: inline-block;
  padding: 0 .3em;
  background: #91130f;
  color: #000;
}

#package .box_package .name {
  margin-bottom: 10px;
}

#package .box01, #package .box02 {
  line-height: 2;
}

#package .box01 .ttl, #package .box02 .ttl {
  display: inline-block;
  padding: 0 .3em;
  margin-bottom: 10px;
  background: #91130f;
  color: #000;
}

#package .box02::before {
  content: '';
  display: inline-block;
  width: 100%;
  height: 5px;
  background: url("../img/common/frame_t.png");
  background-size: 100% 5px;
  vertical-align: bottom;
}

#package .box02::after {
  content: '';
  display: inline-block;
  width: 100%;
  height: 5px;
  background: url("../img/common/frame_b.png");
  background-size: 100% 5px;
  vertical-align: top;
}

#package .box02 .inner {
  padding: 7%;
  background: url("../img/common/frame_m.png") repeat-y;
  background-size: 100% 2px;
}

/* special
##################################### */
#special #list_special {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-bottom: 9%;
}

#special #list_special li {
  width: 47.5%;
  margin-top: 5%;
}

#special #list_special li:nth-child(1), #special #list_special li:nth-child(2) {
  margin-top: 0;
}

#special #list_special li:nth-child(odd) {
  margin-right: 5%;
}

#special #list_special li.new .thum::before {
  content: '';
  position: absolute;
  bottom: -25px;
  right: 0;
  width: 34px;
  height: 17px;
  background: url("../img/common/ico_new.png") no-repeat 0 0;
  background-size: contain;
}

#special #list_special a {
  display: block;
}

#special #list_special a .thum {
  position: relative;
  padding-top: 100%;
  margin-bottom: 10px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

#special #list_special a .date {
  display: block;
  color: #c3ba78;
}

#special #pager {
  text-align: center;
  overflow: hidden;
}

#special #pager ol {
  display: inline-block;
  overflow: hidden;
  margin: 0 auto;
}

#special #pager li {
  float: left;
  width: 14vw;
  height: 16vw;
  background: url("../img/common/bg_pager.png") no-repeat;
  background-size: cover;
}

#special #pager li:first-child {
  background-image: url("../img/common/bg_pager_first.png");
}

#special #pager li:last-child {
  width: 16vw;
  background-image: url("../img/common/bg_pager_last.png");
}

#special #pager li a {
  display: inline-block;
  margin: 5vw 0 0 2vw;
  padding: 0 2vw;
  color: #fff;
}

#special #pager li:last-child a {
  margin-left: 0;
}

#special #pager li.btn_arrow a {
  width: 7vw;
  padding: 0;
}

#special #pager li.btn_arrow.btn_arrow:first-child a {
  margin-left: 3vw;
}

#special #pager li.btn_arrow img {
  vertical-align: top;
}

#special #pager li.is-active a {
  color: #c3ba78;
  font-weight: bold;
}

#special #pager .pager_side, #special #pager .pager_center {
  float: left;
  width: 30%;
  height: 2.3vw;
}

#special #pager .pager_side img, #special #pager .pager_center img {
  width: auto;
  height: 100%;
  vertical-align: top;
}

#special #pager .pager_side {
  width: 30%;
}

#special #pager .pager_center {
  width: 40%;
}

#special .btn_back {
  width: 43%;
  margin-bottom: 9%;
}

#special .box_special {
  margin-bottom: 9%;
}

#special .box_special::before {
  content: '';
  display: inline-block;
  width: 100%;
  height: 5px;
  background: url("../img/common/frame_t.png");
  background-size: 100% 5px;
  vertical-align: bottom;
}

#special .box_special::after {
  content: '';
  display: inline-block;
  width: 100%;
  height: 5px;
  background: url("../img/common/frame_b.png");
  background-size: 100% 5px;
  vertical-align: top;
}

#special .box_special .inner {
  padding: 10%;
  background: url("../img/common/frame_m.png") repeat-y #000;
  background-size: 100% 2px;
}

#special .box_special .inner .date {
  display: block;
  margin-bottom: 5%;
  color: #c3ba78;
}

#special .box_special .inner .ttl {
  margin-bottom: 10%;
  background: #91130f;
  color: #000;
}

#special .box_special .inner .detail {
  padding-bottom: 12%;
  margin-bottom: 12%;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  font-family: 'Roboto', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", 'Hiragino Sans', "游ゴシック", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}

#special .box_special .inner #special_share {
  letter-spacing: -.4em;
}

#special .box_special .inner #special_share img {
  vertical-align: middle;
}

#special .box_special .inner #special_share ul {
  display: inline-block;
  overflow: hidden;
  margin-top: 9%;
}

#special .box_special .inner #special_share li {
  float: left;
  height: 16vw;
  letter-spacing: normal;
}

#special .box_special .inner #special_share li img {
  width: auto;
  height: 100%;
}


.floatcontents {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.9);
  z-index: 500;
}
.floatcontents .wrapper {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.floatcontents .close {
  position: absolute;
  width: 40px;
  height: 40px;
  top: 10px;
  right: 10px;
}
.floatcontents .close:before, .floatcontents .close:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  background: #FFF;
  width: 100%;
  height: 1px;
}
.floatcontents .close:before {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.floatcontents .close:after {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.floatcontents .image {
  position: absolute;
  width: 90%;
  left: 5%;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.floatcontents .image img {
  width: 100%;
}