.w-layout-blockcontainer {
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.w-layout-vflex {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.w-layout-hflex {
  flex-direction: row;
  align-items: flex-start;
  display: flex;
}

@media screen and (max-width: 991px) {
  .w-layout-blockcontainer {
    max-width: 728px;
  }
}

@media screen and (max-width: 767px) {
  .w-layout-blockcontainer {
    max-width: none;
  }
}

.character-view {
  justify-content: center;
  align-items: center;
  height: 0;
  display: flex;
  position: sticky;
  top: -50px;
}

.character-view._2 {
  position: relative;
}

.character-container {
  width: 20%;
}

.stage {
  text-align: center;
  position: relative;
}

.body {
  background-color: #000;
}

.character.l {
  display: none;
  transform: rotate(-1deg);
}

.character.r {
  display: none;
  transform: rotate(1deg);
}

.splash {
  z-index: 3;
  background-color: #fff;
  justify-content: center;
  align-items: flex-start;
  width: 100svw;
  height: 100vh;
  display: none;
  position: fixed;
}

.load-container {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.image {
  flex: 0 auto;
  width: 225px;
  max-width: none;
  height: 8px;
}

.load-bar {
  border: 2px solid #000;
  border-radius: 8px;
  justify-content: flex-end;
  align-items: stretch;
  width: 144px;
  height: 8px;
  line-height: 8px;
  display: flex;
  overflow: hidden;
}

.splash-adjust {
  justify-content: center;
  align-items: center;
  height: 100svh;
  display: flex;
}

.comic-sequence {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  max-width: 500px;
  padding-left: 8px;
  padding-right: 8px;
  display: flex;
}

.map-wrapper {
  background-color: #141414;
  border-radius: 8px;
  margin: 24px 8px;
  padding: 8px;
  position: relative;
}

.map-icon {
  min-width: 18%;
  height: 17%;
  position: absolute;
}

.map-icon.hope {
  position: absolute;
  top: 80%;
  left: 41%;
}

.map-icon.joy {
  top: 46%;
  left: 38%;
}

.map-icon.love {
  top: 39%;
  left: 12%;
}

.map-icon.peace {
  top: 74%;
  left: 74%;
}

.map-location {
  height: 25%;
  transition: left 1.5s, top 1.5s;
  position: absolute;
  top: 67%;
  left: 11%;
}

.map-icon-image {
  height: 100%;
  display: none;
}

.map-container {
  padding-top: 128px;
  padding-bottom: 128px;
  position: relative;
}

.comic-sections {
  flex-flow: column;
  display: flex;
}

.walk-sequence {
  max-width: 500px;
}

.comic-frame {
  border: 8px solid #fff;
}

.comic-transparent.final {
  display: none;
}

.map-section {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  max-width: 500px;
  padding-left: 8px;
  padding-right: 8px;
  display: flex;
  overflow: hidden;
}

.comic-divider {
  margin-top: 36px;
  margin-bottom: 36px;
}

.deco {
  z-index: 2;
  position: absolute;
  inset: 70% auto auto 0%;
}

.deco._1 {
  top: 75%;
}

.deco._2 {
  top: 30%;
  transform: translate(0);
}

.deco._3 {
  width: 50%;
  top: 20%;
  left: 25%;
}

.deco._4 {
  width: 20%;
  position: absolute;
  top: 43%;
  left: 34%;
}

.deco._5 {
  width: 20%;
  display: none;
  top: 83%;
  left: 40%;
}

.deco._5.a {
  display: block;
}

.deco._5.b {
  display: none;
}

.stage-background {
  width: 100%;
}

.stage-background._2 {
  margin-bottom: 72px;
}

.script {
  z-index: 1;
  position: absolute;
  inset: 50% 0% auto;
}

.script._1 {
  text-align: left;
}

.script._2 {
  top: 85%;
}

.script._3 {
  z-index: 3;
  top: 25%;
}

.script._4 {
  top: 63%;
}

.script-overflow {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  max-width: 500px;
  padding-left: 8px;
  padding-right: 8px;
  display: flex;
}

.overflow-script.m2-r {
  clear: none;
}

.map-unlock-icons {
  position: absolute;
  inset: 0%;
}

.map-unlock-icon {
  width: 19%;
  height: 16%;
  position: absolute;
  top: 80%;
  left: 41%;
}

.map-unlock-icon.love {
  top: 38%;
  left: 15%;
}

.map-unlock-icon.joy {
  top: 46%;
  left: 38%;
}

.map-unlock-icon.peace {
  top: 71%;
  left: 77%;
}

.transition-block {
  height: 50vh;
}

.chat-container {
  text-align: center;
  max-width: 500px;
  margin-top: 64px;
  margin-bottom: 64px;
  padding-left: 16px;
  padding-right: 16px;
}

.bold-text-2 {
  color: #fff;
  text-align: left;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
}

.heading {
  color: #fff;
  font-size: 24px;
  font-weight: 400;
}

.button-stack {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: flex-start;
  align-items: flex-end;
}

.ms {
  width: 1px;
  height: 1px;
}

.image-2 {
  width: 150px;
}

.image-3 {
  text-align: left;
  vertical-align: baseline;
  width: 450px;
  height: 35px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
}

.image-4 {
  float: none;
  clear: none;
  text-align: center;
  text-decoration: none;
}

.image-5 {
  float: none;
  margin-left: -6px;
  display: inline-block;
}

.chat-icon {
  width: 20%;
  height: 18%;
  position: absolute;
  inset: 5% 0% auto 62%;
}

.link {
  color: #444;
  text-decoration: none;
}

.section {
  padding-top: 24px;
}

@media screen and (max-width: 479px) {
  .script._3, .script._4 {
    z-index: 3;
  }
}