.intro {
  position: relative;
  overflow: hidden;
  margin-top: -100px;
  padding-top: 100px;
}
@media screen and (max-width: 767px) {
  .intro {
    margin-top: -40px;
    padding-bottom: 16px;
  }
}
@media screen and (max-width: 519px) {
  .intro {
    padding-bottom: 48px;
    margin-bottom: 24px;
  }
}
.intro .deco-leaves {
  top: -20px;
  right: -80px;
}
@media screen and (max-width: 1279px) {
  .intro .deco-leaves {
    top: -30px;
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
  }
}
@media screen and (max-width: 767px) {
  .intro .deco-leaves {
    top: -90px;
    right: -100px;
  }
}
@media screen and (max-width: 519px) {
  .intro .deco-leaves {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
  }
}
.intro .deco-leaves #leaves {
  -webkit-transform: scale(-1, 1);
  transform: scale(-1, 1);
  rotate: 20deg;
}
@media screen and (max-width: 767px) {
  .intro .deco-leaves #leaves {
    rotate: 0deg;
  }
}
.intro .intro-ttl {
  margin-bottom: calc(8px * 4);
}
@media screen and (max-width: 959px) {
  .intro .intro-ttl {
    margin-bottom: calc(8px * 4 * 0.75);
  }
}
@media screen and (max-width: 519px) {
  .intro .intro-ttl {
    margin-bottom: calc(8px * 4 * 0.5);
  }
}
.intro .intro-ttl {
  font-size: 2.4rem;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .intro .intro-ttl {
    font-size: 2rem;
  }
}
.intro .fall-leaves {
  position: absolute;
  bottom: 0;
  left: -80px;
}
@media screen and (max-width: 767px) {
  .intro .fall-leaves {
    left: 8px;
  }
}

.services .lower-unit {
  position: relative;
  padding-bottom: 300px;
}
@media screen and (max-width: 959px) {
  .services .lower-unit {
    padding-bottom: 270px;
  }
}
@media screen and (max-width: 767px) {
  .services .lower-unit {
    padding-bottom: 0;
  }
}
.services .lower-unit__dtl {
  position: relative;
  padding-top: calc(8px * 6);
}
@media screen and (max-width: 959px) {
  .services .lower-unit__dtl {
    padding-top: calc(8px * 6 * 0.75);
  }
}
@media screen and (max-width: 519px) {
  .services .lower-unit__dtl {
    padding-top: calc(8px * 6 * 0.5);
  }
}
.services .lower-unit__dtl {
  border-top: solid 1px #D9D9D9;
}
.services .lower-unit__dtl::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 48px;
  height: 3px;
  background: #018568;
}
@media screen and (max-width: 767px) {
  .services .lower-unit__dtl .txt.--last {
    width: calc(100% - 120px);
    margin-left: auto;
  }
}
.services .lower-unit .services-vsl {
  position: absolute;
  bottom: 0;
  left: -80px;
  content: "";
  width: 714px;
  height: 474px;
}
@media screen and (max-width: 959px) {
  .services .lower-unit .services-vsl {
    left: -40px;
    width: 600px;
    height: 400px;
  }
}
@media screen and (max-width: 767px) {
  .services .lower-unit .services-vsl {
    position: relative;
    width: calc(100% + 40px);
    height: auto;
  }
}
.services .services-unit {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 48px;
}
@media screen and (max-width: 1279px) {
  .services .services-unit {
    gap: 24px;
  }
}
@media screen and (max-width: 1023px) {
  .services .services-unit {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
}
.services .services-unit__txt {
  width: calc(100% - 342px);
}
@media screen and (max-width: 1279px) {
  .services .services-unit__txt {
    width: calc(100% - 308px);
  }
}
@media screen and (max-width: 1023px) {
  .services .services-unit__txt {
    width: 100%;
  }
}
.services .services-unit__vsl {
  width: 100%;
  max-width: 284px;
}
@media screen and (max-width: 1023px) {
  .services .services-unit__vsl {
    max-width: 360px;
  }
}
.services .ttl-s {
  margin-bottom: calc(8px * 5);
}
@media screen and (max-width: 959px) {
  .services .ttl-s {
    margin-bottom: calc(8px * 5 * 0.75);
  }
}
@media screen and (max-width: 519px) {
  .services .ttl-s {
    margin-bottom: calc(8px * 5 * 0.5);
  }
}
.services .facility-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}
@media screen and (max-width: 959px) {
  .services .facility-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
  }
}
@media screen and (max-width: 519px) {
  .services .facility-list {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
.services .facility-list .facility-vsl {
  position: relative;
  margin-bottom: 8px;
}
.services .facility-list .facility-vsl::before {
  position: absolute;
  top: -1px;
  right: -1px;
  content: "";
  width: 88px;
  height: 55px;
  background: #ffffff;
  clip-path: polygon(0 0, 100% 0, 100% 100%);
}
@media screen and (max-width: 959px) {
  .services .facility-list .facility-vsl::before {
    width: 68px;
    height: 40px;
  }
}
.services .facility-list .facility-vsl .facility-ttl {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 8px 16px;
  background: #ffffff;
  font-size: 1.9rem;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .services .facility-list .facility-vsl .facility-ttl {
    padding: 4px 8px;
    font-size: 1.7rem;
  }
}
/*# sourceMappingURL=../../maps/pages/service.css.map */