@media screen and (max-width: 1022px) {
  .about-item {
    width: min(95%, 640px);
    margin: 0 auto;
    padding-top: 12rem;
  }
  .about-item h1 {
    font-size: 2.4rem;
    text-align: center;
    margin-bottom: 4rem;
  }
  .about-item h2 {
    font-size: 1.6rem;
    width: 11rem;
  }
  .about-item p {
    width: calc(100% - 11rem);
    font-size: 1.6rem;
  }
  .about-item img {
    width: 30rem;
    height: 30rem;
    object-fit: cover;
    margin: 0 auto;
  }
  .about-item section {
    display: flex;
    justify-content: space-between;
    width: 100%;
    border-top: 1px dashed var(--font);
    border-bottom: 1px dashed var(--font);
    padding: 1em;
  }
  .about-item #map {
    width: 100%;
    margin: 4rem auto 0 auto;
    display: block;
  }
  .about-item iframe {
    width: 100%;
    height: 32rem;
  }
}
@media screen and (min-width: 1023px) {
  .about-item,
  .buy-item,
  .question-item,
  .contact-item {
    width: var(--vw);
    max-width: 160rem;
    margin: 0 auto;
    padding-top: 20rem;
    padding-bottom: 8rem;
    position: relative;
  }
  .buy-item {
    width: 80vw;
  }
  .about-item h1,
  .buy-item h1,
  .question-item h1,
  .contact-item h1 {
    font-size: 3.2rem;
    text-align: left;
    position: relative;
  }
  .about-item h2 {
    font-size: 1.8rem;
    width: 16rem;
  }
  .about-item p {
    width: calc(100% - 20rem);
    font-size: 1.8rem;
  }
  .about-item-flex {
    display: flex;
    justify-content: space-between;
    margin-top: 4rem;
  }
  .about-item-flex img {
    width: 40rem;
    height: 42rem;
    object-fit: cover;
    object-position: top;
    border-radius: var(--maru);
    margin-left: 4rem;
  }
  .about-item section {
    display: flex;
    justify-content: space-between;
    width: 100%;
    border-top: 1px dashed var(--font);
    border-bottom: 1px dashed var(--font);
    padding: 1em;
  }
  .about-item #map {
    width: 100%;
    margin: 4rem auto;
    display: block;
  }
  .about-item iframe {
    width: 100%;
    height: 36rem;
  }
}