.page-about__section {
  position: relative;
}
@media (min-width: 1025px) {
  .page-about__section {
    padding-bottom: 4rem;
    display: grid;
    grid-template-columns: repeat(20, 1fr);
  }
}
@media (max-width: 1024px) {
  .page-about__section {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
  }
}

.page-about__main {
  position: relative;
  z-index: 2;
  grid-row: 1;
}
@media (min-width: 1025px) {
  .page-about__main {
    grid-column: 2/13;
    padding: 13.2rem 0 12rem;
  }
}
@media (max-width: 1024px) {
  .page-about__main {
    grid-column: 2/12;
    padding-top: 12.2rem;
  }
}

.page-about__mv {
  position: relative;
  right: calc(-1 * var(--inner-pr));
  z-index: 1;
  grid-row: 1;
  justify-self: right;
  width: calc(100% + var(--inner-pr));
  height: 100%;
  overflow: hidden;
  --l-inner-pr-capped: var(--l-inner-padding-pc);
  --inner-pr: var(--l-inner-pr-capped);
}
@media (min-width: 1025px) {
  .page-about__mv {
    grid-column: 9/21;
    border-radius: 0.4rem;
  }
}
@media (max-width: 1024px) {
  .page-about__mv {
    grid-column: 4/13;
    height: auto;
    aspect-ratio: 270/216;
    border-radius: 0.3rem;
    --l-inner-pr-capped: calc(var(--l-inner-padding-sp-ratio) * var(--viewport-client-width, 100%));
    --inner-pr: var(--l-inner-pr-capped);
  }
}

@media (min-width: 1025px) {
  .page-about__body {
    margin-top: 7.4rem;
  }
}
@media (max-width: 1024px) {
  .page-about__body {
    margin-top: 4.7rem;
  }
  .page-about__body br {
    display: none;
  }
}