@charset "UTF-8";
/*
 * app568
 */

/* 詳細ページ
--------------------------------------------------------- */
/* 上部のスタートボタン 位置調整 */
.appTopMainimg01 .appTopMainimgIn01 .btn {
  position: absolute;
  top: 81px;
  right: -48px;
}

.appTopMainimg01 .appTopMainimgIn01 .btn a {
  width: 234px;
  padding-top: 233px;
  height: 0;
  position: relative;
  background: url(../../../../img/contents_pc/apps/app568/details/btn_top_start_01.png) no-repeat 0 0;
  z-index: 100;
  -webkit-animation: scaling 2.5s ease 2s infinite both;
  animation: scaling 2.5s ease 2s infinite both;
}

@-webkit-keyframes scaling {
  0% {
    -webkit-transform: scale(1);
  }
  1% {
    -webkit-transform: scale(0.8);
  }
  4% {
    -webkit-transform: scale(1);
  }
  8% {
    -webkit-transform: scale(0.94);
  }
  13%,
  100% {
    -webkit-transform: scale(1);
  }
}
@keyframes scaling {
  0% {
    transform: scale(1);
  }
  1% {
    transform: scale(0.8);
  }
  4% {
    transform: scale(1);
  }
  8% {
    transform: scale(0.94);
  }
  13%,
  100% {
    transform: scale(1);
  }
}

/* hover */
.appTopMainimg01 .appTopMainimgIn01 .btn a:hover {
  background-position: -0px -230px;
}

/* 招待の場合の表示 */
.appTopMainimg01 .appTopMainimgIn01 .btn.invite a {
  background-position: -0px -460px;
}
.appTopMainimg01 .appTopMainimgIn01 .btn.invite a:hover {
  background-position: -0px -690px;
}

/* メインイメージ画像 */
.appTopMainimg01 {
  background: url(../../../../img/contents_pc/apps/app568/details/img_top_mainimg_01.jpg) no-repeat center top;
}

/* ナビゲーションボタン画像 */
#main .appTopNavi01 {
  display: flex;
  justify-content: center;
}

#main .appTopNavi01 li[class^='navi'] {
  width: auto;
  float: none;
}

#main .appTopNavi01 li[class^='navi'] a {
  background: url(../../../../img/contents_pc/apps/app568/details/btn_top_navi_01.png) no-repeat 0 0;
  height: 50px;
}

/* トップ */
#main .appTopNavi01 li.navi01 a,
#main .appTopNavi01 li.navi01 a:hover,
#main .appTopNavi01 li.navi01 a:active {
  width: 181px;
  background-position-x: 0px;
}

/* ギャラリー */
#main .appTopNavi01 li.navi02 a,
#main .appTopNavi01 li.navi02 a:hover,
#main .appTopNavi01 li.navi02 a:active {
  width: 181px;
  background-position-x: -181px;
}

/* 公式コミュニティ */
#main .appTopNavi01 li.navi03 a,
#main .appTopNavi01 li.navi03 a:hover,
#main .appTopNavi01 li.navi03 a:active {
  width: 182px;
  background-position-x: -362px;
}

/* 対応環境 */
#main .appTopNavi01 li.navi04 a,
#main .appTopNavi01 li.navi04 a:hover,
#main .appTopNavi01 li.navi04 a:active {
  width: 182px;
  background-position-x: -545px;
}

/* サポート */
#main .appTopNavi01 li.navi05 a,
#main .appTopNavi01 li.navi05 a:hover,
#main .appTopNavi01 li.navi05 a:active {
  width: 178px;
  background-position-x: -727px;
}

/* hover active */
#main .appTopNavi01 li[class^='navi'] a.active,
#main .appTopNavi01 li[class^='navi'] a:hover {
  background-position-y: -51px;
}

/* 各タイトルの背景画像 */
.appTopTitle01 {
  background: url(../../../../img/contents_pc/apps/app568/details/bg_top_title_01.png) no-repeat left top;
  width: 810px;
}

/* 横長ボタン */
.appTopPlayBtn01 a {
  position: relative;
  width: 460px;
  height: 116px;
  background: url(../../../../img/contents_pc/apps/app568/details/btn_top_start_02.png) no-repeat 0 0;
}

/* hover */
.appTopPlayBtn01 a:hover {
  background-position: 0px -116px;
  top: 0;
}

/* 招待の場合の表示 */
.appTopPlayBtn01.invite a {
  background-position: 0 -232px;
}

.appTopPlayBtn01.invite a:hover {
  background-position: 0 -348px;
}

.appTopContent01 {
  margin: 3px auto 0;
}

/* 見出し */
.appTopTitle01 {
  text-shadow: 0px 0px 5px rgba(255, 255, 255, 1); /* 白地以外 */
  color: #300;
  padding-left: 30px;
  line-height: 39px;
}

/* common修正 */
.appTopSupportBtn01 .btnType02 a > span span {
  padding: 0;
}