.pageMv::before {
  background-image: url(../../images/environment/img-mv.png);
}

.envSection {
  padding-block: 6rem;
  position: relative;
}

.envSection::before {
  background: var(--colorGray100);
  border-radius: 2.5rem 0 0 2.5rem;
  content: "";
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  width: 85.1%;
  z-index: -1;
}

.benefits {
  margin-block: 6rem 9.5rem;
}

.envHead {
  align-items: flex-end;
  display: flex;
  justify-content: space-between;
}

.envHead .primaryLink {
  margin-bottom: 0.5rem;
}

.envColumn {
  display: grid;
  gap: 8.5%;
  grid-template-columns: 50% auto;
  margin-top: 2.5rem;
}

.envText {
  font-size: 1rem;
  line-height: 1.8;
}

.envList {
  display: grid;
  gap: 1rem;
  margin-top: 2rem;
}

.envList__item {
  border-bottom: 1px solid var(--colorGray350);
}

.envList__link {
  align-items: center;
  display: flex;
  font-size: 1rem;
  font-weight: 700;
  justify-content: space-between;
  line-height: 1.8;
  padding-bottom: 1rem;
  transition: 0.3s;
}

@media (hover: hover) {
  .envList__link:hover {
    color: var(--colorRed);
  }
}

@media screen and (max-width: 767px) {
  .pageMv::before {
    background-image: url(../../images/environment/img-mv_sp.png);
  }

  .envSection {
    padding-block: var(--size48);
  }

  .envSection::before {
    width: 87.7%;
  }

  .benefits {
    margin-block: var(--size64);
  }

  .envHead {
    display: grid;
    gap: 1rem;
  }

  .envColumn {
    gap: 2rem;
    grid-template-columns: 1fr;
  }

  .envTextarea {
    order: 2;
  }

  .envText {
    font-size: var(--size16);
  }

  .envList__link {
    font-size: var(--size16);
  }

  .envImg {
    order: 1;
  }

  .benefits .envImg {
    width: calc(100vw - 6.15%);
  }

  .envSection .primaryLink {
    margin-top: 2.5rem;
  }
}