@charset "UTF-8";
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
th,
td,
button,
figure,
figcaption {
  margin: 0;
  padding: 0;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
fieldset,
img {
  border: 0;
}
address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-style: normal;
  font-weight: normal;
}
ol,
ul {
  list-style: none;
}
caption,
th {
  text-align: left;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}
a {
  color: inherit;
  text-decoration: none;
}
q:before,
q:after {
  content: '';
}
abbr,
acronym {
  border: 0;
  font-variant: normal;
}
sup {
  vertical-align: text-top;
}
sub {
  vertical-align: text-bottom;
}
input,
textarea,
select,
button {
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
input,
textarea,
select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}
input,
textarea,
select {
  *font-size: 100%;
}
legend {
  color: #000;
}
i {
  display: block;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  width: 100%;
  height: 100%;
  min-width: 980px;
  position: relative;
  background: url("../../image/bg.jpg") #e61200;
  background-size: cover;
  background-position: center center;
  font-family: 'Noto Sans JP', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', Arial, Osaka, Sans-Serif;
  -webkit-text-size-adjust: none;
  -webkit-font-smoothing: antialiased;
  font-size: 62.5%;
  font-weight: 400;
  line-height: 1.8em;
  color: #555;
  letter-spacing: 0.05em;
  line-height: 1.6;
  font-feature-settings: "palt";
}
img {
  display: block;
  width: 100%;
  height: auto;
  border: 0;
  outline: none;
}
.container {
  position: relative;
  overflow: hidden;
}
.header {
  position: absolute;
  z-index: 9999;
  top: 0;
  right: 0;
}
.header-logo {
  width: 100px;
  position: absolute;
  top: 0;
  right: 0;
}
.footer {
  width: 100%;
  position: relative;
  z-index: 100;
  background: url("../../common/img/footer/bg01.jpg") center center no-repeat;
  background-size: cover;
}
.footer .footer-logo {
  width: 18.27%;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 0;
}
.footer .footer-menu {
  width: 59.87%;
  margin: 0 auto;
  padding: 0.85% 0;
  position: relative;
  z-index: 1;
  -webkit-transition: 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
          transition: 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.footer .footer-menu:after {
  content: "";
  display: block;
  clear: both;
}
.footer .footer-menu li {
  float: left;
  margin: 0;
  padding: 0;
  cursor: pointer;
}
.footer .footer-menu li a {
  display: block;
}
.footer .footer-menu li a:hover img {
  opacity: 0;
}
.footer .footer-menu .menu_introduction {
  width: 18.91%;
}
.footer .footer-menu .menu_introduction a:hover {
  background: url("../../common/img/footer/fmenu01_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu .menu_action {
  width: 23.44%;
}
.footer .footer-menu .menu_action a:hover {
  background: url("../../common/img/footer/fmenu02_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu .menu_adventure {
  width: 24.95%;
}
.footer .footer-menu .menu_adventure a:hover {
  background: url("../../common/img/footer/fmenu03_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu .menu_guide {
  width: 20.19%;
}
.footer .footer-menu .menu_guide a:hover {
  background: url("../../common/img/footer/fmenu04_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu .menu_amiibo {
  width: 12.3%;
}
.footer .footer-menu .menu_amiibo a:hover {
  background: url("../../common/img/footer/fmenu05_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu li.is-enter {
  cursor: default;
}
.footer .footer-menu li.is-enter a {
  pointer-events: none;
}
.footer .footer-menu li.is-enter a img {
  opacity: 0;
}
.footer .footer-menu li.is-enter a:hover {
  background: none;
}
.footer .footer-menu .menu_introduction.is-enter {
  background: url("../../common/img/footer/fmenu01_current.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu .menu_introduction.is-enter a {
  background: url("../../common/img/footer/fmenu01_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu .menu_action.is-enter {
  background: url("../../common/img/footer/fmenu02_current.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu .menu_action.is-enter a {
  background: url("../../common/img/footer/fmenu02_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu .menu_adventure.is-enter {
  background: url("../../common/img/footer/fmenu03_current.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu .menu_adventure.is-enter a {
  background: url("../../common/img/footer/fmenu03_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu .menu_guide.is-enter {
  background: url("../../common/img/footer/fmenu04_current.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu .menu_guide.is-enter a {
  background: url("../../common/img/footer/fmenu04_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu .menu_amiibo.is-enter {
  background: url("../../common/img/footer/fmenu05_current.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-menu .menu_amiibo.is-enter a {
  background: url("../../common/img/footer/fmenu05_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-link-list {
  padding: 0;
  vertical-align: middle;
  background: rgba(0,0,0,0.6);
  position: relative;
  z-index: 1;
}
.footer .footer-link-list:after {
  content: "";
  display: block;
  clear: both;
}
.footer .footer-link-list .footer-link-item {
  float: left;
}
.footer .footer-link-list .footer-link-item a {
  display: block;
  position: relative;
}
.footer .footer-link-list .footer-link-item a:hover img {
  opacity: 0;
}
.footer .footer-link-list .footer-link-item:nth-child(1) {
  width: 9.73%;
}
.footer .footer-link-list .footer-link-item:nth-child(1) a:hover {
  background: url("../../common/img/footer/gfmenu01_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-link-list .footer-link-item:nth-child(2) {
  width: 11.39%;
}
.footer .footer-link-list .footer-link-item:nth-child(2) a:hover {
  background: url("../../common/img/footer/gfmenu02_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-link-list .footer-link-item:nth-child(3) {
  width: 14.17%;
}
.footer .footer-link-list .footer-link-item:nth-child(3) a:hover {
  background: url("../../common/img/footer/gfmenu03_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-link-list .footer-link-item:nth-child(4) {
  width: 7.92%;
}
.footer .footer-link-list .footer-link-item:nth-child(4) a:hover {
  background: url("../../common/img/footer/gfmenu04_hover.png") left top no-repeat;
  background-size: 100%;
}
.footer .footer-copy {
  margin: 0 10.5% 0.7% 0;
  font-size: 0.6944vw;
  font-weight: bold;
  color: rgba(255,255,255,0.5);
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;
}
@media only screen and (max-width: 960px) {
  .footer .footer-copy {
    font-size: 7px;
  }
}
.footer-pagetop {
  width: 25.7%;
  position: absolute;
  bottom: -52%;
  right: 0;
  z-index: 2;
}
.footer-pagetop {
  width: 10.14%;
  bottom: 0;
  right: 0;
  -webkit-transform: translate3d(-7%, 18%, 0);
          transform: translate3d(-7%, 18%, 0);
}
.footer-pagetop a {
  display: block;
}
.footer-pagetop a:hover .footer-pagetop-hidden {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.footer-pagetop a:hover .footer-pagetop-head {
  -webkit-transform: translate3d(0, 17%, 0);
  transform: translate3d(0, 17%, 0);
}
.footer-pagetop-cap {
  padding-left: 6.4%;
}
.footer-pagetop-cap img {
  -webkit-animation: footer-floating-y 3s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite;
  animation: footer-floating-y 3s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite;
}
.footer-pagetop-hidden {
  position: absolute;
  top: 0;
  margin-top: 83%;
  left: 23%;
  width: 55%;
  -webkit-transform: translate3d(0, 200%, 0);
  transform: translate3d(0, 200%, 0);
  -webkit-transition: 0.5s cubic-bezier(0.19, 1, 0.22, 1);
  transition: 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
.footer-pagetop-head {
  position: relative;
  z-index: 1;
  -webkit-transition: 0.5s cubic-bezier(0.19, 1, 0.22, 1);
  transition: 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
@-webkit-keyframes footer-floating-y {
  0%, 100% {
    -webkit-transform: translate3d(0, -8px, 0);
    transform: translate3d(0, -8px, 0);
  }
  50% {
    -webkit-transform: translate3d(0, 8px, 0);
    transform: translate3d(0, 8px, 0);
  }
}
.modal {
  position: fixed;
  z-index: 10200;
  opacity: 0;
  display: none;
  width: 100%;
  height: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  background-color: rgba(0,0,0,0.85);
  cursor: pointer;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
.modal-inside {
  width: 100%;
  min-height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  text-align: center;
  pointer-events: none;
}
@media only screen and (min-width: 801px) {
  .modal-inside {
    min-width: 1000px;
  }
}
.modal-area {
  padding: 40px 0;
  pointer-events: auto;
}
@media only screen and (max-width: 800px) {
  .modal-area {
    width: 80%;
  }
}
@media only screen and (min-width: 801px) {
  .modal-area {
    width: 1000px;
  }
}
.modal-contents {
  opacity: 0;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  cursor: auto;
}
.modal.is-enter {
  display: block;
  -webkit-animation-name: anime-enter;
  animation-name: anime-enter;
  -webkit-animation-duration: 0.15s;
  animation-duration: 0.15s;
}
.modal.is-enter .modal-contents {
  -webkit-animation-name: anime-enter;
  animation-name: anime-enter;
  -webkit-animation-duration: 0.15s;
  animation-duration: 0.15s;
}
.modal.is-leave {
  -webkit-animation-name: anime-leave;
  animation-name: anime-leave;
  -webkit-animation-duration: 0.1s;
  animation-duration: 0.1s;
}
.modal-movie {
  position: relative;
  width: 100%;
}
.modal-movie-frame {
  width: 100%;
  height: 0;
  padding-top: 56.25%;
  position: relative;
  background-color: #000;
}
.modal-movie-frame iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
@-webkit-keyframes anime-enter {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes anime-leave {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.c-font-serif {
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", serif;
  font-weight: bold;
}
.c-frame {
  border-width: 10px;
  border-width: 0.7vw;
  border-color: #fff;
  border-style: solid;
  box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.45);
}
@media only screen and (max-width: 960px) {
  .c-frame {
    border: 7.2px solid #fff;
  }
}
.c-movie {
  position: relative;
  background-color: #fff;
  overflow: hidden;
}
.c-movie:before {
  content: '';
  width: 100%;
  height: 0;
  padding-top: 56.3%;
  display: block;
}
.c-movie:after {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  width: 200%;
  height: 0;
  padding-top: 200%;
  top: 50%;
  left: 50%;
  margin: -100% 0 0 -100%;
  background-color: #fff;
  border-radius: 50%;
  pointer-events: none;
}
.c-movie iframe,
.c-movie video,
.c-movie-fallback {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.c-movie iframe,
.c-movie video {
  pointer-events: none;
}
/*----------------------
contents setting
-----------------------*/
#wrap {
  width: 100%;
  height: 100%;
  height: calc(100% - 41px);
  overflow: hidden;
  position: relative;
}
#logo_switch {
  position: absolute;
  top: 0;
  right: 0;
  width: 135px;
  height: 135px;
}
#logo_switch img {
  width: 100%;
  height: auto;
}
#contentsWrap {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 600px;
  height: 460px;
  z-index: 10;
  text-align: center;
}
#contentsWrap #logo {
  width: 70%;
  height: auto;
}
#contentsWrap #text_pc {
  margin-top: 30px;
  margin-bottom: 20px;
  width: 70%;
  height: auto;
}
#contentsWrap #exp {
  color: #fff;
  font-size: 3.2em;
  line-height: 1.8em;
  font-weight: bold;
  filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.8));
}
/*--------------------------
    within 640px for sp
----------------------------*/
@media screen and (max-width: 640px) {
  body {
    min-height: 600px;
  }
  #wrap {
    width: 100%;
    height: 470px;
    position: relative;
    overflow: visible;
    top: 0;
  }
  #contentsWrap {
    padding: 100px 0 50px 0;
    position: inherit;
    width: 90%;
    height: auto;
  }
  #contentsWrap #logo {
    width: 80%;
    height: auto;
  }
  #contentsWrap #text_pc {
    margin-bottom: 10px;
    width: 90%;
  }
  #logo_switch {
    position: absolute;
    top: 0;
    right: 0;
    width: 75px;
    height: 75px;
  }
  #contentsWrap #exp {
    font-size: 2.5em;
  }
}
/*--------------------------
    sp held horizontally
----------------------------*/
@media screen and (orientation: landscape) {
  body {
    min-height: 750px;
  }
}
.page-bg {
  z-index: 0;
}
.page-body {
  z-index: 1;
}
.loading {
  width: 100%;
  width: 100vw;
  height: 100%;
  height: 100vh;
  position: fixed;
  overflow: hidden;
  top: 0;
  left: 0;
  z-index: 10201;
  background-color: #e61200;
  will-change: transform;
}
.loading.is-leave {
  -webkit-transform: translate3d(100%, 0, 0);
  transform: translate3d(100%, 0, 0);
  -webkit-transition-timing-function: cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition-timing-function: cubic-bezier(0.895, 0.03, 0.685, 0.22);
}
.loading.is-leave .loading-progress {
  -webkit-transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
  transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
}
.loading-progress {
  width: 120%;
  position: absolute;
  top: 50%;
  height: 48px;
  margin-top: 24px;
  -webkit-transform: translate3d(-108%, 0, 0);
  transform: translate3d(-108%, 0, 0);
  -webkit-transition: 2s linear;
  transition: 2s linear;
  will-change: transform;
}
.loading-line {
  width: 100%;
  height: 4px;
  margin-top: 24px;
  background-color: #fff;
}
.loading-cap {
  width: 94px;
  position: absolute;
  right: -60px;
  bottom: 13px;
}
.menu {
  width: 16.25%;
  min-width: 156px;
  position: fixed;
  top: 40%;
  left: -15.5%;
  z-index: 9999;
  -webkit-transition: 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
          transition: 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
@media only screen and (max-width: 960px) {
  .menu {
    left: -148px;
  }
}
.menu:hover {
  left: 0;
}
.menu ul {
  width: 100%;
  position: absolute;
  z-index: 1;
  top: 10%;
  left: 0;
}
.menu ul li {
  margin: 0;
  padding: 0;
  background: url("../../common/img/menu/menu_arrow_off.png") 94% center no-repeat;
  background-size: 6.42% auto;
  -webkit-transition: 0.3s;
          transition: 0.3s;
  visibility: visible;
  opacity: 1;
  cursor: pointer;
}
.menu ul li:hover {
  opacity: 0.6;
}
.menu ul li.is-enter {
  background: url("../../common/img/menu/menu_arrow_on.png") 94% center no-repeat;
  background-size: 6.42% auto;
  cursor: default;
}
.menu ul li.is-enter:hover {
  visibility: visible;
  opacity: 1 !important;
}
.menu ul li.is-enter a {
  display: block;
  pointer-events: none;
}
.menu .menu-btn {
  width: 22.65%;
  position: absolute;
  top: 11%;
  left: 100%;
  z-index: 1;
  cursor: pointer;
  -webkit-transition: opacity 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
          transition: opacity 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.menu .menu-btn .btn-box {
  width: 50%;
  margin: 0 auto;
  padding-top: 36%;
  position: absolute;
  top: 17%;
  left: 21.3%;
}
.menu .menu-btn .btn-box span {
  width: 100%;
  height: 3px;
  background-color: #d52b23;
  position: absolute;
  left: 0;
  -webkit-transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
          transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.menu .menu-btn .btn-box span:nth-of-type(1) {
  top: 0;
}
.menu .menu-btn .btn-box span:nth-of-type(2) {
  top: 44%;
}
.menu .menu-btn .btn-box span:nth-of-type(3) {
  bottom: 0;
}
@media only screen and (max-width: 960px) {
  .menu .menu-btn .btn-box span {
    height: 2px;
  }
}
.menu .page-bg {
  box-shadow: 0 5px 5px 5px rgba(0,0,0,0.5);
  border-radius: 0 12px 12px 0;
  position: relative;
  z-index: 0;
}
#dot_mario {
  margin: 0 0 6.2% 0;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 99;
  -webkit-animation: dot-mario-pass 40s linear infinite;
          animation: dot-mario-pass 40s linear infinite;
  -webkit-transform: translate3d(-100%, 0, 0);
          transform: translate3d(-100%, 0, 0);
}
#dot_mario span {
  width: 100%;
  display: block;
  -webkit-animation: dot-mario-walk 0.3s steps(3) infinite;
          animation: dot-mario-walk 0.3s steps(3) infinite;
}
.dot_mario_top {
  width: 2.5%;
}
.dot_mario_top span {
  padding-top: 177.78%;
}
.dot_mario_top .dot_mario_top_walk {
  background: url("../../common/img/makaxubi476rrio/top_mario/top_mario_walk.png") 0 0 no-repeat;
  background-size: 300%;
}
.dot_mario_top .dot_mario_top_num {
  background: url("../../common/img/makaxubi476rrio/top_mario/top_mario_num.png") 0 0 no-repeat;
  background-size: 300%;
}
.dot_mario_introduction {
  width: 2.64%;
}
.dot_mario_introduction span {
  padding-top: 184.22%;
}
.dot_mario_introduction .dot_mario_introduction_walk {
  background: url("../../common/img/makaxubi476rrio/introduction_mario/introduction_mario_walk.png") 0 0 no-repeat;
  background-size: 300%;
}
.dot_mario_introduction .dot_mario_introduction_num {
  background: url("../../common/img/makaxubi476rrio/introduction_mario/introduction_mario_num.png") 0 0 no-repeat;
  background-size: 300%;
}
.dot_mario_action {
  width: 2.5%;
}
.dot_mario_action span {
  padding-top: 188.89%;
}
.dot_mario_action .dot_mario_action_walk {
  background: url("../../common/img/makaxubi476rrio/action_mario/action_mario_walk.png") 0 0 no-repeat;
  background-size: 300%;
}
.dot_mario_action .dot_mario_action_num {
  background: url("../../common/img/makaxubi476rrio/action_mario/action_mario_num.png") 0 0 no-repeat;
  background-size: 300%;
}
.dot_mario_adventure {
  width: 3.06%;
}
.dot_mario_adventure span {
  padding-top: 168.19%;
}
.dot_mario_adventure .dot_mario_adventure_walk {
  background: url("../../common/img/makaxubi476rrio/adventure_mario/adventure_mario_walk.png") 0 0 no-repeat;
  background-size: 300%;
}
.dot_mario_adventure .dot_mario_adventure_num {
  background: url("../../common/img/makaxubi476rrio/adventure_mario/adventure_mario_num.png") 0 0 no-repeat;
  background-size: 300%;
}
.dot_mario_guide {
  width: 2.78%;
}
.dot_mario_guide span {
  padding-top: 170%;
}
.dot_mario_guide .dot_mario_guide_walk {
  background: url("../../common/img/makaxubi476rrio/guide_mario/guide_mario_walk.png") 0 0 no-repeat;
  background-size: 300%;
}
.dot_mario_guide .dot_mario_guide_num {
  background: url("../../common/img/makaxubi476rrio/guide_mario/guide_mario_num.png") 0 0 no-repeat;
  background-size: 300%;
}
.dot_mario_amiibo {
  width: 2.64%;
}
.dot_mario_amiibo span {
  padding-top: 184.22%;
}
.dot_mario_amiibo .dot_mario_amiibo_walk {
  background: url("../../common/img/makaxubi476rrio/amiibo_mario/amiibo_mario_walk.png") 0 0 no-repeat;
  background-size: 300%;
}
.dot_mario_amiibo .dot_mario_amiibo_num {
  background: url("../../common/img/makaxubi476rrio/amiibo_mario/amiibo_mario_num.png") 0 0 no-repeat;
  background-size: 300%;
}
#dot_mario.is-click {
  cursor: pointer;
}
#dot_mario2.is-click {
  cursor: pointer;
}
.dot_mario2_click.is-click {
  cursor: pointer;
}
.odyssey_obj {
  width: 5.28%;
  min-width: 44px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 98;
}
.odyssey_obj span {
  display: block;
  width: 100%;
  padding-top: 264.48%;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transform: translate3d(-100%, 0, 0);
          transform: translate3d(-100%, 0, 0);
  -webkit-animation: odysseypass 160s linear 3s forwards, odysseymove 1.2s steps(2) infinite;
          animation: odysseypass 160s linear 3s forwards, odysseymove 1.2s steps(2) infinite;
}
.odyssey_obj .odyssey_0 {
  background: url("../../common/img/makaxubi476rrio/odyssey/odyssey.png") 0 0 no-repeat;
  background-size: 200%;
}
.odyssey_obj .odyssey_a {
  background: url("../../common/img/makaxubi476rrio/odyssey/odyssey_a.png") 0 0 no-repeat;
  background-size: 200%;
}
.odyssey_obj .odyssey_b {
  background: url("../../common/img/makaxubi476rrio/odyssey/odyssey_b.png") 0 0 no-repeat;
  background-size: 200%;
}
.odyssey_obj .odyssey_c {
  background: url("../../common/img/makaxubi476rrio/odyssey/odyssey_c.png") 0 0 no-repeat;
  background-size: 200%;
}
.odyssey_obj .odyssey_d {
  background: url("../../common/img/makaxubi476rrio/odyssey/odyssey_d.png") 0 0 no-repeat;
  background-size: 200%;
}
.odyssey_obj .odyssey_e {
  background: url("../../common/img/makaxubi476rrio/odyssey/odyssey_e.png") 0 0 no-repeat;
  background-size: 200%;
}
.odyssey_obj .odyssey_f {
  background: url("../../common/img/makaxubi476rrio/odyssey/odyssey_f.png") 0 0 no-repeat;
  background-size: 200%;
}
.odyssey_obj .odyssey_g {
  background: url("../../common/img/makaxubi476rrio/odyssey/odyssey_g.png") 0 0 no-repeat;
  background-size: 200%;
}
.odyssey_obj.is-click {
  cursor: pointer;
}
@-webkit-keyframes footer-floating-y {
  0%, 100% {
    -webkit-transform: translate3d(0, -8px, 0);
    transform: translate3d(0, -8px, 0);
  }
  50% {
    -webkit-transform: translate3d(0, 8px, 0);
    transform: translate3d(0, 8px, 0);
  }
}
@keyframes footer-floating-y {
  0%, 100% {
    -webkit-transform: translate3d(0, -8px, 0);
    transform: translate3d(0, -8px, 0);
  }
  50% {
    -webkit-transform: translate3d(0, 8px, 0);
    transform: translate3d(0, 8px, 0);
  }
}
@-webkit-keyframes anime-enter {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes anime-enter {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes anime-leave {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes anime-leave {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes active-menu-bar02 {
  100% {
    height: 0;
  }
}
@keyframes active-menu-bar02 {
  100% {
    height: 0;
  }
}
@-webkit-keyframes dot-mario-pass {
  0% {
    -webkit-transform: translate3d(-1000%, 0, 0);
            transform: translate3d(-1000%, 0, 0);
  }
  100% {
    -webkit-transform: translate3d(4581%, 0, 0);
            transform: translate3d(4581%, 0, 0);
  }
}
@keyframes dot-mario-pass {
  0% {
    -webkit-transform: translate3d(-1000%, 0, 0);
            transform: translate3d(-1000%, 0, 0);
  }
  100% {
    -webkit-transform: translate3d(4581%, 0, 0);
            transform: translate3d(4581%, 0, 0);
  }
}
@-webkit-keyframes dot-mario-walk {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 150% 0;
  }
}
@keyframes dot-mario-walk {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 150% 0;
  }
}
@-webkit-keyframes odysseymove {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 200% 0;
  }
}
@keyframes odysseymove {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 200% 0;
  }
}
@-webkit-keyframes odysseypass {
  0% {
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }
  20% {
    -webkit-transform: translate3d(1794%, 450%, 0);
            transform: translate3d(1794%, 450%, 0);
  }
  40% {
    -webkit-transform: translate3d(0%, 900%, 0);
            transform: translate3d(0%, 900%, 0);
  }
  60% {
    -webkit-transform: translate3d(1794%, 1350%, 0);
            transform: translate3d(1794%, 1350%, 0);
  }
  80% {
    -webkit-transform: translate3d(0%, 1800%, 0);
            transform: translate3d(0%, 1800%, 0);
  }
  100% {
    -webkit-transform: translate3d(1794%, 2250%, 0);
            transform: translate3d(1794%, 2250%, 0);
  }
}
@keyframes odysseypass {
  0% {
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }
  20% {
    -webkit-transform: translate3d(1794%, 450%, 0);
            transform: translate3d(1794%, 450%, 0);
  }
  40% {
    -webkit-transform: translate3d(0%, 900%, 0);
            transform: translate3d(0%, 900%, 0);
  }
  60% {
    -webkit-transform: translate3d(1794%, 1350%, 0);
            transform: translate3d(1794%, 1350%, 0);
  }
  80% {
    -webkit-transform: translate3d(0%, 1800%, 0);
            transform: translate3d(0%, 1800%, 0);
  }
  100% {
    -webkit-transform: translate3d(1794%, 2250%, 0);
            transform: translate3d(1794%, 2250%, 0);
  }
}
