@charset "utf-8";


/* Loading */
.loading{position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #fff; z-index: 9999; overflow: hidden;}
.loading.is-show{animation: loadEnd 2s ease 4s forwards;}

@keyframes loadEnd{
    0%{opacity: 1;}
    100%{opacity: 0; visibility: hidden; pointer-events: none;}
}

.loading .scene1{position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; will-change: transform; overflow: hidden; z-index: 1;}
.loading .scene1 figure{opacity: 0; line-height: 1; display: block; width: min(12.7vw,127px); margin: 0 auto;}
.loading.is-show .scene1 figure{animation: loadScene1 2s forwards;}

@keyframes loadScene1{
    0%{opacity: 0;}
    40%{opacity: 1;}
    80%{opacity: 1; transform: scale(1);}
    100%{opacity: 0; transform: scale(0.6);}
}

.loading .scene2{position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; will-change: transform; overflow: hidden; z-index: 2;}
.loading .scene2 p{opacity: 0; text-align: center;
font-size: min(5vw,5rem); line-height: 1; color: #a38a77; font-weight: 600; }
.loading.is-show .scene2 p{animation: loadScene2 2s ease 2s forwards;}

@keyframes loadScene2{
    0%{opacity: 0; transform: scale(1.1);}
    40%{opacity: 1; transform: scale(1)}
    80%{opacity: 1; transform: scale(1);}
    100%{opacity: 0; transform: scale(0.6);}
}

@media screen and (max-width: 768px){
    .loading .scene1 figure{width: 20vw;}
    .loading .scene2 p{font-size: 8vw;}
}


/* Wrapper */
#wrapper.is-fview{overflow: hidden; height: 100vh;}

/* 
 html,body {
     overflow-x: hidden;overflow-y: scroll;
  } */
   body {
     overflow-y: scroll;
  }
  @media (max-width: 769px) {
  html {
      overflow-x: hidden;overflow-y: scroll;
  }
}
.w-full img{width: 100%;}
.w-full{ opacity: 0;
  filter: blur(16px);
  transform: scale(1.03);
  transition: opacity 1.2s ease-out,
    filter 1.6s ease-out,
    transform 1.6s ease-out;}
    .w-full.is-view{
       opacity: 1;
  filter: blur(0);
  transform: scale(1);
    }
/* mv */
.mv{position: relative;}
.mv picture > img{display: block;width: 100%;}
.mv .bg-mv-pc{display: block; width: 100%; height: 100%; object-fit: cover; object-position: bottom left; transform: translateY(0) scale(1.3);}
.mv .logo-mv{width: 7.82%;position: absolute;right: 8.333%;top: 16.25%;}
.txt-mv{font-size: min(4vw,4.3rem);right: 5.2%;font-weight: 400;color: #fff;position: absolute;top:53%;letter-spacing: 0.28em;font-weight: 500;}
@media screen and (min-width: 1921px){
.txt-mv{font-size: 6rem;}
}
 .img-building{position: absolute;left: 8%;bottom: 0%;transform: translateY(-10%) scale(1.4);z-index: 1;pointer-events: none;}
   .mv{overflow: hidden;}
 .mv.is-show .img-building{animation: mvPcSlideUp 3s ease-out 1s forwards;}
 .mv.is-show .bg-mv-pc{animation: mvBgSlideUp 3s ease-out 1s forwards;}

@media screen and (max-width: 768px){
  /* .mv picture{display: block;overflow: hidden;}
  .mv picture > img{height: 100%;object-fit: cover;object-position: 39% top;transform: translateY(0%) scale(1.1);transform-origin: 90% center;}
  .mv.is-show picture > img{animation: mvSpSlideUp 3s ease-out forwards;} */
  .mv .logo-mv{max-width:134px;width:14.86%;top: 2.9%;left: 6%;right: unset;}
  .txt-mv{font-size: min(5vw,4.8rem);top: 5%;right: 6%;}
   .img-building{transform: translateY(-30%) scale(1.6);left: 0%;}
 .mv.is-show .img-building{animation: mvSpSlideUp 3s ease-out 1s forwards;}
 .mv .bg-mv-sp{width: 100%;object-fit: cover;object-position: bottom left;}
 .mv.is-show .bg-mv-sp{animation: mvBgSlideUp 3s ease-out 1s forwards;}
}

 /* .mv.is-show .img-building{animation: mvPcSlideUp 3s ease-out forwards;} */

@media screen and (min-width: 769px){
  .mv picture{display: block;overflow: hidden;}
  .mv picture > img{width: 100%;object-fit: cover;object-position: bottom left;}
  .mv{overflow: hidden;}
   .mv{height: calc(100vh - 88px);}
 /* .mv .bg-mv-pc{height: calc(100vh - 88px);width: 100%;object-fit: cover;object-position: bottom left;} */
  /* .mv picture > img{object-position: 39% top;transform: translateY(0%) scale(1);transform-origin:0% center;} */
  /* .mv.is-show picture > img{animation: mvPcSlideUp 2s ease-out forwards;} */

}

@keyframes mvSpSlideUp{
  0%{transform: translateY(-30%) scale(1.6);}
  100%{transform: translateY(22%) scale(1.6);}
}

@keyframes mvPcSlideUp{
  0%{transform: translateY(-10%) scale(1.4);}
  100%{transform: translateY(35%) scale(1.4);}
}

@keyframes mvBgSlideUp{
  0%{transform: translateY(0) scale(1.3);}
  100%{transform: translateY(15%) scale(1.3);}
}
.photo-animate.is-view img{-webkit-filter: brightness(1) blur(0);
  filter: brightness(1) blur(0);
  -webkit-mask-position: 50% 50%;
  mask-position: 50% 50%;}
.photo-animate img{
  display: block;
  -webkit-filter: brightness(1.1) blur(20px);
  filter: brightness(1.1) blur(20px);
  -webkit-mask-image: -webkit-gradient(linear, left top, right top, color-stop(25%, rgba(0, 0, 0, 0)), color-stop(33%, black), color-stop(66%, black), color-stop(75%, rgba(0, 0, 0, 0)));
  -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0) 25%, black 33%, black 66%, rgba(0, 0, 0, 0) 75%);
  mask-image: -webkit-gradient(linear, left top, right top, color-stop(25%, rgba(0, 0, 0, 0)), color-stop(33%, black), color-stop(66%, black), color-stop(75%, rgba(0, 0, 0, 0)));
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0) 25%, black 33%, black 66%, rgba(0, 0, 0, 0) 75%);
  -webkit-mask-position: 100% 50%;
  mask-position: 100% 50%;
  -webkit-mask-size: 400% 100%;
  mask-size: 400% 100%;
  -webkit-transition: ease;
  transition: ease;
    transition-property: all;
    transition-duration: 0s;
    transition-delay: 0s;
  transition-property: all;
  transition-duration: 0s;
  transition-delay: 0s;
  -webkit-transition-duration: 1.5s !important;
  transition-duration: 1.5s !important;
  transition-delay: 0.5s;
  -webkit-transition-property: -webkit-filter, -webkit-mask-position;
  transition-property: -webkit-filter, -webkit-mask-position;
  transition-property: filter, mask-position;
  transition-property: filter, mask-position, -webkit-filter, -webkit-mask-position;
  will-change: filter, mask-image;
}

@media screen and (min-width: 1921px){
  .txt-mv{right: 6.5%;}
}
.box-info{border: 1px solid #ccc;margin: 80px 0 0;padding:10px 20px 40px;}
.box-info .tit-info{text-align: center;font-size: 2rem;font-weight: 400;padding: 0 0 5px;margin: 0 0 20px;border-bottom: 1px solid #231815;letter-spacing: 0.1em;}
.intro {padding: 80px 0;position: relative;z-index: 2;}
.intro .intro-tit h3{font-size: min(4.9vw,4.2rem);font-weight: 500;letter-spacing: 0.06em;line-height: 1.55;text-align: center;margin: 0 0 30px;}
.btn-more{max-width: 354px;text-align: center;font-size: min(2.2vw,2.2rem);color: #fff;height: 68px;align-content: center;margin: 0 auto;display: block;}
.btn-bg{background: linear-gradient(to right,#7c6e61,#53493f);letter-spacing: 0.16em;line-height: 1;transition: all 0.3s;}
.btn-bg:hover{background: linear-gradient(to right,#53493f,#7c6e61);}

.intro-txt{padding: 60px 0 0 ;margin: 60px 0 0;border-top: 1px solid #231815;display: flex;justify-content: center;}
.intro-txt p{font-size: min(3vw,3rem);line-height: 1;margin-left: 0.9em;}
.intro-txt h4{font-size: min(4.7vw,4rem);line-height: 1;font-weight: 500;}
.intro-txt h4 .num{font-size: 3.1em;line-height: 0;color: #a38a77;}
.intro-txt h4 .b-txt{font-size: 1.42em;}
.intro-txt h4 small{font-size: min(3vw,3rem);}
 /* .intro .header-btn-menu{display: none;} */
@media screen and (max-width: 768px){
  .box-info{margin: 60px 0 0;}
  .box-info .tit-info{font-size: 1.6rem;}
  .intro{padding: 30px 0 50px;}
  .intro .intro-tit h3{font-size: min(5.5vw,4.6rem);}
 /* .intro .header-btn-menu{display: flex;margin: 20px -20px 30px;justify-content: center;}
 .intro .header-btn-menu a{font-size: 1.6rem;width:16.28em;height: 60px;} */
.btn-more{font-size: 1.6rem;height: 60px;letter-spacing: 0;width: 300px;}
.intro-txt{padding: 30px 0 0;margin: 30px 0 0;}
.intro-txt p{font-size: 1.6rem;margin-left: 0.8em;}
.intro-txt h4{font-size: 2.6rem;}
.intro-txt h4 small{font-size: 1.6rem;display: block;width: fit-content;margin-left: auto;margin-top: 5px;margin-right: -5px;
    text-align: right;}
    .concept .txt-box .m-center{text-align: center !important;font-size: 3.9vw;line-height: 2;letter-spacing: -0.05em;}
    .m-center br{display:  block !important;}
}
/* premium-plan */
.premium-plan{padding: 40px 0 0;background: linear-gradient(to right,#7c6e61,#53493f);}
.premium-plan .logo-page{text-align: center;margin: 0 0 30px;}
.premium-plan .premium-tit{font-size: min(4.2vw,4.5rem);letter-spacing: 0.02em;color: #fff;margin: 0 0 30px;line-height: 1.56;text-align: center;font-weight: 500;}
.premium-plan .list-obi{display: flex;justify-content: space-between;flex-wrap: wrap;row-gap: 10px;margin: 0 0 100px;}
.premium-plan .list-obi li{width: 32.7%;background:#fff linear-gradient(to right, 
    rgba(132, 115, 65,0.5) 0%,
  rgba(192, 180, 149,0.5)  25%,
  rgba(237,232,208,0.5) 50%,
  rgba(192, 180, 149,0.5) 75%,
    rgba(132, 115, 65,0.5) 100%);text-align: center;height: 70px;align-content: center;font-size: min(2.6vw,2.2rem);font-weight: 500;}
.premium-plan .list-obi li small{font-size: 0.7em;}
.premium-plan .premium-tit02{margin: 60px 0 40px;font-size: min(4.5vw,4rem);text-align: center;font-weight: 500;color: #fff;}
.premium-plan .premium-tit02 span{font-size: 0.7em;}
.premium-plan .photo .cap-abs_right{font-size: 1.2rem;right: 15px;}
.btn-more-brd{border: 1px solid #fff;position: relative;margin: 50px auto 20px;background: linear-gradient(to right, #7c6e61,#53493f);}
.btn-more-brd::before{position: absolute;content: "";width: 0%;height: 100%;top:0;left: 0;background: linear-gradient(to right ,#084663,#002b41);z-index: 1;transition: all 0.4s;}
.btn-more-brd:hover::before{width: 100%;}
.btn-more-brd::after{position: absolute;content: "";}
.btn-more-brd span{position: relative;z-index: 2;}
.sub-btn{text-align: center;font-size: min(2.2vw,2.2rem);color: #fff;margin: 0 0 70px;}
@media screen and (max-width: 768px){
  .premium-plan .premium-tit{font-size:  6vw;line-height: 1.6;letter-spacing: 0.06em;}
  .premium-plan .logo-page img{width: 200px;}
  .premium-plan .premium-tit02{font-size: 5vw;margin: 40px 0 20px;}
  .premium-plan .list-obi{margin: 0 0 40px;}
  .sub-btn{font-size: 1.6rem;margin: 0 0 40px;}
  .premium-plan .premium-tit02 span{display: block;}
}
@media screen and (max-width: 576px){
  .premium-plan .list-obi li{width: 100%;font-size: 1.6rem;height: 60px;}

}
.concept{padding: 70px 0 0;}
.concept .logo-page{text-align: center;margin: 0 0 40px;}
.concept .s-tit{font-size: min(4.4vw,4rem);text-align: center;font-weight: 500;margin: 0 0 40px;}
.concept .m-desc{text-align: center;font-size: 2rem;line-height: 2.75;margin: 0 0 100px;font-weight: 500;}
@media screen and (max-width: 768px){
  .concept{padding: 60px 0 0;}
  .concept .s-tit{font-size: 6vw;margin: 0 0 20px;}
  .concept .s-tit.tit-sp{width: fit-content;margin: 0 auto 20px;text-align: left;padding-left: 10%;
    font-size: 7vw;
    line-height: 1.6;letter-spacing: 0.1em;}
  .concept .m-desc{font-size: 1.4rem;text-align: left;line-height: 1.8;margin: 0 0 0;}
    .concept .m-desc br{display: none;}
     .concept .logo-page{position: relative;z-index: 1;margin: 0 0 20px;}
     .concept .txt-box{position: relative;z-index: 1;}
    .concept .logo-page img{width: 100px;}
    .concept{position: relative;padding: 40px 0;}
    .concept::after{position: absolute;width: 100%;height: 100%;content: "";background: linear-gradient(to right, rgba(124, 110, 97,0.2),rgba(83, 73, 63,0.2));top: 0;left: 0;pointer-events: none;}
}
.box-page{padding: 70px 0 0;}
.box-page .box-inner{display: flex; align-items: center;justify-content: space-between;margin: 0 0 100px;}
.box-page .box-inner .logo-page{width: 190px;height: 190px;display: flex;flex-direction: column;justify-content: space-between;align-items: center;padding: 30px 0;background: linear-gradient(to right, #7c6e61,#53493f);}
.box-page .box-inner .txt-box{width: calc(100% - 250px);}
.box-page .box-inner .logo-page .txt_jp{color: #fff;font-size: 2rem;line-height: 1;}

.box-page .box-inner .txt-box .s-tit02{font-size: min(3vw,3.1rem);font-weight: 500;line-height: 1.46;margin: 0 0 10px;}
.box-page .box-inner .txt-box .s-desc{line-height: 2.35;font-weight: 500;font-size: 1.7rem;margin-right: -12%;}

.list-item{display: flex;justify-content: space-between;flex-wrap: wrap;margin: 0 auto 20px;padding: 0 min(2vw,75px)}
.list-item .item{width: 30%;text-align: center;padding: 0 0 15px;border-bottom: 1px solid #231815;margin: 0 0 30px;}
.list-item .item p{font-size: min(2.4vw,2.5rem);font-weight: 500;line-height: 1.44;letter-spacing: -0.03em;}
.list-item .item p span{font-size: 2.24em;color: #796a56;line-height:0.6;}
.list-item .item p strong{font-size: 1.3em; color: #796a56; line-height: 1; letter-spacing: 0.08em;}
.list-item .item p small{font-size: 0.67em;}
.location .list-item .item em{font-style: normal;letter-spacing: 0.16em;}

.btn-coming{font-weight: 500;color: #796a56;width: 280px;background: #fff;height: 40px;font-size: 1.5rem;pointer-events: none;margin:0 auto 70px;display: block;border: 1px solid #796a56;text-align: center;align-content: center;line-height: 1;}
@media screen and (max-width: 768px){
  .box-page{padding: 0;}
  .box-page .box-inner{flex-wrap: wrap;margin: 0 -20px 15px;}
  .box-page .box-inner .logo-page{display: none;}
   
  .box-page .img-sp{width: 100%;}
  .box-page .box-inner .txt-box{width: 100%;margin: 40px 20px 0;}
  .box-page .box-inner .txt-box .s-tit02{font-size: 5.5vw;text-align: center;margin: 0 0 20px;line-height: 1.6;}
  .box-page .box-inner .logo-page .txt_jp{font-size: 1.6rem;}
   .list-item .item:first-child{padding-top: 15px;border-top: 1px solid #231815;margin-bottom: 0;}
  .list-item .item{width: 100%;margin: 0 0 0;padding-top: 15px;height: 102px;align-content: center;}
  .list-item{padding: 0 20px;}
  .list-item .item p{font-size: 1.8rem;line-height: 1.8;}
  .list-item .item-type small{display: block;}
  .btn-coming{margin: 40px auto 60px;}
}

.access .inner-access{display: flex;justify-content: space-between;flex-wrap: wrap;align-items: center;}
.access .inner-access{margin: 0 0 50px}
.access .inner-access .col-txt{width: 42%;}
.access .inner-access .col-img{width: 59.1%;margin-right: -5%;}
.access .inner-access .col-txt p{padding:  40px 0 25px;border-bottom: 1px solid #231815;text-align: center;font-size: min(2.4vw,2.5rem);font-weight: 500;line-height: 1.3;}
.access .inner-access .col-txt p span{font-size: 2.52em;color: #796a56;line-height:0;}
.access .inner-access .col-txt p small{font-size: 0.67em;}
.access .inner-access .col-txt p:first-child{text-align: left;}
.sml-txt{margin: 0 0 10px 0.8em;display: inline-block;}
@media screen and (max-width: 1180px){
  .box-page .box-inner .txt-box .s-desc{margin-right: 0;}
}
@media screen and (max-width: 1120px){
  .access .inner-access {justify-content: center;}
  .access .inner-access .col-txt{width: 42%;}
  .access .inner-access .col-txt p{padding: 20px 0;}
.access .inner-access .col-img{width: 60%;margin: 0 0 40px;order: -1;}

}
@media screen and (max-width: 768px){
  .access .inner-access{margin: 0;}
  .access .inner-access .col-img{width: 100%;}
  .access .inner-access .col-txt p{font-size:1.8rem;height: 102px;align-content: center;}
  .access .inner-access .col-txt{width: 100%;padding: 0 20px;}
  .access .inner-access .col-txt p:first-child{text-align: center;padding-top: 10px;border-top: 1px solid #231815;}
  .access .inner-access .col-txt p small.sml-txt{margin-left: -6.8em;margin-bottom: 0;}
  .box-page .box-inner .txt-box .s-desc{font-size: 1.4rem;}
}
.design .list-item ,.plan .list-item{padding: 0 30px;}
.design .list-item .item{width: 47%;    
    display: flex;
    align-items: flex-end;
    justify-content: center;}
.design .list-item .item03 .txt-sm{font-size: .85em; color: #231815;}
.design .list-item .item03 .txt-sm span{line-height: 1;}
.design.box-page .box-inner .logo-page .txt_jp{font-size: 1.7rem;letter-spacing: -0.12em;}

.plan .list-item .item{width: 47%;}
.plan {padding-bottom: 1px;}
@media screen and (max-width: 1000px){
  .design .list-item, .plan .list-item{padding: 0;}
}
@media screen and (max-width: 768px){
.design .list-item, .plan .list-item{padding: 0 20px;}
  .design .list-item .item{width: 100%;}
  .design .list-item .item03{height: unset;}
  .design .list-item .item03 .txt-sm{font-size: 1em;}
  .design .list-item .item.only-pc{display: none;}
  .plan .list-item .item{width: 100%;}
}
@media screen and (max-width: 576px){
  .btn-coming{max-width: 220px;font-size: 1.4rem;
    height: 35px;}
}