html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title],
dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input,
select {
  vertical-align: middle;
}

* {
  -webkit-text-size-adjust: 100%;
  -webkit-overflow-scrolling: touch;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  letter-spacing: 0.02em;
}

/* For modern browsers */
.cf:before,
.cf:after {
  content: "";
  display: table;
}

.cf:after {
  clear: both;
}

/* For IE 6/7 (trigger hasLayout) */
.cf {
  zoom: 1;
}

.none {
  display: none !important;
}

.not {
  pointer-events: none !important;
}

@media screen and (max-width: 767px) {
  .pc {
    display: none !important;
  }
}
@media screen and (min-width: 768px) {
  .sp {
    display: none !important;
  }
}
body {
  font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
}

body {
  background-color: #000;
}

.uzura-font-loaded {
  font-family: "Uzura", sans-serif;
}

* {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -ms-touch-action: none;
      touch-action: none;
  outline: none !important;
}

* {
  -ms-interpolation-mode: nearest-neighbor;
      image-rendering: -webkit-optimize-contrast;
      image-rendering: pixelated;
}

.fit {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.game__bg {
  width: 375px;
  height: 100%;
  height: 700px;
  max-height: 100vh;
  max-height: 100svh;
  position: fixed;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #d5e7f9;
  z-index: 1;
}

#gamecanvas {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 10;
}

.gameset {
  width: 375px;
  height: 650px;
  max-height: 100vh;
  max-height: 100svh;
  position: fixed;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background-color: #d6e7fa;
  background-image: url("/game/senaka/img/def_bg.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  z-index: 2;
}

#controls {
  position: absolute;
  top: 70%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  padding: 10px;
  display: block;
  text-align: center;
  z-index: 11;
  -webkit-transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
  transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1); /* easeOutExpo */
  -webkit-transition-delay: 3s;
          transition-delay: 3s;
  opacity: 1;
}

body[data-phase=playing] #controls {
  -webkit-transition-delay: 0s;
          transition-delay: 0s;
  opacity: 0;
  pointer-events: none;
  -ms-touch-action: none;
      touch-action: none;
  z-index: 0;
}

.counter {
  z-index: 20;
  position: absolute;
  top: 40px;
  left: 0;
  width: 100%;
  text-align: center;
  pointer-events: none;
  -ms-touch-action: none;
      touch-action: none;
  font-size: 18px;
  display: none;
}
.counter span {
  margin-left: 20px;
}

.timer {
  z-index: 20;
  position: absolute;
  bottom: 45px;
  left: 0;
  width: 100%;
  text-align: center;
  pointer-events: none;
  -ms-touch-action: none;
      touch-action: none;
  font-size: 38px;
  bottom: 0;
  top: 0;
}
[data-lang=en] .timer {
  font-size: 32px;
}
@media (max-height: 700px) {
  .timer {
    top: calc(-100vh + 700px);
    top: calc(-100svh + 700px);
  }
}
@media (max-height: 650px) {
  .timer {
    top: 50px;
  }
}
.timer .timer_num {
  margin-left: 20px;
}
.timer__back {
  z-index: 1;
  position: absolute;
  bottom: 0px;
  left: 0;
  width: 100%;
  height: 120px;
  background-color: #c5c8c7;
}

.level {
  z-index: 20;
  position: absolute;
  top: 80px;
  left: 0;
  width: 100%;
  text-align: center;
  pointer-events: none;
  -ms-touch-action: none;
      touch-action: none;
  font-size: 33px;
  font-weight: bold;
  display: none;
}

/*domscreen*/
.domscreen {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.domscreen__wrap {
  width: 375px;
  height: 650px;
  height: 700px;
  /* height: 545px;*/
  max-height: 100vh;
  max-height: 100svh;
  position: fixed;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 10;
  overflow: hidden;
}

[data-phase=demo] .domscreen__wrap,
[data-phase=play] .domscreen__wrap {
  pointer-events: none;
  -ms-touch-action: none;
      touch-action: none;
}

/*toparea*/
[data-forphase=top] {
  pointer-events: none;
  opacity: 0;
  -webkit-transition: all 400ms cubic-bezier(0.19, 1, 0.22, 1);
  transition: all 400ms cubic-bezier(0.19, 1, 0.22, 1);
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
  z-index: 80;
}

body[data-phase=sound] [data-forphase=top],
body[data-phase=top] [data-forphase=top] {
  pointer-events: auto;
  -ms-touch-action: auto;
      touch-action: auto;
  opacity: 1;
}

.toparea {
  background: #fff;
}
.toparea__lang {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 42px;
  height: 42px;
  cursor: pointer;
  z-index: 10;
  width: auto;
  display: block;
  cursor: pointer;
}
.toparea__lang img {
  display: block;
  width: auto;
  height: 100%;
}
.toparea__bg {
  background-image: url("/game/senaka/img/top_bg.png");
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  z-index: 1;
  -webkit-animation: bgChange 1.6s step-end infinite;
          animation: bgChange 1.6s step-end infinite;
}
[data-lang=en] .toparea__bg {
  background-image: url("/game/senaka/img/en/top_bg.png");
}
.toparea__c {
  background-image: url("/game/senaka/img/top_c.png");
  background-size: cover;
  background-position: center bottom;
  background-repeat: no-repeat;
  z-index: 2;
  -webkit-animation: bgChange 1.6s step-end infinite;
          animation: bgChange 1.6s step-end infinite;
}
.toparea__c__on {
  background-image: url("/game/senaka/img/top_c_on.png");
  background-size: contain;
  background-position: center bottom;
  background-repeat: no-repeat;
  z-index: 2;
  -webkit-animation: bgChange 1.6s step-end infinite;
          animation: bgChange 1.6s step-end infinite;
}
[data-lang=en] .toparea__c__on {
  background-image: url("/game/senaka/img/en/top_c_on.png");
}
.toparea__start {
  width: 154px;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, 75%);
          transform: translate(-50%, 75%);
  cursor: pointer;
  z-index: 3;
  display: block;
  -webkit-animation: start_updown 0.6s ease-in-out infinite alternate;
          animation: start_updown 0.6s ease-in-out infinite alternate;
}

@-webkit-keyframes start_updown {
  0% {
    top: 50%;
  }
  100% {
    top: 51%;
  }
}

@keyframes start_updown {
  0% {
    top: 50%;
  }
  100% {
    top: 51%;
  }
}
/*soundarea*/
[data-forphase=sound] {
  z-index: 100;
}

.soundarea {
  background-color: rgba(255, 255, 255, 0.9);
}
.soundarea__in {
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  width: 100%;
}
.soundarea__in__text {
  width: 217px;
  height: auto;
  display: block;
  margin: 0 auto 47px;
}
.soundarea__in__text.en {
  width: 300px;
}
.soundarea__in__text__2 {
  width: 260px;
  height: auto;
  display: block;
  margin: 52px auto 0;
}
.soundarea__in__text__2.en {
  width: 300px;
}
.soundarea__in__button {
  width: 100%;
  height: 100%;
  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;
}
.soundarea__in__button img {
  cursor: pointer;
  width: 85px;
  height: auto;
  margin: 0 30px;
}

body:not([data-phase=sound]) [data-forphase=sound] {
  pointer-events: none;
  -ms-touch-action: none;
      touch-action: none;
  opacity: 0;
  -webkit-transition: all 400ms ease-in-out;
  transition: all 400ms ease-in-out;
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}

/*endarea*/
.endarea__reload {
  position: absolute;
  top: 0%;
  left: 50%;
  -webkit-transform: translate(-50%, 0%);
          transform: translate(-50%, 0%);
  width: 80%;
  height: 96px;
  opacity: 0;
  display: block;
}
.endarea__bg {
  background-image: url("/game/senaka/img/res_bg.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.endarea__bottom {
  width: 254px;
  position: absolute;
  margin: 0 auto;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  bottom: 30px;
}
.endarea__bottom__a {
  display: block;
  width: 100%;
  cursor: pointer;
  margin-top: 12px;
}
.endarea__bottom__a img {
  display: block;
  width: 100%;
  height: auto;
}
.endarea__window {
  background-image: url("/game/senaka/img/end_window.png");
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  height: 650px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
[data-lang=en] .endarea__window {
  background-image: url("/game/senaka/img/en/end_window.png");
}

[data-forphase=end] {
  -webkit-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;
}

body[data-phase=end] [data-forphase=end] {
  -webkit-transition: all 400ms ease-in-out;
  transition: all 400ms ease-in-out;
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}

body[data-phase=end][data-state=clear] [data-forphase=end] {
  -webkit-transition: all 400ms ease-in-out;
  transition: all 400ms ease-in-out;
  -webkit-transition-delay: 3s;
          transition-delay: 3s;
}

body:not([data-phase=end]) [data-forphase=end] {
  pointer-events: none;
  -ms-touch-action: none;
      touch-action: none;
  opacity: 0;
}

@media (max-height: 650px) {
  .endarea__window {
    -webkit-transform: translateY(-50%) scale(0.9);
            transform: translateY(-50%) scale(0.9);
  }
}
@media (max-height: 630px) {
  .endarea__window {
    -webkit-transform: translateY(-50%) scale(0.8);
            transform: translateY(-50%) scale(0.8);
  }
}
/*level*/
[data-forlevel] {
  opacity: 0;
  width: 100%;
  max-width: 375px;
  height: auto;
  display: block;
  position: absolute;
  bottom: 41px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 3;
  pointer-events: none;
  -ms-touch-action: none;
      touch-action: none;
  -webkit-animation: forlevel 2s ease-in-out infinite;
          animation: forlevel 2s ease-in-out infinite;
}

@-webkit-keyframes forlevel {
  0% {
    bottom: 41px;
  }
  100% {
    bottom: 40px;
  }
}

@keyframes forlevel {
  0% {
    bottom: 41px;
  }
  100% {
    bottom: 40px;
  }
}
[data-level="1"] [data-forlevel="1"],
[data-level="2"] [data-forlevel="2"],
[data-level="3"] [data-forlevel="3"],
[data-level="4"] [data-forlevel="4"],
[data-level="5"] [data-forlevel="5"] {
  opacity: 1;
}

/*guidearea*/
[data-forphase=guide] {
  pointer-events: none;
  -ms-touch-action: none;
      touch-action: none;
  opacity: 0;
  -webkit-transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
  transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1); /* easeOutExpo */
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
  z-index: 50;
}

body[data-phase=top] [data-forphase=guide],
body[data-phase=guide] [data-forphase=guide] {
  pointer-events: auto;
  -ms-touch-action: auto;
      touch-action: auto;
  opacity: 1;
}

.guidearea__bg {
  background-color: rgba(255, 255, 255, 0.9);
}
.guidearea__window {
  background-image: url("/game/senaka/img/guide_window.png");
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  height: 650px;
  height: 700px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
[data-lang=en] .guidearea__window {
  background-image: url("/game/senaka/img/en/guide_window.png");
}
.guidearea__window__start {
  width: 250px;
  display: block;
  height: auto;
  margin-left: -125px;
  position: absolute;
  bottom: 164px;
  left: 50%;
  cursor: pointer;
}

@media (max-height: 650px) {
  .guidearea__window {
    -webkit-transform: translateY(-50%) scale(0.9);
            transform: translateY(-50%) scale(0.9);
  }
}
@media (max-height: 630px) {
  .guidearea__window {
    -webkit-transform: translateY(-50%) scale(0.8);
            transform: translateY(-50%) scale(0.8);
  }
}
/*demoarea*/
[data-forphase=demo] {
  z-index: 10;
  pointer-events: none;
  -ms-touch-action: none;
      touch-action: none;
  opacity: 0;
}

[data-phase=demo] [data-forphase=demo] {
  opacity: 0.99;
  background: rgba(214, 231, 250, 0.01);
}
[data-phase=demo] [data-forphase=demo] * {
  -o-object-fit: cover;
     object-fit: cover;
  mix-blend-mode: multiply;
}
[data-phase=demo] [data-forphase=demo] img {
  overflow: hidden;
}

.demoarea__text {
  width: 194px;
  height: auto;
  position: absolute;
  bottom: 87px;
  bottom: 107px;
  right: 16px;
  -webkit-animation: updown 0.4s ease-in-out infinite;
          animation: updown 0.4s ease-in-out infinite;
}
.demoarea__text.en {
  right: 65px;
  width: 100px;
}
.demoarea__circle {
  width: 78px;
  height: auto;
  position: absolute;
  bottom: 205px;
  bottom: 185px;
  right: 107px;
  right: 127px;
  -webkit-animation: blink 1s ease-in-out infinite;
          animation: blink 1s ease-in-out infinite;
}

@-webkit-keyframes blink {
  0%, 100% {
    bottom: 184px;
    opacity: 0.8;
  }
  50% {
    bottom: 185px;
    opacity: 0;
  }
}

@keyframes blink {
  0%, 100% {
    bottom: 184px;
    opacity: 0.8;
  }
  50% {
    bottom: 185px;
    opacity: 0;
  }
}
@-webkit-keyframes updown {
  0% {
    bottom: 107px;
  }
  100% {
    bottom: 102px;
  }
}
@keyframes updown {
  0% {
    bottom: 107px;
  }
  100% {
    bottom: 102px;
  }
}
/*end*/
.endarea__score {
  position: absolute;
  top: 314px;
  left: 202px;
  line-height: 100%;
}
[data-lang=en] .endarea__score {
  left: 176px;
}
.endarea__score__num {
  font-size: 34px;
  line-height: 100%;
  color: #000;
}
.endarea__rank {
  position: absolute;
  top: 247px;
  left: 253px;
  line-height: 100%;
  width: 42px;
  height: 30px;
}
[data-lang=en] .endarea__rank {
  width: 65px;
  top: 251px;
}
.endarea__rank__num {
  text-align: center;
  font-size: 30px;
  line-height: 100%;
  font-weight: 600;
  color: #fd00cc;
  word-break: break-all;
  position: absolute;
  top: 50%;
  left: 0%;
  -webkit-transform: translate(0%, -50%);
          transform: translate(0%, -50%);
  width: 100%;
  letter-spacing: -0.1em;
}
.endarea__rank__num.rank__out {
  padding-left: 3px;
  background: #fff;
  width: 66px;
  font-size: 24px !important;
  letter-spacing: 0.05em;
}
.endarea__share {
  position: absolute;
  top: 319px;
  left: 49px;
  width: 276px;
  height: 102px;
  display: block;
  display: none;
}
.endarea__vis {
  opacity: 1;
  position: absolute;
  top: 110px;
  left: 73px;
  width: 233px;
  height: auto;
  display: block;
}
.endarea__cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
}

[data-phase=end] .endarea__cover {
  -webkit-transform: translate(0, 100%);
          transform: translate(0, 100%);
  -webkit-transition: all 1500ms steps(3);
  transition: all 1500ms steps(3);
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
}

/*configarea*/
.configarea {
  display: none;
  text-align: center;
  font-family: sans-serif;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.9);
  z-index: 9999;
  font-weight: bold;
  font-size: 12px;
  padding: 5px;
  color: #fff;
}
.configarea a {
  color: #fff;
}
.configarea div {
  display: inline;
  margin-left: 5px;
  text-decoration: underline;
  cursor: pointer;
}

.config_on .configarea {
  display: block;
}

/*timeup*/
.timeup {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url("/game/senaka/img/timeup.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 9999;
  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;
  pointer-events: none;
  opacity: 0;
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
  -webkit-transform-origin: center;
          transform-origin: center;
}
[data-lang=en] .timeup {
  background-image: url("/game/senaka/img/en/timeup.png");
}

.timeuped .timeup {
  opacity: 1;
  -webkit-transition: all 1000ms ease-in-out;
  transition: all 1000ms ease-in-out;
  -webkit-animation: timeup 2s ease-in-out 1;
          animation: timeup 2s ease-in-out 1;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

@-webkit-keyframes timeup {
  0% {
    opacity: 0;
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  15% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}

@keyframes timeup {
  0% {
    opacity: 0;
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  15% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}
/*endarea__sharelink*/
.endarea__sharelink {
  position: absolute;
  top: 356px;
  left: 50%;
  display: block;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.endarea__sharelink a {
  display: inline-block;
  margin: 0 5px;
}
.endarea__sharelink a img {
  opacity: 1;
  display: block;
  width: 44px;
  height: auto;
}

/*count*/
[data-phase=play] .domscreen__wrap,
[data-phase=play][data-playtime="3"] .domscreen__wrap,
[data-phase=play][data-playtime="4"] .domscreen__wrap,
[data-phase=play][data-playtime="5"] .domscreen__wrap,
[data-phase=play][data-playtime="6"] .domscreen__wrap,
[data-phase=play][data-playtime="7"] .domscreen__wrap,
[data-phase=play][data-playtime="8"] .domscreen__wrap {
  pointer-events: none;
  left: -200%;
  -webkit-transform: scale(0);
          transform: scale(0);
  overflow: hidden;
}

/*lang*/
[data-lang=ja] .en,
[data-lang=en] .ja {
  display: none !important;
}

.is_tablet .no_tablet {
  display: none !important;
}
.is_tablet .not_tablet {
  pointer-events: none;
  -ms-touch-action: none;
      touch-action: none;
}

body:not(.is_tablet) .only_tablet {
  display: none !important;
}