@charset "UTF-8";
body {
  font-family: "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", Verdana, "ヒラギノ角ゴシック", Hiragino Sans, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, sans-serif;
  color: #333;
  background-image: url("../img/bg.png");
  background-repeat: repeat-y;
  background-position: top center;
}


/*ーーーーーーーーーーーーー
 共通
 ーーーーーーーーーーーーー*/

.content {
  max-width: 1000px;
  margin: 0 auto;
  background-color: rgba(255, 255, 255, 0.8);
}

.content .inner {
  width: 80%;
  padding: 0;
  margin-top: 56px;
}

.inner {
  position: relative;
  margin: 0 auto;
}

.endspan {
  color: red;
  display: block;
  margin-top: 10px;
}


/*--------- 見出し部分共通 ---------*/

/* トップページキャストコメント */

.comment h3,

/*　イントロダクション　*/

.introTitle h3,

/*　ストーリー　*/

.aboutTitle h3,

/*　アバウト　*/

.storyTitle h3,

/* チケット */

.radioTitle h3,

/* ラジオ */

.mannersTitle h3,

/* ラジオ */

.ticketTitle h3 {
  font-size: 24px;
  font-weight: bold;
  color: rgba(233, 80, 152, 0.7);
  text-align: center;
  margin-bottom: 12px;
}


/*--------- コンテンツ ---------*/

.introContent,
.storyContent,
.ticketContent,
.theaterContent,
.infoContent,
.aboutContent,
.theatertokuten,
.specialContent,
.goodsContent,
.commentContent,
.mannersContent,
.radioContent {
  width: 100%;
  margin: 0 auto;
  padding: 40px 10px 50px;
}


/*--------- コンテンツタイトル ---------*/

.contentTitle {
  position: relative;
  text-align: center;
  margin: 30px auto;
}

.contentTitle .icon {
  display: block;
  position: absolute;
  top: -25px;
  left: 50%;
  margin-left: -25px;
  width: 50px;
  height: 14px;
  background: url(../img/star_2.png) no-repeat;
}

.contentTitle h2 {
  position: relative;
  line-height: 1;
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 3px;
  color: #333;
}

.contentTitle h2 .small {
  font-size: 14px;
  font-weight: normal;
  letter-spacing: 3px;
}


/*---------　フッター　---------*/

.footer {
  font-size: 0.8rem;
  color: #333;
}


/*--------- バナー ---------*/

.footer .banner {
  padding: 20px 0;
  background-color: rgba(0, 0, 0, .2);
}

.footer .banner .bannerBox {
  width: 375px;
  margin: 0 auto;
}

.footer .banner .bannerBox .box {
  float: left;
  width: 180px;
  margin: 0 2px;
}

.footer .banner .bannerBox .box img {
  width: 180px;
  border: 1px solid #333;
}


/*--------- sns ---------*/

button {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
}

footer {
  line-height: 50px;
}

.sns {
  max-width: 1000px;
  padding: 20px 0;
  margin: 0 auto;
  background-color: rgba(255, 255, 255, 0.6);
}

.sns ul {
  display: flex;
  padding: 20px 0;
  margin: 0 auto;
  flex-wrap: wrap;
  width: 284px;
}

.sns li.snsTwitter {
  height: 40px;
  background-color: #fff;
  ;
  border: #1b95e0 solid 1px;
  border-radius: 5px;
  margin: 0 3px;
}

.sns li.snsTwitter a {
  display: flex;
  color: #1b95e0;
  padding: 7px 10px;
  height: 40px;
  align-items: center;
  line-height: 40px;
  font-size: 16px;
  font-weight: bold;
}

.sns li.snsTwitter a img {
  width: 30px;
}

.sns_icon img {
  width: 40px;
  margin: 0 7px;
}


/*---------  topへ戻るのボタン --------- */

#pageTop {
  position: fixed;
  bottom: 30px;
  right: 30px;
}

#pageTop a {
  display: block;
  z-index: 999;
  padding: 10px 0 0 1px;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  background-color: rgba(175, 150, 70, .9);
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
}

#pageTop a:hover {
  text-decoration: none;
  opacity: 0.7;
}


/*---------  NEWアイコン --------- */

.newIcon {
  background-color: rgba(210, 157, 11, 1);
  padding: 2px 5px;
  color: #fff;
  margin-right: 10px;
  display: inline;
  border-radius: 10px;
  font-size: 10px;
}


/*---------  日付 --------- */

.newsDate {
  font-size: 12px;
  font-weight: bold;
  display: inline;
}


/*---------  画像はBOXに対して100%で指定 --------- */

.boxImg img {
  width: 100%;
}

.snsbtnline .tw {
  margin-right: 10px;
}

.snsbtnline {
  position: absolute;
  top: 10px;
  right: 0;
  display: flex;
}

.snsbtnline.pc .tweet {
  display: none !important;
}

.sp {
  display: none !important;
}

.pc {
  display: block !important;
}


/*ーーーーーーーーーーーーー
 トップページ
 ーーーーーーーーーーーーー*/

.homeContent {
  max-width: 100%;
  margin-bottom: 10px;
}

.homeInner {
  max-width: 100%;
}

.homeBox {
  max-width: 1000px;
  margin: 0 auto 50px;
}

.homeBox .wrap {
  display: flex;
  justify-content: space-around;
  background-color: rgba(233, 80, 152, 1);
  width: 100%;
  border-radius: 20px;
  margin: 0 auto;
}

.homeBox .wrap .box {
  width: 50%;
  padding: 20px 20px 30px;
  z-index: 0;
}

.homeBox .wrap .box p {
  width: 60%;
  text-align: left;
  color: #fff;
}

.homeBox .wrap .box .wrap img {
  height: 270px;
}


/*　ヘッダー下のニュース　*/

.news .btn {
  width: 50px;
  color: #fff;
  font-size: 0.8rem;
  line-height: 22px;
  float: left;
  padding: 1px 5px;
  margin-right: 20px;
}

.news {
  position: relative;
  background-color: rgba(233, 80, 152, 1);
  width: 100%;
  margin: 56px auto 0;
}

.ticker {
  margin: 0 auto;
  padding-left: 270px;
  width: 1000px;
  text-align: left;
  position: relative;
  overflow: hidden;
}

.ticker ul {
  width: 100%;
  position: relative;
}

.ticker ul li {
  width: 100%;
  display: none;
  line-height: 24px;
}

.ticker ul li a {
  color: #fff;
}


/*キービジュアル*/

.homeInner h1 {
  background-image: url(../img/top_bg.jpg);
  background-size: 100% 100%;
}

.homeInner h1 img {
  max-width: 50%;
  margin: -20px 25% 0;
}

.releaseBox {
  position: relative;
}

.releaseBox h3 {
  max-height: 80px;
  /*    background-color: #ff4f9c;*/
}

.releaseBox h3 img {
  max-width: 100%;
  margin: 0 auto;
}


/* バナー */

.homeInner .banner1 {
  position: absolute;
  bottom: 120%;
  left: 10px;
  max-width: 200px;
  width: 15%;
}

.homeInner .banner2 {
  position: absolute;
  bottom: 205%;
  left: 10px;
  text-align: center;
  max-width: 200px;
  width: 15%;
}

.homeInner .banner3 {
  position: absolute;
  bottom: 290%;
  left: 10px;
  text-align: center;
  max-width: 200px;
  width: 15%;
}

.homeInner .banner4 {
  position: absolute;
  bottom: 375%;
  left: 10px;
  text-align: center;
  max-width: 200px;
  width: 15%;
}

.homeInner .banner5 {
  position: absolute;
  bottom: 460%;
  left: 10px;
  text-align: center;
  max-width: 200px;
  width: 15%;
}

.homeInner .banner6 {
  position: absolute;
  bottom: 545%;
  left: 10px;
  text-align: center;
  max-width: 200px;
  width: 15%;
}

.homeInner .banner7 {
  position: absolute;
  bottom: 630%;
  left: 10px;
  text-align: center;
  max-width: 200px;
  width: 15%;
}

.homeInner .banner8 {
  position: absolute;
  bottom: 715%;
  left: 10px;
  text-align: center;
  max-width: 200px;
  width: 15%;
}

.homeInner .banner1 img,
.homeInner .banner2 img,
.homeInner .banner3 img,
.homeInner .banner4 img,
.homeInner .banner5 img,
.homeInner .banner6 img,
.homeInner .banner7 img,
.homeInner .banner8 img {
  display: block;
  width: 100%;
  margin-top: -20px;
  border: 1px solid #333;
}

.homeBox .commentBox img {
  margin: 10px auto 20px;
  display: block;
  max-width: 100%;
  height: auto;
}

/* ニュース */

.newsBox {
  max-width: 700px;
  width: 90%;
  margin: 0 auto 30px;
  background-color: rgba(255, 255, 255, 0.8)
}

.newsBox ul li {
  width: 100%;
  padding: 5px 10px;
  line-height: 2;
  font-size: 14px;
  border-bottom: 1px solid#333;
  color: #333;
}

.newsBox ul li a {
  display: block;
  width: 100%;
  height: 100%;
  line-height: 2;
  color: #333;
}

.newsBox ul li a:hover {
  text-decoration: underline;
}

.newsBox ul li a span {
  margin-right: 10px;
}

.newsBox .moreBtn {
  float: right;
  background-color: rgba(210, 157, 11, 1);
  width: 200px;
  font-size: 18px;
  font-weight: bold;
  color: #fff;
  letter-spacing: 2px;
  text-align: center;
  border: 1px solid#dbb03b;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.newsBox .moreBtn a {
  display: block;
  width: 100%;
  height: 100%;
  line-height: 50px;
}

.newsBox .moreBtn:hover,
.moreBtn a:focus {
  background-color: rgba(210, 157, 11, 0.7);
}


/* ツイート読み込み */

.twitterBox {
  width: 90%;
  padding: 10px;
  margin: 0 auto;
  border-radius: 20px;
  border: 1px solid#333;
  overflow: hidden;
}



.twitterContent {
  margin-bottom: 80px;
  width: 100%;
}


/* トレイラー */

.homeBox .trailerContent {
  width: 70%;
  margin: 0 auto;
  padding: 40px 10px 80px;
}

.homeBox .trailerBox {
  width: 100%;
}

.homeBox .trailerTitle {
  text-align: center;
}

.homeBox .trailerVideo {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}

.homeBox .trailerVideo iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}


/*　キャストコメント　*/

.comment {
  text-align: center;
}

.comment .name {
  display: block;
}

.comment .box .fl {
  width: 200px;
}


/* 背景 */

#canvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -999;
}

.newsContent {
  margin-bottom: 80px;
}

.newNews {
  background-image: url(../img/new.png);
  background-repeat: no-repeat;
  width: 50px;
}

#home {
  background-image: none;
}

#home .mainBox {
  display: flex;
  justify-content: space-between;
}

#home .mainBox section {
  width: 50%;
}


/*ーーーーーーーーーーーーー
 ニュースページ
 ーーーーーーーーーーーーー*/

#news .content {
  border: none;
}

.newspageContent {
  width: 100%;
  margin: 0 auto;
  padding: 40px 10px 50px;
}

.newspageBox ul.item {
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
}

.newspageBox ul.item li {
  box-sizing: border-box;
  margin: 10px;
  width: calc(100% - 20px);
  background-color: #333;
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
  padding: 20px;
  position: relative;
}

.newspageBox ul.item li a:hover,
.newspageBox ul.item li a:hover img {
  opacity: 0.7;
}

.newspageBox ul.item li a {
  color: #fff;
}

.newspageBox ul.item li .more {
  position: absolute;
  bottom: 10px;
  right: 10px;
}

.newspageBox ul.item li img {
  display: block;
  width: 100%;
}

.newspageBox ul.item li a.banner {
  display: inline-block;
  vertical-align: middle;
  margin: 5px;
}

.newspageBox ul.item li a.banner img {
  max-width: 200px;
}

.newspageBox ul.item li h3 {
  font-size: 16px;
}

.newspageBox ul.item li.theater h3 {
  color: #ff5e5e;
}

.newspageBox ul.item li.event h3 {
  color: #5effbb;
}

.newspageBox ul.item li.radio h3 {
  color: #ffeb52;
}

.newspageBox ul.item li.goods h3 {
  color: #ff5eff;
}

.newspageBox ul.item li.info h3 {
  color: #5e9cff;
}

.newspageBox ul.item li p {
  margin: 10px auto;
  padding-bottom: 10px;
  color: #fff;
  font-size: 14px;
}

.newspageBox ul.item li p .center {
  display: block;
  text-align: center;
}

.newspageBox ul.item li figure {
  display: block;
  margin-top: 10px;
  margin-bottom: 10px;
}

.newspageBox ul.item li figure figcaption {
  font-size: 12px;
  color: #fff;
  text-align: center;
  margin-top: 5px;
}

.newspageBox ul.item li figure img {
  max-width: 560px;
  height: auto;
  width: 100%;
  margin: 0 auto;
}

.newspageContent .newsCategory {
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 0 30px 0 5px;
}

.newspageContent .newsCategory ul {
  display: flex;
  flex-wrap: wrap;
}

.newspageContent .newsCategory ul li {
  flex: 1;
  text-align: center;
  border-right: 1px solid #000;
}

.newspageContent .newsCategory ul li:last-child {
  border: none;
}

.newspageContent .newsCategory ul li a {
  color: #000;
  display: block;
}

.newspageContent .newsCategory ul li:nth-child(2) a {
  color: #5e9cff;
}

.newspageContent .newsCategory ul li:nth-child(3) a {
  color: #ff5eff;
}

.newspageContent .newsCategory ul li:nth-child(4) a {
  color: #5effbb;
}

.newspageContent .newsCategory ul li:nth-child(5) a {
  color: #ff5e5e;
}

.newspageContent .newsCategory ul li:nth-child(6) a {
  color: #ffeb52;
}

.newspageContent .newsCategory ul li a:hover {
  color: #f00;
}

#news.news-all .newspageContent .newsCategory ul li:nth-child(1) a {
  cursor: default;
  pointer-events: none;
  font-weight: bold;
}

#news.news-info .newspageContent .newsCategory ul li:nth-child(2) a {
  cursor: default;
  pointer-events: none;
  font-weight: bold;
}

#news.news-goods .newspageContent .newsCategory ul li:nth-child(3) a {
  cursor: default;
  pointer-events: none;
  font-weight: bold;
}

#news.news-event .newspageContent .newsCategory ul li:nth-child(4) a {
  cursor: default;
  pointer-events: none;
  font-weight: bold;
}

#news.news-theater .newspageContent .newsCategory ul li:nth-child(5) a {
  cursor: default;
  pointer-events: none;
  font-weight: bold;
}

#news.news-radio .newspageContent .newsCategory ul li:nth-child(6) a {
  cursor: default;
  pointer-events: none;
  font-weight: bold;
}


/*ーーーーーーーーーーーーー
 各ニュースページ
 ーーーーーーーーーーーーー*/

/*　見出し　*/

.heading {
  padding: 10px 0;
  margin-bottom: 20px;
  background: #ffffff;
  /* Old browsers */
  overflow: hidden;
  background: -moz-linear-gradient(left, #ffffff 0%, #e95098 22%, #e95098 80%, #ffffff 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #ffffff 0%, #e95098 22%, #e95098 80%, #ffffff 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #ffffff 0%, #e95098 22%, #e95098 80%, #ffffff 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff', GradientType=1);
}

.heading h3 {
  display: flex;
  justify-content: center;
  width: 80%;
  margin: 0 auto;
  align-items: center;
  text-align: center;
  font-size: 18px;
  color: #fff;
}


/*　ニュース詳細ページ共通　*/

.infoBox strong {
  display: block;
  margin-bottom: 10px;
  text-align: center;
}

.infoBox .item {
  width: 90%;
  margin: 0 auto 30px;
}

.infoBox .item tr {
  border-bottom: 1px solid #000;
  margin-bottom: 10px;
}

.infoBox .item tr:nth-child(5) {
  border-bottom: none;
}

.infoBox .item tr td {
  padding: 10px;
}

.infoBox .item tr td:nth-child(1) {
  font-weight: bold;
}

.infoBox .item tr td:nth-child(2) {
  max-width: 600px;
}

.infoBox .item tr td.full {
  width: 100%;
}

.infoBox .item tr td a {
  color: #000;
}

.infoBox .item tr td img {
  display: block;
  margin: 0 auto;
  padding: 10px 0;
  width: 80%;
}

.infoBox h4 {
  padding: 10px;
  margin-bottom: 20px;
  text-align: center;
  color: #e95098;
  font-size: 18px;
  border-bottom: double #e95098;
  border-top: double #e95098;
}

.infoBox figure {
  display: block;
  margin-top: 20px;
  margin-bottom: 20px;
}

.infoBox figure img {
  max-width: 560px;
  height: auto;
  width: 100%;
  margin: 0 auto;
  display: block;
  border: 1px solid #000;
}

.infoBox figure figcaption {
  font-size: 12px;
  text-align: center;
  margin-top: 5px;
}

.infoBox .caution {
  font-size: 14px;
}


/* ニュース・agfページ */

.infoBox .boxImg.wide {
  width: 70%;
  margin: 0 auto 30px;
}

.infoBox .boxText li {
  margin-bottom: 10px;
}

.infoBox ul.boxText2 li {
  margin-left: 10px;
  list-style-type: disc;
}


/* ニュース・ポスター完成ページ */

.newsImgbox {
  width: 100%;
}

.newsImgbox img {
  width: 100%;
}


/*ーーーーーーーーーーーーー
 ストーリーページ
 ーーーーーーーーーーーーー*/

.storyBox {
  margin-bottom: 20px;
}

.storyText p {
  text-align: left;
}


/*ーーーーーーーーーーーーー
 ラジオページ
 ーーーーーーーーーーーーー*/

.radioBox {
  margin-bottom: 20px;
}

.radioText p {
  text-align: left;
}


/*ーーーーーーーーーーーーー
 イントロページ
 ーーーーーーーーーーーーー*/

.introText p {
  text-align: left;
}


/*ーーーーーーーーーーーーー
 アバウトページ
 ーーーーーーーーーーーーー*/

.aboutText p {
  text-align: left;
}

#about #staff h3 {
  text-align: center;
  line-height: 3rem;
}


/*ーーーーーーーーーーーーー
 キャストページ 
 ーーーーーーーーーーーーー*/

body#cast {
  background: none;
}

#cast .content {
  max-width: 100%;
  border: none;
}

#cast .contentTitle {
  margin-bottom: 60px;
}

#cast .inner .title {
  background-color: #fff;
  text-align: center;
  margin-bottom: 50px;
  position: relative;
}

#cast .inner .title h1 {
  position: relative;
  display: none;
}

#cast .inner .title h1 .logo-3m {
  position: absolute;
  left: 50%;
  bottom: 3%;
  margin-left: calc(-26% - 115px);
  transition: all .2s ease-out;
}

#cast .inner .title h1 .logo-3m.fw {
  margin-left: -1000px;
}

#cast .inner .title h1 .logo-xip {
  position: absolute;
  left: 50%;
  bottom: 3%;
  margin-left: calc(26% - 108px);
  transition: all .2s ease-out;
}

#cast .inner .title h1 .logo-xip.fw {
  margin-left: 1000px;
}

#cast .inner .title:before {
  content: "";
  position: absolute;
  display: block;
  width: 50%;
  height: 100%;
  top: 0;
  right: 0;
  background-color: #000;
}

#cast .inner {
  width: 100%;
}

#cast h1 {
  max-width: 1000px;
  margin: 0 auto;
}

#cast #staff .list-mv07 {
  background: rgba(255, 255, 255, 0.6);
  margin-bottom: 0;
}

#cast #staff h3 {
  text-align: center;
  line-height: 3rem;
}

#cast .textBox {
  padding: 10px 0;
}

#cast p.nameBox {
  font-size: 12px;
  margin-bottom: 20px;
}

#cast p.textarea {
  font-size: 15px;
}

.inner img.castgazo {
  max-width: 100%;
  margin-bottom: -7px;
}

#cast .sns_icon img {
  width: 40px;
  margin: 0 3px;
}

#cast .list-mv07 .char {
  display: flex;
  color: #fff;
  max-width: 1000px;
  margin: 0 auto;
  height: 250px;
}

#cast .list-mv07 .char .gazo {
  flex: 1;
  width: auto;
  position: relative;
  height: 250px;
}

#cast .list-mv07 {
  position: relative;
}

#cast .list-mv07:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  display: block;
  background-size: auto 100%;
  background-repeat: no-repeat;
  opacity: .4;
  background-position: center center;
}

#cast .list-mv07:nth-child(1) {
  background: #4dbdd9;
}

#cast .list-mv07:nth-child(1):before {
  background-image: url('../img/cast-01-bk.png');
  left: -32%;
}

#cast .list-mv07:nth-child(2) {
  background: #b9b9b9;
}

#cast .list-mv07:nth-child(2):before {
  background-image: url('../img/cast-02-bk.png');
  left: -30%;
}

#cast .list-mv07:nth-child(3) {
  background: #d04c4c;
}

#cast .list-mv07:nth-child(3):before {
  background-image: url('../img/cast-03-bk.png');
  left: -21%;
}

#cast .list-mv07:nth-child(4) {
  background: #4c4cd3;
}

#cast .list-mv07:nth-child(4):before {
  background-image: url('../img/cast-04-bk.png');
  left: 37%;
}

#cast .list-mv07:nth-child(5) {
  background: #c7c051;
}

#cast .list-mv07:nth-child(5):before {
  background-image: url('../img/cast-05-bk.png');
  left: 34%;
}

#cast .list-mv07:nth-child(6) {
  background: #a865e2;
}

#cast .list-mv07:nth-child(6):before {
  background-image: url('../img/cast-06-bk.png');
  left: 29%;
}

#cast .list-mv07 .char .gazo img {
  position: absolute;
  right: 2%;
  bottom: 0;
  margin: 0;
  width: auto;
  height: auto;
}

#cast .list-mv07 .char .gazo.right img {
  right: inherit;
  left: 2%;
}

#cast .list-mv07 .textBox {
  width: auto;
  padding: 2%;
  flex: 1;
}

#cast .list-mv07 {
  height: 250px;
}

#cast .castContent {
  overflow: hidden;
}

/*ーーーーーーーーーーーーー
 スタッフ
 ーーーーーーーーーーーーー*/

#staff {
  width: 100%;
  margin-bottom: 80px;
  padding-top: 100px;
}


/* キャストページ・スタッフ　　フェードイン用部分 */

.fadeInLeft {
  -webkit-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 1s;
  -ms-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
  visibility: visible !important;
}

.list-mv07 {
  opacity: 0;
  transform: translate3d(-100%, 0, 0);
  list-style: none;
  width: 100%;
  margin-bottom: 100px;
  position: relative;
}

.list-mv07:nth-child(1) {
  background: rgba(2, 161, 201, 0.7);
}

.list-mv07:nth-child(2) {
  background: rgba(178, 178, 178, 0.9);
}

.list-mv07:nth-child(3) {
  background: rgba(188, 0, 0, 0.7);
}

.list-mv07:nth-child(4) {
  background: rgba(0, 0, 192, 0.7);
}

.list-mv07:nth-child(5) {
  background: rgba(175, 165, 8, 0.7);
}

.list-mv07:nth-child(6) {
  background: rgba(132, 36, 214, 0.7);
}

.list-mv07 img {
  max-width: 400px;
}

.list-mv07 .char .gazo {
  width: 30%;
}

.list-mv07 .char .gazo img {
  margin-top: -35px;
  margin-bottom: -7px;
  width: 180px;
}

.list-mv07 .char {
  display: flex;
  color: #fff;
  max-width: 700px;
  margin: 0 auto;
}

.list-mv07 .textBox {
  width: 65%;
  padding: 2%;
  background: none;
  /*float: right;*/
}

#animation {
  margin: 50px 0;
  font-size: 40px;
  font-weight: bold;
  color: #ff0000;
}

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100px);
    -ms-transform: translateX(-100px);
    transform: translateX(-100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}


/*ーーーーーーーーーーーーー
 トレイラーページ
 ーーーーーーーーーーーーー*/

.trailerContent {
  width: 70%;
  margin: 0 auto;
  padding: 40px 10px 80px;
}

.trailerContent .trailerBox {
  width: 100%;
}

.trailerContent .trailerTitle {
  text-align: center;
}

.trailerContent .trailerVideo {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}

.trailerContent .trailerVideo iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.trailerContent .trailerBox .item {
  margin-bottom: 50px;
}


/*ーーーーーーーーーーーーー
 ストリーページ
 ーーーーーーーーーーーーー*/

.storyImg {
  width: 100%;
  margin: 0 auto;
}

.storyImg img {
  width: 100%;
}

.text {
  padding: 10px 0;
  background: #f6ef90;
  background: -moz-linear-gradient(left, #f6ef90 1%, #f6de6f 51%, #d7a933 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #f6ef90 1%, #f6de6f 51%, #d7a933 100%);
  background: linear-gradient(to right, #f6ef90 1%, #f6de6f 51%, #d7a933 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6ef90', endColorstr='#d7a933', GradientType=1);
  /* IE6-9 */
}

.text h3 {
  color: #ff3491;
  letter-spacing: 10px;
}

.text h3 img {
  max-width: 600px;
  vertical-align: bottom;
}


/*ーーーーーーーーーーーーー
劇場ページ
 ーーーーーーーーーーーーー*/

.theaterBox .item {
  width: 100%;
  background-color: rgba(233, 80, 152, 0.7);
  color: #fff;
}

.theaterBox .item li p {
  width: 54%;
  padding: 0;
  text-align: left;
}

.theaterBox .item li p:nth-child(1) {
  width: 23%;
  text-align: center;
}

.theaterBox .item li p:nth-child(2) {
  width: 46%;
}

.theaterBox .item li p:nth-child(3) {
  width: 22%;
}

.theaterBox .item li p:nth-child(4) {
  width: 9%;
}

.theaterBox a {
  display: block;
  line-height: 3.8;
  color: #333;
}

.theaterBox a:hover {
  color: #f00;
}

.theaterBox h2 {
  float: left;
  clear: both;
  box-sizing: border-box;
  border-top: 3px solid rgba(233, 80, 152, 0.7);
  width: 23%;
  height: 100%;
  padding-left: 2%;
  line-height: 3;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  letter-spacing: 10px;
}

.theaterBox ul:first-child {
  height: 50px;
  border-top: none;
}

.theaterBox ul:first-child li {
  line-height: 50px;
}

.theaterBox h2.last,
.theaterBox ul.last {
  border-bottom: 3px solid rgba(233, 80, 152, 0.7);
}

.theaterBox li p {
  float: left;
  box-sizing: border-box;
  width: 60%;
  margin-bottom: 0;
}

.theaterContent .contentCaution {
  margin-bottom: 20px;
  text-align: center;
}

.theaterContent .contentCaution h3 {
  margin-bottom: 5px;
}

.theaterContent .contentCaution ul {
  display: inline-block;
}

.theaterContent .contentCaution ul li {
  text-align: left;
  font-size: 14px;
}

.theaterContent .theaterAbout figure {
  padding: 30px 20px;
}

.theaterContent .theaterAbout figure img {
  max-width: 100%;
  height: auto;
}

.theaterContent .contentCaution .caution {
  margin-top: 10px;
  display: block;
  font-size: 14px;
}

.theaterContent .normal {
  color: #4200FF;
  margin-left: 5px;
}

.theaterContent .tokimeki {
  color: #FF0090;
  margin-left: 5px;
}

.theaterContent .end {
  color: #f00;
  margin-left: 5px;
  font-size: 12px;
  line-height: 1.4;
  display: block;
  line-height: 60px;
}

.theaterContent .end br {
  display: none;
}

.theaterContent .theaterAbout {
  padding-top: 20px;
}

.theaterContent .theaterAbout a {
  color: #000;
}

.theaterContent .theaterAbout a:hover {
  color: #f00;
}

.theaterBox li p.tel {
  width: 25%;
}

.theaterBox li p.type {
  width: 15%;
  line-height: 3.8;
  text-align: center;
}

.theaterBox li div.type-plus {
  width: 15%;
  float: left;
}

.theaterBox li div.type-plus > div {}

.theaterBox li div.type-plus > div .type,
.theaterBox li div.type-plus > div .end {
  line-height: 30px;
  float: none;
  text-align: center;
  width: 100%;
}

.theaterBox li div.type-plus > div .type span {}

.theaterBox ul {
  float: left;
  width: 77%;
  border-top: 3px solid rgba(233, 80, 152, 0.7);
  ;
}

.theaterBox ul li {
  height: 100%;
  line-height: 2;
  text-align: left;
}

.theaterAbout h3 {
  margin-bottom: 5px;
}

.theaterAbout p.caution {
  font-size: 14px;
}

.theatertokuten {
  padding-top: 0 !important;
}

.theatertokuten > section {
  margin-bottom: 40px;
}

.theatertokuten .contenttitle {
  margin-bottom: 10px;
}

.theatertokuten .contenttitle h2 img {
  position: static;
  width: 100px;
}

.theatertokuten > section > section {
  margin-bottom: 30px;
}

.theatertokuten section h3 {
  color: rgba(233, 80, 152, 0.7);
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 20px;
}

.theatertokuten section p {
  margin-bottom: 20px;
}

.theatertokuten section ul {
  padding-left: 2%;
}

.theatertokuten section ul li h4 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 20px;
}

.theatertokuten section ul li {
  margin-bottom: 20px;
}

.theatertokuten section ul li figure {
  padding-right: 2%;
}

.theatertokuten section ul li figure img {
  max-width: 100%;
  height: auto;
}

.theatertokuten section .title {
  display: block;
  margin-bottom: 5px;
}


/*ーーーーーーーーーーーーー
マナーページ
 ーーーーーーーーーーーーー*/

.mannersBox .item {
  width: 100%;
  background-color: rgba(233, 80, 152, 0.7);
  color: #fff;
}

.mannersBox .item li p {
  width: 54%;
  padding: 0;
  text-align: left;
}

.mannersContent .mannersAbout figure {
  padding: 30px 20px;
}

.mannersContent .mannersAbout figure img {
  max-width: 100%;
  height: auto;
}


/*ーーーーーーーーーーーーー
スペシャルページ
 ーーーーーーーーーーーーー*/

.specialContent > section {
  margin-bottom: 40px;
}

.specialContent .contenttitle {
  margin-bottom: 20px;
}

.specialContent .contenttitle h2 img {
  position: static;
  width: 30%;
}

.specialContent > section > section {
  margin-bottom: 30px;
}

.specialContent .contenttitle {
  margin-bottom: 10px;
}

.specialContent .contenttitle h2 img {
  position: static;
  width: 100px;
}

.specialContent section h3 {
  color: rgba(233, 80, 152, 0.7);
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 20px;
}

.specialContent section p {
  margin-bottom: 20px;
}

.specialContent section ul {
  padding-left: 2%;
}

.specialContent section ul li h4 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 20px;
}

.specialContent section ul li {
  margin-bottom: 20px;
}

.specialContent section ul li figure {
  padding-right: 2%;
}

.specialContent section ul li figure img {
  max-width: 100%;
  height: auto;
}

.specialContent section .title {
  display: block;
  margin-bottom: 5px;
}

.specialContent #ticketlist {
  padding: 30px 0;
}

.specialContent #ticketlist table {
  width: 100%;
  border: 1px solid rgba(233, 80, 152, 0.15);
}

.specialContent #ticketlist table tr {
  border: 1px solid rgba(233, 80, 152, 0.15);
}

.specialContent #ticketlist table tr:first-child {
  background: rgba(233, 80, 152, 0.2);
}

.specialContent #ticketlist table tr th,
.specialContent #ticketlist table tr td {
  padding: 10px 15px;
}

.specialContent #ticketlist table tr th {
  font-size: 0;
}

.specialContent #ticketlist table tr td {
  font-size: 16px;
  white-space: nowrap;
}

.specialContent #ticketlist table tr.end th,
.specialContent #ticketlist table tr.end td {
  background-color: #ccc;
}

.specialContent #ticketlist table tr.end td:last-child {
  color: red;
}

.specialContent #ticketlist table tr th .price {
  display: inline-block;
  font-size: 14px;
  width: 75%;
  vertical-align: middle;
}

.specialContent #ticketlist table tr:first-child th .price,
.specialContent #ticketlist table tr:first-child th .name,
.specialContent #ticketlist table tr:first-child td {
  font-size: 18px;
  color: rgba(233, 80, 152, 0.7);
  font-weight: bold;
  tac
}

.specialContent #ticketlist table tr th .name {
  display: inline-block;
  font-size: 14px;
  width: 25%;
  vertical-align: middle;
}

.specialContent #ticketlist table tr th .name a {
  text-decoration: underline;
  color: #333;
}

.specialContent .ticketBox .ticketTable {
  padding: 10px;
}




/*ーーーーーーーーーーーーー
コメントページ
 ーーーーーーーーーーーーー*/

.commentContent > section {
  margin-bottom: 40px;
}

.commentContent .contenttitle {
  margin-bottom: 20px;
}

.commentContent .contenttitle h2 img {
  position: static;
  width: 30%;
}

.commentContent > section > section {
  margin-bottom: 30px;
}

.commentContent .contenttitle {
  margin-bottom: 10px;
}

.commentContent .contenttitle h2 img {
  position: static;
  width: 100px;
}

.commentContent section h3 {
  color: rgba(233, 80, 152, 0.7);
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 20px;
}

.commentContent section p {
  margin-bottom: 20px;
  line-height: 2;
}

.commentContent section ul {
  padding-left: 2%;
}

.commentContent section ul li h4 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 20px;
}

.commentContent section ul li {
  margin-bottom: 20px;
}

.commentContent section ul li figure {
  padding-right: 2%;
}

.commentContent section ul li figure img {
  max-width: 100%;
  height: auto;
}

.commentContent section .title {
  display: block;
  margin-bottom: 5px;
}


/*ーーーーーーーーーーーーー
グッズページ
 ーーーーーーーーーーーーー*/

.goodsContent > section {
  margin-bottom: 40px;
}

.goodsContent .contenttitle {
  margin-bottom: 20px;
}

.goodsContent .contenttitle h2 img {
  position: static;
  width: 30%;
}

.goodsContent > section > section {
  margin-bottom: 30px;
}

.goodsContent .contenttitle {
  margin-bottom: 10px;
}

.goodsContent .contenttitle h2 img {
  position: static;
  width: 100px;
}

.goodsContent .goodsBox {
  margin-bottom: 60px;
}

.goodsContent .goodsBox .dx {
  background: rgba(243, 154, 196, 0.33);
  padding: 1px 10px;
  border-radius: 6px;
  margin-bottom: 20px;
}

.goodsContent .goodsBox h3 {
  color: rgba(233, 80, 152, 0.7);
  font-size: 24px;
  font-weight: bold;
}

.goodsContent .goodsBox h4 {
  font-size: 18px;
  text-align: center;
  margin-bottom: 20px;
  margin-top: 40px;
  font-weight: bold;
  1
}

.goodsContent .goodsBox .figureBox {
  text-align: center;
  margin: 20px 0;
  font-size: 0;
}

.goodsContent .goodsBox .figureBox figure {
  display: inline-block;
  vertical-align: bottom;
  padding: 5px 10px;
}

.goodsContent .goodsBox .figureBox figure img {
  max-width: 100%;
  height: auto;
  border: 1px solid #000;
  display: block;
}

.goodsContent .goodsBox .figureBox figure figcaption {
  font-size: 14px;
  margin-top: 10px;
}

.goodsContent .goodsBox#pamphlet .figureBox figure img {
  height: 360px;
  width: auto;
}

.goodsContent .goodsBox#pamphlet .figureBox:nth-last-of-type(1) figure img {
  height: 360px;
}

.goodsContent .goodsBox#pamphlet2 .figureBox figure img {
  height: 360px;
  width: auto;
}

.goodsContent .goodsBox#pamphlet2 .figureBox:nth-last-of-type(1) figure img {
  height: 240px;
}

.goodsContent .goodsBox table {
  width: 100%;
  border: 1px solid rgba(233, 80, 152, 0.15);
}

.goodsContent .goodsBox table tbody tr th,
.goodsContent .goodsBox table tbody tr td {
  padding: 10px 15px;
  font-size: 14px;
  border: 1px solid rgba(233, 80, 152, 0.15);
}

.goodsContent .goodsBox table tbody tr th {
  text-align: center;
  width: 20%;
}

.goodsContent .goodsBox table tbody tr td span {
  display: inline-block;
  text-align: right;
  /*  width: 6em;*/
}

.goodsContent .goodsBox table tbody tr td span.tm {
  /*  width: 8em;*/
  text-align: right;
}

.goodsContent .goodsBox p {
  margin-bottom: 20px;
}

.goodsContent #goodslist {
  margin-bottom: 40px;
}

.goodsContent #goodslist table {
  width: 100%;
  border: 1px solid rgba(233, 80, 152, 0.15);
}

.goodsContent #goodslist table tr {
  border: 1px solid rgba(233, 80, 152, 0.15);
}

.goodsContent #goodslist table tr:first-child {
  background: rgba(233, 80, 152, 0.2);
}

.goodsContent #goodslist table tr th,
.goodsContent #goodslist table tr td {
  padding: 10px 15px;
}

.goodsContent #goodslist table tr th {
  font-size: 0;
}

.goodsContent #goodslist table tr td {
  font-size: 16px;
  white-space: nowrap;
}

.goodsContent #goodslist table tr.end th,
.goodsContent #goodslist table tr.end td {
  background-color: #ccc;
}

.goodsContent #goodslist table tr.end td:last-child {
  color: red;
}

.goodsContent #goodslist table tr th .price {
  display: inline-block;
  font-size: 14px;
  width: 35%;
  vertical-align: middle;
}

.goodsContent #goodslist table tr:first-child th .price,
.goodsContent #goodslist table tr:first-child th .name,
.goodsContent #goodslist table tr:first-child td {
  font-size: 18px;
  color: rgba(233, 80, 152, 0.7);
  font-weight: bold;
}

.goodsContent #goodslist table tr th .name {
  display: inline-block;
  font-size: 14px;
  width: 100%;
  vertical-align: middle;
}

.goodsContent #goodslist table tr th .name a {
  text-decoration: underline;
  color: #333;
}

.goodsContent .goodsBox .goods-b {
  display: block;
  border: 1px solid #ff74bb;
}

.goodsContent .goodsBox .goods-b:hover {
  border: 1px solid #f00;
}

.goodsContent .goodsBox .goods-b img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}

/*ーーーーーーーーーーーーー
チケットページ
 ーーーーーーーーーーーーー*/

.ticketBox {
  width: 100%;
  margin: 0 auto 40px;
  box-sizing: border-box;
  padding: 10px 20px;
  border-radius: 20px;
  border: 10px solid rgba(233, 80, 152, 0.15);
  background: rgba(233, 80, 152, 0.2);
}

.ticketContent .ticketBox {
  border: 10px solid rgba(80, 80, 80, 0.15);
  background: rgba(80, 80, 80, 0.2);
}

.ticketBox p {
  text-align: left;
}

.ticketBox a img {
  margin-top: 10px;
}

.ticketBox a {
  color: #000;
  text-decoration: underline;
}

.ticketBox a img {
  max-width: 500px;
  border: 1px solid #333;
}

.ticketBox .boxImg {
  width: 50%;
  margin: 0 auto;
}

.ticketBox .boxImg.small {
  width: 180px;
  margin: 0 auto;
}

.ticketBox .boxImg.wide {
  width: 65%;
  margin: 0 auto 30px;
}

.ticketBox .boxText li {
  margin-bottom: 10px;
}

.ticketBox ul.boxText2 li {
  margin-left: 10px;
  list-style-type: disc;
}

.ticketContent #group .boxImg {
  width: 100%;
  text-align: center;
}

.ticketContent .boxText .center {
  text-align: center;
}

.ticketContent #group .boxImg img {
  width: 45%;
  padding: 10px 0;
}

.ticketContent #ticketlist table {
  width: 100%;
  border: 1px solid rgba(233, 80, 152, 0.15);
}

.ticketContent #ticketlist table tr {
  border: 1px solid rgba(233, 80, 152, 0.15);
}

.ticketContent #ticketlist table tr:first-child {
  background: rgba(233, 80, 152, 0.2);
}

.ticketContent #ticketlist table tr th,
.ticketContent #ticketlist table tr td {
  padding: 10px 15px;
}

.ticketContent #ticketlist table tr th {
  font-size: 0;
}

.ticketContent #ticketlist table tr td {
  font-size: 16px;
  white-space: nowrap;
}

.ticketContent #ticketlist table tr.end th,
.ticketContent #ticketlist table tr.end td {
  background-color: #ccc;
}

.ticketContent #ticketlist table tr.end td:last-child {
  color: red;
}

.ticketContent #ticketlist table tr th .price {
  display: inline-block;
  font-size: 14px;
  width: 35%;
  vertical-align: middle;
}

.ticketContent #ticketlist table tr:first-child th .price,
.ticketContent #ticketlist table tr:first-child th .name,
.ticketContent #ticketlist table tr:first-child td {
  font-size: 18px;
  color: rgba(233, 80, 152, 0.7);
  font-weight: bold;
}

.ticketContent #ticketlist table tr th .name {
  display: inline-block;
  font-size: 14px;
  width: 65%;
  vertical-align: middle;
}

.ticketContent #ticketlist table tr th .name a {
  text-decoration: underline;
  color: #333;
}

.ticketContent .ticketBox .ticketTable {
  padding: 10px;
}

.ticketContent .ticketBox .ticketTable table tr th,
.ticketContent .ticketBox .ticketTable table tr td {
  padding: 5px;
  vertical-align: top;
}

.ticketContent .ticketBox .ticketTable table tr td span {
  display: inline-block;
  margin-left: 5px;
}

.ticketContent .ticketBox .ticketTable table tr th {
  font-weight: bold;
  white-space: nowrap;
}

.ticketContent .ticketBox .ticketTable table tr td a {
  margin-left: 10px;
}

.ticketContent .ticketBox p.caution {
  font-size: 14px;
  margin-top: 20px;
}

.ticketContent .ticketSlider .slick div a img {
  max-width: 100%;
  height: auto;
}

.ticketContent .ticketSlider .slick-dots li.slick-active button:before {
  color: rgba(233, 80, 152, 0.7);
}

.ticketContent .ticketSlider {
  margin-bottom: 50px;
}


/*ーーーーーーーーーーーーー
 ラジオページ
 ーーーーーーーーーーーーー*/

.radioContent .radioTitle h3 {
  margin-bottom: 0;
}

.radioContent .radioTitle p {
  margin-bottom: 30px;
  text-align: center;
}

.radioContent .radioTitle h3 img {
  max-width: 700px;
  height: auto;
  margin: 0 auto;
  margin-top: -50px;
  margin-bottom: -40px;
}

.radioContent .radioTitle h3.djcd img {
  max-width: 500px;
  margin-bottom: -20px;
}

.radioContent .radioTitle h3.djcd-back img {
  margin-bottom: 0px;
  margin-top: 0px;
}

.radioContent .radioTitle h3.djcd-about img {
  max-width: 400px;
  margin-bottom: -20px;
}

.radioContent h4 {
  font-size: 24px;
  font-weight: bold;
  color: rgba(233, 80, 152, 0.7);
  text-align: center;
  margin-bottom: 20px;
}

.radioContent h4.djcd {
  color: #000;
}

.radioContent h4.djcd + p {
  text-align: left;
}

.radioContent .radioPerson {
  font-size: 0;
  margin-bottom: 20px;
}

.radioContent .radioPerson.djcd {
  background: #f39ac4;
  padding: 30px;
  border-radius: 20px;
}

.radioContent .radioPerson > div {
  display: inline-block;
  vertical-align: bottom;
  width: 50%;
  text-align: center;
  box-sizing: border-box;
  padding: 0 0.5%;
}

.radioContent .radioPerson > div img {
  max-width: 100%;
  height: auto;
}

.radioContent .radioPerson > div figcaption {
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 1px;
  color: #333;
  text-align: center;
}

.radioContent .radioPerson > div p {
  font-size: 16px;
  text-align: center;
  margin-bottom: 10px;
}

.radioContent .radioPerson > .caption {
  font-size: initial;
  margin-top: 10px;
}

.radioContent .radioPerson > div p.cv {
  font-size: 14px;
  text-align: left;
  display: inline-block;
  margin-top: 10px;
}

.radioContent .radioPerson > div p.cv.djcd {
  text-align: center;
  font-weight: bold;
  font-size: 20px;
}

.radioContent .radioPerson > div p.cv span {
  width: 6em;
  display: inline-block;
}

.radioContent .radioPerson + p.djcd {
  text-align: center;
  font-weight: bold;
  margin-bottom: 30px;
}

.radioContent .djcd-tokuten {
  margin-bottom: 40px;
}

.radioContent .djcd-tokuten h5 {
  font-size: 20px;
  margin-bottom: 10px;
  font-weight: bold;
}

.radioContent .djcd-tokuten h6 {
  font-size: 18px;
  margin-bottom: 10px;
  font-weight: bold;
}

.radioContent .djcd-tokuten h6 span {
  text-indent: 18px;
  display: inline-block;
  font-size: 14px;
  font-weight: normal;
}

.radioContent .djcd-tokuten table {
  margin-bottom: 30px;
}

.radioContent .djcd-tokuten table th {
  white-space: nowrap;
  padding: 10px;
  vertical-align: top;
}

.radioContent .djcd-tokuten table td {
  padding: 10px;
}

.radioContent .djcd-tokuten table td span {
  font-size: 14px;
}

.radioContent .djcd-tokuten table th span {
  display: inline-block;
  width: 4.5em;
}

.radioContent .djcd-tokuten .figure {
  text-align: center;
  font-size: 0;
  padding: 15px 0;
}

.radioContent .djcd-tokuten .figure p {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 10px;
}

.radioContent .djcd-tokuten p.caution {
  font-size: 14px;
  font-weight: normal;
  text-align: left;
  margin-top: 15px;
}

.radioContent .djcd-tokuten p.caution a {
  color: #000;
}

.radioContent .djcd-tokuten p.caution a:hover {
  text-decoration: underline;
}

.radioContent .djcd-tokuten figure {
  display: inline-block;
  max-width: 330px;
  width: 50%;
  vertical-align: middle;
}

.radioContent .djcd-tokuten .badge figure {
  max-width: 720px;
  width: 100%;
}

.radioContent .djcd-tokuten figure img {
  max-width: 100%;
  height: auto;
}

.radioContent hr.djcd {
  height: 2px;
  border-color: #000;
  margin-bottom: 60px;
}

.radioContent a.djcd {
  display: block;
  text-align: center;
  margin-top: 20px;
}

.radioContent a.djcd img {
  max-width: 100%;
  height: auto;
}

.radioContent .radioPlay {
  width: 100%;
  margin: 0 auto 40px;
  box-sizing: border-box;
  padding: 10px 20px;
  border-radius: 10px;
  border: 3px solid #e56ba5;
  background: #f39ac4;
  font-size: 0;
}

.radioContent .radioPlay .left p {}

.radioContent .radioPlay .left {
  font-size: 14px;
  color: #fff;
  display: inline-block;
  vertical-align: top;
  width: 62%;
  box-sizing: border-box;
  padding-right: 10px;
}

.radioContent .radioPlay .left div {
  display: block;
  padding: 10px;
  /*border:2px solid #fff;*/
  margin: 20px auto 0;
  border-radius: 10px;
  text-align: center;
  line-height: 1;
}

.radioContent .radioPlay .left div a {
  display: inline-block;
  vertical-align: middle;
  width: 30%;
  padding: 0 10px;
}

.radioContent .radioPlay .left div a img {
  max-width: 100%;
  height: auto;
}

.radioContent .radioPlay .left a:hover img {
  opacity: .7;
}

.radioContent .radioPlay .left h5 span {
  display: inline-block;
  font-size: 14px;
  float: right;
}

.radioContent .radioPlay .right {
  font-size: 14px;
  color: #fff;
  display: inline-block;
  vertical-align: top;
  width: 38%;
}

.radioContent .radioPlay .right figure img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
}

.radioContent .radioPlay .right h6 {
  font-size: 18px;
  text-align: center;
  margin-bottom: 5px;
  font-weight: bold;
  letter-spacing: 1px;
}

.radioContent .radioList li > div.sec h6 span:last-child {
  display: inline-block;
  float: right;
  margin-right: 0;
}

.radioContent .radioPlay .right .guestBox {
  font-size: 0;
  /*
	position: relative;
	margin-top: -5%;
	margin-left: 0;
	margin-bottom: 10px;*/
}

.radioContent .radioPlay .right .guestBox figure img {
  display: inline-block;
  width: 45%;
  height: auto;
  vertical-align: middle;
}

.radioContent .radioPlay .right .guestBox figure figcaption {
  display: inline-block;
  width: 55%;
  vertical-align: middle;
  font-size: 18px;
  color: #fff;
  font-weight: bold;
  box-sizing: border-box;
  padding-left: 10px;
}

.radioContent .radioPlay .right .guestBox figure figcaption span {
  display: block;
  font-size: 14px;
}

.radioContent .radioPlay .left h5 {
  font-size: 16px;
  margin-bottom: 10px;
  overflow: hidden;
}

.radioContent .radioPlay .left h5 span {
  display: inline-block;
  font-size: 14px;
  float: right;
}

.radioContent .radioList {
  margin-top: 50px;
}

.radioContent .release {
  margin-top: 50px;
}

.radioContent .radioList h5 {
  font-size: 24px;
  font-weight: bold;
  color: rgba(233, 80, 152, 0.7);
  text-align: center;
  margin-bottom: 10px;
}

.radioContent .radioList ul {
  border: 3px solid #888;
}

.radioContent .radioList li.back-w {
  background-color: #fff;
  color: #000;
}

.radioContent .radioList li.back-b {
  background-color: #000;
  color: #fff;
}

.radioContent .radioList li {
  display: table;
  width: 100%;
}

.radioContent .radioList li > div {
  display: inline-table;
  padding: 10px;
  vertical-align: middle;
}

.radioContent .radioList li > div.fst {
  width: 15%;
  text-align: center;
}

.radioContent .radioList li > div.fst h6 {
  width: 100%;
  padding-top: 100%;
  font-weight: bold;
  position: relative;
  border-radius: 50%;
  background-color: rgba(128, 128, 128, 0.5);
}

.radioContent .radioList li > div.fst h6 span {
  position: absolute;
  top: calc( 50% - 11px);
  left: 0;
  width: 100%;
  font-size: 16px;
}

.radioContent .radioList li > div.fst a {
  display: block;
  width: 100%;
  padding: 5px;
  background-color: rgba(0, 0, 0, 0.68);
  margin: 10px auto;
  border-radius: 6px;
  text-align: center;
  line-height: 1;
}

.radioContent .radioList li > div.fst a img {
  width: 40px;
  height: auto;
}

.radioContent .radioList li > div.fst a:hover img {
  opacity: .7;
}

.radioContent .radioList li > div.sec {
  width: 50%;
}

.radioContent .radioList li > div.sec h6 {
  font-size: 16px;
  margin-bottom: 6px;
  font-weight: bold;
}

.radioContent .radioList li > div.sec h6 span {
  margin-right: 5px;
}

.radioContent .radioList li > div.sec p {
  font-size: 14px;
}

.radioContent .radioList li > div.trd {
  width: 35%;
}

.radioContent .radioList li > div.trd figure {
  font-size: 0;
}

.radioContent .radioList li > div.trd figure img {
  display: inline-block;
  width: 60%;
  height: auto;
  vertical-align: middle;
}

.radioContent .radioList li > div.trd figure figcaption {
  display: inline-block;
  width: 40%;
  vertical-align: middle;
  font-size: 18px;
  font-weight: bold;
  box-sizing: border-box;
  padding-left: 10px;
}

.radioContent .radioList li > div.trd figure figcaption span {
  font-size: 14px;
  display: block;
}

.radioContent #release .release p a {
  color: #000;
}

.radioContent #release .release p a:hover {
  text-decoration: underline;
}


/* ディバイスサイズ　770px 〜 980px */

@media screen and (max-width: 980px) {
  body {
    background-size: contain;
  }
  /* ナビのツイッターボタン隠す */
  .snsbtnline {
    display: none !important;
  }
  /*ーーーーーーーーーーーーー
 トップページ
 ーーーーーーーーーーーーー*/
  /*キービジュアル*/
  .homeInner h3 {
    background-color: #e95098;
    height: 45px;
  }
  /* バナー */
  .homeInner .banner1 {
    position: absolute;
    bottom: 120%;
    left: 10px;
    max-width: 200px;
    width: 15%;
  }
  .homeInner .banner2 {
    position: absolute;
    bottom: 205%;
    left: 10px;
    text-align: center;
    max-width: 200px;
    width: 15%;
  }
  .homeInner .banner3 {
    position: absolute;
    bottom: 290%;
    left: 10px;
    text-align: center;
    max-width: 200px;
    width: 15%;
  }
  .homeInner .banner4 {
    position: absolute;
    bottom: 375%;
    left: 10px;
    text-align: center;
    max-width: 200px;
    width: 15%;
  }
  .homeInner .banner5 {
    position: absolute;
    bottom: 460%;
    left: 10px;
    text-align: center;
    max-width: 200px;
    width: 15%;
  }
  .homeInner .banner6 {
    position: absolute;
    bottom: 545%;
    left: 10px;
    text-align: center;
    max-width: 200px;
    width: 15%;
  }
  .homeInner .banner7 {
    position: absolute;
    bottom: 630%;
    left: 10px;
    text-align: center;
    max-width: 200px;
    width: 15%;
  }
  .homeInner .banner8 {
    position: absolute;
    bottom: 715%;
    left: 10px;
    text-align: center;
    max-width: 200px;
    width: 15%;
  }
  /*　ヘッダー下のニュース　*/
  .news .btn {
    margin-left: 0;
  }
  .ticker {
    width: 100%;
    padding-left: 0;
  }
}


/* ディバイスサイズ　641px 〜 769px */

@media screen and (max-width: 769px) {
  /*ーーーーーーーーーーーーー
 共通
 ーーーーーーーーーーーーー*/
  .sp {
    display: block !important;
  }
  .pc {
    display: none !important;
  }
  .content {
    display: block;
    border: none;
    background-color: rgba(255, 255, 255, 0.6);
  }
  .content .inner {
    width: 100%;
    padding: 0;
  }
  .inner img {
    width: 100%;
  }
  /* フッター */
  footer {
    line-height: 1.2;
    padding: 5px 0;
  }
  /* SNSボタン */
  .snsbtnline {
    position: static;
    width: 110px;
    margin: 50px auto;
  }
  /*--------- 見出し部分共通 ---------*/
  /* トップページキャストコメント */
  .comment h3,
  /*　イントロダクション　*/
  .introTitle h3,
  /*　ストーリー　*/
  .aboutTitle h3,
  /*　アバウト　*/
  .radioTitle h3,
  /* チケット */
  .storyTitle h3,
  /* ラジオ */
  .mannersTitle h3,
  /* ラジオ */
  .ticketTitle h3 {
    font-size: 20px;
    text-align: center;
    margin-bottom: 12px;
  }
  /*ーーーーーーーーーーーーー
 トップページ
 ーーーーーーーーーーーーー*/
  #home .mainBox section {
    width: 50%;
  }
  .homeBox .comment {
    margin: 0 auto;
  }
  .homeBox .comment > .wrap {
    display: block;
    width: 90%;
    margin: 0 auto;
  }
  .homeBox .wrap {
    display: inline-block;
    width: 100%;
    margin: 0 auto;
  }
  .homeBox .wrap .box {
    width: 100%;
    margin: 0 auto 30px;
  }
  .homeBox .wrap .box p {
    width: 100%;
  }
  .homeBox .wrap .box .wrap img {
    float: left;
    margin-right: 10px;
    width: 40%;
    height: auto;
  }
  /*トップムービーサイズ*/
  .sp .trailerContent {
    padding: 40px 10px 0;
  }
  /* バナー */
  .flotBox {
    width: 90%;
    margin: 0 auto;
  }

  .flotBox .banner {
    width: 49%;
    margin: 30px 1% 0 0;
    float: left;
  }
  .flotBox .banner2 {
    width: 49%;
    margin: 30px 0 0 1%;
    float: left;
  }
  .homeBox .banner img,
  .homeBox .banner2 img {
    width: 100%;
    margin-top: -20px;
    border: 1px solid #333;
  }
  /*  ディレクターコメント*/
  .homeBox .commentBox {
    width: 90%;
    margin: 10px auto 40px;
  }
  .homeBox .commentBox img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
  }
  /*キービジュアル*/
  .homeInner h1 img {
    max-width: 100%;
    margin: 0;
  }
  /* トレイラー */
  .homeBox .trailerContent {
    width: 90%;
    margin: 0 auto;
  }
  iframe.video {
    width: 60%;
    height: 280px;
    margin: 0 20% 50px;
  }
  /*ーーーーーーーーーーーーー
 キャストページ 
 ーーーーーーーーーーーーー*/
  #cast .title img {
    display: block;
    width: 100%;
    margin: 56px auto 0;
  }
  #cast .content > .inner {
    margin-top: 0;
  }
  @-webkit-keyframes active-menu-bar02 {
    100% {
      height: 0;
    }
  }
  @keyframes active-menu-bar02 {
    100% {
      height: 0;
    }
  }
  .menu-trigger.active span:nth-of-type(3) {
    -webkit-transform: translateY(-8px) rotate(45deg);
    transform: translateY(-8px) rotate(45deg);
  }
  /*ーーーーーーーーーーーーー
劇場ページ
 ーーーーーーーーーーーーー*/
  .theaterContent,
  .theatertokuten {
    width: 80%;
  }
  .theaterBox .item {
    display: none;
  }
  .theaterBox h2 {
    float: none;
    width: 100%;
    font-size: 16px;
    background-color: rgba(233, 80, 152, 0.7);
    border: none;
    color: #fff;
  }
  .theaterBox li p {
    width: 55%;
    font-size: 11px;
  }
  .theaterBox li p.tel {
    width: 30%;
    margin-left: 0;
    font-size: 11px;
  }
  .theaterBox li p.type {
    width: 15%;
    margin-left: 0;
    margin-top: 10px;
  }
  .theaterBox li p.type span {
    margin: 0;
  }
  .theaterBox li div.type-plus span.end {
    margin-top: 5px;
  }
  .theaterBox li div.type-plus span.end,
  .theaterBox li div.type-plus p.type {
    font-size: 10px;
    line-height: 10px;
    padding: 0;

  }
  .theaterBox li p.type span.end {
    font-size: 10px;
    line-height: 20px;
    padding: 0;
  }
  .theaterBox li p.type span.end br {
    display: block;
  }
  .theaterBox ul {
    float: none;
    width: 100%;
    border: none;
  }
  .theaterBox h2.last,
  .theaterBox ul.last {
    border: none;
  }
  .theatertokuten section h3 {
    font-size: 20px;
  }
  .theatertokuten section ul {
    padding-left: 0;
  }
  .theatertokuten section ul li figure {
    padding-right: 0;
  }
  .theaterContent .theaterAbout figure {
    padding: 20px 0;
  }
  /*ーーーーーーーーーーーーー
マナーページ
 ーーーーーーーーーーーーー*/
  .mannersContent .theaterAbout figure {
    padding: 20px 0;
  }
  /*ーーーーーーーーーーーーー
スペシャルページ
 ーーーーーーーーーーーーー*/
  .specialContent {
    width: 80%;
  }
  .specialBox .item {
    display: none;
  }
  .specialBox h2 {
    float: none;
    width: 100%;
    font-size: 16px;
    background-color: rgba(233, 80, 152, 0.7);
    border: none;
    color: #fff;
  }
  .specialContent section h3 {
    font-size: 20px;
  }
  .specialContent section ul {
    padding-left: 0;
  }
  .specialContent section ul li figure {
    padding-right: 0;
  }
  /*ーーーーーーーーーーーーー
コメントページ
 ーーーーーーーーーーーーー*/
  .commentContent {
    width: 80%;
  }
  .commentBox .item {
    display: none;
  }
  .commentBox h2 {
    float: none;
    width: 100%;
    font-size: 16px;
    background-color: rgba(233, 80, 152, 0.7);
    border: none;
    color: #fff;
  }
  .commentContent section h3 {
    font-size: 20px;
  }
  .commentContent section ul {
    padding-left: 0;
  }
  .commentContent section ul li figure {
    padding-right: 0;
  }
  /*ーーーーーーーーーーーーー
グッズページ
 ーーーーーーーーーーーーー*/
  .goodsContent {
    width: 80%;
  }
  .goodsBox .item {
    display: none;
  }
  .goodsBox h2 {
    float: none;
    width: 100%;
    font-size: 16px;
    background-color: rgba(233, 80, 152, 0.7);
    border: none;
    color: #fff;
  }
  .goodsContent section h3 {
    font-size: 20px;
  }
  .goodsContent section ul {
    padding-left: 0;
  }
  .goodsContent section ul li figure {
    padding-right: 0;
  }
  /*ーーーーーーーーーーーーー
チケットページ
 ーーーーーーーーーーーーー*/
  .ticketContent {
    width: 90%;
    margin: 0 auto;
  }
  .ticketContent #group .boxImg img {
    width: 80%;
  }
  /*ーーーーーーーーーーーーー
ニュースページ
 ーーーーーーーーーーーーー*/
  .newspageContent {
    width: 100%;
    margin: 0 auto;
  }
  /*ーーーーーーーーーーーーー
ニュース詳細ページ
 ーーーーーーーーーーーーー*/
  .infoContent {
    overflow: hidden;
    width: 90%;
    margin: 0 auto;
  }
  /*　イントロページ　*/
  .introContent,
  /*　ストーリーページ　*/
  .aboutContent,
  /*　アバウトページ　*/
  .storyContent,
  /*　チケットページ　*/
  .radioContent,
  /*　ラジオページ　*/
  .ticketContent,
  /*　トレイラーページ　*/
  .trailerContent {
    width: 90%;
    margin: 0 auto;
  }
}


/* ディバイスサイズ　321px 〜 640px */

@media screen and (max-width: 640px) {
  /*ーーーーーーーーーーーーー
 共通
 ーーーーーーーーーーーーー*/
  .homeInner h3 {
    background-color: rgba(255, 255, 255, 0);
  }
  .inner h2 img {
    position: absolute;
    z-index: 999;
    top: 3px;
    left: 3px;
    width: 44px;
  }
  .inner img {
    width: 100%;
  }
  /* topへ戻るのボタン */
  #pageTop {
    position: fixed;
    bottom: 5px;
    right: 5px;
  }
  /* ニュースページ */
  .newspageContent,
  /* イントロページ */
  .introContent,
  /* ストリーページ */
  .aboutContent,
  /* ストリーページ */
  .storyContent,
  /* チケットページ */
  .radioContent,
  /* ラジオページ */
  .ticketContent,
  /* 劇場ページ */
  .theaterContent,
  /* トレイラー */
  .mannersContent,
  /* トレイラー */
  .theatertokuten,
  /* トレイラー */
  .trailerContent,
  /* 劇場特典 */
  .specialContent,
  .commentContent,
  /* スペシャル */
  .goodsContent/*  グッズ */
    {
    width: 98%;
    padding: 40px 1% 50px;
  }
  /* フッター */
  .footer {
    font-size: 0.6rem;
  }
  /* 見出し */
  /* イントロページ */
  .introTitle h2,
  /* ストリーページ */
  .aboutTitle h2,
  /* アバウトページ */
  .storyTitle h2,
  /* チケットページ */
  .radioTitle h2,
  /* ラジオページ */
  .ticketTitle h2,
  /* トップページ コメント */
  .comment h3 {
    font-size: 20px;
  }
  /*ーーーーーーーーーーーーー
 トップページ
 ーーーーーーーーーーーーー*/
  #home .mainBox {
    display: block;
  }
  #home .mainBox section {
    width: 100%;
  }
  .homeBox {
    margin-bottom: 40px;
  }
  /* ナビ下・ニュース */
  .news .btn {
    width: 40px;
    line-height: 20px;
    float: left;
    padding: 1px 2px;
    border-radius: 5px;
    margin-right: 5px;
  }
  .twitterBox iframe {
    width: 90%;
    padding: 10px;
    margin: 0 auto;
    border-radius: 20px;
    border: 1px solid#333;
  }
  /* キャストコメント */
  .comment .name {
    display: block;
    text-align: center;
  }
  .homeBox .comment > .wrap {
    width: 95%;
  }
  .homeBox .wrap .box {
    width: 100%;
    margin: 0 auto 40px;
  }
  .homeBox .wrap .box .wrap img {
    float: none;
    margin: 0 20%;
    width: 60%;
    height: auto;
  }
  /*ーーーーーーーーーーーーー
 キャストページ 
 ーーーーーーーーーーーーー*/
  #cast .list-mv07 {
    max-height: 260px;
  }
  #cast .textBox {
    padding: 10px 0 10px 10px;
  }
  #cast p.textarea {
    font-size: 14px;
  }
  #cast #staff .list-mv07 {
    height: auto;
  }
  #cast .inner .title h1 .logo-3m {
    margin-left: -45%;
    width: 40%;
  }
  #cast .inner .title h1 .logo-3m img,
  #cast .inner .title h1 .logo-xip img {
    width: 100%;
    height: auto;
  }
  #cast .inner .title h1 .logo-xip {
    margin-left: 8%;
    width: 36%;
  }
  #cast p.textarea {
    font-size: 14px;
    line-height: 1.4;
    position: relative;
  }
  #cast .list-mv07 .textBox {
    flex: 2;
  }
  #cast .list-mv07 .char .gazo img {
    right: -10%;
    height: 235px;
    width: auto !important;
  }
  #cast .list-mv07:nth-child(2) .char .gazo img {
    right: -55%;
  }
  #cast .list-mv07 .char .gazo.right img {
    left: -26%;
  }
  #cast .list-mv07:nth-child(1):before,
  #cast .list-mv07:nth-child(2):before,
  #cast .list-mv07:nth-child(3):before {
    background-position: center right;
  }
  #cast .list-mv07:nth-child(4):before,
  #cast .list-mv07:nth-child(5):before,
  #cast .list-mv07:nth-child(6):before {
    background-position: center left;
  }
  #cast p.nameBox {
    margin-bottom: 10px;
  }
  /*ーーーーーーーーーーーーー
グッズページ
 ーーーーーーーーーーーーー*/
  .goodsContent .goodsBox {
    margin-bottom: 40px;
  }
  .goodsContent .goodsBox h3 {
    font-size: 20px;
  }
  .goodsContent .goodsBox h4 {
    font-size: 16px;
    margin-top: 30px;
  }
  .goodsContent .goodsBox table tbody tr th,
  .goodsContent .goodsBox table tbody tr td {
    padding: 5px;
  }
  .goodsContent #goodslist table tr th .name,
  .goodsContent #goodslist table tr th .price {
    display: block;
    width: 100%;
  }
  .goodsContent #goodslist table tr:first-child th .price,
  .goodsContent #goodslist table tr:first-child th .name,
  .goodsContent #goodslist table tr:first-child td {
    font-size: 16px;
  }
  /*ーーーーーーーーーーーーー
チケットページ
 ーーーーーーーーーーーーー*/
  .ticker li {
    width: 100%;
    padding: 0 2%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: none;
    line-height: 24px;
  }
  .ticketImg {
    width: 100%;
  }
  .ticketImg.wide {
    width: 100%;
  }
  .ticketImg {
    width: 100%;
  }
  .ticketContent #ticketlist table tr th .name,
  .ticketContent #ticketlist table tr th .price {
    display: block;
    width: 100%;
  }
  .ticketContent #ticketlist table tr:first-child th .price,
  .ticketContent #ticketlist table tr:first-child th .name,
  .ticketContent #ticketlist table tr:first-child td {
    font-size: 16px;
  }
  .ticketContent .ticketBox .ticketTable table tr th,
  .ticketContent .ticketBox .ticketTable table tr td {
    font-size: 14px;
  }
  .ticketContent .ticketBox .ticketTable {
    padding: 0px;
  }
  .ticketBox .boxImg.wide {
    width: 100%;
    margin: 0 auto 30px;
  }
  .ticketBox .boxImg.movie {
    width: 100%;
    margin: 0 auto;
  }
  /*ーーーーーーーーーーーーー
ニュースページ
 ーーーーーーーーーーーーー*/
  .newspageBox ul.item li {
    padding: 10px;
  }
  .newspageContent .newsCategory ul li {
    width: calc( 100% / 3);
    flex: none;
    margin-bottom: 5px;
  }
  .newspageContent .newsCategory ul li:nth-child(1),
  .newspageContent .newsCategory ul li:nth-child(4) {
    border-left: 1px solid #000;
  }
  .newspageContent .newsCategory ul li:nth-child(6) {
    border-right: 1px solid #000;
  }
  /*ーーーーーーーーーーーーー
 ストリーページ
 ーーーーーーーーーーーーー*/
  .text h3 img {
    width: 90%;
    margin: 0 5%;
  }
  /*ーーーーーーーーーーーーー
ニュース詳細ページ
 ーーーーーーーーーーーーー*/
  .infoBox h4 {
    text-align: left;
  }
  .infoBox strong {
    text-align: left;
  }
  .infoBox .heading h3 {
    text-align: left;
  }
  .infoBox .item tr td {
    display: block;
  }
  .infoBox .item tr td:nth-child(1) {
    width: 100%;
  }
  .infoBox .item {
    width: 100%;
  }
  .infoBox .item tr {
    border-bottom: none;
  }
  .infoBox .item tr td:nth-child(1) {
    background-color: rgba(233, 80, 152, 0.2);
  }
  .introText p,
  .storyText p,
  .aboutText p {
    font-size: 16px;
  }
  .infoBox .heading {
    background: #e95098;
  }
  .infoBox .heading h2 {
    width: 80%;
    margin: 0 auto;
  }
  /*ーーーーーーーーーーーーー
劇場ページ
 ーーーーーーーーーーーーー*/
  #theater article {
    padding: 0;
  }
  /*ーーーーーーーーーーーーー
ラジオページ
 ーーーーーーーーーーーーー*/
  .radioContent .radioPerson > div {
    display: block;
    width: 100%;
  }
  .radioContent .radioTitle h3 {
    margin-bottom: 10px;
  }
  .radioContent h4 {
    margin-bottom: 10px;
  }
  .radioContent h4.djcd {
    text-align: left;
    font-size: 20px;
  }
  .radioContent h4.djcd br {
    display: none;
  }
  .radioContent .radioPlay > div.left,
  .radioContent .radioPlay > div.right {
    display: block;
    width: 100%;
  }
  .radioContent .radioPlay .left p {
    padding-right: 0;
  }
  .radioContent .radioPlay > div.right {
    margin-top: 20px;
  }
  .radioContent .radioPlay .right .guestBox {
    /*margin-left: 0;
		margin-top: -5%;*/
  }
  .radioContent .radioList li {
    font-size: 0;
  }
  .radioContent .radioList li > div {
    display: inline-block;
  }
  .radioContent .radioList li > div.fst {
    width: 30%;
  }
  .radioContent .radioList li > div.sec {
    width: 70%;
  }
  .radioContent .radioList li > div.trd {
    width: 70%;
    margin-left: 30%;
    padding-top: 0;
    padding-left: 0;
  }
  .radioContent .radioList li > div.trd img {
    display: none !important;
  }
  .radioContent .radioList li > div.trd figure figcaption {
    width: 100%;
  }
  .radioContent .radioList li > div.trd figure figcaption span {
    display: inline;
    margin-left: 10px;
  }
  .radioContent .radioList li > div.sec h6 span {}

  /*ーーーーーーーーーーーーー
スペシャルページ
 ーーーーーーーーーーーーー*/
  .specialContent #ticketlist table tr th .name,
  .specialContent #ticketlist table tr th .price {
    display: block;
    width: 100%;
  }
  .specialContent #ticketlist table tr:first-child th .price,
  .specialContent #ticketlist table tr:first-child th .name,
  .specialContent #ticketlist table tr:first-child td {
    font-size: 16px;
  }


}

.radioContent .djcd-tokuten table th,
.radioContent .djcd-tokuten table td {
  padding: 5px;
}


/* ディバイスサイズ　 〜 320px */

@media screen and (max-width: 320px) {
  .inner img.main {
    width: 80%;
    margin: 0 10% 15%;
  }
  /* フッター */
  .footer .banner .bannerBox {
    width: 180px;
  }
  .footer .banner .bannerBox .box {
    float: none;
  }
  /*ーーーーーーーーーーーーー
 トップページ
 ーーーーーーーーーーーーー*/
  /* バナー */
  .homeBox .banner img,
  .homeBox .banner2 img {
    width: 100%;
    margin-top: -20px;
  }
  .homeBox .commentBox {
    margin-top: -20px;
    margin-bottom: 40px;
  }
  .flotBox {
    width: 90%;
    margin: 0 auto;
  }
  .flotBox .banner {
    width: 96%;
    margin: 30px 2%;
    float: none;
  }
  .flotBox .banner2 {
    width: 96%;
    margin: 30px 2%;
    float: none;
  }
  /*ーーーーーーーーーーーーー
 キャストページ 
 ーーーーーーーーーーーーー*/
  #cast .list-mv07 .char {
    width: 100%;
  }
  #cast .list-mv07 .char .gazo img {
    width: 100px;
  }
  #cast #staff h3 {
    font-size: 14px;
  }
}


/* 表の体裁を修正 */

#info.radio .item span {
  display: inline-block;
  width: 8.5em;
}

@media screen and (max-width: 640px) {
  #info.radio .item span {
    display: block;
    width: auto;
  }
}

#info.radio .heading h2 {
  display: flex;
  justify-content: center;
  width: 80%;
  margin: 0 auto;
  align-items: center;
  text-align: center;
  font-size: 18px;
  color: #fff;
}

#info.radio .item span {
  display: inline-block;
  width: 8.5em;
}