* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.m-plus-1p-thin {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.m-plus-1p-light {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.m-plus-1p-regular {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.m-plus-1p-medium {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.m-plus-1p-bold {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.m-plus-1p-extrabold {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 800;
  font-style: normal;
}

.m-plus-1p-black {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  font-style: normal;
}

body {
  background-color: rgb(255, 255, 255);
  font-family: "M PLUS 1p";
  font-size: 20px;
  padding: 50px;
  transition-duration: 0.7s;
}

/* .Dark-box {
  position: absolute;
  top: 3em;
  right: 4em;
} */

#dark-button {
  display: block;
  position: absolute;
  width: 3em;
  height: 3em;
  top: 2.7em;
  right: 2.7em;
  background-color: #00000000;
  border-radius: 50%;
  overflow: hidden;
}

#dark-button:hover {
  background-color: #00000025;
  transition-duration: 0.4s;
}

@media (max-width: 499px) {
  #dark-button {
    top: 5.5em;
  }
}

#switch10 {
  position: absolute;
  display: block;
  opacity: 0;
}

#image-dark {
  position: relative;
  display: block;
  width: 3em;
  height: 3em;
}

.Emote-table {
  padding: 35px;
  margin-top: 50px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  text-align: center;
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed;
  height: 100px;
}

h2 {
  margin-top: 60px;
}

.table1 {
  word-break: break-all;
}

.table1:nth-child(odd) {
  background-color: #f2f2f2;
}

.table-top {
  background-color: #94edfc;
  table-layout: fixed;
  height: 100px;
}

button {
  padding: 0;
  border: none;
  background: none;
}

.emote {
  display: block;
  margin: 7.5%;
  width: 75%;
}

.emote2 {
  display: block;
  margin: 11.67%;
  width: 116.67%;
  margin-left: -15%;
}

.emote3 {
  display: block;
  margin: 10%;
  width: 100%;
  margin-left: -7%;
}

.emote4 {
  display: block;
  margin-top: 15%;
  margin-bottom: 15%;
  margin-right: 15%;
  margin-left: -34%;
  width: 150%;
}

.emote5 {
  display: block;
  width: 52.865%;
  margin: 0.629883em;
  margin-left: 20%;
  margin-right: auto;
}

.emote6 {
  display: block;
  margin: 8.39844%;
  width: 84%;
  margin-left: 1.79%;
}

.emote7 {
  display: block;
  height: 95px;
  margin-left: -10%;
  margin-top: 8.39844px;
  margin-bottom: 8.39844px;
}

.emote8 {
  display: block;
  height: 84px;
  margin-left: -9%;
  margin-top: 8.39844px;
  margin-bottom: 8.39844px;
}

.image {
  font-size: 0px;
  line-height: 0px;
}

.image1 {
  font-size: 0px;
  line-height: 0px;
}

.DECtalk-table {
  margin-left: auto;
  margin-right: auto;
  table-layout: fixed;
  width: 100%;
  text-align: center;
  border-collapse: collapse;
  border-spacing: 0;
  word-break: break-all;
}

.table2:nth-child(even) {
  background-color: #f2f2f2;
}

.text-box {
  padding: 40px;
}

#Title-box {
  table-layout: auto;
  height: 100px;
  width: 100%;
}

.table-box {
  margin-top: 50px;
  background-color: #94edfc;
}

.b-dark {
  background-color: #1b1b1b;
  color: #ffffff;
  .table-top-dark {
    background-color: #05a4bf;
  }
  .table1-dark:nth-child(odd) {
    background-color: #595959;
  }
  .table2-dark:nth-child(even) {
    background-color: #595959;
  }
  .table-box-dark {
    background-color: #05a4bf;
  }
  #dark-button:hover {
    background-color: #ffffff3a;
    transition-duration: 0.4s;
  }
}
.spritespin {
  height: 500;
}
#div360 {
  margin-left: -0.85rem;
  padding-top: 8.39844px;
  padding-bottom: 8.39844px;
}
#viewer-360 {
  font-size: 0px;
  line-height: 0px;
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
}