.mainvisual.for-doctor {
  background-image: url("../images/img-about_mv.png");
}

.about {
  padding: calc(8px * 8) 0 calc(8px * 15);
}

.about .container {
  max-width: 1100px;
}

.aboutHead {
  align-items: center;
  column-gap: calc(8px * 10);
  display: grid;
  grid-template-columns: auto 515px;
}

.aboutHead__box--text {
  font-size: var(--fontSize20);
  line-height: 1.7;
}

.aboutHead__nav--text {
  color: #545454;
  font-size: 22px;
  font-weight: bold;
  margin-top: calc(8px * 6);
}

.aboutHead__nav:hover {
  opacity: .7;
}


.aboutNav {
  column-gap: calc(8px * 9);
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-top: calc(8px * 12);
}

.aboutNav__nav:hover {
  opacity: .7;
}

.aboutNav__nav--text {
  color: #545454;
  font-size: 22px;
  font-weight: bold;
  margin-top: calc(8px * 6);
}

@media screen and (max-width: 767px) {
  .about {
    padding: calc(8px * 4) 0 calc(8px * 8);
  }

  .aboutHead {
    grid-template-columns: 100%;
  }

  .aboutHead__box--text {
    font-size: var(--fontSize18);
    line-height: 1.7;
  }

  .aboutHead__nav--text {
    font-size: 16px;
    margin-top: calc(8px * 3);
  }

  .aboutHead__nav--img {
    margin-top: calc(8px * 5);
  }

  .aboutNav {
    grid-template-columns: 100%;
    margin-top: calc(8px * 6);
    row-gap: calc(8px * 6);
  }

  .aboutNav__nav:hover {
    opacity: .7;
  }

  .aboutNav__nav--text {
    font-size: 16px;
    margin-top: calc(8px * 3);
  }
}