.contact {
  padding: 40px clamp(20px, calc(27.5px + 50vw - 187.5px), 27.5px) 80px;
}

.contact__intro {
  margin: 80px auto 40px;
  font-family: "Shippori Mincho", serif;
  font-size: 20px;
  line-height: 24px;
  font-weight: 600;
  text-align: center;
}

.contact__content {
  width: 100%;
  max-width: 320px;
  margin: 0 auto;
  border: 1px solid #000;
  padding: 24px clamp(16px, calc(23.5px + 50vw - 187.5px), 23.5px);
}

.contact__tel {
  font-size: min(36px, 9.6vw);
  line-height: 1;
  font-weight: 600;
  font-family: "Shippori Mincho", serif;
  display: flex;
  align-items: center;
  gap: 2px;
}

.contact__tel::before {
  content: "";
  display: block;
  width: 32px;
  height: 32px;
  background-image: url(../images/common/mdi_phone.svg);
  background-size: contain;
  background-repeat: no-repeat;
}

.contact__schedule {
  margin: 16px auto 0;
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: center;
}

.contact__schedule span {
  font-size: 14px;
  line-height: 16px;
}

.contact__schedule span:first-child {
  border: 1px solid #000;
  padding: 1.5px 7.5px;
}

.contact__schedule span:last-child {
  font-size: 16px;
  line-height: 21px;
}

@media (min-width: 768px) {
  .contact {
    padding: 120px 30px 64px;
  }

  .contact__intro {
    margin: 64px auto 32px;
    font-size: 24px;
    line-height: 36px;
  }

  .contact__content {
    max-width: 504px;
    margin: 0 auto;
    padding: 32px 115.5px;
  }

  .contact__schedule span:first-child {
    line-height: 28px;
    padding: 2px 8px;
  }

  .contact__schedule span:last-child {
    font-size: 16px;
    line-height: 2;
  }
}