.mf-ap,
.mf-ap *,
.mf-ap *::before,
.mf-ap *::after {
  box-sizing: border-box;
}

.mf-ap {
  --mf-ap-u: 0.0520833333vw;
  position: relative;
  display: grid;
  grid-template-columns: repeat(15, minmax(0, 1fr));
  gap: calc(20 * var(--mf-ap-u));
  width: 100%;
  margin: 0;
  padding: calc(140 * var(--mf-ap-u)) calc(30 * var(--mf-ap-u)) 0;
  overflow: visible;
  background: #000;
}

.mf-ap__portrait {
  position: relative;
  width: 100%;
  grid-column: 8 / 11;
}

.mf-ap__portrait-image,
.mf-ap__portrait-placeholder {
  display: block;
  width: 100%;
}

.mf-ap__portrait-image {
  height: auto;
}

.mf-ap__portrait-placeholder {
  aspect-ratio: 860 / 1124;
  background: #707276;
}

.mf-ap__autograph {
  position: absolute;
  right: -8vw;
  bottom: -2vw;
  display: block;
  width: 68%;
  height: auto;
  pointer-events: none;
}

@media (max-width: 767.98px) {
  .mf-ap {
    --mf-ap-u: 0.2666666667vw;
    display: block;
    padding: calc(80 * var(--mf-ap-u)) calc(15 * var(--mf-ap-u)) 0;
  }

  .mf-ap__portrait {
    width: 60%;
    max-width: 260px;
    margin: 0 auto;
  }

  .mf-ap__autograph {
    right: -16vw;
    bottom: -4vw;
  }
}