@charset "UTF-8";

/* --------------------------------
  レンタル
 -------------------------------- */
/*----- hero -----*/
.p-rentalHero {
  position: relative;
  height: min(70vh, 700px);
}
.p-rentalHero__logo {
  z-index: 2;
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(700px, 75vw);
}
.p-rentalHero__logo img {
  width: 100%;
  object-fit: contain;
}
.p-rentalHero__photo {
  position: absolute;
}
.p-rentalHero__photoItem {
  width: 100%;
  height: min(70vh, 700px);
}
.p-rentalHero__photoImage {
  height: 100%;
  width: 100%;
  object-position: center;
  object-fit: cover;
}

@media screen and (max-width: 767.98px) {
  .p-rentalHero__logo {
    top: 55%;
  }
  .p-rentalHero,
  .p-rentalHero__photoItem {
    height: min(33vh, 400px);
  }
}

/*----- イントロ -----*/

.p-rental__heading {
  font-size: min(1.4em, 4.5vw);
  text-align: center;
  font-weight: 600;
}


/*----- サービスとブランド -----*/
.p-rental__service {
  display: grid;
  gap: 80px;
}
.p-rental__serviceBox {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px 5%;
}
.p-rental__mainPhoto {
  flex: 1 1 clamp(200px, 40%, 450px);
}
.p-rental__mainPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-rental__dataArea {
  display: grid;
  align-content: start;
  gap: 10px;
  flex: 1 1 clamp(300px, 55%, 450px);
}
.p-rental__title {
  font-size: min(1.7em, 3vw);
  font-weight: 900;
  display: flex;
  flex-wrap: wrap;
  align-items: last baseline;
  gap: 0 0.5em;
}
.p-rental__title span {
  display: inline-block;
}
.p-rental__title .c-small {
  font-size: 0.6em;
}
.p-rental__waxLogo {
  display: inline-block;
}
.p-rental__waxLogo img {
  width: min(2.5em, 7vw);
}
.p-rental__subtitle {
  font-weight: 900;
  font-size: 0.8em;
}
.p-rental__brand {
  display: grid;
  gap: 20px;
}
.p-rental__brandList {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 15px;
}
.p-rental__serviceBox .p-rental__brandList {
  border-top: 1px solid var(--color-gray);
  padding-top: 10px;
}
.p-rental__brandCategory {
  font-weight: 600;
}
.p-rental__brandList img {
  max-width: 100px;
  max-height: 40px;
  object-fit: contain;
}

.p-rental__waxPhoto {
  flex: 1 1 clamp(300px, 45%, 400px);
}
.p-rental__waxDetail {
  flex: 1 1 clamp(35px, 50%, 500px);
}

.p-rental__waxCatch {
  font-weight: bold;
  font-size: 1.05em;
}
.p-rental__waxPrice {
  width: min(400px, 70%);
}
.p-rental__waxPrice img {
  width: 100%;
}
.p-rental__note {
  font-size: 0.845em;
}

@media screen and (max-width: 768px) {
  .p-rental__service {
    gap: 40px;
    max-width: 500px;
    margin: auto;
  }
  .p-rental__waxLogo img {
    width: min(2.5em, 15vw);
  }
  .p-rental__title {
    font-size: min(1.6em, 5vw);
  }
  .p-rental__waxPrice {
    margin: auto;
    width: 100%;
  }
  .p-rental__brandList {
    gap: 10px;
  }
  .p-rental__brandList img {
    max-width: 80px;
    max-height: 35px;
    object-fit: contain;
  }
}