*{
  margin:0;
  padding:0;
  }
*{
  font-family:sans-serif;
}
body {
  margin: 0;
  padding: 0;
  background-color: white;
  color: #8e8e8e;
}
.box {
      display: flex;
      margin: 0em 0em 0em 0em;
      /** overflow-x: scroll; snapしない場合 **/
      overflow: scroll /** autoでもOK（ブラウザに依存）**/;
      overflow-y: hidden;
      scroll-snap-type: x;
      scroll-behavior: smooth;
}   

.box div {
        width: 100%;
        margin: 0em 7em 0.5em 0em;
        padding: 0em;
}

/**.box div img{
  height: 69.2%;
}**/


.box div img{
  height: 94.5svh;
}

embed{

height: 100svh;
}

/**.box div p{
  margin: 0em 40em 0em 10em;
  padding: 0em;
}**/

.area {
  scroll-snap-align: center;
}

.bottom-fixed {
  font-size: 0.5em;
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 3em;
  padding: 1em 0 0 2em;
  text-align:center;
  background: #fff;
  box-shadow: 0px 10px 10px 6px rgba(0, 0, 0, 0.3);

  /**border-top: 0.1em solid rgba(0, 0, 0, 0.3);**/
}
.bottom-mark-fixed {
  font-size: 0.65em;
  height: 3em;
  position: fixed;
  bottom: 1.6em;
  display: block;
  height: 1em;
  padding: 0em 0 0em 1.5em;
  text-align:left;
  z-index: 99;
}
.spacer01{
  margin-left:50em;
}

/* .box div:hover {
  overflow-x: scroll;
} */