@charset "utf-8";

.intro {
  position: relative;
  z-index: 1;
}
.intro__content {
  position: relative;
  z-index: 1;
  padding-top: 160px;
  padding-bottom: 175px;
}
.intro__content__photo {
  position: absolute;
  z-index: -1;
  inset: 0;
}
.intro__content__photo img {
  height: 100%;
  object-fit: contain;
}
.intro__content__heading {
  --font-size-min: 24;
  --font-size-max: 44;
  letter-spacing: .19em;
  line-height: 1.681818182;
}
.intro__content__heading .comma {
  margin-right: -.5em;
}
.intro__content__heading .period {
  margin-right: -.5em;
}
.intro__content__copy {
  --font-size-min: 11;
  --font-size-max: 16;
  line-height: 2.875;
  --margin-top: 55;
}
@media screen and (max-width: 480px){
  .intro__content {
    padding-top: 80px;
    padding-bottom: 135px;
  }
  .intro__content__heading {
    --font-size-max: 28;
    letter-spacing: .1em;
    line-height: 1.642857143;
  }
  .intro__content__copy {
    --font-size-max: 14;
    line-height: 2.428571429;
    --margin-top: 40;
  }
}



.access {
  position: relative;
  z-index: 2;
}
/* .access__heading {
} */
.concept-heading {
  position: relative;
  z-index: 1;
  --font-size-min: 28;
  --font-size-max: 38;
  margin-block: -.5lh;
  filter: drop-shadow(0 0 10px rgba(255, 255, 255, 1)) drop-shadow(0 0 10px rgba(255, 255, 255, 1)) drop-shadow(0 0 20px rgba(255, 255, 255, .5)) drop-shadow(0 0 20px rgba(255, 255, 255, .5));
}
/* .access__kv {
} */
.access__copy {
  --margin-top: 100;
}
.access__content {
  margin-top: 100px;
  padding-bottom: 150px;
  background: linear-gradient(180deg, transparent 110px, rgba(var(--color-lightbrown), .3) 110px);
}
.access__content__list {
  gap: 60px calc(60 / 1200 * 100%);
}
.access__content__list__item {
  flex: 0 1 360px;
}
/* .access__content__list__item__photo {
} */
.access__content__list__item__desc {
  margin-top: 35px;
}
.access__content__list__item__desc__copy {
  --font-size-min: 12;
  --font-size-max: 18;
  line-height: 2.222222222;
  margin-inline: -.5em;
}
.access__content__list__item__desc__copy em {
  font-size: 130%;
  line-height: 0;
}
.access__content__list__item__desc__copy em.zenkakugo {
  font-size: 180%;
  vertical-align: -.03em;
  box-sizing: border-box;
  padding-inline: .075em;
}
.access__content__list__item__desc__copy sup {
  font-size: 10px;
}
.access__content__bnr {
  max-width: 1000px;
  margin-top: 100px;
}
@media screen and (max-width: 480px){
  .concept-heading {
    --font-size-max: 30;
    filter: drop-shadow(0 0 3px rgba(255, 255, 255, 1)) drop-shadow(0 0 3px rgba(255, 255, 255, 1)) drop-shadow(0 0 10px rgba(255, 255, 255, .5)) drop-shadow(0 0 10px rgba(255, 255, 255, .5));
  }
  .access__copy {
    --margin-top: 50;
  }
  .access__content {
    margin-top: 50px;
    padding-bottom: 80px;
    background: linear-gradient(180deg, transparent 100px, rgba(var(--color-lightbrown), .3) 100px);
  }
  .access__content__list {
    gap: 40px 0;
  }
  .access__content__list__item {
    flex: 1 0 100%;
  }
  .access__content__list__item__desc {
    margin-top: 30px;
  }
  .access__content__list__item__desc__copy {
    --font-size-max: 16;
    line-height: 2.25;
  }
  .access__content__bnr {
    margin-top: 55px;
  }
}



.design {
  position: relative;
  z-index: 2;
  margin-top: 165px;
  padding-bottom: 80px;
}
/* .design__heading {
} */
/* .design__kv {
} */
.design__copy {
  --margin-top: 100;
}
.design__map {
  max-width: 900px;
  margin-top: 100px;
}
.design__list {
  margin-top: 140px;
}
.design__list__item {
  position: relative;
  z-index: 1;
  gap: 60px calc(60 / 1200 * 100%);
  mix-blend-mode: multiply;
}
.design__list__item + .design__list__item {
  margin-top: 110px;
}
.design__list__item:nth-child(even) {
  flex-direction: row-reverse;
}
.design__list__item::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: calc(370 / 1200 * 100%);
  padding-top: calc(680 / 1200 * 100%);
}
.design__list__item:nth-child(odd)::before {
  top: -75px;
  left: calc(100% + (var(--window-half-width) - 50%));
  transform: translateX(-100%);
  background: url(../../img/common/img_leaf.jpg) no-repeat top right/100% auto;
}
.design__list__item:nth-child(even)::before {
  bottom: -85px;
  right: calc(100% + (var(--window-half-width) - 50%));
  transform: translateX(100%);
  background: url(../../img/common/img_leaf2.jpg) no-repeat top left/100% auto;
}
.design__list__item__photo {
  z-index: 1;
  width: calc(640 / 1200 * 100%);
}
.design__list__item__photo::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 76px;
  width: calc(100% - 40px);
  height: calc(100% - 46px);
  background: var(--bg-underpage);
}
.design__list__item:nth-child(odd) .design__list__item__photo::before {
  right: 70px;
}
.design__list__item:nth-child(even) .design__list__item__photo::before {
  left: 70px;
}
.design__list__item__desc {
  flex: 1;
}
.design__list__item__desc__heading {
  --font-size-min: 22;
  --font-size-max: 42;
}
.design__list__item__desc__copy {
  --margin-top: 30;
}
.design__list__item__desc__btn {
  max-width: 300px;
  margin-top: 55px;
  margin-inline: auto;
}
.design__list__item__desc__btn a {
  min-height: calc(50 / 16 * 1em);
  letter-spacing: .1em;
}
.design__list__item__desc__btn--soon a {
  --color-btn-bg: rgba(var(--color-lightgreen), 1);
  pointer-events: none;
}
@media screen and (max-width: 480px){
  .design {
    margin-top: 120px;
    padding-bottom: 50px;
  }
  .design__copy {
    --margin-top: 50;
    width: calc(340 / 380 * 100%);
    letter-spacing: 0;
  }
  .design__map {
    margin-top: 50px;
    width: calc(360 / 380 * 100%);
  }
  .design__list {
    margin-top: 60px;
  }
  .design__list__item {
    gap: 40px 0;
  }
  .design__list__item + .design__list__item {
    margin-top: 50px;
  }
  .design__list__item::before {
    width: calc(185 / 320 * 100%);
    padding-top: calc(340 / 320 * 100%);
  }
  .design__list__item:nth-child(odd)::before {
    top: 0;
  }
  .design__list__item:nth-child(even)::before {
    bottom: auto;
    top: -30px;
  }
  .design__list__item__photo {
    width: calc(306 / 320 * 100%);
  }
  .design__list__item:nth-child(odd) .design__list__item__photo {
    margin-left: auto;
  }
  .design__list__item:nth-child(even) .design__list__item__photo {
    margin-right: auto;
  }
  .design__list__item__photo::before {
    top: 37px;
    width: calc(100% - 20px);
    height: calc(100% - 23px);
  }
  .design__list__item:nth-child(odd) .design__list__item__photo::before {
    right: auto;
    left: -14px;
  }
  .design__list__item:nth-child(even) .design__list__item__photo::before {
    left: auto;
    right: -14px;
  }
  .design__list__item__desc {
    flex: 1 0 100%;
  }
  .design__list__item__desc__heading {
    --font-size-max: 28;
  }
  .design__list__item__desc__copy {
    --margin-top: 20;
  }
  .design__list__item__desc__btn {
    max-width: 220px;
    margin-top: 30px;
  }
  .design__list__item__desc__btn a {
    font-size: calc(16 / 380 * 100vw);
  }
}