html {
  -webkit-tap-highlight-color: transparent !important;
  font-size: 14px;
  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic",
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
  line-height: 1;
  /* text-align: center; */
  overflow: hidden;
  background-color: #b2dfcc;
}
html.on {
  background-color: #babcbf;
}

.wrapper {
  /* background-color: #b2dfcc; */
  height: 100vh;
  overflow: hidden;
  position: relative;
  width: 100%;

  display: flex;
  justify-content: center;
  align-items: center;
}

.control {
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
}
.control#prev {
  left: 0;
}
.control#next {
  right: 0;
}

.arrow {
  fill: #ffffff;
  /* opacity: 0.5; */
  width: 50px;
  /* margin: 25px; */
  transition: transform 0.3s;
  fill: #f0841d;
}
#prev:hover .arrow,
#next:hover .arrow {
  transform: scale(1.2);
}

.viewer {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;

  margin: 0 100px;

  user-select: none;
}

.viewer img {
  width: 100%;
  height: auto;
}

@media (min-aspect-ratio: 2054/1278) {
  .viewer,
  .viewer img {
    width: auto;
    height: 100%;
  }
}

.en-menu {
  display: none;
}

.nav-back {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: black;
  cursor: pointer;

  visibility: hidden;
  opacity: 0;
  transition: visibility 0.3s, opacity 0.3s;
  z-index: 7;
}

.nav-back.on {
  visibility: visible;
  opacity: 0.7;
}

.nav,
.how {
  position: absolute;
  background-color: white;
  background-color: #1e9354;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  width: calc(100% - 200px);
  /* height: calc(100vh - 200px); */
  max-height: calc(100vh - 200px);

  transition: visibility 0.3s, opacity 0.3s;
  visibility: hidden;
  opacity: 0;
  z-index: 7;

  overflow-y: auto;
}

.nav::-webkit-scrollbar,
.how::-webkit-scrollbar {
  width: 6px;
}
.nav::-webkit-scrollbar-track,
.how::-webkit-scrollbar-track {
  background-color: #4bb47c;
  border-radius: 10px;
}
.nav::-webkit-scrollbar-thumb,
.how::-webkit-scrollbar-thumb {
  background-color: #177041;
  border-radius: 10px;
}

.nav.on,
.how.on {
  display: flex;
  visibility: visible;
  opacity: 1;
}

.nav .menu {
  width: 100%;
  height: 100%;
}

.nav .menu .lan_btn,
.how .lan_btn {
  position: absolute;
  right: 0;
  top: 0;
  cursor: pointer;
  padding: 20px;
  font-weight: 700;
}

.nav ul.ko-menu,
.nav ul.en-menu {
  text-align: left;
  margin: 0;
  padding: 40px 5.8%;
  list-style: none;
  column-count: 2;
  column-gap: 8%;
  /* font-size: 15px; */
  font-weight: 600;
  line-height: 1.48;
  word-break: keep-all;
}

.nav li.f-list {
  display: flex;
  flex-wrap: wrap;
}

.nav ul.ko-menu ul,
.nav ul.en-menu ul {
  margin: 1em 0;
  padding-left: 0;
  flex: 100% 1 1;
}

.nav .num {
  display: inline-block;
  min-width: 3em;
}

.nav ul.ko-menu ul .num,
.nav ul.en-menu ul .num {
  margin-right: 1em;
}

@media (max-aspect-ratio: 1/1) {
  .nav,
  .how {
    height: calc(100% - 200px);
    overflow-y: auto;
  }

  .nav ul.ko-menu,
  .nav ul.en-menu {
    column-count: 1;
  }

  .nav::-webkit-scrollbar {
    width: 6px;
  }
  .nav::-webkit-scrollbar-track {
    background-color: #4bb47c;
    border-radius: 10px;
  }
  .nav::-webkit-scrollbar-thumb {
    background-color: #177041;
    border-radius: 10px;
  }
}

.nav ul ul li {
  display: flex;
}

.nav span.ko {
  /* display: inline-block; */
  flex: 1% 1 1;
  cursor: pointer;
  text-decoration-color: #f0841d;

  user-select: none;
}

.nav span.ko:hover {
  text-decoration: underline;
  text-decoration-color: #f0841d;
}

.how {
  padding: 40px 5%;
  height: auto;
  /* max-height: calc(100vh - 200px); */
  width: auto;
  /* max-width: calc(100% - 200px); */
}

.how .inner {
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1.7;
  font-size: 14px;
  font-weight: 500;
  height: 100%;
  word-break: keep-all;
}

.how h2 {
  margin-top: 0;
  margin-bottom: 0.8em;
  text-align: center;
  font-weight: 600;
}
.how h3 {
  margin-top: 0;
  margin-bottom: 0.3em;
  line-height: 1;
  font-weight: 600;
}

.how p {
  margin: 0 0 1em 1em;
  line-height: 1.6;
}

.search,
.footer {
  width: 100%;
  height: 60px;
  position: fixed;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;

  /* border: 1px solid; */

  transition: visibility 0.3s, opacity 0.3s;
  visibility: hidden;
  opacity: 0;
  user-select: none;
  z-index: 7;
}
.search.on,
.footer.on {
  visibility: visible;
  opacity: 1;
}

.search {
  background-color: #76cbef;
  background-color: #1e9354;
  background-color: #babcbf;
  background-color: #fff;
  top: 0;
  flex-wrap: wrap;
  /* padding-left: 80px; */
}
.footer {
  background-color: #20408f;
  background-color: #76cbef;
  bottom: 0;
  color: #fff;
}

.search a {
  text-decoration: none;
  margin-right: 20px;
  color: black;
  color: #fff;
  padding: 0.3em 0.5em;
  background-color: #20408f;
}

.search a img {
  height: 1em;
  filter: invert(1);
}

.footer marquee {
}

.footer .text {
  display: inline-block;
  font-size: 16px;
  margin-right: 2em;
  transform: translateY(-6px);
}

.footer img {
  height: 25px;
  margin-right: 2em;
}

.footer img.filter {
  filter: invert(1);
}

.nav-btn {
  position: fixed;
  right: 20px;
  bottom: 10px;
  height: 40px;
  width: 40px;
  cursor: pointer;
  user-select: none;

  transition: transform 0.3s;
  z-index: 6;
}

.nav-btn img {
  width: 100%;
}

.nav-btn:hover {
  transform: scale(1.1);
}

.page-number {
  display: none;
  position: fixed;
  color: #000000;
  left: 1em;
  bottom: 1em;
  /* opacity: 0.5; */
  user-select: none;
}

@media screen and (max-width: 700px) {
  .viewer {
    margin: 0 45px;
  }
  .nav,
  .how {
    width: calc(100% - 90px);
  }
  .arrow {
    margin: 10px;
    width: 25px;
  }
  .lightbox div {
    width: calc(100vw - 25px);
  }
}

/* 라이트박스 */
.lightbox-back {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: black;

  cursor: pointer;

  visibility: hidden;
  opacity: 0;
  transition: visibility 0.3s, opacity 0.3s;
  z-index: 11;
}

.lightbox-back.on {
  visibility: visible;
  opacity: 0.85;
}

.lightbox {
  position: absolute;
  /* background-color: white; */
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;

  width: max-content;
  margin-top: -30px;
  /* width: calc(100% - 80px);
  height: calc(100% - 120px); */
  /* padding: 50px; */

  transition: visibility 0.3s, opacity 0.3s;
  visibility: hidden;
  opacity: 0;
  z-index: 11;
}

.lightbox.on {
  visibility: visible;
  opacity: 1;
}

.lightbox img {
  display: none;
  width: 100%;
  height: 100%;
  max-width: calc(100vw - 30px);
  max-height: calc(100vh - 100px - 120px);
  object-fit: contain;
}

.lightbox div {
  display: none;
  width: calc(100vw - 160px);
}

@media (min-aspect-ratio: 1440/945) {
  .lightbox div {
    width: calc(80vw - 160px);
  }
}

.lightbox p {
  min-width: max-content;
  text-align: right;
  font-size: 13px;
  margin: 0;
  line-height: 1.3;
  position: absolute;
  bottom: -1em;
  transform: translateY(100%);
  color: white;
  word-break: keep-all;
}

.lightbox svg {
  position: fixed;
  right: -40px;
  top: 0;
  width: 25px;
  height: 25px;
  cursor: pointer;
}

/* 일러두기 */
.how-btn {
  position: fixed;
  left: 20px;
  top: 10px;
  height: 40px;
  width: 40px;
  cursor: pointer;
  user-select: none;

  transition: transform 0.3s;
  z-index: 5;
}

.how-btn img {
  width: 100%;
}

.how-btn:hover {
  transform: scale(1.1);
}

.how-back {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: black;

  cursor: pointer;

  visibility: hidden;
  opacity: 0;
  transition: visibility 0.3s, opacity 0.3s;
  z-index: 11;
}

.how-back.on {
  visibility: visible;
  opacity: 0.85;
}

/* 장면들 */

.scenes {
  position: absolute;
  width: 100%;
  height: 100%;
}

.scenes .scenes_bg,
.scenes .scenes_fig {
  position: absolute;
  cursor: pointer;
}

.scenes .scenes_bg {
  width: 100%;
  height: 100%;
}

.scenes .scenes_fig {
  background-color: #f0841d;
  opacity: 0;
  transition: opacity 0.3s;
}

.scenes .scenes_fig:hover {
  opacity: 0.4;
}

/* 개별 위치 */
.scenes .f108.scenes_fig:nth-child(2) {
  width: 22.7%;
  height: 24.6%;
  left: 27.3%;
  top: 2.7%;
}

.scenes .f108.scenes_fig:nth-child(3) {
  width: 16.8%;
  height: 18.5%;
  left: 82.4%;
  top: 2.6%;
}

.scenes .f108.scenes_fig:nth-child(4) {
  width: 22.2%;
  height: 26.5%;
  left: 77.8%;
  top: 53.7%;
}

.scenes .f108.scenes_fig:nth-child(5) {
  width: 9.5%;
  height: 18.6%;
  left: 58.8%;
  top: 58.7%;
}

.scenes .f108.scenes_fig:nth-child(6) {
  width: 17.1%;
  height: 18.8%;
  left: 25.5%;
  top: 71.1%;
}

.scenes .f108.scenes_fig:nth-child(7) {
  width: 17.1%;
  height: 18.3%;
  left: 0;
  top: 25.7%;
}
.scenes .f108.scenes_fig:nth-child(8) {
  width: 17.1%;
  height: 18.3%;
  left: 0;
  top: 49.5%;
}

.scenes .f109.scenes_fig:nth-child(2) {
  width: 13.4%;
  height: 27.5%;
  left: 3%;
  top: 17%;
}
.scenes .f109.scenes_fig:nth-child(3) {
  width: 37.8%;
  height: 41%;
  left: 38%;
  top: 32.8%;
}
.scenes .f109.scenes_fig:nth-child(4) {
  left: 55.8%;
  top: 15.9%;
  width: 17.3%;
  height: 4.6%;
}
.scenes .f109.scenes_fig:nth-child(5) {
  left: 87.1%;
  top: 21.1%;
  width: 12.8%;
  height: 12.5%;
}
.scenes .f109.scenes_fig:nth-child(6) {
  left: 84.6%;
  top: 67.5%;
  width: 10%;
  height: 19.2%;
}
.scenes .f109.scenes_fig:nth-child(7) {
  left: 9.2%;
  top: 54.5%;
  width: 17.2%;
  height: 18.3%;
}
.scenes .f109.scenes_fig:nth-child(8) {
  left: 9.2%;
  top: 73.4%;
  width: 17.2%;
  height: 18.3%;
}

.scenes .f110.scenes_fig:nth-child(1) {
  left: 3.5%;
  top: 24.8%;
  width: 10.5%;
  height: 15.7%;
}
.scenes .f110.scenes_fig:nth-child(2) {
  left: 36.8%;
  top: 38.4%;
  width: 11%;
  height: 21.4%;
}
.scenes .f110.scenes_fig:nth-child(3) {
  left: 55.8%;
  top: 62.6%;
  width: 11.2%;
  height: 21.5%;
}
.scenes .f110.scenes_fig:nth-child(4) {
  left: 79.9%;
  top: 62.7%;
  width: 14.9%;
  height: 28.8%;
}
.scenes .f110.scenes_fig:nth-child(5) {
  left: 2.9%;
  top: 66.4%;
  width: 12.6%;
  height: 17.2%;
}
.scenes .f110.scenes_fig:nth-child(6) {
  left: 16.2%;
  top: 66.4%;
  width: 12.2%;
  height: 17.2%;
}

.scenes .f111.scenes_fig:nth-child(2) {
  left: 0%;
  top: 27.2%;
  width: 10.1%;
  height: 12.2%;
}
.scenes .f111.scenes_fig:nth-child(3) {
  left: 51.9%;
  top: 28.8%;
  width: 13.2%;
  height: 14.5%;
}
.scenes .f111.scenes_fig:nth-child(4) {
  left: 85.8%;
  top: 20.3%;
  width: 9.3%;
  height: 7%;
}
.scenes .f111.scenes_fig:nth-child(5) {
  left: 80.9%;
  top: 44.1%;
  width: 13.5%;
  height: 10.3%;
}
.scenes .f111.scenes_fig:nth-child(6) {
  left: 66.9%;
  top: 62.7%;
  width: 13.5%;
  height: 14.9%;
}
.scenes .f111.scenes_fig:nth-child(7) {
  left: 29.9%;
  top: 79.8%;
  width: 13.5%;
  height: 15.2%;
}
.scenes .f111.scenes_fig:nth-child(8) {
  left: 0.7%;
  top: 54.4%;
  width: 11.5%;
  height: 21.5%;
}
.scenes .f111.scenes_fig:nth-child(9) {
  left: 12.6%;
  top: 54.4%;
  width: 11.5%;
  height: 21.5%;
}
.scenes .f111.scenes_fig:nth-child(10) {
  left: 24.4%;
  top: 54.4%;
  width: 11.5%;
  height: 21.5%;
}

.scenes .f112.scenes_fig:nth-child(2) {
  left: 1.8%;
  top: 25.4%;
  width: 10.2%;
  height: 18.4%;
}
.scenes .f112.scenes_fig:nth-child(3) {
  left: 21.6%;
  top: 10.4%;
  width: 20.8%;
  height: 22.8%;
}
.scenes .f112.scenes_fig:nth-child(4) {
  left: 75.8%;
  top: 54.1%;
  width: 10.2%;
  height: 14.8%;
}
.scenes .f112.scenes_fig:nth-child(5) {
  left: 86.7%;
  top: 54.1%;
  width: 10.1%;
  height: 14.8%;
}

.scenes .f113.scenes_bg:nth-child(1) {
  left: 0%;
  top: 0%;
  width: 50%;
  height: 100%;
}
.scenes .f113.scenes_bg:nth-child(2) {
  left: 50%;
  top: 0%;
  width: 50%;
  height: 100%;
}

.scenes .f114.scenes_fig:nth-child(2) {
  left: 1.8%;
  top: 21.8%;
  width: 13%;
  height: 26.7%;
}
.scenes .f114.scenes_fig:nth-child(3) {
  left: 15.6%;
  top: 21.8%;
  width: 13%;
  height: 26.7%;
}
.scenes .f114.scenes_fig:nth-child(4) {
  left: 29.2%;
  top: 21.8%;
  width: 13%;
  height: 26.7%;
}
.scenes .f114.scenes_fig:nth-child(5) {
  left: 54.8%;
  top: 16%;
  width: 41.9%;
  height: 25.7%;
}
.scenes .f114.scenes_fig:nth-child(6) {
  left: 82.4%;
  top: 47.2%;
  width: 15.7%;
  height: 32.2%;
}
.scenes .f114.scenes_fig:nth-child(7) {
  left: 52.9%;
  top: 69.1%;
  width: 15.1%;
  height: 14.8%;
}

.scenes .f115.scenes_fig:nth-child(2) {
  left: 34.1%;
  top: 29.9%;
  width: 14.1%;
  height: 13.8%;
}
.scenes .f115.scenes_fig:nth-child(3) {
  left: 80.8%;
  top: 25%;
  width: 13.8%;
  height: 13.9%;
}
.scenes .f115.scenes_fig:nth-child(4) {
  left: 51.9%;
  top: 64.1%;
  width: 25.1%;
  height: 24.9%;
}
.scenes .f115.scenes_fig:nth-child(5) {
  left: 28.3%;
  top: 78.6%;
  width: 14%;
  height: 13.8%;
}

.scenes .f116.scenes_fig:nth-child(1) {
  left: 5%;
  top: 17.6%;
  width: 21.8%;
  height: 35.1%;
}
.scenes .f116.scenes_fig:nth-child(2) {
  left: 58%;
  top: 18.8%;
  width: 13.6%;
  height: 18.6%;
}
.scenes .f116.scenes_fig:nth-child(3) {
  left: 73.2%;
  top: 18.8%;
  width: 13.6%;
  height: 18.6%;
}
.scenes .f116.scenes_fig:nth-child(4) {
  left: 88.6%;
  top: 18.8%;
  width: 11.4%;
  height: 18.6%;
}

.scenes .f117.scenes_fig:nth-child(1) {
  left: 1.9%;
  top: 24.4%;
  width: 20.7%;
  height: 21.3%;
}
.scenes .f117.scenes_fig:nth-child(2) {
  left: 1.9%;
  top: 46.7%;
  width: 20.7%;
  height: 21.3%;
}
.scenes .f117.scenes_fig:nth-child(3) {
  left: 1.9%;
  top: 69.3%;
  width: 20.7%;
  height: 21.3%;
}
.scenes .f117.scenes_fig:nth-child(4) {
  left: 78.6%;
  top: 50.6%;
  width: 15.7%;
  height: 32.1%;
}

.scenes .f118.scenes_fig:nth-child(1) {
  left: 1.6%;
  top: 4.3%;
  width: 30.6%;
  height: 25.1%;
}
.scenes .f118.scenes_fig:nth-child(2) {
  left: 77.5%;
  top: 2.7%;
  width: 17.1%;
  height: 17.3%;
}
.scenes .f118.scenes_fig:nth-child(3) {
  left: 77.5%;
  top: 21.2%;
  width: 17.1%;
  height: 17.3%;
}
.scenes .f118.scenes_fig:nth-child(4) {
  left: 77.5%;
  top: 39.8%;
  width: 17.1%;
  height: 17.3%;
}
.scenes .f118.scenes_fig:nth-child(5) {
  left: 48%;
  top: 54.5%;
  width: 17.5%;
  height: 17.7%;
}
.scenes .f118.scenes_fig:nth-child(6) {
  left: 48%;
  top: 72.9%;
  width: 17.5%;
  height: 17.7%;
}
.scenes .f118.scenes_fig:nth-child(7) {
  left: 21%;
  top: 46.5%;
  width: 19.7%;
  height: 16.1%;
}
.scenes .f118.scenes_fig:nth-child(8) {
  left: 0%;
  top: 70.6%;
  width: 16.5%;
  height: 17.1%;
}

.scenes .f119.scenes_fig:nth-child(2) {
  left: 4.7%;
  top: 43.7%;
  width: 22.4%;
  height: 22.9%;
}
.scenes .f119.scenes_fig:nth-child(3) {
  left: 4.5%;
  top: 68%;
  width: 22.4%;
  height: 22.9%;
}
.scenes .f119.scenes_fig:nth-child(4) {
  left: 34.6%;
  top: 27.1%;
  width: 15.4%;
  height: 31.7%;
}
.scenes .f119.scenes_fig:nth-child(5) {
  left: 66.2%;
  top: 23.3%;
  width: 13.5%;
  height: 21.6%;
}
.scenes .f119.scenes_fig:nth-child(6) {
  left: 81%;
  top: 23.3%;
  width: 13.5%;
  height: 21.6%;
}
.scenes .f119.scenes_fig:nth-child(7) {
  left: 59.4%;
  top: 63.8%;
  width: 24.3%;
  height: 26.6%;
}

.scenes .f120.scenes_fig:nth-child(1) {
  left: 12.2%;
  top: 35.3%;
  width: 26.8%;
  height: 29.2%;
}
.scenes .f120.scenes_fig:nth-child(2) {
  left: 56.6%;
  top: 35.3%;
  width: 36%;
  height: 29.2%;
}

.scenes .f121.scenes_fig:nth-child(2) {
  left: 49.9%;
  top: 26.7%;
  width: 20.4%;
  height: 22.2%;
}
.scenes .f121.scenes_fig:nth-child(3) {
  left: 83.9%;
  top: 20%;
  width: 9%;
  height: 23.1%;
}
.scenes .f121.scenes_fig:nth-child(4) {
  left: 67.8%;
  top: 58.2%;
  width: 30.5%;
  height: 33.2%;
}
.scenes .f121.scenes_fig:nth-child(5) {
  left: 34.2%;
  top: 66.6%;
  width: 15.8%;
  height: 30.8%;
}
.scenes .f121.scenes_fig:nth-child(6) {
  left: 4.5%;
  top: 66.4%;
  width: 17.2%;
  height: 18.7%;
}

/* 장면들 다음 */
.scenes .f125.scenes_fig:nth-child(1) {
  left: 1.8%;
  top: 58%;
  width: 17.2%;
  height: 16.4%;
}
.scenes .f125.scenes_fig:nth-child(2) {
  left: 1.8%;
  top: 76.5%;
  width: 17.2%;
  height: 16.5%;
}
.scenes .f125.scenes_fig:nth-child(3) {
  left: 55.7%;
  top: 59.4%;
  width: 17.2%;
  height: 33.7%;
}
.scenes .f125.scenes_fig:nth-child(4) {
  left: 77.4%;
  top: 59.4%;
  width: 17.2%;
  height: 33.7%;
}

.scenes .f126.scenes_fig:nth-child(1) {
  left: 1.8%;
  top: 72.5%;
  width: 10%;
  height: 20.7%;
}
.scenes .f126.scenes_fig:nth-child(2) {
  left: 12.7%;
  top: 72.5%;
  width: 9.9%;
  height: 20.7%;
}
.scenes .f126.scenes_fig:nth-child(3) {
  left: 23.5%;
  top: 72.5%;
  width: 9.9%;
  height: 20.7%;
}
.scenes .f126.scenes_fig:nth-child(4) {
  left: 34.2%;
  top: 72.5%;
  width: 10%;
  height: 20.7%;
}
.scenes .f126.scenes_fig:nth-child(5) {
  left: 55.7%;
  top: 62.3%;
  width: 14.4%;
  height: 14.9%;
}
.scenes .f126.scenes_fig:nth-child(6) {
  left: 55.7%;
  top: 78.1%;
  width: 14.4%;
  height: 14.9%;
}
.scenes .f126.scenes_fig:nth-child(7) {
  left: 77.4%;
  top: 62.3%;
  width: 14.4%;
  height: 14.9%;
}
.scenes .f126.scenes_fig:nth-child(8) {
  left: 77.4%;
  top: 78.1%;
  width: 14.4%;
  height: 14.9%;
}

.scenes .f127.scenes_fig:nth-child(1) {
  left: 1.8%;
  top: 72.5%;
  width: 10%;
  height: 20.7%;
}
.scenes .f127.scenes_fig:nth-child(2) {
  left: 12.7%;
  top: 72.5%;
  width: 9.9%;
  height: 20.7%;
}
.scenes .f127.scenes_fig:nth-child(3) {
  left: 23.5%;
  top: 72.5%;
  width: 9.9%;
  height: 20.7%;
}
.scenes .f127.scenes_fig:nth-child(4) {
  left: 34.2%;
  top: 72.5%;
  width: 10%;
  height: 20.7%;
}
.scenes .f127.scenes_fig:nth-child(5) {
  left: 55.7%;
  top: 46.1%;
  width: 13.2%;
  height: 14.4%;
}
.scenes .f127.scenes_fig:nth-child(6) {
  left: 55.7%;
  top: 61.7%;
  width: 13.2%;
  height: 14.4%;
}
.scenes .f127.scenes_fig:nth-child(7) {
  left: 55.7%;
  top: 77.3%;
  width: 13.2%;
  height: 14.4%;
}
.scenes .f127.scenes_fig:nth-child(8) {
  left: 77.4%;
  top: 72.4%;
  width: 10%;
  height: 19.2%;
}

.scenes .f127.scenes_fig:nth-child(9) {
  left: 88.2%;
  top: 72.4%;
  width: 10%;
  height: 19.2%;
}

.scenes .f128.scenes_fig:nth-child(1) {
  left: 1.8%;
  top: 73.9%;
  width: 8.6%;
  height: 17.7%;
}
.scenes .f128.scenes_fig:nth-child(2) {
  left: 11.3%;
  top: 73.9%;
  width: 8.6%;
  height: 17.7%;
}
.scenes .f128.scenes_fig:nth-child(3) {
  left: 23.4%;
  top: 64.6%;
  width: 20.8%;
  height: 13%;
}
.scenes .f128.scenes_fig:nth-child(4) {
  left: 23.4%;
  top: 78.7%;
  width: 20.8%;
  height: 13%;
}
.scenes .f128.scenes_fig:nth-child(5) {
  left: 55.7%;
  top: 78%;
  width: 13.6%;
  height: 13.6%;
}
.scenes .f128.scenes_fig:nth-child(6) {
  left: 70.2%;
  top: 78%;
  width: 13.6%;
  height: 13.6%;
}
.scenes .f128.scenes_fig:nth-child(7) {
  left: 84.7%;
  top: 78%;
  width: 13.6%;
  height: 13.6%;
}

.scenes .f129.scenes_fig:nth-child(1) {
  left: 1.8%;
  top: 79.9%;
  width: 13.5%;
  height: 13.2%;
}
.scenes .f129.scenes_fig:nth-child(2) {
  left: 16.4%;
  top: 79.9%;
  width: 13.5%;
  height: 13.2%;
}
.scenes .f129.scenes_fig:nth-child(3) {
  left: 30.8%;
  top: 79.9%;
  width: 13.5%;
  height: 13.2%;
}
.scenes .f129.scenes_fig:nth-child(4) {
  left: 55.7%;
  top: 51.6%;
  width: 10%;
  height: 20%;
}
.scenes .f129.scenes_fig:nth-child(5) {
  left: 66.6%;
  top: 51.6%;
  width: 10%;
  height: 20%;
}
.scenes .f129.scenes_fig:nth-child(6) {
  left: 77.4%;
  top: 51.6%;
  width: 10%;
  height: 20%;
}
.scenes .f129.scenes_fig:nth-child(7) {
  left: 55.7%;
  top: 73%;
  width: 10%;
  height: 20%;
}
.scenes .f129.scenes_fig:nth-child(8) {
  left: 66.6%;
  top: 73%;
  width: 10%;
  height: 20%;
}
.scenes .f129.scenes_fig:nth-child(9) {
  left: 77.4%;
  top: 73%;
  width: 10%;
  height: 20%;
}

.scenes .f130.scenes_fig:nth-child(1) {
  left: 1.8%;
  top: 54.6%;
  width: 17.1%;
  height: 17.9%;
}
.scenes .f130.scenes_fig:nth-child(2) {
  left: 1.8%;
  top: 73.7%;
  width: 17.1%;
  height: 17.9%;
}
.scenes .f130.scenes_fig:nth-child(3) {
  left: 21.3%;
  top: 67.4%;
  width: 10.7%;
  height: 11.5%;
}
.scenes .f130.scenes_fig:nth-child(4) {
  left: 21.3%;
  top: 80.2%;
  width: 10.7%;
  height: 11.5%;
}
.scenes .f130.scenes_fig:nth-child(5) {
  left: 34.3%;
  top: 71.6%;
  width: 9.9%;
  height: 20%;
}
.scenes .f130.scenes_fig:nth-child(6) {
  left: 55.8%;
  top: 45%;
  width: 13.5%;
  height: 14.5%;
}
.scenes .f130.scenes_fig:nth-child(7) {
  left: 55.8%;
  top: 61%;
  width: 13.5%;
  height: 14.5%;
}
.scenes .f130.scenes_fig:nth-child(8) {
  left: 55.8%;
  top: 77.1%;
  width: 13.5%;
  height: 14.5%;
}
.scenes .f130.scenes_fig:nth-child(9) {
  left: 77.4%;
  top: 72.5%;
  width: 10%;
  height: 19.1%;
}
.scenes .f130.scenes_fig:nth-child(10) {
  left: 88.2%;
  top: 72.5%;
  width: 10%;
  height: 19.1%;
}

.cooming {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -100%);
  background-color: white;
  padding: 0.2em 1em;
  font-size: 8vw;
  width: 100%;
  text-align: center;
}