/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~/
/  function                                                  */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~/
/  mixin                                                     */
.p-lifestyle {
  padding-block: 64px;
}
@media screen and (max-width: 1024px) {
  .p-lifestyle {
    padding-block: 48px;
  }
}
@media screen and (max-width: 599.98px) {
  .p-lifestyle {
    padding-block: 32px;
  }
}
.p-lifestyle__row {
  display: grid;
  align-items: center;
  justify-content: space-between;
  grid-template-columns: repeat(2, minmax(0, auto));
  column-gap: var(--gutter);
}
:where(#works) .p-lifestyle__row {
  column-gap: 42px;
}
:where(.p-lifestyle:nth-child(even of .p-lifestyle)) .p-lifestyle__row {
  grid-template-areas: "img cont";
}
:where(.p-lifestyle:nth-child(odd of .p-lifestyle)) .p-lifestyle__row {
  grid-template-areas: "cont img";
}
@media screen and (max-width: 1024px) {
  .p-lifestyle__row {
    grid-template: "img" auto "cont" auto/auto;
    justify-items: center;
    justify-content: center;
    row-gap: 35px;
  }
}
@media screen and (max-width: 599.98px) {
  .p-lifestyle__row {
    row-gap: 24px;
  }
}
.p-lifestyle__cont {
  grid-area: cont;
  display: grid;
  row-gap: 48px;
  max-width: 492px;
}
@media screen and (max-width: 1024px) {
  .p-lifestyle__cont {
    row-gap: 27px;
  }
}
@media screen and (max-width: 599.98px) {
  .p-lifestyle__cont {
    row-gap: 6px;
    max-width: 93.7142857143cqw;
    margin-inline: auto;
  }
}
.p-lifestyle__img {
  grid-area: img;
  max-width: 100%;
  min-width: 0;
}
.p-lifestyle__photos {
  display: grid;
  width: 548px;
  max-width: 100%;
}
.p-lifestyle__photos_item {
  display: grid;
}
.p-lifestyle__photos_item:nth-child(1) {
  grid-template: "photo ." auto/423fr 125fr;
}
@media screen and (max-width: 599.98px) {
  .p-lifestyle__photos_item:nth-child(1) {
    grid-template-columns: 260fr 90fr;
  }
}
.p-lifestyle__photos_item:nth-child(2) {
  grid-template: ". photo" auto/247fr 301fr;
  margin-top: -10.0364963504%;
}
@media screen and (max-width: 599.98px) {
  .p-lifestyle__photos_item:nth-child(2) {
    grid-template-columns: 138fr 212fr;
  }
}
.p-lifestyle__photos_item:nth-child(3) {
  grid-template: ". photo ." auto/82fr 181fr 285fr;
  margin-top: -14.2335766423%;
}
@media screen and (max-width: 599.98px) {
  .p-lifestyle__photos_item:nth-child(3) {
    grid-template-columns: 26fr 149fr 175fr;
  }
}
.p-lifestyle__photo {
  grid-area: photo;
}
.p-lifestyle__photo img {
  object-fit: cover;
}

.p-outro {
  padding-block: 64px;
  background-color: #fff;
}
@media screen and (max-width: 1024px) {
  .p-outro {
    padding-block: 48px 56px;
  }
}
@media screen and (max-width: 599.98px) {
  .p-outro {
    padding-block: 32px 48px;
  }
}
.p-outro__ttl {
  text-align: center;
}
.p-outro__text {
  margin-top: 48px;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .p-outro__text {
    margin-top: 25px;
  }
}
@media screen and (max-width: 599.98px) {
  .p-outro__text {
    margin-top: 10px;
  }
}
.p-outro__link {
  display: block;
  width: fit-content;
  margin-top: 64px;
  margin-inline: auto;
}
@media screen and (max-width: 1024px) {
  .p-outro__link {
    margin-top: 48px;
  }
}
@media screen and (max-width: 599.98px) {
  .p-outro__link {
    margin-top: 32px;
  }
}
.p-outro__link:hover {
  opacity: 0.7;
}
.p-outro__link_en {
  display: block;
  padding-inline: 1em 0.85em;
  font-weight: 600;
  line-height: 1.619047619;
  font-size: 2.1rem;
  letter-spacing: 0.15em;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .p-outro__link_en {
    line-height: 1.4871794872;
    font-size: 1.95rem;
  }
}
@media screen and (max-width: 599.98px) {
  .p-outro__link_en {
    line-height: 1.3333333333;
    font-size: 1.8rem;
  }
}
.p-outro__link_ja {
  display: block;
  border-top: 1px solid;
  padding-top: 4px;
  font-family: "BIZ UDPGothic", sans-serif;
  line-height: 1.1538461538;
  font-size: 1.3rem;
  letter-spacing: 0.15em;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .p-outro__link_ja {
    margin-top: 0.5px;
    line-height: 1.1111111111;
    font-size: 1.35rem;
  }
}
@media screen and (max-width: 599.98px) {
  .p-outro__link_ja {
    margin-top: 1px;
    line-height: 1.0714285714;
    font-size: 1.4rem;
  }
}

/*# sourceMappingURL=page-garden.css.map */
