.home-hero {
  position: relative;
  padding-top: 9.25rem;
  @media (min-width: 768px) {
    padding-top: 15rem;
  }
  @media (min-width: 1024px) {
    padding-top: 20rem;
  }
  @media (min-width: 1200px) {
    padding-top: 25rem;
  }
  
  & .home-hero__image {
    position: relative;
    width: 100%;
    height: 22.5rem;
    background-color: var(--lime);
    @media (min-width: 1024px) {
      height: 27rem;
    }
    @media (min-width: 1200px) {
      height: 37.5rem;
    } 
    & img {
      object-fit: cover;
      width: 100%;
      height: 100%;
      opacity: 50%;
    }
    &::after {
      content: "";
      position: absolute;
      inset: 0;
      background-image: url(/system_panel/uploads/images/concrete.jpg);
      opacity: 10%;
    }
  }
  
  & .home-hero__title {
    writing-mode: vertical-rl;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    font-family: var(--font-serif);
    position: absolute;
    top: 5.5rem;
    left: 1.5rem;
    @media (min-width: 768px) {
      top: 10rem;
      left: 5rem;
    }
    @media (min-width: 1024px) {
      top: 13rem;
      left: 8rem;
    }
    @media (min-width: 1200px) {
      top: 17rem;
      left: 18rem;
    }
    
    & .home-hero__title-main {
      letter-spacing: 0.15em;
      font-weight: 600;
      font-size: 2rem;
      line-height: 1.5;
      @media (min-width: 768px) {
        font-size: 3rem;
      }
      @media (min-width: 1024px) {
        font-size: 4rem;
      }
      @media (min-width: 1200px) {
        font-size: 4.5rem;
      }
    }
    & .home-hero__title-sub {
      letter-spacing: 0.15em;
      font-weight: 500;
      font-size: 0.875rem;
      line-height: 2;
      @media (min-width: 768px) {
        font-size: 1rem;
      }
    }
  }
}

.section-title-en {
  &.section-title-en--about-us {
    top: 3.75rem;
    left: 0;
    @media (min-width: 768px) {
      top: 2rem;
      left: 2rem;
    }
    @media (min-width: 1024px) {
      top: 1.25rem;
      left: 3rem;
    }
    @media (min-width: 1200px) {
      left: 5rem;
    }
  }
  &.section-title-en--news {
    top: -4rem;
    left: -0.625rem;
    @media (min-width: 768px) {
      top: -5rem;
      left: -2rem;
    }
    @media (min-width: 1024px) {
      top: -8rem;
      left: -5rem;
    }
    @media (min-width: 1200px) {
      left: -15rem;
    }
  }
  &.section-title-en--recruit {
    top: -3.375rem;
    right: 0.75rem;
    @media (min-width: 768px) {
      top: -4.5rem;
      right: -2rem;
    }
    @media (min-width: 1024px) {
      top: -7rem;
    }
  }
}

.home-service-title-dec {
  position: absolute;
  width: 27.5rem;
  opacity: 10%;
  @media (min-width: 768px) {
    width: 27.5rem;
  }
  &.home-service-title-dec--1 {
    top: 8.5rem;
    left: 9.25rem;
    @media (min-width: 768px) {
      top: 2rem;
      left: -11.75rem;
    }
  }
  &.home-service-title-dec--2 {
    top: 0.75rem;
    right: -10rem;
    @media (min-width: 768px) {
      top: -5rem;
      right: -11.25rem;
    }
  }
}


.home-about-mark {
  position: absolute;
  bottom: -4rem;
  right: -8rem;
  width: 37.5rem;
  opacity: 5%;
  z-index: -1;
  
  @media (min-width: 1200px) {
    right: unset;
    left: -4rem;
    bottom: -16rem;
  }
}