@charset "UTF-8";
.balloon {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
@media screen and (min-width: 768px) {
  .balloon__1 {
    position: absolute;
    top: calc(862 / 1920 * 100vw);
    left: calc(108 / 1920 * 100vw);
    width: calc(168 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__1 {
    position: absolute;
    top: calc(807 / 750 * 100vw);
    left: calc(13 / 750 * 100vw);
    width: calc(94 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__2 {
    position: absolute;
    top: calc(1219 / 1920 * 100vw);
    left: calc(-65 / 1920 * 100vw);
    width: calc(286 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__2 {
    position: absolute;
    top: calc(1078 / 750 * 100vw);
    left: calc(-55 / 750 * 100vw);
    width: calc(160 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__3 {
    position: absolute;
    top: calc(1430 / 1920 * 100vw);
    left: calc(97 / 1920 * 100vw);
    width: calc(199 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__3 {
    position: absolute;
    top: calc(1231 / 750 * 100vw);
    left: calc(29 / 750 * 100vw);
    width: calc(86 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__4 {
    position: absolute;
    top: calc(1988 / 1920 * 100vw);
    left: calc(-36 / 1920 * 100vw);
    width: calc(199 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__4 {
    position: absolute;
    top: calc(3500 / 750 * 100vw);
    left: calc(4 / 750 * 100vw);
    width: calc(107 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__5 {
    position: absolute;
    top: calc(2898 / 1920 * 100vw);
    left: calc(67 / 1920 * 100vw);
    width: calc(252 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__5 {
    position: absolute;
    top: calc(3600 / 750 * 100vw);
    left: calc(-47 / 750 * 100vw);
    width: calc(138 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__6 {
    position: absolute;
    top: calc(3097 / 1920 * 100vw);
    left: calc(-78 / 1920 * 100vw);
    width: calc(325 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__6 {
    position: absolute;
    top: calc(5204 / 750 * 100vw);
    left: calc(-36 / 750 * 100vw);
    width: calc(159 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__7 {
    position: absolute;
    top: calc(4305 / 1920 * 100vw);
    left: calc(-41 / 1920 * 100vw);
    width: calc(396 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__7 {
    position: absolute;
    top: calc(6200 / 750 * 100vw);
    left: calc(-18 / 750 * 100vw);
    width: calc(135 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__8 {
    position: absolute;
    top: calc(7293 / 1920 * 100vw);
    left: calc(133 / 1920 * 100vw);
    width: calc(199 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__8 {
    position: absolute;
    top: calc(6275 / 750 * 100vw);
    left: calc(-29 / 750 * 100vw);
    width: calc(101 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__9 {
    position: absolute;
    top: calc(5992 / 1920 * 100vw);
    left: calc(-44 / 1920 * 100vw);
    width: calc(185 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__9 {
    position: absolute;
    top: calc(6828 / 750 * 100vw);
    left: calc(-35 / 750 * 100vw);
    width: calc(117 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__10 {
    position: absolute;
    top: calc(6133 / 1920 * 100vw);
    left: calc(34 / 1920 * 100vw);
    width: calc(249 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__10 {
    position: absolute;
    top: calc(7300 / 750 * 100vw);
    left: calc(3 / 750 * 100vw);
    width: calc(90 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__11 {
    position: absolute;
    top: calc(6436 / 1920 * 100vw);
    left: calc(-70 / 1920 * 100vw);
    width: calc(212 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__11 {
    position: absolute;
    top: calc(7826 / 750 * 100vw);
    left: calc(-21 / 750 * 100vw);
    width: calc(104 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__12 {
    position: absolute;
    top: calc(7089 / 1920 * 100vw);
    left: calc(-20 / 1920 * 100vw);
    width: calc(260 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__12 {
    position: absolute;
    top: calc(7900 / 750 * 100vw);
    left: calc(-21 / 750 * 100vw);
    width: calc(125 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__13 {
    position: absolute;
    top: calc(8221 / 1920 * 100vw);
    left: calc(75 / 1920 * 100vw);
    width: calc(266 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__13 {
    position: absolute;
    top: calc(8400 / 750 * 100vw);
    left: calc(-6 / 750 * 100vw);
    width: calc(95 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__14 {
    position: absolute;
    top: calc(8462 / 1920 * 100vw);
    left: calc(-65 / 1920 * 100vw);
    width: calc(320 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__14 {
    position: absolute;
    top: calc(8650 / 750 * 100vw);
    left: calc(-4 / 750 * 100vw);
    width: calc(101 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__15 {
    position: absolute;
    top: calc(10336 / 1920 * 100vw);
    left: calc(-35 / 1920 * 100vw);
    width: calc(277 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__15 {
    position: absolute;
    top: calc(8720 / 750 * 100vw);
    left: calc(-13 / 750 * 100vw);
    width: calc(72 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__16 {
    display: none !important;
  }
}
@media screen and (max-width: 767px) {
  .balloon__16 {
    position: absolute;
    top: calc(9671 / 750 * 100vw);
    left: calc(-38 / 750 * 100vw);
    width: calc(113 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__17 {
    display: none !important;
  }
}
@media screen and (max-width: 767px) {
  .balloon__17 {
    position: absolute;
    top: calc(10850 / 750 * 100vw);
    left: calc(-29 / 750 * 100vw);
    width: calc(132 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__18 {
    position: absolute;
    top: calc(867 / 1920 * 100vw);
    right: calc(-72 / 1920 * 100vw);
    width: calc(236 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__18 {
    position: absolute;
    top: calc(797 / 750 * 100vw);
    right: calc(-17 / 750 * 100vw);
    width: calc(113 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__19 {
    position: absolute;
    top: calc(1028 / 1920 * 100vw);
    right: calc(86 / 1920 * 100vw);
    width: calc(172 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__19 {
    position: absolute;
    top: calc(895 / 750 * 100vw);
    right: calc(46 / 750 * 100vw);
    width: calc(85 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__20 {
    position: absolute;
    top: calc(1466 / 1920 * 100vw);
    right: calc(-26 / 1920 * 100vw);
    width: calc(273 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__20 {
    position: absolute;
    top: calc(1312 / 750 * 100vw);
    right: calc(-40 / 750 * 100vw);
    width: calc(152 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__21 {
    position: absolute;
    top: calc(2105 / 1920 * 100vw);
    right: calc(-19 / 1920 * 100vw);
    width: calc(224 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__21 {
    position: absolute;
    top: calc(2400 / 750 * 100vw);
    right: calc(-9 / 750 * 100vw);
    width: calc(163 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__22 {
    position: absolute;
    top: calc(2429 / 1920 * 100vw);
    right: calc(50 / 1920 * 100vw);
    width: calc(224 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__22 {
    position: absolute;
    top: calc(2500 / 750 * 100vw);
    right: calc(-29 / 750 * 100vw);
    width: calc(99 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__23 {
    position: absolute;
    top: calc(3525 / 1920 * 100vw);
    right: calc(-72 / 1920 * 100vw);
    width: calc(278 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__23 {
    position: absolute;
    top: calc(4196 / 750 * 100vw);
    right: calc(-36 / 750 * 100vw);
    width: calc(121 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__24 {
    position: absolute;
    top: calc(3763 / 1920 * 100vw);
    right: calc(-7 / 1920 * 100vw);
    width: calc(348 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__24 {
    position: absolute;
    top: calc(4400 / 750 * 100vw);
    right: calc(-18 / 750 * 100vw);
    width: calc(152 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__25 {
    position: absolute;
    top: calc(4269 / 1920 * 100vw);
    right: calc(-48 / 1920 * 100vw);
    width: calc(199 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__25 {
    position: absolute;
    top: calc(4992 / 750 * 100vw);
    right: calc(-46 / 750 * 100vw);
    width: calc(135 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__26 {
    position: absolute;
    top: calc(5599 / 1920 * 100vw);
    right: calc(-61 / 1920 * 100vw);
    width: calc(206 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__26 {
    position: absolute;
    top: calc(6016 / 750 * 100vw);
    right: calc(-29 / 750 * 100vw);
    width: calc(96 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__27 {
    position: absolute;
    top: calc(5840 / 1920 * 100vw);
    right: calc(-11 / 1920 * 100vw);
    width: calc(272 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__27 {
    position: absolute;
    top: calc(6498 / 750 * 100vw);
    right: calc(-42 / 750 * 100vw);
    width: calc(128 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__28 {
    position: absolute;
    top: calc(6831 / 1920 * 100vw);
    right: calc(39 / 1920 * 100vw);
    width: calc(214 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__28 {
    position: absolute;
    top: calc(7006 / 750 * 100vw);
    right: calc(-40 / 750 * 100vw);
    width: calc(150 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__29 {
    position: absolute;
    top: calc(7092 / 1920 * 100vw);
    right: calc(-99 / 1920 * 100vw);
    width: calc(314 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__29 {
    position: absolute;
    top: calc(8227 / 750 * 100vw);
    right: calc(-20 / 750 * 100vw);
    width: calc(79 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__30 {
    position: absolute;
    top: calc(8849 / 1920 * 100vw);
    right: calc(75 / 1920 * 100vw);
    width: calc(238 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__30 {
    position: absolute;
    top: calc(8352 / 750 * 100vw);
    right: calc(-17 / 750 * 100vw);
    width: calc(118 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__31 {
    position: absolute;
    top: calc(9194 / 1920 * 100vw);
    right: calc(-64 / 1920 * 100vw);
    width: calc(292 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__31 {
    position: absolute;
    top: calc(8950 / 750 * 100vw);
    right: calc(-50 / 750 * 100vw);
    width: calc(150 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__32 {
    position: absolute;
    top: calc(10576 / 1920 * 100vw);
    right: calc(88 / 1920 * 100vw);
    width: calc(199 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__32 {
    position: absolute;
    top: calc(10259 / 750 * 100vw);
    right: calc(-25 / 750 * 100vw);
    width: calc(84 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__33 {
    position: absolute;
    top: calc(10861 / 1920 * 100vw);
    right: calc(-73 / 1920 * 100vw);
    width: calc(278 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__33 {
    position: absolute;
    top: calc(11335 / 750 * 100vw);
    right: calc(-52 / 750 * 100vw);
    width: calc(137 / 750 * 100vw);
    z-index: 999;
  }
}
@media screen and (min-width: 768px) {
  .balloon__34 {
    position: absolute;
    top: calc(11109 / 1920 * 100vw);
    right: calc(2 / 1920 * 100vw);
    width: calc(348 / 1920 * 100vw);
    z-index: 999;
  }
}
@media screen and (max-width: 767px) {
  .balloon__34 {
    position: absolute;
    top: calc(11465 / 750 * 100vw);
    right: calc(-15 / 750 * 100vw);
    width: calc(171 / 750 * 100vw);
    z-index: 999;
  }
}

.dmm-player-modal {
  position: fixed;
  inset: 0;
  z-index: 10001;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dmm-player-modal[hidden] {
  display: none;
}
.dmm-player-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
}
.dmm-player-modal__window {
  position: relative;
  z-index: 1;
  background: #fff;
}
@media screen and (min-width: 768px) {
  .dmm-player-modal__window {
    width: calc(600 / 1920 * 100vw);
    height: calc(350 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .dmm-player-modal__window {
    width: calc(600 / 750 * 100vw);
    height: calc(350 / 750 * 100vw);
  }
}
.dmm-player-modal__close {
  position: absolute;
  padding: 0;
  border: none;
  cursor: pointer;
}
@media screen and (min-width: 768px) {
  .dmm-player-modal__close {
    top: calc(-25 / 1920 * 100vw);
    right: calc(-25 / 1920 * 100vw);
    width: calc(50 / 1920 * 100vw);
    height: calc(50 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .dmm-player-modal__close {
    top: calc(-25 / 750 * 100vw);
    right: calc(-25 / 750 * 100vw);
    width: calc(50 / 750 * 100vw);
    height: calc(50 / 750 * 100vw);
  }
}
.dmm-player-modal__close img {
  width: 100%;
  height: 100%;
  display: block;
}
.dmm-player-modal__iframe {
  width: 100%;
  height: 100%;
  border: none;
  display: block;
}

#dmm-header #dmm_ntgnavi {
  display: flex;
  justify-content: space-between;
  overflow: hidden;
  background: url('../images/bg_navimain.gif') center center repeat-x;
  background-size: auto 100%;
  border-bottom: 1px solid #ccc;
  border-top: 1px solid #ccc;
  font-family:
    'メイリオ', 'Meiryo', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3',
    'ＭＳ Ｐゴシック', Verdana, sans-serif;
}
@media screen and (max-width: 767px) {
  #dmm-header #dmm_ntgnavi {
    border-bottom: calc(1 / 750 * 100vw) solid #ccc;
    border-top: calc(1 / 750 * 100vw) solid #ccc;
    font-size: calc(12 / 750 * 100vw);
  }
}
#dmm-header #dmm_ntgnavi ul {
  list-style: none;
  margin: 2px 0;
  padding: 0;
  display: flex;
  width: 50%;
}
@media screen and (max-width: 767px) {
  #dmm-header #dmm_ntgnavi ul {
    margin: calc(2 / 750 * 100vw) 0;
  }
}
#dmm-header #dmm_ntgnavi ul li {
  margin: 0 6px 0 0;
  line-height: 15px;
}
@media screen and (max-width: 767px) {
  #dmm-header #dmm_ntgnavi ul li {
    margin: 0 calc(6 / 750 * 100vw) 0 0;
    line-height: calc(15 / 750 * 100vw);
  }
}
#dmm-header #dmm_ntgnavi .navi_left li > a {
  display: block;
  padding: 0 3px 0 8px;
  text-decoration: none;
  border: 1px solid #eee;
  border-radius: 3px;
}
@media screen and (max-width: 767px) {
  #dmm-header #dmm_ntgnavi .navi_left li > a {
    padding: 0 calc(3 / 750 * 100vw) 0 calc(8 / 750 * 100vw);
    border-radius: calc(3 / 750 * 100vw);
  }
}
#dmm-header #dmm_ntgnavi .navi_left li > a:hover {
  background: #eee;
  border: 1px solid #666;
  border-radius: 3px;
}
@media screen and (max-width: 767px) {
  #dmm-header #dmm_ntgnavi .navi_left li > a:hover {
    border-radius: calc(3 / 750 * 100vw);
  }
}
#dmm-header #dmm_ntgnavi .navi_left li > a span {
  display: block;
  padding: 9px 10px 7px 28px;
  color: #333;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  #dmm-header #dmm_ntgnavi .navi_left li > a span {
    padding: calc(9 / 750 * 100vw) calc(10 / 750 * 100vw) calc(7 / 750 * 100vw)
      calc(28 / 750 * 100vw);
  }
}
#dmm-header #dmm_ntgnavi .navi_left li.ntg_top {
  margin-left: 10px;
}
@media screen and (max-width: 767px) {
  #dmm-header #dmm_ntgnavi .navi_left li.ntg_top {
    margin-left: calc(10 / 750 * 100vw);
  }
}
#dmm-header #dmm_ntgnavi .navi_left li.ntg_top span {
  background: url('../images/bg_bt_olgtop.gif') 0 center no-repeat;
}
@media screen and (max-width: 767px) {
  #dmm-header #dmm_ntgnavi .navi_left li.ntg_top span {
    background-size: calc(20 / 750 * 100vw);
  }
}
#dmm-header #dmm_ntgnavi .navi_right {
  justify-content: flex-end;
  font-size: 10px;
}
@media screen and (max-width: 767px) {
  #dmm-header #dmm_ntgnavi .navi_right {
    font-size: calc(10 / 750 * 100vw);
  }
}
#dmm-header #dmm_ntgnavi .navi_right li {
  margin: 0 10px 0 0;
  padding: 8px 5px;
}
@media screen and (max-width: 767px) {
  #dmm-header #dmm_ntgnavi .navi_right li {
    margin: 0 calc(10 / 750 * 100vw) 0 0;
    padding: calc(8 / 750 * 100vw) calc(5 / 750 * 100vw);
  }
}
#dmm-header #dmm_ntgnavi .arrow {
  padding-left: 14px;
  background: url('../images/arrow_common.gif') no-repeat left center;
  text-decoration: none;
  color: #333;
}
@media screen and (max-width: 767px) {
  #dmm-header #dmm_ntgnavi .arrow {
    padding-left: calc(14 / 750 * 100vw);
    background-size: calc(5 / 750 * 100vw) calc(8 / 750 * 100vw);
  }
}
#dmm-header #dmm_ntgnavi .clear {
  clear: both;
}

@keyframes yoyo {
  0%,
  10% {
    transform: translateX(0);
  }
  90%,
  100% {
    transform: translateX(calc(-100% + 100vw));
  }
}
@keyframes pulse {
  0% {
    transform: scale(1) rotate(0deg);
    filter: brightness(1);
  }
  50% {
    transform: scale(1.2) rotate(180deg);
    filter: brightness(2);
  }
  100% {
    transform: scale(1) rotate(360deg);
    filter: brightness(1);
  }
}
.for-status-bars,
.for-tab-bars {
  position: fixed;
  left: 0;
  width: 100%;
  background-color: #000;
  mix-blend-mode: lighten;
  pointer-events: none;
  z-index: 10000;
}

.for-status-bars {
  top: 0;
  height: 5px;
}

.for-tab-bars {
  bottom: 0;
  height: 4px;
}

html {
  scroll-behavior: smooth;
  overflow-x: hidden;
  overscroll-behavior: none;
}

body {
  overscroll-behavior: none;
}
body .badge {
  position: fixed;
  z-index: 9999;
  transition: transform 0.2s ease;
}
body .badge img {
  width: 100%;
}
@media screen and (min-width: 768px) {
  body .badge {
    right: calc(30 / 1920 * 100vw);
    bottom: calc(30 / 1920 * 100vw);
    width: calc(311 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  body .badge {
    right: calc(30 / 750 * 100vw);
    bottom: calc(57 / 750 * 100vw);
    width: calc(206 / 750 * 100vw);
  }
}
@media (hover: hover) {
  body .badge:where(:-moz-any-link, :enabled, summary):hover {
    transform: scale(1.03);
    -moz-transition: transform 0.3s ease;
    transition: transform 0.3s ease;
  }
  body .badge:where(:any-link, :enabled, summary):hover {
    transform: scale(1.03);
    transition: transform 0.3s ease;
  }
}

img,
picture {
  display: block;
}

@media screen and (max-width: 767px) {
  .pc {
    display: none !important;
  }
}

@media screen and (min-width: 768px) {
  .sp {
    display: none !important;
  }
}

main {
  position: relative;
  display: flex;
  flex-direction: column;
}
main .kv {
  position: relative;
}
@media screen and (min-width: 768px) {
  main .kv {
    height: calc(939 / 1920 * 100vw);
    overflow: hidden;
    background-image: url('../images/pc/kv-bg.webp');
    background-size: cover;
    background-position: top;
  }
}
@media screen and (max-width: 767px) {
  main .kv {
    height: calc(923 / 750 * 100vw);
    overflow: hidden;
  }
}
@media screen and (max-width: 767px) {
  main .kv__bg {
    position: absolute;
    top: 0;
    left: 0;
    width: calc(1582 / 750 * 100vw);
    height: auto;
    animation: yoyo 7s ease-in-out infinite alternate;
    z-index: -1;
  }
}
@media screen and (min-width: 768px) {
  main .kv__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: calc(338 / 1920 * 100vw);
    gap: calc(28 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .kv__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: calc(560 / 750 * 100vw);
    gap: calc(26 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .kv__logo {
    width: calc(575 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .kv__logo {
    width: calc(389 / 750 * 100vw);
  }
}
main .kv__btn {
  position: relative;
  transition: transform 0.2s ease;
  z-index: 9998;
}
@media screen and (min-width: 768px) {
  main .kv__btn {
    width: calc(451 / 1920 * 100vw);
  }
  main .kv__btn img:not(.kv__btn__flash) {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  main .kv__btn {
    width: calc(484 / 750 * 100vw);
  }
  main .kv__btn img {
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  main .kv__btn__flash {
    position: absolute;
    pointer-events: none;
    transition:
      transform 0.3s ease,
      filter 0.3s ease;
  }
}
@media screen and (min-width: 768px) {
  main .kv__btn__flash--1 {
    top: calc(-31 / 1920 * 100vw);
    left: calc(380 / 1920 * 100vw);
    width: calc(102 / 1920 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .kv__btn__flash--2 {
    top: calc(32 / 1920 * 100vw);
    left: calc(-30 / 1920 * 100vw);
    width: calc(77 / 1920 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .kv__btn__flash--3 {
    top: calc(80 / 1920 * 100vw);
    left: calc(21 / 1920 * 100vw);
    width: calc(52 / 1920 * 100vw);
  }
}
@media (hover: hover) {
  main .kv__btn:where(:-moz-any-link, :enabled, summary):hover {
    transform: scale(1.03);
    -moz-transition: transform 0.3s ease;
    transition: transform 0.3s ease;
  }
  main .kv__btn:where(:any-link, :enabled, summary):hover {
    transform: scale(1.03);
    transition: transform 0.3s ease;
  }
}
@media (hover: hover) {
  main .kv__btn:hover > [class*='__flash'] {
    animation: pulse 2s ease-in-out infinite;
  }
}
@media screen and (min-width: 768px) {
  main .play {
    background-image: url('../images/pc/play-bg.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }
}
@media screen and (max-width: 767px) {
  main .play {
    background-image: url('../images/sp/play-bg.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }
}
@media screen and (min-width: 768px) {
  main .play__inner {
    display: flex;
    width: -moz-fit-content;
    width: fit-content;
    margin: calc(42 / 1920 * 100vw) auto;
    gap: calc(60 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .play__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: calc(42 / 750 * 100vw) auto;
    gap: calc(42 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .play__left {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(24 / 1920 * 100vw);
    margin: auto 0;
  }
}
@media screen and (max-width: 767px) {
  main .play__left {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(42 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .play__logo {
    width: calc(375 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .play__logo {
    width: calc(514 / 750 * 100vw);
  }
}
main .play__btn-official {
  transition: transform 0.2s ease;
}
main .play__btn-official img {
  width: 100%;
}
@media screen and (min-width: 768px) {
  main .play__btn-official {
    width: calc(315 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .play__btn-official {
    width: calc(360 / 750 * 100vw);
  }
}
@media (hover: hover) {
  main .play__btn-official:where(:-moz-any-link, :enabled, summary):hover {
    transform: scale(1.03);
    -moz-transition: transform 0.3s ease;
    transition: transform 0.3s ease;
  }
  main .play__btn-official:where(:any-link, :enabled, summary):hover {
    transform: scale(1.03);
    transition: transform 0.3s ease;
  }
}
@media screen and (min-width: 768px) {
  main .play__right {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(32 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .play__right {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(42 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .play__heading {
    width: calc(695 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .play__heading {
    width: calc(627 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .play__store-btns {
    display: flex;
    flex-direction: row;
    gap: calc(10 / 1920 * 100vw);
  }
  main .play__store-btns__row {
    display: contents;
  }
}
@media screen and (max-width: 767px) {
  main .play__store-btns {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: calc(18 / 750 * 100vw);
  }
  main .play__store-btns__row {
    display: flex;
    justify-content: center;
    gap: calc(18 / 750 * 100vw);
  }
}
main .play__btn img {
  width: auto;
  height: 100%;
}
@media screen and (min-width: 768px) {
  main .play__btn {
    height: calc(48 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .play__btn {
    height: calc(60 / 750 * 100vw);
  }
}
main .reward {
  background-color: #43146c;
}
@media screen and (min-width: 768px) {
  main .reward {
    background-image: url('../images/pc/reward-bg.webp');
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }
}
@media screen and (max-width: 767px) {
  main .reward {
    -webkit-clip-path: inset(0);
    clip-path: inset(0);
  }
  main .reward::before {
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100lvh;
    z-index: -1;
    background-image: url('../images/sp/reward-bg.webp');
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
  }
}
main .reward__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (min-width: 768px) {
  main .reward__inner {
    padding: calc(320 / 1920 * 100vw) 0 calc(320 / 1920 * 100vw) 0;
    gap: calc(154 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .reward__inner {
    padding: calc(223 / 750 * 100vw) 0 calc(223 / 750 * 100vw) 0;
    gap: calc(64 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .reward__heading {
    width: calc(1362 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .reward__heading {
    width: calc(660 / 750 * 100vw);
  }
}
main .reward__container {
  position: relative;
  background-color: #3b1c6b;
}
main .reward__container img {
  width: 100%;
}
@media screen and (min-width: 768px) {
  main .reward__container {
    width: calc(1400 / 1920 * 100vw);
    outline: calc(8 / 1920 * 100vw) solid #43146c;
    outline-offset: calc(-1 / 1920 * 100vw);
    border-radius: calc(24 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .reward__container {
    width: calc(666 / 750 * 100vw);
    outline: calc(8 / 750 * 100vw) solid #43146c;
    outline-offset: calc(-1 / 750 * 100vw);
    border-radius: calc(24 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .reward__container.kumasan .reward__btns {
    justify-content: space-between;
    gap: calc(8 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .reward__container.kumasan .reward__btns {
    gap: calc(14 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .reward__container.kumasan .reward__btn {
    height: calc(46 / 1920 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .reward__container.kumablack .reward__btns {
    flex-direction: row;
    gap: calc(24 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .reward__container.kumablack .reward__btns {
    gap: calc(10 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .reward__container.kumablack .reward__btn {
    height: calc(91 / 1920 * 100vw);
  }
}
main .reward__btns {
  position: absolute;
  display: flex;
}
@media screen and (max-width: 767px) {
  main .reward__btns {
    flex-direction: column;
    align-items: center;
  }
}
main .reward__btns__row {
  display: flex;
  justify-content: center;
  gap: calc(10 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  main .reward__btns.kurusuta {
    top: calc(993 / 1920 * 100vw);
    left: calc(134 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .reward__btns.kurusuta {
    top: calc(558 / 750 * 100vw);
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (min-width: 768px) {
  main .reward__btns.monmusu {
    top: calc(993 / 1920 * 100vw);
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (max-width: 767px) {
  main .reward__btns.monmusu {
    top: calc(1069 / 750 * 100vw);
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (min-width: 768px) {
  main .reward__btns.gc {
    top: calc(993 / 1920 * 100vw);
    right: calc(134 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .reward__btns.gc {
    top: calc(1583 / 750 * 100vw);
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (min-width: 768px) {
  main .reward__btns.misutore {
    top: calc(1824 / 1920 * 100vw);
    left: calc(343 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .reward__btns.misutore {
    top: calc(2016 / 750 * 100vw);
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (min-width: 768px) {
  main .reward__btns.fkg {
    top: calc(1824 / 1920 * 100vw);
    left: calc(847 / 1920 * 100vw);
    width: auto;
  }
}
@media screen and (max-width: 767px) {
  main .reward__btns.fkg {
    top: calc(2528 / 740 * 100vw);
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (min-width: 768px) {
  main .reward__btns.dotabyss {
    top: calc(749 / 1920 * 100vw);
    left: calc(664 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .reward__btns.dotabyss {
    top: calc(540 / 750 * 100vw);
    left: 50%;
    transform: translateX(-50%);
  }
}
main .reward__btn img {
  width: auto;
  height: 100%;
}
@media screen and (max-width: 767px) {
  main .reward__btn {
    height: calc(64 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .reward__caption {
    width: calc(1196 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .reward__caption {
    width: calc(506 / 750 * 100vw);
  }
}
main .campaign {
  background-color: #3b1c6b;
}
@media screen and (min-width: 768px) {
  main .campaign {
    background-image: url('../images/pc/campaign-bg.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }
}
@media screen and (max-width: 767px) {
  main .campaign {
    background-image: url('../images/sp/campaign-bg.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }
}
@media screen and (min-width: 768px) {
  main .campaign__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(42 / 1920 * 100vw);
    padding: calc(42 / 1920 * 100vw) 0 calc(42 / 1920 * 100vw) 0;
  }
}
@media screen and (max-width: 767px) {
  main .campaign__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(42 / 750 * 100vw);
    padding: calc(80 / 750 * 100vw) 0 calc(80 / 750 * 100vw) 0;
  }
}
main .campaign h1 img {
  width: 100%;
}
@media screen and (min-width: 768px) {
  main .campaign h1 {
    width: calc(1219 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .campaign h1 {
    width: calc(572 / 750 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .campaign__kumasan-logos {
    width: calc(468 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .campaign__information {
    width: calc(1316 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .campaign__information {
    width: calc(716 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .campaign__logos-group {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: calc(19 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .campaign__logos-group {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(31 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .campaign__logos-frame {
    width: calc(1042 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .campaign__logos-frame {
    width: calc(648 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .campaign__logos-union {
    width: calc(59 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .campaign__logos-union {
    width: calc(95 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .campaign__logos-dotabyss {
    position: relative;
    width: calc(252 / 1920 * 100vw);
    height: calc(145 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .campaign__logos-dotabyss {
    position: relative;
    width: calc(504 / 750 * 100vw);
    height: calc(290 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .campaign__logos-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    mix-blend-mode: multiply;
  }
  main .campaign__logos-bg img {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  main .campaign__logos-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    mix-blend-mode: multiply;
  }
  main .campaign__logos-bg img {
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  main .campaign__logos-main {
    position: absolute;
    top: calc(27 / 1920 * 100vw);
    left: calc(55 / 1920 * 100vw);
    width: calc(146 / 1920 * 100vw);
  }
  main .campaign__logos-main img {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  main .campaign__logos-main {
    position: absolute;
    top: calc(55 / 750 * 100vw);
    left: calc(111 / 750 * 100vw);
    width: calc(293 / 750 * 100vw);
  }
  main .campaign__logos-main img {
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  main .campaign__period {
    width: calc(1014 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .campaign__period {
    width: calc(606 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .present {
    background-image: url('../images/pc/present-bg.webp');
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }
}
@media screen and (max-width: 767px) {
  main .present {
    -webkit-clip-path: inset(0);
    clip-path: inset(0);
  }
  main .present::before {
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100lvh;
    z-index: -1;
    background-image: url('../images/sp/present-bg.webp');
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
  }
}
@media screen and (min-width: 768px) {
  main .present__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: calc(320 / 1920 * 100vw) 0 calc(320 / 1920 * 100vw) 0;
    gap: calc(80 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .present__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: calc(223 / 750 * 100vw) 0 calc(223 / 750 * 100vw) 0;
    gap: calc(32 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .present__heading {
    width: calc(1046 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .present__heading {
    width: calc(666 / 750 * 100vw);
  }
}
main .present__period {
  position: relative;
}
main .present__period img {
  width: 100%;
}
@media screen and (min-width: 768px) {
  main .present__period {
    width: calc(1199 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .present__period {
    width: calc(726 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .present__period-text {
    position: absolute;
    top: calc(185 / 1920 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    font-family: 'Rounded Mplus 1c', 'M PLUS Rounded 1c', sans-serif;
    font-weight: 900;
    color: #31395a;
    white-space: nowrap;
  }
}
@media screen and (max-width: 767px) {
  main .present__period-text {
    position: absolute;
    top: calc(130 / 750 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    font-family: 'Rounded Mplus 1c', 'M PLUS Rounded 1c', sans-serif;
    font-weight: 900;
    color: #31395a;
    white-space: nowrap;
  }
}
@media screen and (min-width: 768px) {
  main .present__period-date {
    font-size: calc(48 / 1920 * 100vw);
    line-height: 1;
  }
}
@media screen and (max-width: 767px) {
  main .present__period-date {
    font-size: calc(29 / 750 * 100vw);
    line-height: 1;
  }
}
@media screen and (min-width: 768px) {
  main .present__period-suffix {
    font-size: calc(30 / 1920 * 100vw);
    line-height: 1.42;
  }
}
@media screen and (max-width: 767px) {
  main .present__period-suffix {
    font-size: calc(18 / 750 * 100vw);
    line-height: 1.42;
  }
}
@media screen and (min-width: 768px) {
  main .present__join {
    position: relative;
    width: calc(1199 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .present__join {
    position: relative;
    width: calc(726 / 750 * 100vw);
  }
}
main .present__join img {
  width: 100%;
}
@media screen and (min-width: 768px) {
  main .present__join-btn {
    position: absolute;
    top: calc(1540 / 1920 * 100vw);
    left: calc(280 / 1920 * 100vw);
    width: calc(639 / 1920 * 100vw);
    transition: transform 0.2s ease;
  }
}
@media screen and (max-width: 767px) {
  main .present__join-btn {
    position: absolute;
    top: calc(1275 / 750 * 100vw);
    left: 50%;
    margin-left: calc(-180 / 750 * 100vw);
    width: calc(360 / 750 * 100vw);
    transition: transform 0.2s ease;
  }
}
@media (hover: hover) {
  main .present__join-btn:where(:-moz-any-link, :enabled, summary):hover {
    transform: scale(1.03);
    -moz-transition: transform 0.3s ease;
    transition: transform 0.3s ease;
  }
  main .present__join-btn:where(:any-link, :enabled, summary):hover {
    transform: scale(1.03);
    transition: transform 0.3s ease;
  }
}
@media screen and (min-width: 768px) {
  main .present__guide {
    position: relative;
    width: calc(1199 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .present__guide {
    position: relative;
    width: calc(726 / 750 * 100vw);
  }
}
main .present__guide img {
  width: 100%;
}
@media screen and (min-width: 768px) {
  main .present__guide-text {
    position: absolute;
    top: calc(180 / 1920 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    width: calc(1069 / 1920 * 100vw);
    font-family: 'Rounded Mplus 1c', 'M PLUS Rounded 1c', sans-serif;
    font-size: calc(20 / 1920 * 100vw);
    font-weight: 500;
    line-height: 1.42;
    color: #31395a;
  }
}
@media screen and (max-width: 767px) {
  main .present__guide-text {
    position: absolute;
    top: calc(120 / 750 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    width: calc(585 / 750 * 100vw);
    font-family: 'Rounded Mplus 1c', 'M PLUS Rounded 1c', sans-serif;
    font-size: calc(15 / 750 * 100vw);
    font-weight: 500;
    line-height: 1.42;
    color: #31395a;
  }
}
@media screen and (max-width: 767px) {
  main .notice__padding {
    background-color: #e7bdff;
    padding-top: calc(70 / 750 * 100vw);
  }
}
main .notice__coming-soon {
  width: 100%;
}
main .footer {
  position: relative;
  background-color: #2f1b40;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  main .footer__inner {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    height: calc(366 / 1920 * 100vw);
    padding-bottom: calc(42 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  main .footer__inner {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    height: calc(238 / 750 * 100vw);
    padding-bottom: calc(42 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  main .footer__bears {
    position: absolute;
    left: calc(-53 / 1920 * 100vw);
    bottom: calc(-84 / 1920 * 100vw);
    width: calc(563 / 1920 * 100vw);
    z-index: 9998;
  }
}
@media screen and (max-width: 767px) {
  main .footer__bears {
    position: absolute;
    left: calc(-24 / 750 * 100vw);
    bottom: calc(-15 / 750 * 100vw);
    width: calc(267 / 750 * 100vw);
    z-index: 9998;
  }
}
@media screen and (min-width: 768px) {
  main .footer__copyright {
    color: #fff;
    font-family: 'Rounded Mplus 1c', 'M PLUS Rounded 1c', sans-serif;
    font-weight: 500;
    font-size: calc(18 / 1920 * 100vw);
    line-height: 1.28;
    white-space: nowrap;
  }
}
@media screen and (max-width: 767px) {
  main .footer__copyright {
    color: #fff;
    font-family: 'Rounded Mplus 1c', 'M PLUS Rounded 1c', sans-serif;
    font-weight: 500;
    font-size: calc(12 / 750 * 100vw);
    line-height: 1.28;
    white-space: nowrap;
  }
}