/* CSS Document */
.pre-inc #residence img {
  width: 100%;
}
.pre-inc #residence .gap-02 {
  margin-right: -0.2em;
}
.pre-inc #residence .gap-04 {
  margin-right: -0.4em;
}
.pre-inc #residence .sup-s {
  font-size: 0.55em;
}
.pre-inc #residence .under-mv {
  background: #A6A291;
}
.pre-inc #residence .under-mv figure {
  position: relative;
}
.pre-inc #residence .under-mv .mv-title {
  position: absolute;
  top: 10%;
  right: 10%;
  font-size: min(4.5svw, 48px);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.pre-inc #residence .under-mv .mv-title span {
  padding: min(0.5vw, 0.5rem) 0;
  text-shadow: 0 0 1rem #0075BD, 0.5em 0.5em 1rem #0075BD, -0.5em -0.5em 1rem #0075BD;
}
.pre-inc #residence #area .lead {
  font-size: min(5vw, 32px);
  text-align: center;
  padding: 2em 0;
}
@media screen and (max-width: 750px), print {
  .pre-inc #residence #area .lead {
    padding: 1em 0;
  }
}
.pre-inc #residence #area .txt {
  font-size: min(3vw, 16px);
  text-align: center;
  margin: 0 auto 5em;
  line-height: 2;
}
@media screen and (max-width: 750px), print {
  .pre-inc #residence #area .txt {
    width: 95%;
    margin: 0 auto 2.5em;
  }
}
.pre-inc #residence #area .txt .ib span {
  font-size: 0.8em;
}
.pre-inc #residence #area .img-area, .pre-inc #residence #area .img-area2 {
  width: 100%;
  max-width: 1480px;
  margin: auto;
}
.pre-inc #residence #area .img-area small, .pre-inc #residence #area .img-area2 small {
  text-align: right;
  font-size: min(2svw, 10px);
  display: block;
  padding: 0.3em;
}
.pre-inc #residence #area .img-area2 {
  max-width: 1080px;
  margin-top: -5rem;
}
@media screen and (max-width: 750px), print {
  .pre-inc #residence #area .img-area2 {
    margin-top: -2rem;
  }
}
.pre-inc #residence #area .img-area p {
  display: flex;
  justify-content: space-around;
  font-size: min(2.8svw, 14px);
}
.pre-inc #residence #area .box {
  padding: 10px;
  width: 90%;
  max-width: 980px;
  margin: min(4vw, 4rem) auto min(8vw, 8rem);
  background: #A6A191;
}
.pre-inc #residence #area .box .in {
  border: 1px solid #fff;
  padding: min(3vw, 3em);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 2rem;
}
.pre-inc #residence #area .box .in dl {
  min-width: calc(60% - 2rem);
  width: calc((480px - 100%) * 1000);
  max-width: 100%;
  color: #fff;
}
.pre-inc #residence #area .box .in dl dt {
  font-size: min(2.8svw, 14px);
  border-bottom: solid #fff 1px;
  padding: 0.5rem 0;
}
.pre-inc #residence #area .box .in dl dt strong {
  font-size: min(3.9svw, 21px);
  padding-left: 1em;
}
.pre-inc #residence #area .box .in dl dd {
  padding: 1rem 0 0;
  line-height: 1.8;
}
.pre-inc #residence #area .box .in figure {
  position: relative;
  min-width: calc(40% - 2rem);
  width: calc((480px - 100%) * 1000);
  max-width: 100%;
}
.pre-inc #residence #area .box .in figure figcaption {
  position: absolute;
  font-size: min(2.4vw, 12px);
  color: #fff;
  bottom: 0.5em;
  right: 0.5em;
}
.pre-inc #residence #area .sec01 {
  background: rgba(166, 162, 145, 0.3);
  padding: 0 0 3em;
}
@media screen and (max-width: 750px), print {
  .pre-inc #residence #area .sec01 {
    padding: 0 0 2em;
  }
}
.pre-inc #residence #area .sec01 .main {
  position: relative;
  background: url(../images/residence/bg-01.webp) no-repeat 0 0;
  background-size: cover;
  padding: 100px 0;
  position: relative;
}
@media screen and (max-width: 750px), print {
  .pre-inc #residence #area .sec01 .main {
    padding: 20px 0;
  }
}
.pre-inc #residence #area .sec01 .main h2 {
  font-family: "Roboto", sans-serif;
  font-size: min(8.5vw, 67px);
  font-style: italic;
  color: rgba(166, 161, 145, 0.4);
  max-width: 1004px;
  width: 95%;
  margin: 0 auto;
}
.pre-inc #residence #area .sec01 .main .cap {
  font-size: min(2.4vw, 12px);
  position: absolute;
  bottom: 0;
  right: 0;
  color: #fff;
  padding: 0.5em;
  text-align: right;
}
.pre-inc #residence #area .sec01 .lead {
  padding: 2em 0;
}
@media screen and (max-width: 750px), print {
  .pre-inc #residence #area .sec01 .lead {
    padding: 1em 0;
  }
}
.pre-inc #residence #area .sec01 .list {
  max-width: 1004px;
  width: 95%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 2%;
  padding: 0 0 2em;
}
@media screen and (max-width: 750px), print {
  .pre-inc #residence #area .sec01 .list {
    padding: 0 0 1em;
  }
}
.pre-inc #residence #area .sec01 .list .block {
  width: 32%;
  margin: 0 0 1em;
}
@media screen and (max-width: 750px), print {
  .pre-inc #residence #area .sec01 .list .block {
    width: 49%;
    margin: 0 0 0.5em;
  }
}
.pre-inc #residence #area .sec01 .list .block .txt {
  text-align: left;
  padding: 1em 0;
  margin: 0;
  line-height: 1.3;
}
.pre-inc #residence #area .sec01 .flex {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 90%;
  max-width: 1280px;
  margin: auto;
}
.pre-inc #residence #area .sec01 .flex .flex-in {
  min-width: 35%;
  width: calc((480px - 100%) * 1000);
  max-width: 100%;
}
.pre-inc #residence #area .sec01 .flex figure {
  min-width: 65%;
  width: calc((480px - 100%) * 1000);
  max-width: 100%;
  margin-top: min(-4vw, -4rem);
}
.pre-inc #residence #area .sec01 .flex figure figcaption {
  font-size: min(2svw, 10px);
  text-align: right;
}
.pre-inc #residence #area .sec01 .cnt1 .lead {
  padding-top: 0;
  text-align: left;
}
.pre-inc #residence #area .sec01 .cnt1 .txt {
  text-align: left;
}
.pre-inc #residence #area .sec01 .box2 {
  width: 90%;
  max-width: 1280px;
  margin: min(4vw, 4rem) auto;
  background: rgba(255, 255, 255, 0.6);
  padding: min(2vw, 2rem);
}
.pre-inc #residence #area .sec01 .box2 .txt2 {
  font-size: min(3.8svw, 20px);
  text-align: center;
  padding: 1rem 1rem 2rem;
}
.pre-inc #residence #area .sec01 .box2 .list {
  padding: 0;
  justify-content: center;
  gap: 2rem;
}
.pre-inc #residence #area .sec01 .box2 .list .block {
  position: relative;
  width: calc(33.3333333333% - 2rem);
}
@media screen and (max-width: 750px), print {
  .pre-inc #residence #area .sec01 .box2 .list .block {
    width: 100%;
  }
}
.pre-inc #residence #area .sec01 .box2 .list .block::after {
  content: "";
  border-right: solid #ddd 1px;
  display: block;
  height: 100%;
  position: absolute;
  top: 0;
  right: -1rem;
}
@media screen and (max-width: 750px), print {
  .pre-inc #residence #area .sec01 .box2 .list .block::after {
    content: none;
  }
}
.pre-inc #residence #area .sec01 .box2 .list .block:last-child::after {
  border-right: none;
}
.pre-inc #residence #area .sec01 .box2 .list .photo {
  position: relative;
}
.pre-inc #residence #area .sec01 .box2 .list .photo small {
  position: absolute;
  font-size: min(2.4vw, 12px);
  color: #fff;
  bottom: 0.5em;
  right: 0.5em;
  font-size: min(2svw, 10px);
  display: block;
  padding: 0.3em;
  text-align: right;
}
.pre-inc #residence #area .sec01 .box2 .list .txt {
  text-align: center;
}
.pre-inc #residence #area .sec01 .box2 .list .txt3 {
  font-size: min(3.8svw, 20px);
  color: #AB8617;
  padding-bottom: 1em;
  text-align: center;
}
.pre-inc #residence #area .sec01 .box2 .list small {
  width: 90%;
  margin: auto;
}
.pre-inc #residence #area .sec01 .box2 .list small.col-black {
  color: #000;
}
.pre-inc #residence #area .sec01 .cnt2 {
  width: 90%;
  max-width: 1280px;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
}
@media screen and (max-width: 750px), print {
  .pre-inc #residence #area .sec01 .cnt2 {
    gap: 1rem;
  }
}
.pre-inc #residence #area .sec01 .cnt2 dl {
  width: calc(33.3333333333% - 2rem);
  padding: 1rem 0;
}
@media screen and (max-width: 750px), print {
  .pre-inc #residence #area .sec01 .cnt2 dl {
    width: 100%;
  }
}
.pre-inc #residence #area .sec01 .cnt2 dl dt {
  font-size: min(3.9vw, 21px);
  padding-bottom: 0.5rem;
  margin-bottom: 1rem;
  text-indent: -3em;
  padding-left: 3em;
}
.pre-inc #residence #area .sec01 .cnt2 dl dt::before {
  content: "";
  background: #817B6D;
  color: #fff;
  padding: 0.2em 0.65em;
  margin-right: 1em;
}
.pre-inc #residence #area .sec01 .cnt2 dl dt sub {
  font-size: min(2.4svw, 12px);
}
.pre-inc #residence #area .sec01 .cnt2 dl dd {
  font-size: min(3.2vw, 16px);
  line-height: 1.8;
}
.pre-inc #residence #area .sec01 .cnt2 .a dt::before {
  content: "A";
}
.pre-inc #residence #area .sec01 .cnt2 .b dt::before {
  content: "B";
}
.pre-inc #residence #area .sec01 .cnt2 .c dt::before {
  content: "C";
}
.pre-inc #residence #area .sec01 .cnt2 .d dt::before {
  content: "D";
}
.pre-inc #residence #area .sec01 .cnt2 .e dt::before {
  content: "E";
}
.pre-inc #residence #area .sec01 .cnt2 .f dt::before {
  content: "F";
}
.pre-inc #residence #area .sec01 .cnt2 .g dt::before {
  content: "G";
}
.pre-inc #residence #area .sec01 .cnt2 .none dt::before {
  content: "";
  display: inline-block;
  width: 0.6em;
  height: 1.4em;
  vertical-align: middle;
}
.pre-inc #residence #area .sec01 .point-area {
  width: 100%;
  max-width: 1540px;
  margin: min(8vw, 8rem) auto;
}
.pre-inc #residence #area .sec01 .point-area .cnt3 {
  width: 100%;
  max-width: 1280px;
  display: flex;
  flex-wrap: wrap;
  margin: min(4vw, 4rem) auto min(4vw, 4rem) 0;
}
.pre-inc #residence #area .sec01 .point-area .cnt3:nth-of-type(even) {
  flex-direction: row-reverse;
  margin: min(4vw, 4rem) 0 min(4vw, 4rem) auto;
}
.pre-inc #residence #area .sec01 .point-area .cnt3 .cnt3-in {
  width: 100%;
  max-width: 640px;
  margin: auto;
  padding: 0 2rem;
  flex: 1;
}
.pre-inc #residence #area .sec01 .point-area .cnt3 .cnt3-in .lead {
  text-align: left;
}
.pre-inc #residence #area .sec01 .point-area .cnt3 .cnt3-in .txt {
  text-align: left;
}
.pre-inc #residence #area .sec01 .point-area .cnt3 figure {
  position: relative;
  min-width: 60%;
  width: calc((780px - 100%) * 1000);
  max-width: 100%;
  margin: auto;
}
.pre-inc #residence #area .sec01 .point-area .cnt3 figure figcaption {
  position: absolute;
  font-size: min(2svw, 10px);
  color: #fff;
  bottom: 0.5em;
  right: 0.5em;
}
.pre-inc #residence #area .sec01 .point-area .cnt3 figure figcaption.col-blk {
  color: #000;
}

/*# sourceMappingURL=residence.css.map */