@media screen and (min-width: 821px) {
  .about-intro {
    gap: 2rem;
  }
  .about-outline {
    gap: 6.5rem;
  }
  .about-outline > .content {
    gap: 8.75rem;
  }
  .about-content {
    grid-template-areas: "title image" "text image";
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: auto 1fr;
    gap: 1.5rem 3rem;
  }
  .about-content::before {
    top: -3rem;
  }
  .about-content > .title {
    grid-column: span 7;
    margin: 0;
  }
  .about-content > .text {
    grid-column: span 7;
    margin: 0 0 auto;
  }
  .about-content > .image {
    grid-column: span 5;
  }
}

@media screen and (min-width: 821px) {
  .company-message {
    grid-template-columns: repeat(12, 1fr);
    gap: 2rem 3rem;
  }
  .company-message > .title {
    grid-column: span 12;
  }
  .company-message > .text {
    grid-column: span 6;
  }
  .company-message > .image {
    grid-column: span 6;
  }
  .company-outline {
    gap: 3rem;
    grid-template-columns: repeat(12, 1fr);
  }
  .company-outline > .title {
    grid-column: span 4;
  }
  .company-outline > .content {
    grid-column: span 8;
  }
  .company-access {
    gap: 2rem 3rem;
    grid-template-columns: repeat(12, 1fr);
  }
  .company-access > .title {
    grid-column: span 12;
  }
  .company-access > .text {
    grid-column: span 6;
  }
  .company-access > .access {
    grid-column: span 6;
  }
}

@media screen and (min-width: 821px) {
  .home-hero {
    aspect-ratio: 1440/740;
  }
  .home-hero-text-wrapper {
    bottom: min(7.78vw, 7rem);
    padding: 0 var(--margin-side);
  }
  .home-hero-text {
    font-size: 3rem;
    padding: 0;
  }
  .home-hero-text > .inner.-connect {
    margin-bottom: 0;
  }
  .home-about {
    gap: 3.5rem;
  }
  .home-about > .title > .site-heading-combi {
    margin-bottom: 1.5rem;
  }
  .home-about > .title > .button {
    text-align: center;
  }
  .home-about > .content {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
  }
  .home-about > .content > li {
    gap: 2rem;
  }
  .home-service {
    gap: 3.5rem;
  }
  .home-service > .title > .site-heading-combi {
    margin-bottom: 1.5rem;
  }
  .home-service > .title > .button {
    text-align: center;
  }
  .home-service > .content {
    gap: 1.25rem;
    grid-template-columns: repeat(3, 1fr);
  }
  .home-service > .content > li {
    padding: 1.5rem 1.5rem 2rem;
  }
  .home-company {
    border-radius: 24px;
    gap: 2.5rem;
    grid-template-columns: 5.135fr 4.865fr;
    padding: 4rem 5rem 4rem 3.125rem;
  }
  .home-company > .text > .site-text-standard {
    max-width: 28.85em;
  }
  .home-company > .image {
    order: 0;
  }
  .home-news {
    grid-template-areas: "title content" "button content";
    grid-template-columns: repeat(12, 1fr);
  }
  .home-news > .title {
    grid-column: span 3;
  }
  .home-news > .content {
    grid-column: span 9;
  }
  .home-news > .button {
    grid-column: span 3;
    text-align: left;
  }
}

@media screen and (min-width: 821px) {
  .recruit-intro {
    gap: 4rem;
  }
  .recruit-intro > .content {
    gap: 2rem;
    margin: 0 auto;
    max-width: 39rem;
  }
  .recruit-intro > .image {
    gap: 3rem;
    margin: 0;
  }
  .recruit-intro > .image > .item:first-child {
    border-radius: 10px;
  }
  .recruit-intro > .image > .item:last-child {
    border-radius: 10px;
  }
  .recruit-intro-button {
    margin-top: 6.25rem;
  }
  .recruit-target {
    gap: 5rem;
  }
  .recruit-target > .content {
    margin: 0 auto;
    max-width: 49.5rem;
    padding: 3.5rem var(--margin-side) 4rem;
  }
  .recruit-target > .content > .inner {
    gap: 2rem;
    margin: 0 auto;
    max-width: 39rem;
  }
  .recruit-button {
    font-size: 1.75rem;
  }
  .recruit-button > .icon {
    width: 3rem;
  }
}