#contentsWrap {
  padding-bottom: 0;
}
@media only screen and (max-width: 767px) {
  #contentsWrap {
    overflow: unset;
  }
}

@media only screen and (min-width: 768px) {
  .billboard-style-01 figure img {
    height: min(44.7vw, 860px);
  }
}

.block-residence {
  background: url(../img/residence/residence_01.jpg) no-repeat center;
  background-size: cover;
  position: relative;
  padding-bottom: 2rem;
}
.block-residence .secttl {
  color: #fff;
  padding-bottom: 1rem;
}
.block-residence .secttl:before {
  background: #fff;
}
.block-residence .note {
  display: block;
  content: attr(data-cap);
  font-size: min(0.8vw, 66.6%);
  line-height: 1.2;
  padding: min(0.52vw, 10px);
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 100;
  color: #fff;
}
@media only screen and (max-width: 767px) {
  .block-residence .note {
    font-size: 0.16rem;
  }
}
.block-residence .inner {
  display: grid;
  gap: 0.5rem;
  color: #fff;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .block-residence .inner {
    display: grid;
  }
}
.block-residence .inner .left_area .en {
  font-size: 0.5rem;
  font-family: "EB Garamond", serif;
  letter-spacing: 0.12em;
}
.block-residence .inner .left_area .jp {
  font-size: 0.2rem;
  letter-spacing: 0.2em;
  margin-top: 0.1rem;
}
@media only screen and (max-width: 767px) {
  .block-residence .inner .left_area .jp {
    font-size: 0.32rem;
  }
}
.block-residence .inner .right_area {
  letter-spacing: 0.2em;
  line-height: 2.5;
}

.block-gallery {
  background: url(../img/residence/gallery_bg.jpg);
  height: 13rem;
  padding: 1.5rem 0;
}
@media only screen and (max-width: 767px) {
  .block-gallery {
    height: 14rem;
  }
}
.block-gallery .mw-1500 {
  width: 100%;
  position: relative;
}
.block-gallery .image.--01 {
  width: 6rem;
}
@media only screen and (max-width: 767px) {
  .block-gallery .image.--01 {
    width: 5rem;
  }
}
.block-gallery .image.--02 {
  width: 3.5rem;
  position: absolute;
  top: 2rem;
  left: 5rem;
  transition-delay: 0.2s;
}
@media only screen and (max-width: 767px) {
  .block-gallery .image.--02 {
    width: 2.5rem;
    left: 4.5rem;
  }
}
.block-gallery .image.--03 {
  width: 3.5rem;
  position: absolute;
  top: 1.5rem;
  right: 0;
  z-index: 2;
  transition-delay: 0.3s;
}
@media only screen and (max-width: 767px) {
  .block-gallery .image.--03 {
    width: 3rem;
    right: auto;
    left: 0.8rem;
    top: 4rem;
  }
}
.block-gallery .image.--04 {
  width: 4.5rem;
  position: absolute;
  top: 5.5rem;
  left: 0;
  transition-delay: 0.5s;
}
@media only screen and (max-width: 767px) {
  .block-gallery .image.--04 {
    width: 3.2rem;
    left: auto;
    right: 0;
  }
}
.block-gallery .image.--05 {
  width: 5rem;
  position: absolute;
  top: 6rem;
  right: 3rem;
  z-index: 1;
  transition-delay: 0.7s;
}
@media only screen and (max-width: 767px) {
  .block-gallery .image.--05 {
    width: 4.5rem;
    top: 8rem;
    right: 0.5rem;
  }
}
.block-gallery .tunnel {
  position: relative;
  width: 100%;
  height: 211svh;
}
.block-gallery .tunnel__sticky {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100svh;
  overflow: hidden;
  perspective: 1100px;
  perspective-origin: 50% 50%;
  background: url(../img/residence/gallery_bg.jpg);
}
.block-gallery .tunnel__scene {
  position: absolute;
  inset: 0;
  transform-style: preserve-3d;
  transform: translate3d(0, 0, calc(var(--p) * var(--tunnel-travel)));
}
.block-gallery .tunnel__panel {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 5.3rem;
  height: 3.5rem;
  overflow: hidden;
  background-color: #0d0d10;
  transform: translate3d(-50%, -50%, 0) translate3d(var(--x, 0), var(--y, 0), calc(var(--i) * -430 * 1px));
  opacity: min(clamp(0, (var(--p) * var(--tunnel-steps) - var(--i) + 6) * 0.45, 1), clamp(0, (var(--i) - var(--p) * var(--tunnel-steps)) * 1.6, 1));
}
.block-gallery .tunnel__panel.--02 {
  width: 5.6rem;
  height: 7.8rem;
}
.block-gallery .tunnel__panel.--03 {
  width: 8.6rem;
  height: 5.4rem;
}
.block-gallery .tunnel__panel.--04 {
  width: 6.2rem;
  height: 3.8rem;
}
.block-gallery .tunnel__panel.--05 {
  width: 7rem;
  height: 5rem;
}
@media screen and (max-width: 767px) {
  .block-gallery .tunnel__panel {
    /*width: 28rem;
    height: 18rem;*/
    transform: translate3d(-50%, -50%, 0) translate3d(calc(var(--x, 0) * 1), calc(var(--y, 0) * 1), calc(var(--i) * -430 * 1px));
  }
}
.block-gallery .tunnel__panel img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /*filter: brightness(1.25) contrast(1.05);*/
}
.block-gallery .tunnel__vignette {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(78% 68% at 50% 50%, rgba(5, 5, 6, 0) 0%, rgba(5, 5, 6, 0.78) 100%);
}
.block-gallery .tunnel__copy p {
  font-family: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-size: clamp(1.6rem, 2.6vw, 2.6rem);
  font-weight: 200;
  letter-spacing: 0.3em;
  text-indent: 0.3em;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.9);
}
.block-gallery .tunnel__copy small {
  display: block;
  font-family: "Cormorant Garamond", "Noto Serif JP", serif;
  font-size: 1.1rem;
  letter-spacing: 0.3em;
  color: #9b978f;
  margin-top: 1.6rem;
}

.bg_darkbrown {
  background: #1f1700;
}

.block-designstory {
  color: #fff;
}
.block-designstory .secttl {
  color: #fff;
}
.block-designstory .secttl:before {
  background: #fff;
}
.block-designstory .seccatch {
  color: #fff;
}
.block-designstory .seccatch {
  text-align: center;
}
.block-designstory .text {
  text-align: center;
  margin-top: 0.5rem;
  line-height: 2.6;
}
.block-designstory .text .p-note {
  display: inline-block;
  font-size: 0.72em;
  margin-left: 0.4em;
  white-space: nowrap;
}
@media only screen and (max-width: 767px) {
  .block-designstory .mainillust {
    margin-top: 0.5rem;
  }
}
@media only screen and (max-width: 767px) {
  .block-designstory .mainillust .concept-video,
  .block-designstory .mainillust img {
    width: 122%;
    max-width: none;
    margin-left: -20.7%;
  }
}
@media only screen and (min-width: 768px) {
  .block-designstory .mainillust .concept-video,
  .block-designstory .mainillust img {
    margin-left: -7.96%;
  }
}
@media only screen and (max-width: 767px) {
  .block-designstory .mainillust figcaption {
    bottom: -0.4rem;
  }
}
.block-designstory .illust_band {
  background: #e7e2d8;
  margin-top: 0.5rem;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .block-designstory .illust_band {
    margin-top: 0.4rem;
  }
}
.block-designstory .illust_layout {
  --iw: min(1500px, 100vw);
  width: var(--iw);
  height: calc(var(--iw) * 0.653);
  margin: 0 auto;
  position: relative;
  color: var(--color-01);
}
@media only screen and (max-width: 1023px) {
  .block-designstory .illust_layout {
    width: auto;
    height: auto;
    padding: 0.4rem 0.25rem 0.45rem;
  }
}
.block-designstory .illust_layout .image {
  position: absolute;
  margin: 0;
  mix-blend-mode: multiply;
}
.block-designstory .illust_layout .image img {
  display: block;
  width: 100%;
  height: auto;
}
.block-designstory .illust_layout .image.--01 {
  left: 4.58%;
  top: 3.21%;
  width: 41.18%;
}
.block-designstory .illust_layout .image.--02 {
  left: 47.57%;
  top: 3.5%;
  width: 42.33%;
}
.block-designstory .illust_layout .image.--03 {
  left: 16.78%;
  top: 44.09%;
  width: 25.17%;
}
.block-designstory .illust_layout .image.--04 {
  left: 42.52%;
  top: 45.84%;
  width: 44.8%;
}
.block-designstory .illust_layout .illust_text {
  position: absolute;
  margin: 0;
  font-size: calc(var(--iw) * 0.01193);
  line-height: 1.82;
  letter-spacing: 0.06em;
}
.block-designstory .illust_layout .illust_text.--01 {
  left: 13.35%;
  top: 41.04%;
}
.block-designstory .illust_layout .illust_text.--02 {
  left: 70.35%;
  top: 11.26%;
}
.block-designstory .illust_layout .illust_text.--03 {
  left: 9.53%;
  top: 66.73%;
}
.block-designstory .illust_layout .illust_text.--04 {
  left: 79.12%;
  top: 71.4%;
}
.block-designstory .illust_layout .illust_note {
  position: absolute;
  right: 6.67%;
  top: 95.84%;
  margin: 0;
  font-size: calc(var(--iw) * 0.0076);
  letter-spacing: 0.04em;
}
.block-designstory .illust_layout .illust_text br.wide {
  display: inline;
}
@media only screen and (max-width: 1023px) {
  .block-designstory .illust_layout .illust_text br.wide {
    display: none;
  }
  .block-designstory .illust_layout .image {
    position: static;
    margin: 0 auto;
  }
  .block-designstory .illust_layout .image.--01 {
    width: 100%;
  }
  .block-designstory .illust_layout .image.--02 {
    width: 100%;
  }
  .block-designstory .illust_layout .image.--03 {
    width: 62%;
  }
  .block-designstory .illust_layout .image.--04 {
    width: 100%;
  }
  .block-designstory .illust_layout .illust_text {
    position: static;
    margin: 0.12rem 0 0.45rem;
    font-size: 0.24rem;
    line-height: 1.9;
    text-align: center;
  }
  .block-designstory .illust_layout .illust_text.--04 {
    margin-bottom: 0.1rem;
  }
  .block-designstory .illust_layout .illust_note {
    position: static;
    text-align: right;
    font-size: 0.16rem;
    letter-spacing: 0.04em;
  }
}

.block-designelement {
  padding-bottom: clamp(48px, 5vw, 96px);
  margin-top: 2rem;
  color: #fff;
  text-align: center;
}
.block-designelement .box {
  border: 1px solid #fff;
  padding: 0 1rem 1rem;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .block-designelement .box {
    padding: 0 0.5rem 0.8rem;
  }
}
.block-designelement .secttl:before {
  background: #fff;
  height: 1.4rem;
  margin-top: -0.9rem;
}
.block-designelement .text {
  margin-top: 0.3rem;
  line-height: 2.6;
}
.block-designelement .grid {
  margin-top: 0.5rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.4rem;
  align-items: start;
}
@media only screen and (max-width: 767px) {
  .block-designelement .grid {
    margin-top: 0.8rem;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.3rem;
  }
}
.block-designelement .grid .image figcaption {
  font-family: "EB Garamond", serif;
  font-size: 0.22rem;
  position: static;
  padding: 0;
  margin-top: 0.1rem;
  text-align: left;
}
@media only screen and (max-width: 767px) {
  .block-designelement .grid .image figcaption {
    font-size: 0.3rem;
  }
}
.block-designelement .note {
  display: block;
  content: attr(data-cap);
  font-size: min(0.8vw, 66.6%);
  line-height: 1.2;
  z-index: 100;
  color: #fff;
  text-align: right;
  position: absolute;
  bottom: 0.1rem;
  right: 0.1rem;
}
@media only screen and (max-width: 767px) {
  .block-designelement .note {
    font-size: 0.16rem;
  }
}

.block-landscape-01 {
  padding: 3rem 0 2rem;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 {
    padding-bottom: 1.5rem;
  }
}
.block-landscape-01 .column--01 {
  background: #e8e2d9;
  padding: min(6.77vw, 1.3rem);
  position: relative;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 {
    padding: 0.8rem 0.6rem 0.6rem;
    margin: 0;
  }
}
.block-landscape-01 .column--01:before {
  width: 1px;
  height: min(15.63vw, 3rem);
  display: block;
  position: absolute;
  left: 50%;
  bottom: calc(100% - min(3.65vw, 0.7rem));
  transform: translateX(-50%);
  /*background: var(--color-01);*/
  background: #fff;
  content: "";
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01:before {
    height: 1.4rem;
    bottom: calc(100% - 0.4rem);
  }
}
.block-landscape-01 .column--01 .boxttl {
  letter-spacing: 0.2em;
  font-size: min(1.2vw, 0.23rem);
  line-height: 1.2;
  text-align: center;
  margin-bottom: min(5.21vw, 1rem);
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .boxttl {
    font-size: 0.3rem;
    margin-bottom: 0.6rem;
  }
}
.block-landscape-01 .column--01 .item {
  display: grid;
  grid-template-columns: 55% auto;
  gap: 0 min(5.21vw, 1rem);
  align-items: start;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .item {
    display: block;
  }
}
.block-landscape-01 .column--01 .item + .item {
  border-top: 1px solid var(--color-01);
  padding-top: min(5.21vw, 1rem);
  margin-top: min(5.21vw, 1rem);
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .item + .item {
    padding-top: 0.6rem;
    margin-top: 0.6rem;
  }
}
.block-landscape-01 .column--01 .item .profile {
  display: grid;
  grid-template-columns: 40% auto;
  grid-template-areas: "image text";
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .item .profile {
    grid-template-columns: 45% auto;
  }
}
.block-landscape-01 .column--01 .item .profile .image {
  grid-area: image;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .item .profile .image {
    aspect-ratio: 1/1.1;
  }
}
.block-landscape-01 .column--01 .item .profile .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}
.block-landscape-01 .column--01 .item .profile .logo {
  width: fit-content;
  margin-left: auto;
}
.block-landscape-01 .column--01 .item .profile .name {
  margin: auto 0 0;
  letter-spacing: 0.14em;
  text-align: right;
  padding-bottom: 0.2rem;
  margin-bottom: auto;
  border-bottom: 1px solid var(--color-01);
}
.block-landscape-01 .column--01 .item .profile .name dd {
  margin-top: 0.1rem;
}
.block-landscape-01 .column--01 .item .profile .name dd span {
  font-size: 138%;
  margin: 0 0.05rem;
}
.block-landscape-01 .column--01 .item .profile p {
  grid-column: 1/3;
  margin-top: 0.5rem;
  line-height: 2.5;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .item .profile p {
    margin-top: 0.4rem;
  }
}
.block-landscape-01 .column--01 .item .profile:nth-of-type(even) {
  grid-template-columns: auto 40%;
  grid-template-areas: "text image";
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .item .profile:nth-of-type(even) {
    grid-template-columns: auto 45%;
  }
}
.block-landscape-01 .column--01 .item .profile:nth-of-type(even) .name {
  text-align: left;
}
.block-landscape-01 .column--01 .item .profile:not(:has(.logo)) {
  align-items: end;
}
.block-landscape-01 .column--01 .item .profile:not(:has(.logo)) .image {
  grid-row: 1/2;
}
.block-landscape-01 .column--01 .item .sttl {
  font-family: "EB Garamond", serif;
  letter-spacing: 0.12em;
  line-height: 1.2;
  font-size: 0.23rem;
  margin-bottom: 0.1rem;
  grid-column: 1/3;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .item .sttl {
    font-size: 0.3rem;
    margin-bottom: 0.15rem;
  }
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .item .works {
    margin-top: 0.6rem;
  }
}
.block-landscape-01 .column--01 .item .works p {
  margin-bottom: 0.3rem;
  line-height: 2.5;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .item .works p {
    margin-bottom: 0.6rem;
  }
}
.block-landscape-01 .column--01 .item .works .images {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.3rem;
}
.block-landscape-01 .column--01 .item .works .image .text {
  display: block;
  text-align: right;
  margin-top: 0.1rem;
  line-height: 1.4;
  font-size: min(0.73vw, 0.14rem);
  letter-spacing: 0.14em;
}
.block-landscape-01 .column--01 .item .works .image .text .note {
  display: block;
  font-size: 0.88em;
  letter-spacing: 0.08em;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .item .works .image .text {
    font-size: 0.16rem;
  }
}
.block-landscape-01 .column--01 .item--01 .profile--01 {
  align-items: start;
}
.block-landscape-01 .column--01 .item--01 .profile--01 .logo img {
  height: min(5.21vw, 1rem);
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .item--01 .profile--01 .logo img {
    height: 0.5rem;
  }
}
.block-landscape-01 .column--01 .item--01 .profile--01 .name {
  margin-top: 0.5rem;
}
.block-landscape-01 .column--01 .item--01 .profile--02 {
  align-items: end;
  margin-top: -0.3rem;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .item--01 .profile--02 {
    margin-top: 0.4rem;
  }
}
.block-landscape-01 .column--01 .item--01 .profile--02 .name {
  margin-bottom: 0.2rem;
}
@media only screen and (min-width: 768px) {
  .block-landscape-01 .column--01 .item--01 .works {
    grid-row: 1/3;
    grid-column: 2/3;
  }
}
.block-landscape-01 .column--01 .item--02 .profile {
  align-items: center;
}
@media only screen and (min-width: 768px) {
  .block-landscape-01 .column--01 .item--02 .profile {
    grid-template-columns: 47% auto;
  }
}
.block-landscape-01 .column--01 .item--02 .profile .logo img {
  height: min(3.02vw, 0.58rem);
  width: auto;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--01 .item--02 .profile .logo img {
    height: 0.3rem;
  }
}
.block-landscape-01 .column--01 .item--02 .profile .name {
  margin-top: 0.5rem;
}
.block-landscape-01 .secttl:before {
  height: min(6.77vw, 1.3rem);
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .secttl:before {
    height: 1.3rem;
  }
}
.block-landscape-01 .lead {
  text-align: center;
  position: relative;
  z-index: 1;
}
.block-landscape-01 .lead p {
  margin: 0.5rem 0 0;
  line-height: 2.6;
}
.block-landscape-01 .lead .image {
  margin-top: 0.8rem;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .lead .image figcaption {
    transform: translateY(calc(100% + 0.2rem));
  }
}
.block-landscape-01 .column--02 {
  position: relative;
  padding-bottom: 2.5rem;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--02 {
    padding-bottom: 1rem;
  }
}
.block-landscape-01 .column--02__bg {
  width: 100vw;
  height: calc(100% + 2.5rem);
  display: block;
  position: absolute;
  bottom: 0;
  left: 50%;
  background: #e4ded4;
  background: #e8e2d9;
  mix-blend-mode: multiply;
  content: "";
  transform: translateX(-50%);
  z-index: -1;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--02__bg {
    height: calc(100% + 2rem);
  }
}
.block-landscape-01 .column--02 .headline {
  display: grid;
  grid-template-columns: 36.5% auto;
  gap: 0.3rem min(4.17vw, 0.8rem);
  align-items: center;
  margin-top: 0.3rem;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--02 .headline {
    grid-template-columns: 48% auto;
    margin-top: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .block-landscape-01 .column--02 .headline .image {
    grid-row: 1/3;
  }
}
.block-landscape-01 .column--02 .headline .seccatch {
  margin-top: auto;
}
.block-landscape-01 .column--02 .headline p {
  line-height: 2.6;
  letter-spacing: 0.05em;
  margin-bottom: auto;
}
@media only screen and (max-width: 767px) {
  .block-landscape-01 .column--02 .headline p {
    grid-column: 1/3;
  }
}

.block-greendesign .item--01 .lead {
  text-align: center;
}
.block-greendesign .item--01 .text {
  margin-top: 0.5rem;
  line-height: 2.6;
}
.block-greendesign .item--01 .image.--01 {
  margin-top: 0.5rem;
}
@media only screen and (max-width: 767px) {
  .block-greendesign .item--01 .image.--01 {
    width: 100%;
  }
  .block-greendesign .item--01 .image.--01 figcaption {
    bottom: -0.4rem;
  }
}
.block-greendesign .item--02 {
  margin-top: 1rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(4, 1.5rem);
}
.block-greendesign .item--02 .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.block-greendesign .item--02 .image.--01 {
  grid-area: 1/1/3/3;
}
.block-greendesign .item--02 .image.--02 {
  grid-area: 1/3/2/5;
}
.block-greendesign .item--02 .image.--03 {
  grid-area: 2/3/3/4;
}
.block-greendesign .item--02 .image.--04 {
  grid-area: 2/4/3/5;
}
.block-greendesign .item--02 .image.--05 {
  grid-area: 3/1/5/2;
}
.block-greendesign .item--02 .image.--06 {
  grid-area: 3/2/4/3;
}
.block-greendesign .item--02 .image.--07 {
  grid-area: 4/2/5/3;
}
.block-greendesign .item--02 .image.--08 {
  grid-area: 3/3/5/5;
}
.block-greendesign .item--03 {
  margin-top: 1.2rem;
  display: grid;
  grid-template-columns: 54% auto;
  gap: 0 min(5.21vw, 1rem);
}
@media only screen and (max-width: 767px) {
  .block-greendesign .item--03 {
    margin-top: 1rem;
    display: block;
  }
}
.block-greendesign .item--03 .seccatch {
  letter-spacing: 0.1em;
}
@media only screen and (max-width: 767px) {
  .block-greendesign .item--03 .seccatch {
    font-size: 0.3rem;
  }
}
.block-greendesign .item--03 .text p {
  margin: 0.3rem 0 0;
  line-height: 2.6;
  letter-spacing: 0.05em;
}
.block-greendesign .item--03 .logo {
  margin-top: 0.3rem;
}
@media only screen and (max-width: 767px) {
  .block-greendesign .item--03 .logo {
    margin-top: 0.4rem;
  }
}
.block-greendesign .item--03 .logo img {
  height: min(1.82vw, 0.35rem);
  width: auto;
}
@media only screen and (max-width: 767px) {
  .block-greendesign .item--03 .logo img {
    height: 0.35rem;
  }
}
@media only screen and (max-width: 767px) {
  .block-greendesign .item--03 .image {
    margin-top: 0.6rem;
    width: 3.6rem;
  }
}

.block-gate {
  margin-top: 0;
}
.block-gate .seccatch {
  text-align: center;
}

.block-entrance {
  margin-top: 2rem;
  padding-bottom: clamp(72px, 6.25vw, 120px);
}
@media only screen and (max-width: 767px) {
  .block-entrance {
    margin-top: 1rem;
    padding-bottom: 60px;
  }
}
.block-entrance .seccatch {
  text-align: center;
}

.block-material-01 {
  background: #463c21;
  color: #fff;
  padding: 2rem 0;
  margin-top: 2rem;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .block-material-01 {
    padding: 1.5rem 0;
    margin-top: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .block-material-01 .lead {
    display: grid;
    grid-template-columns: 1fr 40vw;
    gap: 0 0.5rem;
  }
}
@media only screen and (max-width: 767px) {
  .block-material-01 .lead {
    text-align: center;
  }
}
@media only screen and (min-width: 768px) {
  .block-material-01 .lead .secttl {
    text-align: left;
  }
}
.block-material-01 .lead .secttl:before {
  content: none;
}
.block-material-01 .lead .text {
  place-content: center;
}
.block-material-01 .lead p {
  margin: 0.5rem 0 0;
  line-height: 2.6;
}
@media only screen and (min-width: 768px) {
  .block-material-01 .lead .image {
    margin-right: calc((min(90vw, 1500px) - 100vw) / 2 - 10px);
  }
}
.block-material-01 .lead .image figcaption {
  right: auto;
  left: 0;
}
@media only screen and (max-width: 767px) {
  .block-material-01 .lead .image {
    margin-top: 1rem;
  }
}
@media only screen and (max-width: 767px) {
  .block-greendesign .item--03 .logo img {
    margin-inline: auto;
  }
  .block-greendesign .item--03 .image {
    margin-inline: auto;
  }
}

.block-designelement .element-video { display: block; width: 100%; height: auto; aspect-ratio: 275 / 297; object-fit: cover; }

/* ギャラリー写真が下からゆっくり浮かび上がる演出 */
.block-gallery .image.gallery-float {
  opacity: 0;
  transform: translate3d(0, 80px, 0);
  transition-property: opacity, transform;
  transition-duration: 1.8s, 2.2s;
  transition-timing-function: ease-out, cubic-bezier(.22, 1, .36, 1);
}
.block-gallery .image.gallery-float.scrollIn { opacity: 1; transform: translate3d(0, 0, 0); }
@media only screen and (max-width: 767px) {
  .block-gallery .image.gallery-float { transform: translate3d(0, 48px, 0); }
  .block-gallery .image.gallery-float.scrollIn { transform: translate3d(0, 0, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .block-gallery .image.gallery-float { opacity: 1; transform: none; transition: none; }
}

/* 男性写真：表示枠を維持して鼻より上をトリミング */
.block-gallery .image.--05 { aspect-ratio: 709 / 495; overflow: hidden; }
.block-gallery .image.--05 img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.5); transform-origin: 50% 100%; }

/* 断面概念図のループ動画 */
.mainillust .concept-video { display: block; width: 100%; height: auto; aspect-ratio: 1634 / 755; object-fit: fill; }
/*# sourceMappingURL=residence.css.map */
/* Let the page background show through the certification logos’ white areas. */
.block-greendesign .item--03 {
  mix-blend-mode: multiply;
}

@media only screen and (max-width: 767px) {
  .block-designstory .text .p-note,
  .block-designstory .illust_layout .illust_note,
  .block-landscape-01 .column--01 .item .works .image .text {
    font-size: max(10px, 0.2rem);
  }
}

@media only screen and (max-width: 767px) {
  .block-residence .note,
  .block-designelement .note {
    font-size: max(10px, 0.2rem);
  }
}

/* 2026-09-26 定例CB */
.block-gallery { position: relative; }
.block-gallery > .note {
  display: block;
  position: absolute;
  right: 0.2rem;
  bottom: 0.15rem;
  font-size: min(0.8vw, 66.6%);
  line-height: 1.2;
  color: #fff;
  z-index: 100;
}
@media only screen and (max-width: 767px) {
  .block-gallery > .note { font-size: max(10px, 0.2rem); right: 0.15rem; }
  .block-landscape-01 .column--01 .item--01 .profile--01 .logo img { height: 0.7rem; }
  .block-landscape-01 .column--01 .item--02 .profile .logo img { height: 0.44rem; }
  .illust_text .p-note { font-size: max(10px, 0.2rem); }
}
.illust_text .p-note { display: inline-block; font-size: 0.8em; margin-left: 0.4em; }

/* 2026-09-26 各イラストに概念図キャプションを付ける */
.block-designstory .illust_layout .image figcaption {
  position: absolute;
  right: 0.3em;
  bottom: 0.3em;
  font-size: calc(var(--iw) * 0.0076);
  letter-spacing: 0.04em;
  line-height: 1.2;
  white-space: nowrap;
}
@media only screen and (max-width: 1023px) {
  .block-designstory .illust_layout .image figcaption {
    position: static;
    display: block;
    text-align: right;
    margin-top: 0.06rem;
    font-size: 0.16rem;
  }
}
@media only screen and (max-width: 767px) {
  .block-designstory .illust_layout .image figcaption { font-size: max(10px, 0.2rem); }
}

/* 2026-09-29 スマホでのちらつき対策
   この4点のイラストは mix-blend-mode: multiply で白地を下地になじませている。
   そこへ blurIn（filter: blur と opacity のアニメーション）が重なると、
   アニメーション中だけ要素が独立して描画され、白地がそのまま見えてしまう。
   スクロールで再生され直すと点滅して見えるため、この4点だけ演出を外す。 */
.block-designstory .illust_layout .image.blurIn,
.block-designstory .illust_layout .image.blurIn.scrollIn {
  opacity: 1;
  transform: none;
  filter: none;
  transition: none;
}

/* 2026-09-29 マテリアルの写真枠がグリッドで縦に伸び、キャプションが写真の外に
   落ちていたため、枠を写真の高さに合わせる */
.block-material-01 .lead figure.image {
  align-self: start;
}

/* 2026-09-29 ハイサッシのイラストが上のコピーに重なっていたので少し下げる
   （コピーが2行になったぶん、元の位置では上端がかかっていた） */
@media only screen and (min-width: 1024px) {
  .block-designstory .illust_layout .image.--03 { top: 48.4%; }
}

/* 2026-09-29 ちらつきの根本対応
   この4点のイラストは掛け合わせ（multiply）で白地を帯の色になじませていたが、
   iOSのSafariはスクロール中に掛け合わせの描画をやり直す際にちらつくことがある。
   画像側にあらかじめ帯の色（#e7e2d8）を掛けた状態で書き出したので、
   掛け合わせの指定を外す。見え方は指定していたときと同じ。 */
.block-designstory .illust_layout .image {
  mix-blend-mode: normal;
}

/* Keep illustration copy above the neighboring opaque images. */
.block-designstory .illust_layout .illust_text {
  z-index: 1;
}
.block-designstory .illust_layout .illust_text.--01 .p-note {
  display: block;
  margin-left: 0;
}

@media only screen and (max-width: 767px) {
  .block-designstory .mainillust .concept-sp-motion { position: relative; width: 122%; margin-left: -20.7%; }
  .block-designstory .mainillust .concept-sp-motion img { display: block; width: 100%; margin: 0; }
  .concept-sp-motion canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
}