@charset "UTF-8";

.demo01 {
  width: min(100%, 800px);
  margin: 0 auto 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  aspect-ratio: 16 / 9;
  border-radius: 8px;
  background-color: #BCF8FF;
  text-align: center;

  p {
    font-size: 16px;
  }
}
.demo02 {
  width: min(100%, 600px);
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  aspect-ratio: 1 / 1;
  border-radius: 8px;
  background-color: #BCF8FF;
  text-align: center;
  border-radius: 50%;

  p {
    font-size: 16px;
  }
}


/* YouTube */
.video-wrapper {
  width: min(100%, 600px);
  margin: 0 auto;
  aspect-ratio: 16 / 9;
}

.video-wrapper iframe {
  width: 100%;
  height: 100%;
}

/* google map */
.map-wrapper {
  width: min(100%, 600px);
  margin: 0 auto;
  aspect-ratio: 4 / 3;
}

.map-wrapper iframe {
  width: 100%;
  height: 100%;
}

.map-wrapper02 {
  aspect-ratio: 4 / 1.5;
}

.map-wrapper02 iframe {
  width: 100%;
  height: 100%;
}