/************************************
	State
************************************/
/************************************
	hack
************************************/
.ua-edge {
  overflow-x: hidden; }

/************************************
	header
************************************/
.gnav-list {
  transition: right linear .2s; }
  .gnav-list-item.is-current .text-image .text-image-default {
    opacity: 0;
    visibility: hidden; }
  .gnav-list-item.is-current .text-image .text-image-active {
    opacity: 1;
    visibility: visible; }
  .gnav-list-item.is-current .text {
    color: #FACD46;
    text-shadow: 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8), 0 0 3px rgba(148, 0, 0, 0.8); }

.gnav.is-active .gnav-btn {
  background-image: url(../images/common/header_nav_btn-close.png); }

.gnav.is-active .gnav-list {
  right: 0; }

/************************************
	module
************************************/
.movie-bg.is-scr::before {
  opacity: 1; }

.movie-bg.is-disable .movie-bg-player {
  display: none; }

.movie-bg.is-disable .image-bg {
  background-position: center;
  background-repeat: no-repeat;
  background-size: 125%;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  transition: background-image .2s ease-in;
  width: 100%; }
  @media only screen and (min-width: 769px) {
    .movie-bg.is-disable .image-bg {
      background-size: cover; } }

/************************************
	Page
************************************/
/****** introduction ******/
.sec#introduction .conts-intro .link-btn {
  opacity: 0;
  transition: opacity .2s ease-in 2s, z-index .2s ease-in 2s;
  z-index: -1; }

.sec#introduction .conts-intro.is-active .link-btn {
  opacity: 1;
  z-index: 2; }

.sec#introduction .conts-intro.is-active .image-box .mask-effect {
  animation: mask-effect 1s steps(9) 0.5s forwards; }

/****** gameplay ******/
.sec#gameplay .conts-play .slide-inner .tab.is-active {
  display: block; }

.sec#gameplay .conts-play .slide-inner .tab-list-item.is-active {
  background: #991111; }