@charset "UTF-8";
/*@import url(mobile_ep3.css);*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
RESET_start
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*
基本リセット
*/
* {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
div,
p,
span,
em,
strong,
ul,
ol,
li,
dl,
dt,
dd,
a {
  background-repeat: no-repeat;
  background-size: 100% auto;
}

a {
  outline: none;
  text-decoration: none;
}

/*
ウェブフォント用基本サイズセット
*/
h1,
h2,
h3,
h4,
h5,
h6,
p,
li,
dt,
dd,
a,
em,
span,
strong,
figcaption {
  font-size: 0.9375em;
  line-height: 1em;
  font-family: "FOT-筑紫Aオールド明朝 Pr6 D";
  letter-spacing: 0.07em;
  font-feature-settings: "palt";
}

/*
PC・SP対応用
*/
.pc {
  display: none;
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
RESET_end
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
COMMON_start
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
body {
  background-color: #eceeee;
}

html,
body {
  width: 100%;
  height: 100%;
  font-weight: 500;
  font-style: normal;
  vertical-align: baseline;
}

#grandwrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
COMMON_end
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
LOADING_start
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#loading {
  z-index: 999;
  background-color: #000000;
  color: #ffffff;
  box-sizing: border-box;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition-duration: 600ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.42, 0, 0, 0.99);
  transition-delay: 300ms;
  transform-origin: bottom;
}

#loading.fade {
  opacity: 0;
  pointer-events: none;
  background-color: transparent;
}

#loading.remove {
  display: none;
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
LOADING_end
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
メニュー_start
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
.headernav {
  transition: 0.3s;
  opacity: 0;
  z-index: 3;
  position: fixed;
  bottom: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 20px;
  background: url(../images/deluxe_btn_bg.png) no-repeat left top rgba(225, 225, 225, 0.8);
  width: 100%;
  padding: 15px 0;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  transform: translateY(30px);
}
.headernav li {
  display: flex;
  align-items: center;
  height: 20px;
}
.headernav li img {
  height: 100%;
  width: auto;
}
.headernav li a {
  display: flex;
  align-items: center;
  height: 100%;
  color: #000000;
}
.headernav li a.reserve_btn {
  padding: 6px 15px;
  background: #b22222;
  border-radius: 50px;
  color: #FFFFFF;
}
.headernav.wpactive {
  opacity: 1;
  transform: translateY(0px);
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
メニュー_end
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
キービジュアル_start
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#kv {
  background-color: #000000;
  overflow: hidden;
  /*
  キャッチコピー
  */
  /*
  アート要素
  */
  /*
  プラットフォーム
  */
  /*
  パブリッシャー
  */
  /*
  アニメーション
  */
  /*トランスレーション系*/
}
#kv .catch {
  color: #FFFFFF;
  text-align: left;
  font-family: "FOT-筑紫Aオールド明朝 Pr6 D";
  font-size: 4vw;
  margin: 10vw 0 8vw 20vw;
}
#kv .art {
  position: relative;
  margin: 0 auto;
  max-width: 440px;
  width: 100%;
  /*TC*/
  /*ABC*/
}
#kv .art > div {
  background-repeat: no-repeat;
  background-size: auto 100%;
}
#kv .art > div > h2 {
  z-index: 2;
  position: absolute;
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: center center;
  text-indent: -9999px;
}
#kv .art .visual {
  display: block;
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: center center;
}
#kv .art .tc {
  background-image: url(../images/vis_tc_bg.png);
  background-position: top right;
  width: 100%;
}
#kv .art .tc h2 {
  top: 110px;
  left: 0px;
  background-image: url(../images/vis_logo_tc.png);
  background-size: 100% auto;
  width: 64%;
  height: 50px;
}
#kv .art .tc .visual {
  margin: 0 0 0 0;
  background-image: url(../images/vis_tc_img_sp.png);
  background-size: 240px auto;
  background-position: top right;
  width: 100%;
  height: 300px;
}
#kv .art .abc {
  margin: 0 0 0 0;
  background-image: url(../images/vis_abc_bg.png);
  background-position: top left;
}
#kv .art .abc h2 {
  top: 420px;
  right: 20px;
  background-image: url(../images/vis_logo_abc.png);
  background-size: 100% auto;
  width: 36%;
  height: 50px;
}
#kv .art .abc .visual {
  margin: 0 0 0 0;
  background-image: url(../images/vis_abc_img.png);
  background-size: 286px auto;
  background-position: top left;
  width: 100%;
  height: 300px;
}
#kv .art_lowerpage {
  width: 100%;
  margin: 0 auto;
}
#kv .art_lowerpage img {
  width: 100%;
}
#kv .platform {
  z-index: 3;
  position: absolute;
  top: 0;
  left: 0;
  background-image: url(../images/logo_switch.png);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center center;
  max-width: 72px;
  max-height: 72px;
  width: 12vw;
  height: 12vw;
}
#kv .publisher {
  position: absolute;
  top: 0px;
  right: 0px;
  background-image: url(../images/vis_logo_developer.png);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center center;
  max-width: 150px;
  max-height: 58px;
  width: 30vw;
  height: 13vw;
  text-indent: -9999px;
}
#kv .catch,
#kv .art > div > h2,
#kv .art .visual,
#kv .art_lowerpage,
#kv .platform,
#kv .publisher {
  opacity: 0;
  transition-duration: 800ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.42, 0, 0, 0.99);
  transition-delay: 0ms;
  transform-origin: center;
}
#kv .catch {
  transform: translateX(30px);
}
#kv.wpactive .catch {
  opacity: 1;
  transform: translateY(0px);
}
#kv .art .tc > h2 {
  transform: translateX(30px);
}
#kv .art .abc > h2 {
  transform: translateX(-30px);
}
#kv.wpactive .art > div > h2 {
  opacity: 1;
  transform: translateY(0px);
}
#kv .art .visual,
#kv .art_lowerpage {
  transform: scale(1.25);
  transition-delay: 500ms;
  transition-duration: 1500ms;
}
#kv.wpactive .art .visual, #kv.wpactive .art_lowerpage {
  opacity: 1;
  transform: scale(1);
}
#kv .platform {
  transform: translateY(-30px);
}
#kv.wpactive .platform {
  opacity: 1;
  transform: translateY(0px);
}
#kv .publisher {
  transform: translateY(-30px);
}
#kv.wpactive .publisher {
  opacity: 1;
  transform: translateY(0px);
}

/*アニメート系*/
オブジェクト {
  opacity: 0;
  animation-duration: 1000ms;
  animation-timing-function: cubic-bezier(0.42, 0, 0, 0.99);
  animation-direction: normal;
  animation-fill-mode: forwards;
  animation-play-state: running;
  animation-iteration-count: inherit;
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
概要_start
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#aboutus {
  text-align: center;
  padding: 70px 0;
  /*
  見出し
  */
  /*
  キャプション
  */
  /*
  予約・購入ボタン
  */
  /*
  アニメーション
  */
  /*トランスレーション系*/
}
#aboutus h2 {
  margin: 0 0 40px 0;
  font-size: 30px;
  font-family: futura-pt, sans-serif;
  font-weight: 400;
  font-style: italic;
  letter-spacing: 0em;
}
#aboutus h2 strong {
  font-family: futura-pt, sans-serif;
  font-weight: 700;
}
#aboutus .caption {
  width: 320px;
  margin: 0 auto;
}
#aboutus .caption p {
  font-size: 16px;
  line-height: 2em;
}
#aboutus a.reserve_btn {
  background: #b22222;
  color: #FFF;
  padding: 3vw;
  margin: 6vw auto 0;
  display: block;
  width: 50vw;
  border-radius: 10vw;
  font-size: 16px;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
}
#aboutus h2,
#aboutus .caption p,
#aboutus a.reserve_btn {
  opacity: 0;
  transition-duration: 1000ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.42, 0, 0, 0.99);
  transition-delay: 0ms;
  transform-origin: center;
}
#aboutus h2 {
  letter-spacing: 0.1em;
}
#aboutus.wpactive h2 {
  opacity: 1;
  letter-spacing: 0;
}
#aboutus .caption p,
#aboutus a.reserve_btn {
  transform: translateY(30px);
}
#aboutus.wpactive .caption p, #aboutus.wpactive a.reserve_btn {
  opacity: 1;
  transform: translateY(0px);
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
受賞・評価歴_start
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#award {
  background-color: #1d1d1d;
  color: #ffffff;
  background-image: url(../images/award_bg.png);
  background-position: center center;
  background-repeat: repeat-x;
  background-size: auto 100%;
  text-align: center;
  padding: 65px 0;
}

/*
見出し
*/
#award .subtitle {
  margin: 0 0 40px 0;
}

#award .subtitle em {
  display: block;
  margin: 0 0 25px 0;
  font-size: 15px;
  font-style: normal;
}

#award .subtitle h2 {
  color: #ffefc0;
  position: relative;
  font-size: 23px;
  margin: 0 0 30px 0;
}

#award .subtitle h2::after {
  content: "";
  display: block;
  position: absolute;
  bottom: -25px;
  left: 50%;
  margin: 0 0 0 -5px;
  width: 10px;
  height: 4px;
  background-color: #ffde00;
}

#award .subtitle span {
  font-size: 12px;
  font-family: futura-pt, sans-serif;
  font-weight: 500;
  font-style: italic;
}

/*
受賞リスト
*/
#award .awardlist ul {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  text-indent: -9999px;
}

/*TC*/
#award .awardlist ul.tc {
  background-image: url(../images/award_tc_sp.png);
  background-size: 320px 187px;
  width: 100%;
  height: 187px;
  margin: 0 auto 30px auto;
}

/*ABC*/
#award .awardlist ul.abc {
  background-image: url(../images/award_abc_sp.png);
  background-size: 320px 318px;
  width: 100%;
  height: 318px;
  margin: 0 auto;
}

/*
アニメーション
*/
/*トランスレーション系*/
#award,
#award .subtitle em,
#award .subtitle h2,
#award .subtitle span,
#award .awardlist ul.tc,
#award .awardlist ul.abc {
  opacity: 0;
  transition-duration: 1000ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.42, 0, 0, 0.99);
  transition-delay: 0ms;
  transform-origin: center;
}

#award {
  transition-duration: 400ms;
  transform-origin: left;
  transform: scaleX(0);
}

#award.wpactive {
  opacity: 1;
  transform: scaleX(1);
}

#award .subtitle em,
#award .subtitle h2,
#award .subtitle span {
  letter-spacing: 0.2em;
  transition-delay: 400ms;
  transform: translateY(20px);
}

#award .subtitle h2 {
  transition-delay: 700ms;
}

#award .subtitle span {
  transition-delay: 1000ms;
}

#award .subtitle.wpactive em,
#award .subtitle.wpactive h2,
#award .subtitle.wpactive span {
  opacity: 1;
  transform: translateY(0px);
}

#award .awardlist ul.tc,
#award .awardlist ul.abc {
  transform: scale(1.25);
  transition-duration: 2000ms;
}

#award .awardlist ul.tc.wpactive,
#award .awardlist ul.abc.wpactive {
  opacity: 1;
  transform: scale(1);
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
ゲーム紹介汎用スタイル_start
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
.aboutbox {
  background-repeat: repeat-y;
  background-position: top center;
  background-attachment: fixed;
  padding: 130px 0 0 0;
  text-align: center;
}

/*
キャッチコピー
*/
.aboutbox > h3 {
  font-size: 25px;
  writing-mode: vertical-rl;
  margin: 0 auto 98px auto;
  text-align: center;
  letter-spacing: 0.4em;
  font-feature-settings: unset;
}

/*
タイトルロゴ
*/
.aboutbox > h2 {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  text-indent: -9999px;
}

/*
ビジュアル
*/
.aboutbox .vis {
  background-position: bottom center;
  background-repeat: no-repeat;
}

.aboutbox .vis .visual {
  display: block;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  margin: 0 auto;
}

/*
ストーリー
*/
.aboutbox .story {
  width: 320px;
  margin: 0 auto 100px auto;
}

.aboutbox .story p {
  font-size: 16px;
  line-height: 2.56em;
  margin: 0 0 2.8em 0;
}

/*
スタッフ
*/
.aboutbox .staff {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 320px;
  margin: 0 auto 100px auto;
}

.aboutbox .staff li {
  background-image: url(../images/common_box_arrow.png);
  background-position: top left;
  background-repeat: no-repeat;
  background-size: 10px auto;
  box-sizing: border-box;
  width: 310px;
  min-height: 135px;
  padding: 25px 15px;
  border: 1px #a0a0a0 solid;
  margin: 0 0 20px 0;
}

.aboutbox .staff li em {
  display: block;
  font-size: 15px;
  font-style: normal;
  margin: 0 0 15px 0;
}

.aboutbox .staff li h4 {
  font-size: 18px;
  font-style: normal;
  margin: 0 0 15px 0;
}

.aboutbox .staff li p {
  font-size: 12px;
  font-style: normal;
  letter-spacing: 0;
}

/*
キャラクター
*/
.aboutbox .character {
  margin: 0 0 150px;
}
.aboutbox .character h3 {
  display: inline-block;
  background-color: #000000;
  color: #ffffff;
  font-size: 12px;
  margin: 0 0 40px 0;
  padding: 12px 30px;
}
.aboutbox .character ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 30px;
  max-width: 80%;
  margin: 0 auto;
}
.aboutbox .character li {
  width: 45%;
  max-width: 200px;
  font-size: 18px;
}
.aboutbox .character li img {
  width: 100%;
  height: auto;
}
.aboutbox .character li figcaption {
  width: 88%;
  height: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  background: url(../images/common_box_arrow.png) no-repeat top left rgba(236, 238, 238, 0.9);
  background-size: 10px auto;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  margin: -82px auto 0;
  padding: 15px 0;
  border: 1px solid #000000;
  font-size: 12px;
  text-align: center;
}
.aboutbox .character li figcaption em {
  display: block;
  font-size: 16px;
  font-style: normal;
  width: 100%;
}

/*
声優さん
*/
.aboutbox .voiceactor {
  margin: 0 0 100px 0;
}

.aboutbox .voiceactor h3 {
  display: inline-block;
  background-color: #000000;
  color: #ffffff;
  font-size: 12px;
  margin: 0 0 40px 0;
  padding: 12px 30px;
}

.aboutbox .voiceactor ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 320px;
  margin: 0 auto;
}

.aboutbox .voiceactor li {
  font-size: 18px;
  padding: 0 4px 0 0;
  line-height: 2em;
}

.aboutbox .voiceactor li::after {
  content: "/";
  padding: 0 0 0 4px;
}

.aboutbox .voiceactor li:last-child::after {
  display: none;
  padding: 0;
}

/*
スペック
*/
.aboutbox .spec {
  box-sizing: border-box;
  background-position: top center;
  background-repeat: no-repeat;
  background-size: auto 100%;
  width: 100%;
  margin: 0 auto;
}

.aboutbox .spec h3 {
  font-size: 18px;
  margin: 0 0 30px 0;
}

.aboutbox .spec ul {
  width: 320px;
  margin: 0 auto;
}

.aboutbox .spec li {
  font-size: 16px;
  margin: 0 0 30px 0;
  width: 320px;
}

.aboutbox .spec li em {
  display: block;
  font-style: normal;
  background-color: #ffffff;
  margin: 0 auto 15px auto;
  padding: 2px 5px;
  letter-spacing: 0em;
  border: 1px #1d1d1d solid;
  width: 80px;
  text-align: center;
  font-size: 13px;
}

/*
アニメーション
*/
/*トランスレーション系*/
.aboutbox > h3,
.aboutbox > h2,
.aboutbox .vis,
.aboutbox .vis .visual,
.aboutbox .story p,
.aboutbox .staff li,
.aboutbox .voiceactor h3,
.aboutbox .voiceactor ul,
.aboutbox .character h3,
.aboutbox .character li,
.aboutbox .character li figcaption,
.aboutbox .spec,
.aboutbox .spec ul {
  opacity: 0;
  transition-duration: 1000ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.42, 0, 0, 0.99);
  transition-delay: 0ms;
  transform-origin: center;
}

.aboutbox > h3.wpactive {
  opacity: 1;
  color: #000000;
}

.aboutbox > h2 {
  transform: scale(1.25);
}

.aboutbox > h2.wpactive {
  opacity: 1;
  transform: scale(1);
}

.aboutbox .vis {
  transform: translateX(-80px);
}

.aboutbox .vis.wpactive {
  opacity: 1;
  transform: translateX(0px);
}

.aboutbox .vis .visual {
  transform: translateX(80px);
  transition-delay: 500ms;
}

.aboutbox .vis.wpactive .visual {
  opacity: 1;
  transform: translateX(0px);
}

.aboutbox .story p {
  transform: translateY(10px);
}

.aboutbox .story p.wpactive {
  opacity: 1;
  transform: translateY(10px);
}

.aboutbox .staff li,
.aboutbox .character li figcaption {
  background-color: #000000;
}

.aboutbox .staff.wpactive li,
.aboutbox .character li.wpactive figcaption {
  opacity: 1;
  background-color: rgba(236, 238, 238, 0.9);
}

.aboutbox .voiceactor h3,
.aboutbox .character h3,
.aboutbox .character li {
  transform: translateY(30px);
}

.aboutbox .voiceactor.wpactive h3,
.aboutbox .character.wpactive h3,
.aboutbox .character li.wpactive {
  opacity: 1;
  transform: translateY(0px);
}

.aboutbox .voiceactor ul {
  transform: translateY(-30px);
}

.aboutbox .voiceactor.wpactive ul {
  opacity: 1;
  transform: translateY(0px);
}

/*.aboutbox .switchfact h3 {
	transform: translateY(30px);
}

.aboutbox .switchfact.wpactive h3 {
	opacity: 1;
	transform: translateY(0px);
}

.aboutbox .switchfact li {
	transform: translateY(-30px);
}

.aboutbox .switchfact.wpactive li {
	opacity: 1;
	transform: translateY(0px);
}*/
.aboutbox .spec {
  transform: scale(1.25);
}

.aboutbox .spec.wpactive {
  opacity: 1;
  transform: scale(1);
}

.aboutbox .spec ul {
  transition-delay: 500ms;
}

.aboutbox .spec.wpactive ul {
  opacity: 1;
}

/*アニメート系*/
.iamdead {
  display: inline-block;
  position: relative;
  animation-duration: 1000ms;
  animation-timing-function: cubic-bezier(0.42, 0, 0, 0.99);
  animation-direction: normal;
  animation-fill-mode: forwards;
  animation-play-state: running;
  animation-iteration-count: infinite;
}

.iamdead.wpactive {
  animation-name: tc_chatch_death;
  animation-duration: 4000ms;
}

@keyframes tc_chatch_death {
  0% {
    color: #000000;
  }
  50% {
    color: #ff0000;
  }
  51% {
    color: #ff0000;
    transform: translate(0px, 0px);
  }
  55% {
    color: #ff0000;
    transform: translate(2px, 3px);
  }
  60% {
    color: #ff0000;
    transform: translate(-3px, 2px);
  }
  65% {
    color: #ff0000;
    transform: translate(2px, -2px);
  }
  75% {
    color: #ff0000;
    transform: translate(0px, 0px);
  }
  80% {
    color: #ff0000;
    transform: translate(1px, 1px);
  }
  85% {
    color: #ff0000;
    transform: translate(0px, 0px);
  }
  100% {
    color: #000000;
  }
}
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
東京クロノス_start
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#about_tc.aboutbox {
  background-image: url(../images/about_tc_bg_sp.png);
  background-size: 100% auto;
  background-position: center center;
  background-repeat: no-repeat;
}

/*
タイトルロゴ
*/
#about_tc.aboutbox > h2 {
  background-image: url(../images/logo_tc.png);
  width: 300px;
  height: 61px;
  margin: 0 auto 40px auto;
}

/*
ビジュアル
*/
#about_tc.aboutbox .vis {
  background-image: url(../images/about_tc_vis_bg.png);
  background-size: 900px auto;
  margin: 0 0 60px 0;
}

#about_tc.aboutbox .vis .visual {
  background-image: url(../images/about_tc_vis.png);
  background-size: 380px 334px;
  width: 100%;
  height: 334px;
}

/*
スペック
*/
#about_tc.aboutbox .spec {
  background-image: url(../images/spec_tc_bg_sp.png);
  height: auto;
  padding: 110px 0 30px 0;
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
アルトデウス_start
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#about_abc.aboutbox {
  background-image: url(../images/about_abc_bg_sp.png);
  background-size: 100% auto;
  background-position: center 20px;
  background-repeat: no-repeat;
}

/*
タイトルロゴ
*/
#about_abc.aboutbox > h2 {
  background-image: url(../images/logo_abc.png);
  width: 233px;
  height: 70px;
  margin: 0 auto 40px auto;
}

/*
ビジュアル
*/
#about_abc.aboutbox .vis {
  background-image: url(../images/about_abc_vis_bg.png);
  background-size: 830px auto;
  margin: 0 0 60px 0;
}

#about_abc.aboutbox .vis .visual {
  background-image: url(../images/about_abc_vis.png);
  background-position: -30px top;
  background-size: 420px 370px;
  width: 420px;
  height: 353px;
}

/*
スペック
*/
#about_abc.aboutbox .spec {
  background-image: url(../images/spec_abc_bg_sp.png);
  padding: 70px 0 30px 0;
  margin: 0 0 150px 0;
}

#about_abc.aboutbox .spec li {
  letter-spacing: 0.1em;
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
製品情報_start
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#product,
#reserve-buy {
  background-image: url(../images/product_bg_sp.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 98% auto;
  text-align: center;
  margin: 50px 0px;
  /*
  見出し
  */
  /*
  キャプション
  */
  /*
  パッケージ画像
  */
  /*
  Switch版の特徴
  */
}
#product .subtitle em,
#reserve-buy .subtitle em {
  display: block;
  margin: 0 0 25px 0;
  font-size: 15px;
  font-style: normal;
}
#product .subtitle h2,
#reserve-buy .subtitle h2 {
  position: relative;
  font-size: 30px;
  margin: 0 0 50px 0;
}
#product .subtitle h2::after,
#reserve-buy .subtitle h2::after {
  content: "";
  display: block;
  position: absolute;
  bottom: -25px;
  left: 50%;
  margin: 0 0 0 -5px;
  width: 10px;
  height: 4px;
  background-color: #b22222;
}
#product .caption,
#reserve-buy .caption {
  width: 320px;
  margin: 0 auto 30px auto;
}
#product .caption p,
#reserve-buy .caption p {
  font-size: 16px;
  line-height: 2em;
  letter-spacing: 0.05em;
}
#product .package img,
#reserve-buy .package img {
  display: inline-block;
  margin: 0 0 10px 0;
  width: 200px;
}
#product .package figcaption,
#reserve-buy .package figcaption {
  width: 320px;
  margin: 0 auto;
  font-size: 12px;
  letter-spacing: 0.05em;
  line-height: 2em;
}
#product .switchfact,
#reserve-buy .switchfact {
  margin: 50px 0;
}
#product .switchfact h3,
#reserve-buy .switchfact h3 {
  font-size: 18px;
  margin: 0 0 40px 0;
}
#product .switchfact li,
#reserve-buy .switchfact li {
  box-sizing: border-box;
  width: 320px;
  margin: 0 auto 20px auto;
  padding: 1.1em 2em;
  border: 1px #a0a0a0 solid;
  border-radius: 100px;
}
#product .switchfact li:last-child,
#reserve-buy .switchfact li:last-child {
  margin: 0 auto 20px auto;
}
#product .switchfact .supp,
#reserve-buy .switchfact .supp {
  font-size: 12px;
  line-height: 2em;
}

.productinfo {
  position: relative;
  background: url(../images/product_bg.png) no-repeat center top/cover;
  box-sizing: border-box;
  width: 100%;
  margin: 100px auto;
  padding: 65px 15px;
}
.productinfo dl {
  margin: 0 0 15px 0;
}
.productinfo dt {
  display: inline-block;
  font-style: normal;
  background-color: #ffffff;
  margin: 0 10px 0 0;
  padding: 0 5px;
  letter-spacing: 0em;
  border: 1px #1d1d1d solid;
}
.productinfo dd {
  margin: 0 0 30px;
  line-height: 1.4em;
}
.productinfo::before {
  content: "";
  z-index: 2;
  display: block;
  position: absolute;
  top: -47px;
  right: 0;
  left: 0;
  margin: 0 auto;
  width: 63px;
  height: 56px;
  background: url(../images/product_bgchara.png) no-repeat center top/contain;
}

/*
豪華版・早期購入特典
*/
.deluxe {
  width: 80%;
  margin: 0 auto 60px;
}
.deluxe img {
  width: 100%;
}
.deluxe .setlist {
  border: 1px #a0a0a0 solid;
  padding: 15px;
  margin: 15px 0 0;
  background: url(../images/common_box_arrow.png) no-repeat top left;
  background-size: 10px auto;
}
.deluxe .setlist li {
  margin: 0 0 15px;
  text-align: left;
  line-height: 1.4em;
}
.deluxe .setlist li:last-child {
  margin: 0;
}

.earlybird {
  text-align: left;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  gap: 15px;
  width: 80%;
  border: 1px #a0a0a0 solid;
  padding: 15px;
  margin: 0 auto 60px;
  background: url(../images/common_box_arrow.png) no-repeat top left;
  background-size: 10px auto;
}
.earlybird img {
  width: 20%;
}
.earlybird dt {
  display: inline-block;
  background-color: #000000;
  color: #ffffff;
  font-size: 14px;
  margin: 0 0 15px;
  padding: 15px 40px;
}

/*
ご予約・購入 店舗情報
*/
.shop h3 {
  display: inline-block;
  background-color: #000000;
  color: #ffffff;
  font-size: 12px;
  padding: 12px 30px;
}
.shop .shoplist {
  width: 75%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
}
.shop .shoplist li {
  width: 100%;
  margin: 0 0 150px;
}
.shop .shoplist .benefits {
  margin: 0 0 30px;
}
.shop .shoplist .benefits img {
  width: 100%;
}
.shop .shoplist .standard_btn,
.shop .shoplist .deluxe_btn {
  position: relative;
  display: block;
  margin: 0 auto 15px;
  padding: 15px;
  width: 50%;
  border-radius: 10vw;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
  background: #b22222;
  color: #FFF;
}
.shop .shoplist .standard_btn.comingsoon,
.shop .shoplist .deluxe_btn.comingsoon {
  background: #cccccc;
  color: rgba(255, 255, 255, 0.5);
  box-shadow: none;
}
.shop .shoplist .standard_btn.comingsoon::after,
.shop .shoplist .deluxe_btn.comingsoon::after {
  content: "comingsoon";
  display: block;
  position: absolute;
  bottom: 16px;
  right: 0;
  left: 0;
  color: #333333;
}
.shop .shoplist .deluxe_btn {
  background: url(../images/deluxe_btn_bg.png) no-repeat left top #b22222;
  background-size: cover;
}
.shop .shoplist .benefits_caution {
  display: inline-block;
  color: #b22222;
  margin: 0 0 15px;
}

.back_btn {
  display: block;
  margin: 0 auto 15px;
  padding: 15px;
  width: 50%;
  border-radius: 50px;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
  background: none;
  color: #000000;
  border: 1px solid #000000;
}

/*
アニメーション
*/
/*トランスレーション系*/
#product,
#product .subtitle em,
#product .subtitle h2,
#product .caption,
#product figure img,
#reserve-buy,
#reserve-buy .subtitle h2,
#reserve-buy .deluxe img,
#reserve-buy .deluxe .setlist,
#reserve-buy .shop h3,
#reserve-buy .earlybird,
#reserve-buy .shoplist li {
  opacity: 0;
  transition-duration: 1000ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.42, 0, 0, 0.99);
  transition-delay: 0ms;
  transform-origin: center;
}

#product {
  background-position: center 50px;
}
#product.wpactive {
  opacity: 1;
  background-position: center 160px;
}
#product .subtitle em {
  letter-spacing: 0.4em;
}
#product .subtitle.wpactive em {
  opacity: 1;
  letter-spacing: 0.165em;
}
#product .subtitle h2 {
  letter-spacing: 0.4em;
  transform: translateY(-30px);
}
#product .subtitle.wpactive h2 {
  opacity: 1;
  letter-spacing: 0.165em;
  transform: translateY(0px);
}
#product .caption {
  transform: translateY(-30px);
}
#product .caption.wpactive {
  opacity: 1;
  transform: translateY(0px);
}
#product figure img {
  display: inline-block;
  transform: scale(1.5);
  transition-duration: 2000ms;
}
#product figure.wpactive img {
  opacity: 1;
  transform: scale(1);
}

#reserve-buy {
  background-position: center 50px;
}
#reserve-buy.wpactive {
  opacity: 1;
  background-position: center 160px;
}
#reserve-buy .subtitle h2,
#reserve-buy .shop h3,
#reserve-buy .deluxe .setlist {
  letter-spacing: 0.4em;
  transform: translateY(-30px);
}
#reserve-buy .subtitle.wpactive h2,
#reserve-buy .shop h3.wpactive,
#reserve-buy .deluxe .setlist.wpactive {
  opacity: 1;
  letter-spacing: 0.165em;
  transform: translateY(0px);
}
#reserve-buy .deluxe img {
  display: inline-block;
  transform: scale(1.5);
  transition-duration: 2000ms;
}
#reserve-buy .deluxe img.wpactive {
  opacity: 1;
  transform: scale(1);
}
#reserve-buy .shop li,
#reserve-buy .earlybird {
  transform: translateY(-30px);
}
#reserve-buy .shop li.wpactive,
#reserve-buy .earlybird.wpactive {
  opacity: 1;
  transform: translateY(0px);
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
公式SNS_start
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#sns {
  margin: 0 0 150px 0;
  text-align: center;
}

/*
見出し
*/
#sns .subtitle em {
  display: block;
  margin: 0 0 25px 0;
  font-size: 15px;
  font-style: normal;
}

#sns .subtitle h2 {
  position: relative;
  font-size: 23px;
  margin: 0 0 70px 0;
}

#sns .subtitle h2::after {
  content: "";
  display: block;
  position: absolute;
  bottom: -25px;
  left: 50%;
  margin: 0 0 0 -5px;
  width: 10px;
  height: 4px;
  background-color: #b22222;
}

/*
リンクアイコン
*/
#sns .snslist {
  display: flex;
  justify-content: center;
  align-items: center;
}

#sns .snslist li {
  width: 100px;
  height: 100px;
  overflow: hidden;
  margin: 0 20px;
  border-radius: 10px;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
}

#sns .snslist li img {
  width: 100%;
  height: 100%;
}

/*
アニメーション
*/
/*トランスレーション系*/
#sns .subtitle em,
#sns .subtitle h2,
#sns .snslist li a {
  opacity: 0;
  transition-duration: 1000ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.42, 0, 0, 0.99);
  transition-delay: 0ms;
  transform-origin: center;
}

#sns .subtitle em {
  letter-spacing: 0.4em;
}

#sns.wpactive .subtitle em {
  opacity: 1;
  letter-spacing: 0.165em;
}

#sns .subtitle h2 {
  letter-spacing: 0.4em;
  transform: translateY(-30px);
}

#sns.wpactive .subtitle h2 {
  opacity: 1;
  letter-spacing: 0.165em;
  transform: translateY(0px);
}

#sns .snslist li a {
  box-shadow: 0 0px 10px rgba(0, 0, 0, 0.2);
  transform: translateY(10px);
  transition-duration: 600ms;
}

#sns.wpactive .snslist li a {
  opacity: 1;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
  transform: translateY(0px);
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
フッター_start
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
footer#grandfooter {
  background-color: #020309;
  color: #ffffff;
  padding: 80px 0 150px;
}

footer#grandfooter p {
  width: 320px;
  margin: 0 auto;
  line-height: 1.8em;
  font-size: 14px;
}

/*
コンテンツ
*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
コンテンツ_end
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*//*# sourceMappingURL=mobile.css.map */