@charset "UTF-8";
/*----------------------------------------

	modelroom CSS

-----------------------------------------*/
.modelroom .c-title--page--full__title {
  width: clamp(321.6px, 28.963vw, 482.4px);
  left: clamp(2.4px, 0.216vw, 3.6px);
}
@media screen and (max-width: 768px) {
  .modelroom .c-title--page--full__title {
    width: clamp(80px, 26.667vw, 120px);
    top: calc(clamp(36px, 12vw, 54px) + 3%);
    left: clamp(24px, 8vw, 36px);
  }
}

/*----------------------------------------
	lead
-----------------------------------------*/
.lead {
  padding-bottom: min(8.429vw, 140.4px);
}
@media screen and (max-width: 768px) {
  .lead {
    padding-bottom: 0;
  }
}
.lead h2 {
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  place-items: center;
  width: 5em;
  margin: min(13.545vw, 225.6px) auto min(9.654vw, 160.8px);
  color: #FFF;
  font-family: "Zen Old Mincho", serif;
  font-size: min(2.305vw, 38.4px);
  font-weight: 400;
  letter-spacing: 0.4em;
  /* 縦書き（右から左） */
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  text-orientation: upright;
  word-break: keep-all;
}
@media screen and (max-width: 768px) {
  .lead h2 {
    width: 4em;
    margin: min(22.667vw, 102px) auto min(17.333vw, 78px);
    font-size: min(5.333vw, 24px);
    line-height: 1;
  }
}
.lead .spec {
  width: 315px;
  height: 322px;
  margin: auto;
  background-color: #24333D;
}
@media screen and (max-width: 768px) {
  .lead .spec {
    width: min(47.467vw, 213.6px);
    height: min(41.6vw, 187.2px);
  }
}
.lead .spec p {
  margin: 0;
  text-align: center;
  line-height: 1;
}
.lead .spec p:nth-of-type(1) {
  padding-top: min(1.729vw, 28.8px);
  color: #4C6473;
  font-family: "Cormorant Garamond", serif;
  font-size: min(1.009vw, 16.8px);
  letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
  .lead .spec p:nth-of-type(1) {
    padding-top: min(2.667vw, 12px);
    font-size: min(2.4vw, 10.8px);
  }
}
.lead .spec p:nth-of-type(2) {
  padding-top: min(2.738vw, 45.6px);
  color: #FFF;
  font-family: "Cormorant Garamond", serif;
  font-size: min(4.323vw, 72px);
}
@media screen and (max-width: 768px) {
  .lead .spec p:nth-of-type(2) {
    padding-top: min(4.8vw, 21.6px);
    font-size: min(8vw, 36px);
  }
}
.lead .spec p:nth-of-type(3) {
  padding-top: min(2.882vw, 48px);
  color: #FFF;
  font-family: "Zen Old Mincho", serif;
  font-size: min(2.161vw, 36px);
  letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
  .lead .spec p:nth-of-type(3) {
    padding-top: min(5.067vw, 22.8px);
    font-size: min(4.8vw, 21.6px);
  }
}
.lead .spec p:nth-of-type(4) {
  padding-top: min(0.865vw, 14.4px);
  font-family: "Zen Old Mincho", serif;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
  .lead .spec p:nth-of-type(4) {
    padding-top: min(1.6vw, 7.2px);
  }
}
.lead .spec p:nth-of-type(4) span:nth-of-type(1) {
  display: inline-block;
  margin-right: 0.6em;
  color: #C7D3DC;
  font-size: min(1.009vw, 16.8px);
  -webkit-transform: translateY(-0.2em);
          transform: translateY(-0.2em);
}
@media screen and (max-width: 768px) {
  .lead .spec p:nth-of-type(4) span:nth-of-type(1) {
    font-size: min(2.667vw, 12px);
  }
}
.lead .spec p:nth-of-type(4) span:nth-of-type(2) {
  color: #FFF;
  font-size: min(1.729vw, 28.8px);
}
@media screen and (max-width: 768px) {
  .lead .spec p:nth-of-type(4) span:nth-of-type(2) {
    font-size: min(4.267vw, 19.2px);
  }
}
.lead .spec p:nth-of-type(4) span:nth-of-type(3) {
  color: #FFF;
  font-size: min(1.297vw, 21.6px);
}
@media screen and (max-width: 768px) {
  .lead .spec p:nth-of-type(4) span:nth-of-type(3) {
    font-size: min(2.933vw, 13.2px);
  }
}

/*----------------------------------------
	anchorLink-pc
-----------------------------------------*/
.anchorLink-pc {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: min(3.89vw, 64.8px);
  opacity: 0;
}
.anchorLink-pc.is-fixed {
  z-index: 7;
  position: fixed;
  top: min(5.476vw, 91.2px);
  width: 100%;
  padding: min(1.081vw, 18px) 0;
  background-color: rgb(53, 76, 90);
  opacity: 1;
  -webkit-transition: top 0.5s ease-in-out, opacity 0.5s ease-in-out;
  transition: top 0.5s ease-in-out, opacity 0.5s ease-in-out;
}
@media screen and (max-width: 768px) {
  .anchorLink-pc {
    display: none;
  }
}
.anchorLink-pc li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  line-height: 1;
}
.anchorLink-pc li span {
  display: inline-block;
}
.anchorLink-pc li span:nth-of-type(1) {
  color: #FFF;
  font-family: "Cormorant Garamond", serif;
  font-size: min(1.153vw, 19.2px);
  letter-spacing: 0.1em;
}
.anchorLink-pc li span:nth-of-type(2) {
  margin: 0 1.3em 0 1em;
  color: #C7B370;
  font-family: "Zen Old Mincho", serif;
  font-size: min(0.865vw, 14.4px);
  letter-spacing: 0.1em;
}
.anchorLink-pc li::after {
  content: "";
  display: block;
  width: min(0.937vw, 15.6px);
  height: min(0.937vw, 15.6px);
  margin-top: min(0.144vw, 2.4px);
  background: transparent url(/asset/img/modelroom/modelroom_anchor_arrow.svg) NO-repeat center center;
  background-size: contain;
}

/*----------------------------------------
	c-images
-----------------------------------------*/
.c-images {
  z-index: 0;
  position: relative;
}

/*----------------------------------------
	images
-----------------------------------------*/
.images {
  position: relative;
  height: 100svh;
}
@media screen and (max-width: 768px) {
  .images {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
  }
}
.images figure {
  z-index: 1;
  position: relative;
  height: inherit;
}
.images figure span.l-text,
.images figure span.r-text {
  display: block;
  position: fixed;
  top: 0;
  bottom: 0;
  margin: auto;
  opacity: 0;
}
@media screen and (max-width: 768px) {
  .images figure span.l-text,
  .images figure span.r-text {
    display: none;
  }
}
.images figure span.l-text {
  z-index: 2;
  left: min(1.441vw, 24px);
}
.images figure span.r-text {
  z-index: 3;
  right: min(1.441vw, 24px);
}

#living_dining1 span.l-text,
#living_dining1 span.r-text,
#living_dining2 span.l-text,
#living_dining2 span.r-text,
#living_dining3 span.l-text,
#living_dining3 span.r-text,
#living_dining4 span.l-text,
#living_dining4 span.r-text {
  height: min(11.239vw, 187.2px);
  width: min(1.441vw, 24px);
}

#kitchen span.l-text,
#kitchen span.r-text {
  height: min(5.331vw, 88.8px);
  width: min(1.441vw, 24px);
}

#master_bedroom span.l-text,
#master_bedroom span.r-text {
  height: min(11.239vw, 187.2px);
  width: min(1.441vw, 24px);
}

#bedroom1 span.l-text,
#bedroom1 span.r-text,
#bedroom2 span.l-text,
#bedroom2 span.r-text {
  height: min(5.98vw, 99.6px);
  width: min(1.441vw, 24px);
}

.stit-sp {
  display: none;
}
@media screen and (max-width: 768px) {
  .stit-sp.st1 {
    margin-top: min(20vw, 90px);
  }
}
@media screen and (max-width: 768px) {
  .stit-sp.st2, .stit-sp.st3, .stit-sp.st4, .stit-sp.st5 {
    margin-top: min(14.667vw, 66px);
  }
}
@media screen and (max-width: 768px) {
  .stit-sp {
    display: block;
    text-align: center;
  }
  .stit-sp span {
    display: block;
  }
  .stit-sp span:nth-of-type(1) {
    color: #FFF;
    font-family: "Cormorant Garamond", serif;
    font-size: min(5.333vw, 24px);
    letter-spacing: 0.1em;
  }
  .stit-sp span:nth-of-type(2) {
    margin-top: min(-1.067vw, -4.8px);
    margin-bottom: min(4vw, 18px);
    color: #C7B370;
    font-family: "Zen Old Mincho", serif;
    font-size: min(2.667vw, 12px);
    letter-spacing: 0.1em;
  }
}

/*----------------------------------------
	header
-----------------------------------------*/
header.is-fixed {
  background-color: rgb(53, 76, 90);
}

/*----------------------------------------
	footer
-----------------------------------------*/
footer {
  z-index: 10;
}
/*# sourceMappingURL=modelroom.css.map */