@charset "UTF-8";
ul.btns li {
  opacity: 0; }
ul.btns li img {
  transition: transform .6s ease; }
ul.btns li a:hover img {
  transform: scale(1.1);
  /* 拡大 */ }

p.btn img {
  transition: transform .6s ease; }
p.btn img:hover {
  transform: scale(1.1);
  /* 拡大 */ }

#spMv {
  display: none; }

#mv202301 {
  height: 700px;
  background: #f5d833;
  position: relative; }
  #mv202301 #date {
    position: absolute;
    width: 100%;
    border-top: 5px solid #000;
    border-bottom: 5px solid #000;
    background: #fff;
    text-align: center;
    bottom: -28px;
    padding: 20px 0;
    z-index: 0; }
  #mv202301 #mvIn {
    width: 900px;
    margin: 0 auto;
    position: relative; }
    #mv202301 #mvIn #bl1 {
      position: absolute;
      top: 60px;
      left: 40px;
      opacity: 0; }
      #mv202301 #mvIn #bl1 img.bound {
        animation: fluffy1 2s ease 1; }
@keyframes fluffy1 {
  0% {
    transform: translateY(0); }
  5% {
    transform: translateY(0); }
  10% {
    transform: translateY(0); }
  20% {
    transform: translateY(-10px); }
  25% {
    transform: translateY(0); }
  30% {
    transform: translateY(-10px); }
  50% {
    transform: translateY(0); }
  100% {
    transform: translateY(0); } }
    #mv202301 #mvIn h1 {
      position: absolute;
      top: 40px;
      left: 0px;
      opacity: 0;
      z-index: 12; }
    #mv202301 #mvIn #sps p {
      position: absolute;
      top: 160px;
      left: -45px;
      opacity: 0;
      z-index: 10; }
    #mv202301 #mvIn p#c1 {
      position: absolute;
      top: 350px;
      right: -150px;
      opacity: 0;
      z-index: 2; }
      #mv202301 #mvIn p#c1 img {
        width: 50%; }
    #mv202301 #mvIn p#c2 {
      position: absolute;
      top: 430px;
      right: 300px;
      opacity: 0;
      z-index: 1; }

#nandomo {
  background: #fff;
  text-align: center;
  padding: 60px 0 40px 0; }
  #nandomo ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 890px;
    margin: 0 auto;
    padding: 80px 0 0 0; }
    #nandomo ul li {
      width: 265px; }
      #nandomo ul li dl img {
        width: 100%; }
      #nandomo ul li dl dt {
        width: 250px;
        height: 230px;
        display: table-cell;
        vertical-align: bottom; }
      #nandomo ul li dl dd {
        width: 264px;
        opacity: 0; }
        #nandomo ul li dl dd img.bound {
          animation: fluffy1 2s ease 1; }
@keyframes fluffy1 {
  0% {
    transform: translateY(0); }
  5% {
    transform: translateY(0); }
  10% {
    transform: translateY(0); }
  20% {
    transform: translateY(-10px); }
  25% {
    transform: translateY(0); }
  30% {
    transform: translateY(-10px); }
  50% {
    transform: translateY(0); }
  100% {
    transform: translateY(0); } }
#new_app .inner h2 {
  /*width:593px;
  padding-right:80px;*/ }

#new_app .inner .desc {
  width: 617px;
  padding: 30px 0 0 0px; }

#new_app .inner ul {
  padding-left: 0px; }

#new_app .inner ul li {
  width: 150px;
  margin: 0 -10px; }

#new_app .inner ul li.second {
  padding: 90px 0 0 0; }

#sec_coupon, #sec_new, #sec_menu {
  background: #eff0e1; }

 /*.   
    .inner{     
          display: flex;
          justify-content: space-between;
          align-items: center;
      div{width: calc(33.3333% - 60px / 3);
          
       
          p{
              font-size: 28px;
                line-height: 1.4em;
                font-weight: bold;
                margin-bottom: 10px;
              span{
              font-size: 20px;
          }
   
}       }
}
  left{
    text-align: center;
    width:31.33%;
    min-height: 200px;
    dt{
      color:#c40018;
      font-weight: bold;
      font-size:60px;
      width:504px;
      height:42px;
      position: relative;
      span{
        display: block;
        position: absolute;
        width:504px;
        top:0;
        height:42px;
        left:-454px;
        z-index:1;
      }
      b{
        display: block;
        position: absolute;
        width:504px;
        top:0;
        line-height: 0;
        left:-504px;
        z-index:0;
      }
      img{
        width:504px;
      }
    }
    dd{
      font-size:20px;
      padding:20px 0 0 0;
    }
  }
  .img{
    width:31.33%;
    margin:0 50px 0 0 ;

    p.notice{
      text-align: right;
      font-size:12px;
      }
    }*/
#sec_coupon .left {
  background: url("../img/new/bmov1.svg") center center no-repeat;
  background-size: 279px; }
  #sec_coupon .left dt span {
    background: #fff; }

#sec_game .left {
  min-height: 247px;
  background: url("../img/new/bmov2.svg") center center no-repeat;
  background-size: 254px;
  padding: 30px 0 0 0; }
  #sec_game .left dt span {
    background: #e7e4de; }

#sec_new .left {
  min-height: 247px;
  background: url("../img/new/bmov3.svg") center center no-repeat;
  background-size: 247px;
  padding: 30px 0 0 0; }
  #sec_new .left dt span {
    background: #fff; }

#sec_campaign .left {
  min-height: 247px;
  background: url("../img/new/bmov4.svg") center center no-repeat;
  background-size: 250px; }
  #sec_campaign .left dt span {
    background: #e7e4de; }

#sec_menu .left {
  min-height: 247px;
  background: url("../img/new/bmov5.svg") center center no-repeat;
  background-size: 220px;
  padding: 20px 0 0 0; }
  #sec_menu .left dt span {
    background: #fff; }

#sec_shop .left {
  min-height: 247px;
  background: url("../img/new/bmov6.svg") center center no-repeat;
  background-size: 160px;
  padding: 20px 0 0 0; }
  #sec_shop .left dt span {
    background: #e7e4de; }

.trigger_stamp {
  text-align: center;
  padding: 15px 0; }
  .trigger_stamp img {
    width: 390px; }

ul.btns li {
  opacity: 0; }

@media screen and (max-width: 767px) {
  #mv202301 {
    display: none; }

  #nandomo {
    /*background: #f5d833;*/
    text-align: center;
    padding: 50px 5% 70px 5%; }
    #nandomo ul {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      width: 100%;
      margin: 0 auto;
      padding: 40px 0 0 0;
      align-items: baseline; }
      #nandomo ul li {
        width: 32%; }
        #nandomo ul li dl img {
          width: 100%; }
        #nandomo ul li dl dt {
          width: 100%;
          height: 120px;
          display: table-cell;
          vertical-align: bottom; }
        #nandomo ul li dl dd {
          width: 100%;
          opacity: 0; }
          #nandomo ul li dl dd img.bound {
            animation: fluffy1 2s ease 3; }
  @keyframes fluffy1 {
    0% {
      transform: translateY(0); }
    5% {
      transform: translateY(0); }
    10% {
      transform: translateY(0); }
    20% {
      transform: translateY(-10px); }
    25% {
      transform: translateY(0); }
    30% {
      transform: translateY(-10px); }
    50% {
      transform: translateY(0); }
    100% {
      transform: translateY(0); } }
  #new_app .inner h2 {
    /*width:88%;
    padding-right:1%;*/ }

  #new_app .inner .desc {
    width: 100%;
    padding: 15px 0 0 0px; }

  #new_app .inner ul {
    padding-left: 0px; }

  #new_app .inner ul li {
    width: 45%;
    margin: 0 -1%; }

  #new_app .inner ul li.second {
    padding: 45px 0 0 0;
    margin-bottom: -20px; }

  .textImg {
    width: 90%;
    margin: 0 auto;
    display: block;
    padding: 25px 0 25px 0; }
    .textImg .left {
      text-align: center;
      width: 100%;
      min-height: 200px; }
      .textImg .left dt {
        width: 100%;
        height: 42px;
        margin: 0 auto;
        position: relative; }
        .textImg .left dt span {
          display: block;
          position: absolute;
          width: 100%;
          top: 0;
          height: 42px;
          left: -100%;
          z-index: 1; }
        .textImg .left dt b {
          display: block;
          position: absolute;
          width: 100%;
          top: 0;
          line-height: 0;
          left: -100%;
          z-index: 0; }
        .textImg .left dt img {
          width: 100%; }
      .textImg .left dd {
        font-size: 20px;
        padding: 20px 0 0 0; }
    .textImg .img {
      width: 280px;
      margin: 30px auto 0 auto; }
      .textImg .img p.notice {
        text-align: right;
        font-size: 12px; }

  #sec_coupon .left {
    background: url("../img/new/bmov1.svg") center center no-repeat;
    background-size: 279px; }
    #sec_coupon .left dt span {
      background: #fff; }

  #sec_game .left {
    min-height: 247px;
    background: url("../img/new/bmov2.svg") center center no-repeat;
    background-size: 254px;
    padding: 30px 0 0 0; }
    #sec_game .left dt span {
      background: #e7e4de; }

  #sec_new .left {
    min-height: 247px;
    background: url("../img/new/bmov3.svg") center center no-repeat;
    background-size: 247px;
    padding: 30px 0 0 0; }
    #sec_new .left dt span {
      background: #fff; }

  #sec_campaign .left {
    min-height: 247px;
    background: url("../img/new/bmov4.svg") center center no-repeat;
    background-size: 250px; }
    #sec_campaign .left dt span {
      background: #e7e4de; }

  #sec_menu .left {
    min-height: 247px;
    background: url("../img/new/bmov5.svg") center center no-repeat;
    background-size: 220px;
    padding: 20px 0 0 0; }
    #sec_menu .left dt span {
      background: #fff; }

  #sec_shop .left {
    min-height: 247px;
    background: url("../img/new/bmov6.svg") center center no-repeat;
    background-size: 160px;
    padding: 20px 0 0 0; }
    #sec_shop .left dt span {
      background: #e7e4de; }

  .trigger_stamp {
    text-align: center;
    padding: 15px 0; }
    .trigger_stamp img {
      width: 80%; }

  ul.btns li {
    opacity: 0; }
  ul.btns li img {
    transition: transform .6s ease; }
  ul.btns li a:hover img {
    transform: scale(1.2);
    /* 拡大 */
    background: #000; }

  #spMv {
    display: block;
    position: relative;
    background: #f5d833;
    min-height: 750px;
    width: 100%;
    overflow: hidden; }
    #spMv #ttl #h1 {
      position: absolute;
      top: 25px;
      left: 0;
      opacity: 0; }
      #spMv #ttl #h1 img {
        width: 90%; }
    #spMv #ttl #bl2p {
      position: absolute;
      top: 25px;
      left: 7%;
      width: 20%;
      opacity: 0; }
      #spMv #ttl #bl2p img {
        width: 100%; }
      #spMv #ttl #bl2p img.bound {
        animation: fluffy1 2s ease 1; }
  @keyframes fluffy1 {
    0% {
      transform: translateY(0); }
    5% {
      transform: translateY(0); }
    10% {
      transform: translateY(0); }
    20% {
      transform: translateY(-10px); }
    25% {
      transform: translateY(0); }
    30% {
      transform: translateY(-10px); }
    50% {
      transform: translateY(0); }
    100% {
      transform: translateY(0); } }
    #spMv p {
      position: absolute;
      top: 100px;
      left: 0;
      padding: 20px 0 0 0;
      width: 100%;
      opacity: 0; }
      #spMv p img {
        width: 110%; }
    #spMv #spc1 {
      position: absolute;
      bottom: 220px;
      right: -60px;
      opacity: 0;
      width: 200px; }
      #spMv #spc1 img {
        width: 50%; }
    #spMv #spc2 {
      position: absolute;
      top: 170px;
      left: 20px;
      opacity: 0;
      width: 110px; }
      #spMv #spc2 img {
        width: 100%; }
    #spMv #spda {
      position: absolute;
      bottom: 5%;
      left: 0;
      width: 100%;
      border-top: 2px solid #000;
      border-bottom: 2px solid #000;
      background: #fff;
      text-align: center;
      padding: 20px 0 10px 0; }
      #spMv #spda img {
        width: 80%; } }
@media screen and (max-width: 539px) {
  #spMv {
    display: block;
    position: relative;
    background: #f5d833;
    min-height: 595px;
    width: 100%;
    overflow: hidden; }
    #spMv #ttl #h1 {
      position: absolute;
      top: 25px;
      left: 0;
      opacity: 0; }
      #spMv #ttl #h1 img {
        width: 90%; }
    #spMv #ttl #bl2p {
      position: absolute;
      top: 25px;
      left: 7%;
      width: 20%;
      opacity: 0; }
      #spMv #ttl #bl2p img {
        width: 100%; }
      #spMv #ttl #bl2p img.bound {
        animation: fluffy1 2s ease 1; }
  @keyframes fluffy1 {
    0% {
      transform: translateY(0); }
    5% {
      transform: translateY(0); }
    10% {
      transform: translateY(0); }
    20% {
      transform: translateY(-10px); }
    25% {
      transform: translateY(0); }
    30% {
      transform: translateY(-10px); }
    50% {
      transform: translateY(0); }
    100% {
      transform: translateY(0); } }
    #spMv p {
      position: absolute;
      top: 100px;
      left: 0;
      padding: 20px 0 0 0;
      width: 100%;
      opacity: 0; }
      #spMv p img {
        width: 110%; }
    #spMv #spc1 {
      position: absolute;
      bottom: 180px;
      right: -60px;
      opacity: 0;
      width: 200px; }
      #spMv #spc1 img {
        width: 50%; }
    #spMv #spc2 {
      position: absolute;
      top: 140px;
      left: 10px;
      opacity: 0;
      width: 110px; }
      #spMv #spc2 img {
        width: 100%; }
    #spMv #spda {
      position: absolute;
      bottom: 5%;
      left: 0;
      width: 100%;
      border-top: 2px solid #000;
      border-bottom: 2px solid #000;
      background: #fff;
      text-align: center;
      padding: 20px 0 10px 0; }
      #spMv #spda img {
        width: 80%; } }
@media screen and (max-width: 361px) {
  #spMv p {
    top: 115px; } }
@media screen and (max-width: 280px) {
  #spMv {
    display: block;
    position: relative;
    background: #f5d833;
    min-height: 450px;
    width: 105%;
    overflow: hidden;
    padding: 20px 0 0 0; }
    #spMv #ttl #h1 {
      position: absolute;
      top: 40px;
      left: 0;
      opacity: 0; }
      #spMv #ttl #h1 img {
        width: 90%; }
    #spMv #ttl #bl2p {
      position: absolute;
      top: 40px;
      left: 7%;
      width: 20%;
      opacity: 0; }
      #spMv #ttl #bl2p img {
        width: 100%; }
      #spMv #ttl #bl2p img.bound {
        animation: fluffy1 2s ease 1; }
  @keyframes fluffy1 {
    0% {
      transform: translateY(0); }
    5% {
      transform: translateY(0); }
    10% {
      transform: translateY(0); }
    20% {
      transform: translateY(-10px); }
    25% {
      transform: translateY(0); }
    30% {
      transform: translateY(-10px); }
    50% {
      transform: translateY(0); }
    100% {
      transform: translateY(0); } }
    #spMv p {
      position: absolute;
      top: 100px;
      left: 0;
      padding: 20px 0 0 0;
      width: 100%;
      opacity: 0; }
      #spMv p img {
        width: 110%; }
    #spMv #spc1 {
      position: absolute;
      bottom: 100px;
      right: -30px;
      opacity: 0;
      width: 100px; }
      #spMv #spc1 img {
        width: 50%; }
    #spMv #spc2 {
      position: absolute;
      top: 120px;
      left: 10px;
      opacity: 0;
      width: 80px; }
      #spMv #spc2 img {
        width: 100%; }
    #spMv #spda {
      position: absolute;
      bottom: 5%;
      left: 0;
      width: 100%;
      border-top: 2px solid #000;
      border-bottom: 2px solid #000;
      background: #fff;
      text-align: center;
      padding: 20px 0 10px 0; }
      #spMv #spda img {
        width: 80%; }

  #nandomo, #new_app, #sec_coupon, #sec_game, #sec_new, #sec_campaign, #sec_menu, #sec_shop, #regist, #use {
    /*width:105%;*/ }

  .textImg .img img {
    width: 80%;
    display: block;
    margin: 0 auto; } }
.loading {
  width: 100vw;
  height: 100vh;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0; }

.loading img {
  width: 100px; }