@import url(/css/style.css?v=0.1);

picture {
  width: 582px;
  height: auto;

  position: absolute;
  left: 50%;

  transform: translateX(-50%);

  transform-style: preserve-3d;
}

picture svg {
  width: 95vw;

  fill: none;
  stroke: #ffffff;
  stroke-miterlimit: 10;

  position: absolute;
  left: 50%;
  top: 15%;

  transform: translateX(-50%) translateZ(-1px);

  z-index: 0;
}

picture img,
picture source {
  width: 100%;
  height: auto;

  z-index: 10;
}

.wrap {
  margin-top: 37vw;

  display: flex;
  flex-direction: column;
  gap: 2rem;

  z-index: 99;
}

body > p {
  width: 90%;

  font-size: 0.75rem;
  text-align: center;

  margin-bottom: 4vh;

  z-index: 99;
}

button svg {
  width: auto;
  height: 1.75rem;
}

button svg * {
  fill: #fff;
}

@media screen and (max-width: 1220px) {
  .wrap {
    margin-top: 50vw;
  }
}

@media screen and (max-width: 800px) {
  .wrap {
    margin-top: 75vw;
  }
}

@media screen and (max-width: 430px) {
  .wrap {
    margin-top: 80vw;
  }

  picture {
    width: 110%;
  }

  button svg {
    height: 1rem;
  }

  body > p {
    font-size: 0.625rem;
  }
}