/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~/
/  function                                                  */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~/
/  mixin                                                     */
.p-about {
  padding-block: 64px;
}
@media screen and (max-width: 1024px) {
  .p-about {
    padding-block: 48px;
  }
}
@media screen and (max-width: 599.98px) {
  .p-about {
    padding-block: 32px;
  }
}
.p-about__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-about__row {
  column-gap: 42px;
}
:where(.p-about:nth-child(even of .p-about)) .p-about__row {
  grid-template-areas: "img cont";
}
:where(.p-about:nth-child(odd of .p-about)) .p-about__row {
  grid-template-areas: "cont img";
}
@media screen and (max-width: 1024px) {
  .p-about__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-about__row {
    row-gap: 24px;
  }
}
.p-about__cont {
  grid-area: cont;
  display: grid;
  row-gap: 48px;
  max-width: 492px;
}
@media screen and (max-width: 1024px) {
  .p-about__cont {
    row-gap: 27px;
  }
}
@media screen and (max-width: 599.98px) {
  .p-about__cont {
    row-gap: 6px;
    max-width: 93.7142857143cqw;
    margin-inline: auto;
  }
}
.p-about__img {
  grid-area: img;
  max-width: 100%;
  min-width: 0;
}
.p-about__photos {
  display: grid;
  width: 573px;
  max-width: 100%;
  isolation: isolate;
}
.p-about__photos_item {
  display: grid;
}
.p-about__photos_item:nth-child(1) {
  grid-template: "photo ." auto/419fr 154fr;
  z-index: 1;
}
.p-about__photos_item:nth-child(2) {
  grid-template: ". photo" auto/302fr 271fr;
  margin-top: -17.4520069808%;
}
.p-about__photo {
  grid-area: photo;
}
.p-about__photo img {
  object-fit: cover;
}
@media screen and (max-width: 599.98px) {
  :where(#about) .p-about__photo img {
    width: max(273px, 78cqw);
  }
}

.p-merit {
  padding-block: 32px;
}
@media screen and (max-width: 1024px) {
  .p-merit {
    padding-block: 24px;
  }
}
@media screen and (max-width: 599.98px) {
  .p-merit {
    padding-block: 16px;
  }
}
.p-merit__ttl {
  width: fit-content;
  margin-right: -0.15em;
  margin-inline: auto;
  border-bottom: 1px solid;
  padding-bottom: 1px;
  font-weight: 600;
  line-height: 1.6153846154;
  font-size: 2.6rem;
  letter-spacing: 0.15em;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .p-merit__ttl {
    font-size: 2.2rem;
    letter-spacing: 0.075em;
  }
}
@media screen and (max-width: 599.98px) {
  .p-merit__ttl {
    font-size: 1.8rem;
    letter-spacing: 0;
  }
}
.p-merit__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px 32px;
  max-width: 700px;
  margin-top: 24px;
  margin-inline: auto;
}
@media screen and (max-width: 1024px) {
  .p-merit__list {
    gap: 14px 22.5px;
  }
}
@media screen and (max-width: 599.98px) {
  .p-merit__list {
    gap: 8px 13px;
  }
}
.p-merit__list_item {
  border: 1px solid;
  border-radius: 6px;
  padding: 2px 9px;
  line-height: 1.3571428571;
  font-size: 1.4rem;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .p-merit__list_item {
    line-height: 1.4615384615;
    font-size: 1.3rem;
  }
}
@media screen and (max-width: 599.98px) {
  .p-merit__list_item {
    min-width: calc((100% - 13px) / 2);
    padding: 1px 11px;
    line-height: 1.5833333333;
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 599.98px) {
  .p-merit__list_item:nth-last-child(1) {
    order: 9;
  }
}
@media screen and (max-width: 599.98px) {
  .p-merit__list_item:nth-last-child(3) {
    order: 10;
  }
}

.p-points {
  padding-block: 32px 64px;
}
@media screen and (max-width: 1024px) {
  .p-points {
    padding-block: 32px 48px;
  }
}
@media screen and (max-width: 599.98px) {
  .p-points {
    padding-block: 32px;
  }
}
.p-points__ttl {
  width: fit-content;
  margin-right: -0.15em;
  margin-inline: auto;
  border-bottom: 1px solid;
  padding-bottom: 1px;
  font-weight: 600;
  line-height: 1.6153846154;
  font-size: 2.6rem;
  letter-spacing: 0.15em;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .p-points__ttl {
    font-size: 2.2rem;
    letter-spacing: 0.075em;
  }
}
@media screen and (max-width: 599.98px) {
  .p-points__ttl {
    font-size: 1.8rem;
    letter-spacing: 0;
  }
}
.p-points__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, auto));
  justify-content: space-between;
  justify-items: center;
  row-gap: 32px;
  column-gap: var(--gutter);
  margin-top: 48px;
}
@media screen and (max-width: 1024px) {
  .p-points__list {
    grid-template-columns: repeat(2, minmax(0, auto));
    justify-content: center;
    margin-top: 36px;
  }
}
@media screen and (max-width: 599.98px) {
  .p-points__list {
    grid-template-columns: minmax(0, auto);
    margin-top: 24px;
  }
}
.p-points__list_item {
  display: grid;
  grid-template-rows: auto 15px auto 17px auto 29px;
  grid-template-columns: 22px 1fr 22px;
  grid-template-areas: "photo photo photo" "..... ..... ....." "..... ttl   ....." "..... ..... ....." "..... text  ....." "..... ..... .....";
  align-content: start;
  width: 345px;
  max-width: 100%;
  background-color: #fff;
}
@media screen and (max-width: 1024px) {
  .p-points__list_item {
    width: 322.5px;
    grid-template-rows: auto 12px auto 12.5px auto 25.5px;
    grid-template-columns: 20px 1fr 20px;
  }
}
@media (max-width: 1024px) and (min-width: 600px) {
  .p-points__list_item:where(:last-child:nth-child(odd)) {
    grid-column: span 2;
  }
}
@media screen and (max-width: 599.98px) {
  .p-points__list_item {
    width: 300px;
    grid-template-rows: auto 9px auto 8px auto 22px;
    grid-template-columns: 18px 1fr 18px;
  }
}
.p-points__list_ttl {
  grid-area: ttl;
  font-weight: 600;
  line-height: 1.4583333333;
  font-size: 2.4rem;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .p-points__list_ttl {
    font-size: 2.1rem;
  }
}
@media screen and (max-width: 599.98px) {
  .p-points__list_ttl {
    line-height: 1.6111111111;
    font-size: 1.8rem;
  }
}
.p-points__list_text {
  grid-area: text;
  min-height: 6lh;
  line-height: 1.3571428571;
  font-size: 1.4rem;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .p-points__list_text {
    line-height: 1.4642857143;
  }
}
@media screen and (max-width: 599.98px) {
  .p-points__list_text {
    line-height: 1.5714285714;
  }
}
.p-points__list_photo {
  grid-area: photo;
}

.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__inner {
  display: grid;
}
.p-outro__ttl {
  margin-top: 64px;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .p-outro__ttl {
    margin-top: 48px;
  }
}
@media screen and (max-width: 599.98px) {
  .p-outro__ttl {
    margin-top: 32px;
  }
}
.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;
  }
}
.p-outro__photos {
  order: -1;
  display: grid;
  grid-auto-flow: column;
}
@media screen and (max-width: 599.98px) {
  .p-outro__photos {
    margin-inline: calc(50cqw - 50 * var(--vw));
  }
}

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