html, body {
  background: url("../img/bg_sm.jpg") center no-repeat #06121e fixed;
  color: #f2f2f2;
  overflow-y: auto;/* スマホでの右ズレ回避 */
  font-family: 'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
}

h1,
h2,
h3,
h4,
h5,
h6,
.h2,.h4 {
  font-weight: bold;
  }
a {
  color: #ffc107;
  }
a:hover {
  color: #FEF5BD;
  }

/*  キャッチコピー  */
header p.h2 {
  margin-top: -0.5rem;
  }
/*  section指定  */
section {
  clear: both;
  }
/*  eShopリンク  */
section.store {
  overflow: auto;
  }
section.store .store-top {/* ページトップのeShopリンクの枠 */
  background-color: rgba(0,0,0,0.6);
  padding: 0.75rem 0 0.1rem;
  }
section.store .btn:hover {
  box-shadow: 0px 0px 30px 3px rgba(255,255,255,0.7);
  }

/* 各section 枠と背景*/
.about-blue,.about-green, .about-pink, .about-yellow, .about-gray {
  padding: 3rem 1rem 2rem;
  }
.about-blue {
  border-top: 8px double #1e90ff;
  background-color: rgba(1,7,12,0.9);
  }
.about-green {
  border-top: 8px double #2ed573;
  background-color: rgba(1,7,4,0.9);
  }
.about-pink {
  border-top: 8px double #ff6348;
  background-color: rgba(12,4,3,0.9);
  }
.about-yellow {
  border-top: 8px double #f9ca24;
  background-color: rgba(5,4,0,0.9);
  }

/* showcase 画像の枠  */
.b-blue {
  margin: 0.1rem;
  box-shadow: 0px 0px 8px 2px #84C3FF;
  }
.b-green {
  margin: 0.1rem;
  box-shadow: 0px 0px 8px 2px #83D3A3;
  }
.b-yellow {
  margin: 0.1rem;
  box-shadow: 0px 0px 8px 2px #F7DD88;
  }
.b-pink {
  margin: 0.1rem;
  box-shadow: 0px 0px 8px 2px #FFBAAF;
  }

/* ネオン風の見出し */
.neon-pink,.neon-green,.neon-blue,.neon-yellow {
  color: #fff;
  letter-spacing: 0.1rem;
  }
.neon-pink {
  text-shadow: 0 1px 30px #ff6348, 0 0 12px #fff, 2px 5px 60px #990a52;
  -webkit-text-stroke: 1px #CC0E70;
  }
.neon-green {
  text-shadow: 0 1px 30px #2ed573, 0 0 12px #fff, 2px 5px 60px #7bed9f;
  -webkit-text-stroke: 1px #7bed9f;
  }
.neon-blue {
  text-shadow: 0 1px 30px #1e90ff, 0 0 12px #fff, 2px 5px 60px #70a1ff;
  -webkit-text-stroke: 1px #70a1ff;
  }
.neon-yellow {
  text-shadow: 0 1px 20px #f9ca24, 0 0 12px #fff, 2px 5px 60px #f9ca24;
  -webkit-text-stroke: 1px #DDB121;
  }
.neon-none {
  text-shadow: none;
  -webkit-text-stroke: 0;
}
/*  動画表示  */
.video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
  }
.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  }

/*  各画像と説明テキスト  */
section .showcase-gallery {
  padding-bottom: 5px;
  }
section .showcase-gallery p {
  margin: 0.5rem 0 0.5rem;
  }
/*  Table内の画像指定  */
.table td img {
  max-width: 30px;
  }
/*     footer      */
footer .container {
  background-color: rgba(0,0,0,0.95);
  border-top: 8px double #dee2e6;
  border-bottom: 8px double #dee2e6;
  color: #dee2e6;
  }
hr {
    height: 1;
    border-color: #444;
    margin-top: 0;
    }
/*   スクロールボタン   */
#fixedTop {
    right: 1.5rem;
    bottom: 1rem;
    width: 80px;
    height: 90px;
    text-align: center;
    display: none;
    position: fixed;
    z-index: 9999;
    -webkit-transform: translateZ(0);
    background: url(../img/character/enemy_05B.png) center bottom no-repeat;
    background-size: cover;
    font-weight: bold;
    padding-bottom: 0.5rem;
    border-radius: 8px;
  }
#fixedTop:hover {
    background: url(../img/character/enemy_04B.png) center no-repeat;
    background-size: cover;
    text-decoration: none;
  }
@media (max-width:768px) {
  #fixedTop {
      right: 5px;
      bottom: 0;
      width: 64px;
      height: 72px;
      font-size: 0.8rem;
      background-color: rgba(0,0,0,0.3);
    }
  }

/*     レシポンシブ調整     */

@media (max-width:576px) {
  footer .list-inline .xs-none {
    display: none;
    }
  }

@media (min-width:325px) {
    html, body {
      background-size: auto 100%;
      height: 100%;
    }
    header {/* 天井からeShopリンクまでの距離 */
      margin-bottom: 10rem;
    }
    header .container {/* 両端アイコンの隙間 */
      padding: 5px;
    }
    header .title_logo img {/* タイトルロゴ */
      width: 85% !important;
      margin-top: 0.5rem;
    }
    header .h2 {
      font-size: 1.25rem;
      margin: 0;
    }
    header .bland-switch {/* Switchロゴ */
      width: 40px;
      margin: 0;
    }
    header .bland-steam {/* Steamロゴ */
      width: 110px;
    }
    header .bland-tozai {/* Tozaiロゴ */
      width: 70px;
    }
    section.store .store-top .h4 {
      font-size: 1.25rem;
    }
    section.store img {
      max-width: 100px;
    }
    section.showcase h2 {
      font-size: 1.25rem;
    }
    .col-lg-6, .col-md {
      padding-right: 0px;
      padding-left: 0px;
    }
    .spec .container {
      padding-right: 5px;
      padding-left: 5px;
    }
    .table td,
    .table th {
      padding: 0.75rem 0.25rem;
      font-size: small;
    }
    .d-xs-none {/* スマホのみ表示 */
      visibility:hidden;
    }
    footer .list-inline-item {
      display: block;
      width: 100%;
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }
  }
@media (min-width:576px) {
    html, body {
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
      height: auto;
    }
    header .title_logo img {/* タイトルロゴ */
      width: 65% !important;
    }
    header .title_logo p {
      font-size: 1.25rem;
      margin-top: -0.75rem;
   }
    section.store .store-top {
      padding: 0.5rem 0 0.1rem;
    }
    .d-xs-none {
      visibility: visible;
    }
    footer .list-inline-item {
      display: inline-block;
      width: auto;
    }
  }
@media (min-width:768px) {
    header {
      margin -bottom: 12rem;
    }
    header .container {
      padding: 10px 0;
    }
    header .title_logo img {/* タイトルロゴ */
      width: 60% !important;
      margin-top: -2rem;
    }
    header .title_logo .h2 {
      font-size: 1.25rem;
    }
    header .bland-switch {/* Switchロゴ */
      width: 60px;
      margin-right: 1rem;
    }
    header .bland-steam {/* Steamロゴ */
      width: 150px;
    }
    header .bland-tozai {/* Tozaiロゴ */
      width: 90px;
    }
    section.store .store-top {/* eShopリンク右寄せ */
      float: right;
      padding: 1rem 1.5rem 0.25rem;
    }
    section.showcase h2 {
      font-size: 2rem;
    }
    .col-lg-6, .col-md {
      padding-right: 15px;
      padding-left: 15px;
    }
    .table {
      width: 75%;
      max-width: 100%;
    }
    .table td,
    .table th {
      padding: 0.75rem;
      font-size: 1rem;
    }
  }
@media (min-width:992px) {
    header {
      margin-bottom: 14rem;
    }
    header .title_logo img {/* タイトルロゴ */
      width: 45% !important;
    }
    header .title_logo .h2 {
      font-size: 1.75rem;
    }
    section.store .store-top .h4 {
      font-size: 1.5rem;
    }
    section.store img {
      max-width: 140px;
    }
  }
@media (min-width:1200px) {
    header {
      margin-bottom: 14rem;
    }
    header .title_logo img {/* タイトルロゴ */
      width: 50% !important;
      margin-top: -3rem;
    }
    header .bland-switch {/* Switchロゴ */
      width: 80px;
      margin-right: 0.5rem;
    }
    header .bland-steam {/* Steamロゴ */
      width: 180px;
    }
    header .bland-tozai {/* Tozaiロゴ */
      width: 120px;
    }
    .link {
      text-align: right;
    }
  }
@media (min-width:1366px) {
    header {
      margin-bottom: 20rem;
    }
    header .title_logo img {/* タイトルロゴ */
      width: 45% !important;
    }
  }