@charset "utf-8";

.p-fv {
  width: 100%;
  height: 419px;
  position: relative;

  @media (width < 768px) {
    height: 320px;
  }
}

.p-fv__img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 0;
  object-fit: cover;
}

.p-fv__gradient {
  position: absolute;
  z-index: 1;
  bottom: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: transparent linear-gradient(180deg, rgba(225, 238, 186, 0) 0%, rgba(188, 224, 177, 0) 39.42%, rgba(156, 212, 169, 0.82) 73.69%, #239edf 100%);
}

.gjs-dashed *[data-highlightable] .p-fv__gradient {
  z-index: -1;
}

.p-fv-breadcrumb {
  position: absolute;
  top: 84px;
  right: 90px;
  z-index: 2;

  @media (width < 768px) {
    right: 76px;
  }
}

.p-fv-breadcrumb__inner {
  display: flex;
  justify-content: end;
  align-items: center;
  gap: 30px;
}

.p-fv-breadcrumb__text {
  color: var(--color-white);
  font-size: 12px;
  line-height: normal;
  position: relative;

  a:hover {
    opacity: 0.7;
  }
}

.p-fv-breadcrumb__text:not(:last-of-type)::after {
  position: absolute;
  content: "";
  top: 50%;
  transform: translateY(-50%);
  right: -22px;
  width: 13px;
  height: 10px;
  background: url("https://eco-connect-plus.co.jp/system_panel/uploads/images/breadcrumb-arrow.svg") no-repeat center center / contain;
}

.p-fv__title {
  padding-right: 80px;
  padding-left: clamp(20px, calc(106vw / 13.66), 106px);
  position: absolute;
  z-index: 2;
  bottom: 45px;

  @media (width < 1120px) {
    padding-left: 15px;
  }

  @media (width < 768px) {
    padding-right: 60px;
    bottom: 16px;
  }
}

.p-fv__title-en {
  color: #d5f0ef;
  font-family: var(--font-noto-sans);
  font-size: 80px;
  line-height: 1;
  letter-spacing: -0.01em;

  @media (width < 768px) {
    font-size: 50px;
  }
}

.p-fv__title-ja {
  color: var(--color-white);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.9;

  @media (width < 768px) {
    font-size: 16px;
  }
}