@charset "UTF-8";
main {
    background: #FFFFFF;
    color: #212121;
}


/* ========================================
  @media screen and (min-width: 768px), print
======================================== */
@media screen and (min-width: 768px), print {
#kariyamodelhouse {
    max-width: 1920px;
    margin-inline: auto;
    width: 100%;
}

/* header
-------------------------------------*/
.header .inHeader {
    padding: 15px 16px;
}
.header .h-time {
    font-weight: normal;
    font-size: 12px;
    letter-spacing: 0.08em;
    margin: 13px 0 0 11px;
}
.header .inHeader .hnavi {
    position: absolute;
    top: 15px;
    left: 85px;
}
.header .inHeader .h-right {
    padding-right: 44px;
    padding-top: 13px;
}
.header .inHeader .h-right .btn {
    text-align: right;
}
.hamberger {
    display: none;
}
.header .h-tel span:before {
    position: absolute;
    content: "";
    left: 0;
    top: 50%;
    width: 13px;
    height: 14px;
    -webkit-transform: translateY(-48%);
    -moz-transform: translateY(-48%);
    -ms-transform: translateY(-48%);
    -o-transform: translateY(-48%);
    transform: translateY(-48%);
    background: url(../img/icn_tel_w.svg) no-repeat center center;
    background-size: 100% 100%;
}
.header .h-box-tel,
.header .h-box-tel a {
    color: #fff;
}

/* mv
-------------------------------------*/
.mv {
    background: url(../img/mv.jpg)no-repeat center / cover;
    margin-bottom: 150px;
}
.mv .inner {
    width: min(95%, 1390px);
    margin-inline: auto;
    padding: 425px 0 352px;
    position: relative;
}
.mv .inner .ttl-box {
    width: min(95%, 562px);
    margin-left: auto;
}
.mv h1 {
    font-weight: 400;
    font-size: 46px;
    letter-spacing: 0.075em;
    line-height: 1.60869;
    color: #fff;
    margin-bottom: 5px;
}
.mv h2 {
    font-weight: 400;
    font-size: 26px;
    letter-spacing: 0.075em;
    line-height: 2.6923;
    color: #fff;
}
.mv .btn {
    position: absolute;
    bottom: -58px;
    left: 50%;
    transform: translateX(-50%);
}

/* concept
-------------------------------------*/
.concept .top {
    background: url(../img/concept-bg.jpg)no-repeat center bottom/ contain;
}
.concept .top .inner {
    width: min(95%, 1000px);
    margin-inline: auto;
    padding: 0 0 2577px;
}
.concept .enttl {
    font-weight: 400;
    font-size: 30px;
    letter-spacing: 0.075em;
    line-height: 2.3333;
    text-align: center;
    margin-bottom: 27px;
}
.concept h2 {
    font-weight: bold;
    font-size: 48px;
    letter-spacing: 0.075em;
    line-height: 1.458333;
    text-align: center;
    margin-bottom: 51px;
    margin-left: 23px;
}
.concept .lead {
    font-weight: 400;
    font-size: 26px;
    letter-spacing: 0.075em;
    line-height: 1.5834615;
    text-align: center;
    margin-bottom: 12px;
}
.concept .txt {
    font-weight: 400;
    font-size: 18px;
    letter-spacing: 0.075em;
    line-height: 2.22222;
    text-align: center;
}

.concept .bottom {
    position: relative;
    text-align: center;
    padding: 0 0 105px;
}
.concept .bottom h3 {
    font-weight: normal;
    font-size: 30px;
    letter-spacing: 0.075em;
    line-height: 1.8;
    text-align: center;
    position: relative;
    padding: 109px 0 108px;
    display: inline-block;
}
.concept .bottom h3 span{
    font-weight: normal;
    font-size: 20px;
    letter-spacing: 0.075em;
    line-height: 1;
    text-align: center;
    display: block;
    margin-bottom: 13px;
}
.concept .bottom .list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 60px;
    width: min(95%, 1200px);
    margin-inline: auto;
}
.concept .concept-slide{position: relative;z-index: 1;}
.concept .concept-slide .loop {padding-top: 119px;overflow: hidden;padding-bottom: 20px;}
.concept .concept-slide .loop__box {display: flex;width: 100vw;}
.concept .concept-slide .loop__box img {min-width: 115.58vw;object-fit: cover;}
.concept .concept-slide .loop__box img:first-child {animation: loop 50s -25s linear infinite;}
.concept .concept-slide .loop__box img:last-child {animation: loop2 50s linear infinite;}
@keyframes loop {
    0% {
        transform: translateX(100%);
    }
    to {
        transform: translateX(-100%);
    }
  }
  @keyframes loop2 {
    0% {
        transform: translateX(0);
    }
    to {
        transform: translateX(-200%);
    }
  }
  
.concept .bottom .lead {
    font-weight: normal;
    font-size: 30px;
    letter-spacing: 0.075em;
    line-height: 2;
    text-align: center;
    position: relative;
    display: inline-block;
}
.concept .bottom .lead span {
    font-weight: normal;
    font-size: 20px;
    letter-spacing: 0.075em;
    line-height: 2.4;
    text-align: center;
    display: block;
    margin-bottom: 10px;
}


/* point
-------------------------------------*/
.point {
    position: relative;
}
.point .inner {position: relative;}
.point .photo {
    position: relative;
    z-index: 2;
}
.point .ttl-box {
    position: relative;
    z-index: 3;
    top: 10px;
}
.point .num {
    margin-left: 16px;
    margin-bottom: 22px;
}
.point h2 {
    font-weight: normal;
    font-size: 49px;
    letter-spacing: 0.05em;
    line-height: 1.7551020;
}
.point h2 span {
    background: #FFFFFF;
    padding: 0 12px 5px;
}
.point h2 span:nth-of-type(2) {
    position: relative;
    top: 4px;
}
.point .txt {
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 0.05em;
    line-height: 2;
    margin-bottom: 32px;
}
.point .txt:nth-last-of-type(1) {
    margin-bottom: 0;
}
.point .lead {
    font-weight: normal;
    font-size: 20px;
    letter-spacing: 0.05em;
    line-height: 2;
}

/* point01 */
#point01 {
    position: relative;
    top: 105px; 
    height: 0;
    display: block;
}
.point01 {
    margin-bottom: 106px;
    position: relative;
}
.point01 .scrolldown {
    animation: scroll 2s infinite;
    background: #212121;
    height: 160px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 1px;
    z-index: 10;
    top: -80px;
}
@keyframes scroll {
    0% {
        transform: scale(1,0);
        transform-origin: 0 0;
    }
    50% {
        transform: scale(1, 1);
        transform-origin: 0 0;
    }
    51% {
        transform: scale(1, 1);
        transform-origin: 0 100%;
    }
    100% {
        transform: scale(1, 0);
        transform-origin: 0 100%;
    }
}

.point01 .photo {
    max-width: 1920px;
    width: 100%;
    margin-inline: auto;
}
.point01 .inner {
    width: min(95%, 1200px);
    margin-inline: auto;
    padding: 0 0 0;
}
.point01 .ttl-box {
    top: -99px;
    left: 35px;
}
.point01 .inBox01 {
    z-index: 3;
    display: grid;
    grid-template-columns: 690px 1fr;
    gap: 52px;
    position: relative;
    top: -147px;
    width: min(95%, 1100px);
    margin-inline: auto;
    align-items: center;
    margin-bottom: -101px;
}
.point01 .inBox01 .txt-box {
    margin: 94px 0 0;
}
.point01 .inBox01 .txt:nth-of-type(1) {
    margin-bottom: 19px;
}
.point01 .inBox02 .txt {
    font-weight: normal;
    font-size: 18px;
    letter-spacing: 0.05em;
    line-height: 2.4444;
    text-align: center;
    margin-bottom: 14px;
}
.point01 .inBox02 .lead {
    font-weight: normal;
    font-size: 28px;
    letter-spacing: 0.05em;
    line-height: 1.92857;
    text-align: center;
}

/* point02 */
#point02 {
    position: relative;
    top: 105px; 
    height: 0;
    display: block;
}
.point02::before ,
.point02::after {
    content: "";
    display: block;
    width: 83.3333%;
    background: #F2F2F2;
    position: absolute;
    left: 0;
    pointer-events: none;
    z-index: 1;
}
.point02::before {
    top: 0;
    height: 1005px;
}
.point02::after {
    bottom: 184px;
    height: 443px;
}
.point02 .inner {
    width: min(95%, 1652px);
    margin-left: auto;
    padding: 117px 0 120px;
}
.point02 .label {
    padding: 88px 0 0;
}
.point02 .photo{
    text-align: right;
    position: relative;
    top: -708px;
    margin-bottom: -708px;
}
.point02 .inBox01 {
    z-index: 3;
    display: grid;
    grid-template-columns: 370px 1fr;
    gap: 60px;
    width: min(95%, 1050px);
    margin-left: 191px;
    position: relative;
    top: -88px;
    margin-bottom: -86px;
}
.point02 .inBox01 .txt-box {
    margin: 138px 0 -28px;
}
.point02 .inBox01 .photo02 {
    margin: -62px 0 0;
}
.point02 .inBox02 {
    z-index: 3;
    display: grid;
    grid-template-columns: 590px 1fr;
    gap: 80px;
    width: min(95%, 1100px);
    margin-left: 142px;
    position: relative;
    top: -61px;
    margin-bottom: -61px;
}
.point02 .inBox02 .txt-box {
    margin: 227px 0 0;
}
.point02 .inBox02 .lead {
    margin:  -9px 0 0;
}

/* point03 */
#point03 {
    position: relative;
    top: 105px; 
    height: 0;
    display: block;
}
.point03 {
    background: #F2F2F2;
    text-align: center;
}
.point03 .ttl-box {
    position: relative;
    text-align: center;
    display: inline-block;
    padding: 83px 0 0 0;
    margin-bottom: 32px;
}
.point03 .num {
    margin-left: 0;
    margin-bottom: 17px;
}
.point03 h2 {
    margin-bottom: 29px;
}
.point03 .ttl-box .txt {
    margin-bottom: 40px;
}
.point03 .photo {
    max-width: 1920px;
    width: 100%;
    margin-inline: auto;
}
.point03 .inBox01 {
    width: min(95%, 1180px);
    margin-inline: auto;
    display: grid;
    grid-template-columns: 642px 1fr;
    gap: 77px;
    padding: 68px 0 4px;
    text-align: left;
}
.point03 .inBox01 .txt-box {
    padding: 0 0 0 39px;
}
.point03 .inBox01 .photo02 {
    margin-right: 41px;
    position: relative;
    top: 2px;
}
.point03 .inBox02 {
    width: min(95%, 1100px);
    margin-inline: auto;
    display: grid;
    grid-template-columns: 591px 603px;
    text-align: left;
    padding: 0px 0 130px;
}
.point03 .inBox02 .txt-box {
    position: relative;
    left: -33px;
    margin-top: 80px;
}
.point03 .inBox02 .txt-box h3 {
    font-weight: normal;
    font-size: 20px;
    letter-spacing: 0.05em;
    line-height: 2.2;
    margin-bottom: 30px;
}
.point03 .inBox02 .txt-box h3 span {
    background: #FFFFFF;
    padding: 5px 10px;
}
.point03 .inBox02 .txt-box .txt {
    margin-left: 12px;
    margin-bottom: 27px;
    margin-right: 55px;
}

/* bnr-box
-------------------------------------*/
.bnr-box {
    width: min(95%, 1100px);
    margin-inline: auto;
    padding: 151px 0 0;
}
.bnr-box .item {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 44px;
    align-items: flex-end;
}

/* floor
-------------------------------------*/
.floor {
    background: #F2F2F2;
    margin-bottom: 139px;
}
.floor .inner{
    width: min(95%, 1280px);
    margin-inline: auto;
    padding: 80px 0 183px;
}
.floor .ttl {
    font-weight: normal;
    font-size: 30px;
    letter-spacing: 0.05em;
    line-height: 2.730769;
    text-align: center;
    margin-bottom: 8px;
}
.floor .ttl-subt{
    text-align: center;
    font-size: 16px; line-height: 1.6; letter-spacing: 1px;
    margin:0px 0px 50px 0px;
}

.floor .img-box {
    position: relative;
    margin-bottom: 135px;
}
.floor .img-box .en{
    position: absolute;
    top: -45px;
    left: -82px;
}
.pin {
    position: absolute;
    left: var(--x);
    top: var(--y);
    transform: translate(-50%, -50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
}
.pin img {
    width: 58px;  
    height: auto;
    display: block;
}
/* モーダル */
.modal {
    position: fixed;
    inset: 0;
    display: none;
    /* overflow-y: auto; */
    height: 100dvh;            
    /* -webkit-overflow-scrolling: touch; */
    z-index: 100;
}
  .modal.is-open {
    display: grid;
    place-items: center;
}
  .modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(29,29,29,.9);
    min-height: 1120px;
}
  .modal__box {
    position: relative;
    width: 1280px;
}
  .modal__close {
    position: absolute;
    right: -263px;
    top: 39px;
}
.modal__slider {
    margin: 51px 0 0!important;
}
.modal__slider .txt {
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 0.05em;
    line-height: 1.75;
    color: #FFFFFF;
    width: min(95%,1000px);
    margin-inline: auto;
}
  .modal__slider .photo {
    margin-bottom: 26px;
}
  .modal__slider .photo img {
    width: 100%;
    height: 560px;
    display: block;
    object-fit: contain;
}
  
  .slick-list {
    height: auto!important;
  }
  .slide-arrow {
    position: absolute;
    top: 49%;
    transform: translateY(-50%);
    z-index: 10;
    width: 80px;
    height: 80px;
    cursor: pointer;
    left: 50%;
  }
  .prev-arrow {
    margin-left: -781px;
  }
  .next-arrow {
    margin-left: 699px;
  }
  .slide-dots {
    margin: 50px  0 0;
    padding: 0;
    text-align: center;
  }
  .slide-dots li {
    display: inline-block;
    margin: 0 30px;
  }
  .slide-dots li button {
    position: relative;
    text-indent: -9999px;
  }
  .slide-dots li button::before {
    background-image: url(../img/slide-dots.svg);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    cursor: pointer;
    width: 20px;
    height: 20px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
  }
  .slide-dots li.slick-active button::before {
    background-image: url(../img/slide-dots-active.svg);
    background-repeat: no-repeat;
    background-size: contain;
  }
  button {
    background: none;
    border: none;
    outline: none;
    padding: 0 7px;
  }

/* ttl共通
-------------------------------------*/
.sec-ttl {
    font-weight: 400;
    font-size: 44px;
    letter-spacing: 0.05em;
    line-height: 1.590909;
    position: relative;
    text-align: center;
    margin-bottom: 69px;
}
.sec-ttl::before,
.sec-ttl::after {
    content: "";
    display: block;
    width: 490px;
    height: 1px;
    background: #212121;
    position: absolute;
    top: 56%;
    transform: translateY(-50%);
}
.sec-ttl::before {
    left: 0;
}
.sec-ttl::after {
    right: 0;
}

/* gallery
-------------------------------------*/
.gallery .list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 62px 40px;
}
.gallery .list li .ttl-wrap {
    display: grid;
    grid-template-columns: 22px 1fr;
    gap: 10px;
    align-items: center;
    border-bottom: 1px solid #212121;
    padding: 0 0 15px;
    margin-bottom: 23px;
}
.gallery .list li .ttl-wrap h3 {
    font-weight: normal;
    font-size: 22px;
    letter-spacing: 0.05em;
}
.gallery .list li .photo {
    margin-bottom: 10px;
    position: relative;
}
.gallery .list li .photo::after {
    position: absolute;
    content: "";
    background: url(../img/open-icon.svg)no-repeat;
    background-size: contain;
    width: 25px;
    height: 25px;
    bottom: 0;
    right: 0;
}
.gallery .list li .txt {
    font-weight: normal;
    font-size: 14px;
    letter-spacing: 0.05em;
    line-height: 2;
}

/* room-tour
-------------------------------------*/
.room-tour .inner {
    width: min(95%, 1280px);
    margin-inline: auto;
    padding: 145px 0 0;
}
.room-tour .sec-ttl {
    margin-bottom: 40px;
}
.room-tour .sec-ttl::before,
.room-tour .sec-ttl::after {
    width: 460px;
}
.room-tour .ytArea {
    width: min(95%, 880px);
    margin-inline: auto;
}
.room-tour .ytArea iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
}
.room-tour .bnr-box {
    padding: 155px 0 181px;
}
.room-tour .bnr-box li:nth-child(3) {
    grid-column: 1 / -1;
}
.room-tour .bnr-box .item {
    gap: 26px 44px;
    margin-bottom: 12px;
}
.room-tour .desc {
    font-weight: normal;
    font-size: 14px;
    letter-spacing: 0.05em;
    line-height: 2;
}

/* access
-------------------------------------*/
.access .inner {
    width: min(95%, 1280px);
    margin-inline: auto;
}
.access .sec-ttl {
    margin-bottom: 40px;
}
.access .sec-ttl::before,
.access .sec-ttl::after {
    width: 510px;
}
.access .map {
    margin-bottom: 21px;
    height: 640px;
}
.access .map iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
}
.access .address {
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 0.075em;
    text-align: center;
}


/* contact
-------------------------------------*/
#kariyamodelhouse .cm-form {
    margin-top: 155px;
}
#kariyamodelhouse .cm-form .form-blocks.bg-gray {
    padding: 0 0 78px;
}
#kariyamodelhouse .contact {
    background: #F2F2F2;
}
#kariyamodelhouse .contact .inner {
    width: min(95%, 1280px);
    margin-inline: auto;
    background: #FFFFFF;
    padding: 70px 0 80px;
}
#kariyamodelhouse .contact .wcm03 {
    position: relative;
    max-width: 1000px;
    padding: 0;
}
#kariyamodelhouse .contact .ttl-box {
    position: relative;
    width: min(95%, 300px);
    margin-inline: auto;
    padding: 123px 0 56px;
}
#kariyamodelhouse .contact h2 {
    font-weight: normal;
    font-size: 40px;
    letter-spacing: 0.05em;
    line-height: 1.75;
    text-align: center;
    margin-bottom: 10px;
    position: relative;
    z-index: 2;
}
#kariyamodelhouse .contact .en {
    position: absolute;
    content: "";
    width: 180px;
    height: 74px;
    top: 94px;
    left: -19px;
}
#kariyamodelhouse .contact h3 {
    font-weight: normal;
    font-size: 20px;
    letter-spacing: 0.08em;
    text-align: center;
}
#kariyamodelhouse .contact .form-note {
    font-weight: normal;
    font-size: 14px;
    letter-spacing: 0.08em;
    line-height: 2.142857;
    text-align: left;
    margin: 0;
    width: min(95%,605px);
    margin-inline: auto;
}
#kariyamodelhouse .cm-form .box-form{
    margin-top: 29px;
}
#kariyamodelhouse .form-group-title .ttl:before {
    content: none;
}
#kariyamodelhouse .form-group-title .ttl.is-required:before {
    background: #C13824;
    font-size: 13px;
    font-weight: 400;
    line-height: 2.2;
    width: 50px;
    height: 30px;
    right: 14px;
    left: initial; 
    content: "必須";
    background: #C13924;
}
#kariyamodelhouse .form-group-title {
    font-weight: normal;
    font-size: 17px;
    letter-spacing: 0.05em;
    line-height: 2.235294;
    text-align: left;
    padding: 0 10px 1px 25px;
    max-width: 384px;
    width: 40%;
}

#kariyamodelhouse .form-group .day-subtxt{
 font-size: 13px; line-height: 1.6; letter-spacing: 1px;
 text-align: left; padding: 25px 0 0 75px;
}

#kariyamodelhouse .contact .form-group {
    border-bottom: 1px solid #DDDDDD;
    padding: 29px 0 30px;
}
#kariyamodelhouse .contact .form-group:first-child {
    padding: 29px 0 30px;
    border-top: 1px solid #DDDDDD;
}
#kariyamodelhouse .contact .form-group:first-child:last-child {
    align-items: flex-start;
}
#kariyamodelhouse .form-group-content {
    width: 54.6%;
}
#kariyamodelhouse .contact .form-group:first-child input {
    width: 320px;
}
#kariyamodelhouse .contact .form-group:nth-child(2) input {
    width: 320px;
}
#kariyamodelhouse .box-datetimepicker .input-date {
    height: 50px;
    border-radius: 5px;
    background: #f2f2f2;
    border: 1px solid #e6e6e6;
    color: #999999;
}
#kariyamodelhouse .box-select select {
    height: 50px;
    border-radius: 5px;
    background: #f2f2f2;
    border: 1px solid #e6e6e6;
    color: #999999;
}
#kariyamodelhouse .input-text {
    /* width: 320px; */
    height: 50px;
    border-radius: 5px;
    background: #f2f2f2;
    border: 1px solid #e6e6e6;
    color: #999999;
}
#kariyamodelhouse .input-area {
    height: 220px;
    border-radius: 5px;
    background: #f2f2f2;
    border: 1px solid #e6e6e6;
    color: #999999;
}
#kariyamodelhouse .form-policy {
    height: 160px;
    background: #f2f2f2;
    border: 1px solid #ddd;
    font-weight: normal;
    font-size: 14px;
    letter-spacing: 0.05em;
    line-height: 1.571428;
    margin-top: 46px;
    padding: 32px 36px;
}
#kariyamodelhouse .form-policy .policy-list{
    margin-top: 10px;
}
#kariyamodelhouse .form-action .btn-agree {
    max-width: 380px;
    margin: 0 auto 35px;
}
#kariyamodelhouse .form-action {
    margin-top: 46px;
}
#kariyamodelhouse .form-action .btn-agree label {
    font-weight: normal;
    font-size: 17px;
    letter-spacing: 0.05em;
    line-height: 2.235294;
    border-bottom: 1px solid #212121;
    border-top: none;
    border-left: none;
    border-right: none;
    padding: 0 0 10px;
}
#kariyamodelhouse .form-action .btn-agree label span {
    margin-left: 0;
}
#kariyamodelhouse .cm-btn02 {
    max-width: 500px;
    font-weight: normal;
    font-size: 20px;
    letter-spacing: 0.05em;
    line-height: 2;
    text-align: center;
    color: #fff;
    padding: 27px 22px 32px 0;
}
#kariyamodelhouse .form-action .submit-button:after {
    background: url(../img/submit-arrow.svg)no-repeat;
    background-size: contain;
    width: 17px;
    height: 13px;
    right: 51px;
}

/* bnr04
-------------------------------------*/
.bnr04 {
    padding: 90px 0 145px;
    text-align: center;
}

/* event
-------------------------------------*/
.event {
    width: min(95%, 1280px);
    margin-inline: auto;
    margin: 0 auto 100px auto;
}
.event .sec-ttl {
    margin-bottom: 12px;
}
.event .sec-ttl::before,
.event .sec-ttl::after {
    width: 528px;
}
.event .subt {
    font-weight: normal;
    font-size: 20px;
    letter-spacing: 0.08em;
    text-align: center;
        margin:0 0 20px 0;
}

#exhibition_kariyamodelhouse .cm-btn02 {
    max-width: 500px;
    font-weight: normal;
    font-size: 20px;
    letter-spacing: 0.05em;
    line-height: 2;
    text-align: center;
    color: #fff;
    padding: 27px 22px 32px 0;
}
#exhibition_kariyamodelhouse .form-action .submit-button:after {
    background: url(../img/submit-arrow.svg)no-repeat;
    background-size: contain;
    width: 17px;
    height: 13px;
    right: 51px;
}


/* floating bnr
-------------------------------------*/
.side-fix {
    display: none;
}
.fix-list {
    display: none;
}
.float-bnr{
    position: fixed;
    top: 80px;
    right: -10px;
    z-index: 400;
}
.float-bnr__img{
    display: block;
    width: 100%;
    height: auto;
}

/*スマホ用メニュー*/
.sp-fix-list {
    display: none;
}
  

.form-step {
    padding: 30px 0px 20px 0px !important;
}

}

/* ========================================
@media screen and (min-width:768px) and (max-width:1000px) 
======================================== */
@media screen and (min-width:768px) and (max-width:1000px) {
/* header
-------------------------------------*/
.header .h-time {margin: 0;font-size: 10px;}
.header .inHeader .h-right .btn img {
    width: 26.8vw;
}


}

/* ========================================
@media screen and (min-width:768px) and (max-width:1840px) 
======================================== */
@media screen and (min-width:768px) and (max-width:1840px) {
    .concept .top .inner {
        width: 61.348vw;
        padding: 0 0 140.054vw;
    }
}

/* ========================================
@media screen and (min-width:768px) and (max-width:1440px) 
======================================== */
@media screen and (min-width:768px) and (max-width:1440px) {
/* concept
-------------------------------------*/
.concept .enttl {
    font-size: 2.083vw;
    margin-bottom: 1.88vw;
}
.concept h2 {
    font-size: 3.333vw;
    margin-bottom: 3.54vw;
    margin-left: 1.6vw;
}
.concept .lead {
    font-size: 1.806vw;
    margin-bottom: 0.83vw;
}
.concept .txt {
    font-size: 1.25vw;
}

}

/* ========================================
@media screen and (min-width:768px) and (max-width:1540px) 
======================================== */
@media screen and (min-width:768px) and (max-width:1540px) {
.concept .bottom {
    padding: 0 0 7.29vw;
}
.concept .bottom::before {
    width: 13.182vw;
    height: 5.779vw;
    top: -5.649vw;
}
.concept .bottom h3 {
    font-size: 1.948vw;
    padding: 7.57vw 0 7.50vw;
}
.concept .bottom h3::before {
    width: 16.429vw;
    height: 16.494vw;
    top: -1.104vw;
    left: -19.805vw;
}
.concept .bottom h3 span{
    font-size: 1.299vw;
    margin-bottom: 0.844vw;
}
.concept .bottom .lead {
    font-size: 1.948vw;
}
.concept .bottom .lead span {
    font-size: 1.299vw;
    margin-bottom: 0.69vw;
}
}

/* ========================================
@media screen and (min-width:768px) and (max-width:1700px) 
======================================== */
@media screen and (min-width:768px) and (max-width:1700px) {
/* point
-------------------------------------*/
.point .ttl-box {
    top: 0.588vw;
}
.point .num {
    margin-left: 0.941vw;
    margin-bottom: 1.294vw;
}
.point h2 {
    font-size: 2.882vw;
}
.point h2 span {
    padding: 0 0.706vw 0.294vw;
}
.point h2 span:nth-of-type(2) {
    top: 0.235vw;
}
.point .txt {
    font-size: clamp(10px, calc(12px + 7 * ((100vw - 768px) / 1152)), 16px);
    margin-bottom: 1.882vw;
}
.point .lead {
    font-size: clamp(15px, calc(11px + 9 * ((100vw - 768px) / 1152)), 20px);
}
/* point01 */
#point01 {
    top: 6.176vw; 
}
.point01 {
    margin-bottom: 6.235vw;
}
.point01 .scrolldown {
    height: 9.412vw;
    left: 50%;
    width: 0.059vw;
    z-index: 10;
    top: -4.706vw;
}

.point01 .photo {

}
.point01 .inner {
    width: 75.29vw;
}
.point01 .ttl-box {
    top: -5.824vw;
    left: 2.059vw;
}
.point01 .inBox01 {
    grid-template-columns: 40.59vw 1fr;
    gap: 3.059vw;
    top: -8.647vw;
    width: 64.71vw;
    margin-bottom: -5.941vw;
}
.point01 .inBox01 .txt-box {
    margin: 5.529vw 0 0;
}
.point01 .inBox01 .txt:nth-of-type(1) {
    margin-bottom: 1.118vw;
}
.point01 .inBox02 .txt {
    font-size: clamp(10px, calc(12px + 7 * ((100vw - 768px) / 1152)), 16px);
    margin-bottom: 0.824vw;
}
.point01 .inBox02 .lead {
    font-size: 1.647vw;
}

/* point02 */
#point02 {
    top: 6.176vw; 
}
.point02::before {
    height: 59.118vw;
}
.point02::after {
    bottom: 5.824vw;
    height: 26.059vw;
}
.point02 .inner {
    width: 97.18vw;

    padding: 6.882vw 0 7.059vw;
}
.point02 .label {
    padding: 5.176vw 0 0;
}
.point02 .label img {
    width: 23.71vw;
}
.point02 .photo{
    top: -41.647vw;
    margin-bottom: -41.647vw;
}
.point02 .photo img {
    width: 73.35vw;
}
.point02 .inBox01 {
    grid-template-columns: 21.76vw 1fr;
    gap: 3.529vw;
    width: 61.76vw;
    margin-left: 11.235vw;
    top: -5.176vw;
    margin-bottom: -5.059vw;
}
.point02 .inBox01 .txt-box {
    margin: 8.118vw 0 -1.647vw;
}
.point02 .inBox01 .photo02 {
    margin: -3.647vw 0 0;
}
.point02 .inBox02 {
    grid-template-columns: 34.71vw 1fr;
    gap: 4.706vw;
    width: 64.71vw;
    margin-left: 8.353vw;
    top: 1.412vw;
    margin-bottom: -3.588vw;
}
.point02 .inBox02 .txt-box {
    margin: 13.353vw 0 0;
}
.point02 .inBox02 .lead {
    margin:  -0.529vw 0 0;
}

/* point03 */
#point03 {
    top: 6.176vw; 
}
.point03 .ttl-box {
    padding: 4.882vw 0 0 0;
    margin-bottom: 1.882vw;
}
.point03 .num {
    margin-left: 0;
    margin-bottom: 1vw;
}
.point03 h2 {
    margin-bottom: 1.706vw;
}
.point03 .ttl-box .txt {
    margin-bottom: 2.353vw;
}
.point03 .photo {

}
.point03 .inBox01 {
    width: 69.41vw;
    grid-template-columns: 37.76vw 1fr;
    gap: 4.529vw;
    padding: 4vw 0 0.235vw;
}
.point03 .inBox01 .txt-box {
    padding: 0 0 0 2.294vw;
}
.point03 .inBox01 .photo02 {
    margin-right: 2.412vw;
    top: 0.118vw;
}
.point03 .inBox02 {
    width: 64.71vw;
    grid-template-columns: 34.765vw 35.471vw;
    padding: 0px 0 7.647vw;
}
.point03 .inBox02 .txt-box {
    left: -1.941vw;
    margin-top: 4.706vw;
}
.point03 .inBox02 .txt-box h3 {
    font-size: clamp(12px, calc(12px + 7 * ((100vw - 768px) / 1152)), 20px);
    margin-bottom: 1.765vw;
}
.point03 .inBox02 .txt-box h3 span {
    padding: 0.294vw 0.588vw;
}
.point03 .inBox02 .txt-box .txt {
    margin-left: 0.706vw;
    margin-bottom: 1.588vw;
    margin-right: 3.235vw;
}

}

/* ========================================
@media screen and (min-width:768px) and (max-width:1440px)
======================================== */
@media screen and (min-width:768px) and (max-width:1440px) {
/* floor
-------------------------------------*/
.floor {
    margin-bottom: 9.653vw;
}
.floor .img-box .en{
    position: absolute;
    top: -3.125vw;
    left: -2.694vw;
}
.floor .img-box .en img {
    width: 27.083vw;
}

}


/* ========================================
@media screen and (min-width:768px) and (max-width:1919px)
======================================== */
@media screen and (min-width:768px) and (max-width:1919px) {
/* モーダル */
.modal {
    position: fixed;
    inset: 0;
    display: none;
    overflow-y: auto;
    height: 100dvh;            
    -webkit-overflow-scrolling: touch;
    z-index: 1000;
}
  .modal.is-open {
    display: grid;
    place-items: center;
}
  .modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(29,29,29,.9);
    min-height: 58.364vw;
}
  .modal__box {
    position: relative;
    width: 66.701vw;
}
  .modal__close {
    position: absolute;
    right: -13.705vw;
    top: 2.032vw;
}
.modal__slider {
    margin: 51px 0 0!important;
}
.modal__slider .txt {
    font-weight: normal;
    /* font-size: clamp(0.875rem, 0.792rem + 0.17vw, 1rem); */
    letter-spacing: 0.05em;
    line-height: 1.75;
    color: #FFFFFF;
    width: min(95%,1000px);
    margin-inline: auto;
}
  .modal__slider .photo {
    margin-bottom: 1.355vw;
}
  .modal__slider .photo img {
    width: 100%;
    height: 29.182vw;
    display: block;
    object-fit: contain;
}
  
  .slick-list {
    height: auto;
  }
  .slide-arrow {
    position: absolute;
    top: 49%;
    transform: translateY(-50%);
    z-index: 10;
    width: 4.169vw;
    height: 4.169vw;
    cursor: pointer;
    left: 50%;
  }
  .prev-arrow {
    margin-left: -40.698vw;
  }
  .next-arrow {
    margin-left: 36.425vw;
  }
  .slide-dots {
    margin: 2.606vw  0 0;
    padding: 0;
    text-align: center;
  }
  .slide-dots li {
    display: inline-block;
    margin: 0 1.563vw;
  }
  .slide-dots li button {
    position: relative;
    text-indent: -521.053vw;
  }
  .slide-dots li button::before {
    background-image: url(../img/slide-dots.svg);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    cursor: pointer;
    width: 1.042vw;
    height: 1.042vw;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
  }
  .slide-dots li.slick-active button::before {
    background-image: url(../img/slide-dots-active.svg);
    background-repeat: no-repeat;
    background-size: contain;
  }
  button {
    background: none;
    border: none;
    outline: none;
    padding: 0 0.365vw;
  }

}

/* ========================================
@media screen and (min-width:768px) and (max-width:1440px)
======================================== */
@media screen and (min-width:768px) and (max-width:1440px) {
/* ttl
-------------------------------------*/
.sec-ttl {
    font-size: 3.056vw;
    margin-bottom: 4.792vw;
}
.sec-ttl::before,
.sec-ttl::after {
    width: 34.028vw;
    height: 0.069vw;
}

.room-tour .sec-ttl {
    margin-bottom: 2.778vw;
}
.room-tour .sec-ttl::before,
.room-tour .sec-ttl::after {
    width: 31.944vw;
}

.access .sec-ttl {
    margin-bottom: 2.778vw;
}
.access .sec-ttl::before,
.access .sec-ttl::after {
    width: 35.417vw;
}

.event .sec-ttl {
    margin-bottom: 0.833vw;
}
.event .sec-ttl::before,
.event .sec-ttl::after {
    width: 36.667vw;
}
}


/* ========================================
@media screen and (max-width: 767px)
======================================== */
@media screen and (max-width: 767px) {
/* header
-------------------------------------*/
.header .inHeader .h-logo {
    width: 34.5vw;
    padding: 4vw 0 0 0;
    position: relative;
    left: 5vw;
}
.header .inHeader .h-logo img {
    width: auto;
}

/* mv
-------------------------------------*/
.mv {
    background: url(../img/mv_sp.jpg)no-repeat center / cover;
    margin-bottom: 34.8vw;
}
.mv .inner {
    width: 94.205vw;
    margin-inline: auto;
    padding: 22vw 0 95.5vw;
    position: relative;
}
.mv .inner .ttl-box {
    margin: 0 0 0 4vw;
}
.mv h1 {
    font-weight: 400;
    font-size:6.763vw;
    letter-spacing: 0.075em;
    line-height: 1.55;
    color: #fff;
    margin-bottom: 2.5vw;
}
.mv h2 {
    font-weight: 400;
    font-size:3.865vw;
    letter-spacing: 0.075em;
    line-height: 1;
    color: #fff;
}
.mv .btn {
    position: absolute;
    bottom: -21vw;
    left: 50%;
    transform: translateX(-50%);
    width: 98.6vw;
}


/* concept
-------------------------------------*/
.concept .top {
    background: url(../img/concept-bg_sp.jpg)no-repeat center bottom/ contain;
}
.concept .top .inner {
    margin-inline: auto;
    padding: 20vw 0 142.5vw;
}
.concept .enttl {
    font-weight: 400;
    font-size:7.729vw;
    letter-spacing: 0.075em;
    line-height: 1;
    text-align: center;
    margin-bottom: 5.7vw;
}
.concept h2 {
    font-weight: bold;
    font-size: 6.039vw;
    letter-spacing: 0.075em;
    line-height: 1.84;
    text-align: center;
    margin-bottom: 3vw;
    margin-left: 4.2vw;
}
.concept .lead {
    font-weight: 400;
    font-size:4.831vw;
    letter-spacing: 0.075em;
    line-height: 1.8;
    text-align: center;
    margin-bottom: 5.7vw;
    margin-left: 5vw;
}
.concept .txt {
    font-weight: 400;
    font-size: 3.623vw;
    letter-spacing: 0.075em;
    line-height: 2.1333;
    text-align: left;
    width: 89.375vw;
    margin-inline: auto;
    padding-left: 2vw;
}


.concept .bottom {
    position: relative;
    text-align: center;
    padding: 0 0 35.8vw;
}
.concept .bottom::before {
    content: "";
    display: block;
    width: 21.5vw;
    height: 9.43vw;
    background: url(../img/concept-bottom-bg-top.svg)no-repeat;
    background-size: contain;
    position: absolute;
    top: -9vw;
    left: 50%;
    transform: translateX(-50%);
}
.concept .bottom h3 {
    font-weight: normal;
    font-size:5.797vw;
    letter-spacing: 0.075em;
    line-height: 1.6666;
    text-align: center;
    position: relative;
    padding: 16.8vw 0 0;
    display: inline-block;
    margin-bottom: 19.5vw;
}
.concept .bottom h3::before {
    content: "";
    display: block;
    width: 53.4vw;
    height: 53.9vw;
    background: url(../img/no1.png)no-repeat;
    background-size: contain;
    position: absolute;
    top: 5.5vw;
    left: 50%;
    transform: translateX(-50%);
}
.concept .bottom h3 span{
    font-weight: normal;
    font-size:3.865vw;
    letter-spacing: 0.075em;
    line-height: 1;
    text-align: center;
    display: block;
    margin-bottom: 2vw;
    padding-left: 4vw;
}
.concept .bottom .list {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 9.6vw;
    width: 86.96vw;
    margin-inline: auto;
}
.concept .concept-slide{position: relative;z-index: 1;}
.concept .concept-slide .loop {padding-top: 17vw;overflow: hidden;padding-bottom: 7.8vw;}
.concept .concept-slide .loop__box {display: flex;width: 100vw;}
.concept .concept-slide .loop__box img {min-width: 198.12vw;object-fit: cover;}
.concept .concept-slide .loop__box img:first-child {animation: loop 50s -25s linear infinite;}
.concept .concept-slide .loop__box img:last-child {animation: loop2 50s linear infinite;}
@keyframes loop {
    0% {
        transform: translateX(100%);
    }
    to {
        transform: translateX(-100%);
    }
  }
  @keyframes loop2 {
    0% {
        transform: translateX(0);
    }
    to {
        transform: translateX(-200%);
    }
  }
  
.concept .bottom .lead {
    font-weight: normal;
    font-size:5.797vw;
    letter-spacing: 0.075em;
    line-height: 1.66666;
    text-align: center;
    position: relative;
    display: inline-block;
    margin: 0;
}
.concept .bottom .lead span {
    font-weight: normal;
    font-size:3.865vw;
    letter-spacing: 0.075em;
    line-height: 2;
    text-align: center;
    display: block;
    margin-bottom: 3.2vw;
}

/* point
-------------------------------------*/
.point {
    position: relative;
}
.point .inner {position: relative;}
.point .photo {
    position: relative;
    z-index: 2;
    margin-top: -6.2vw;
    margin-bottom: 5.2vw;
}
.point .ttl-box {
    width: 89.375vw;
    margin-inline: auto;
    position: relative;
    z-index: 3;
}
.point .num {
    margin-left: 4vw;
    margin-bottom: 3vw;
}
.point h2 {
    font-weight: normal;
    font-size:6.28vw;
    letter-spacing: 0.05em;
    line-height: 2;
}
.point h2 span {
    background: #FFFFFF;
    padding: 1vw 2vw;
}
.point h2 span:nth-of-type(2) {
}
.point .txt {
    font-weight: normal;
    font-size:3.382vw;
    letter-spacing: 0.05em;
    line-height: 2;
    margin-bottom: 7vw;
}
.point .txt:nth-last-of-type(1) {
    margin-bottom: 0;
}
.point .lead {
    font-weight: normal;
    font-size:4.348vw;
    letter-spacing: 0.05em;
    line-height: 2;
}
.point .inBox01 {
    display: grid;
    width: 89.375vw;
    margin-inline: auto;
    margin-bottom: 13.5vw;
    position: relative;
}
.point .inBox01 .txt-box {
    order: 1;
    margin-bottom: 5.2vw;
}
.point .inBox01 .photo02 {
    order: 2;
}
.point .inBox02 {
    display: grid;
    position: relative;
}
.point .inBox02 .photo02 {
    margin-bottom: 5vw;
}
.point .inBox02 .txt-box {
    margin-bottom: 7vw;
    width: 89.375vw;
    margin-inline: auto;
    position: relative;
    z-index: 2;
}
.point .inBox02 .photo03 {
    margin-bottom: 5vw;
    width: 89.375vw;
    margin-inline: auto;
    position: relative;
    z-index: 2;
}
/* point01 */
.point01 {
    margin-bottom: 11.5vw;
}
.point01 .scrolldown {
    animation: scroll 2s infinite;
    background: #212121;
    height: 24.15vw;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 0.2vw;
    z-index: 10;
    top: -28vw;
}
@keyframes scroll {
    0% {
        transform: scale(1,0);
        transform-origin: 0 0;
    }
    50% {
        transform: scale(1, 1);
        transform-origin: 0 0;
    }
    51% {
        transform: scale(1, 1);
        transform-origin: 0 100%;
    }
    100% {
        transform: scale(1, 0);
        transform-origin: 0 100%;
    }
}
.point01 {
    display: grid;
    margin-bottom: 13.5vw;
}
.point01 .inner {
    display: contents;
}
.point01 .ttl-box {
    order: 1;
    width: 90vw;
}
.point01 .photo {
    order: 2;
}
.point01 .inBox01 {
    order: 3;
    margin-bottom: 5vw;
}
.point01 .inBox02 {
    order: 4;
    width: 89.375vw;
    margin-inline: auto;
}
.point01 .inBox02 .photo03 {
    order: 2;
}
.point01 .lead {
    margin: -1.2vw 0 1vw;
}



/* point02 */
.point02::before  {
    content: "";
    display: block;
    width: 100%;
    background: #F2F2F2;
    position: absolute;
    left: 0;
    pointer-events: none;
    z-index: 1;
}
.point02::before {
    top: 0;
    height: 239.13vw;
}
.point02 .ttl-box {
    display: contents;
}
.point02 .num {
    order: 1;
    position: relative;
    width: 89.375vw;
    margin-inline: auto;
    margin-left: 9vw;
}
.point02 h2 {
    order: 2;
    position: relative;
    width: 89.375vw;
    margin-inline: auto;
}
.point02 .inner {
    padding: 15vw 0 12vw;
    display: grid;
    position: relative;
    z-index: 2;
}
.point02 .label {
    padding: 2vw 0 0 2vw;
    order: 4;
    position: relative;
    text-align: center;
}
.point02 .label img {
    width: 86.23vw;
}
.point02 .photo {
    order: 3;
    position: relative;
    margin-top: 6.5vw;
}
.point02 .inBox02::before {
    content: "";
    display: block;
    width: 100%;
    background: #F2F2F2;
    position: absolute;
    left: 0;
    pointer-events: none;
    z-index: 1;
    top: -9.5vw;
    height: 114.1vw;
}
.point02 .inBox02 .lead{
    margin: -1vw 0 0;
    line-height: 1.777;
}
.point02 .inBox01 {
    order: 4;
    padding: 11.8vw 0 0;
}
.point02 .inBox02 {
    order: 5;
}



/* point03 */
.point03 {
    position: relative;
    padding: 21.1vw 0 3vw;
}
.point03::before {
    position: absolute;
    top: 0;
    left: 0;
    background: #F2F2F2;
    width: 100%;
    height: 535vw;
    content: "";
    pointer-events: none;
}
.point03 .ttl-box {
    position: relative;
}
.point03 h2 {
    margin-bottom: 4vw;
}
.point03 .photo {
    margin: 6vw 0 0;

}
.point03 .photo img {

}
.point03 .inBox01 {
    width: 94.205vw;
    margin-bottom: 5vw;
}
.point03 .inBox01 .txt-box {
    display: contents;
}
.point03 .inBox01 .txt-box .txt:nth-of-type(2) {
    order: 1;
    background: #F2F2F2;
    position: relative;
    top: -4.5vw;
    z-index: 3;
    padding: 3.2vw 2.5vw;
    margin-bottom: -5vw;
}
.point03 .inBox01 .txt-box .txt:nth-of-type(3) {
    order: 3;
    width: 89.375vw;
    margin-inline: auto;
    margin-bottom: 0.5vw;
}
.point03 .inBox01 .photo02 {
    order: 2;
    width: 89.375vw;
    margin-inline: auto;
    margin-bottom: 5.7vw;
}
.point03 .inBox02 .txt-box h3 {
    font-weight: normal;
    font-size:4.348vw;
    letter-spacing: 0.05em;
    line-height: 2.22222;
    margin-bottom: -5.5vw;
    position: relative;
    top: -9.5vw;
}
.point03 .inBox02 .txt-box h3 span {
    background: #FFFFFF;
    padding: 1vw 2vw 0 0vw;
}

/* bnr-box
-------------------------------------*/
.bnr-box {
    width: 94.205vw;
    margin-inline: auto;
    padding: 18.2vw 0 0vw;
}
.bnr-box .item {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 5vw;
}

/* floor
-------------------------------------*/
.floor {
    background: #F2F2F2;
}
.floor .inner{
    padding: 10.5vw 0 2vw;
}
.floor .ttl {
    font-weight: normal;
    font-size:4.348vw;
    letter-spacing: 0.05em;
    line-height: 1.7777;
    text-align: center;
    margin-bottom: 3vw;
}

.floor .ttl-subt{
    text-align: center;
    font-size: 3.14vw; line-height: 1.6; letter-spacing: 0.25vw;
    margin:0vw 0vw 8vw 0vw;
}

.floor .img-box {
    position: relative;
    margin-bottom: 10.25vw;
}
.floor .img-box .en{
    position: absolute;
    top: -5vw;
    left: 5.9vw;
}
.floor .img-box .en img {
    width: 30.2vw;
}
.pin {
    position: absolute;
    left: var(--x);
    top: var(--y);
    transform: translate(-50%, -50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
}
.pin img {
    width: 4.9vw;
    height: auto;
    display: block;
}
.pin[data-gallery="exterior"] {
    left: 30.9%;
    top: 34.8%;
}
.pin[data-gallery="entry"] {
    left: 71.2%;
    top: 25.9%;
}
.pin[data-gallery="hall"] {
    left: 81.4%;
    top: 16%;
}
.pin[data-gallery="ldk"] {
    left: 43.6%;
    top: 20.3%;
}
.pin[data-gallery="washroom"] {
    left: 57.5%;
    top: 12.9%;
}
.pin[data-gallery="nook"] {
    left: 43.7%;
    top: 14.9%;
}

/* モーダル */
.modal {
    position: fixed;
    inset: 0;
    display: none;
    overflow-y: auto;
    height: 100dvh;
    -webkit-overflow-scrolling: touch;
    z-index: 1000;
}
  .modal.is-open {
    display: grid;
    place-items: center;
}
  .modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(29,29,29,.9);
    /* min-height: 1120px; */
}
  .modal__box {
    position: relative;
    width: 100vw;
    /* padding: 13vw 0 0; */
}
  .modal__close {
    position: absolute;
    right: 6.5vw;
    top: -5vw;
}
.modal__close img {
    
width: 5.9vw;
}
.modal__slider {
    margin:0 0 0vw!important;
}
.modal__slider .txt {
    font-weight: normal;
    font-size:3.382vw;
    letter-spacing: 0.05em;
    line-height: 2;
    color: #FFFFFF;
    width: 89.375vw;
    margin-inline: auto;
}
  .modal__slider .photo {
    margin-bottom: 5vw;
}
  .modal__slider .photo img {
    width: 100%;
    /* height: 800px; */
    display: block;
    object-fit: contain;
}
  
.slick-list {
    height: auto!important;
    /* margin: 0 0 21vw!important; */
    padding: 8vw 0 0;
}
.slide-dots {
    margin: 0  0 0;
    padding: 0;
    text-align: center;
  }
  .slide-dots li {
    display: inline-block;
    margin: 0 5.5vw;
  }
  .slide-dots li button {
    position: relative;
    text-indent: -9999px;
  }
  .slide-dots li button::before {
    background-image: url(../img/slide-dots.svg);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    cursor: pointer;
    width: 3.7vw;
    height: 3.7vw;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
  }
  .slide-dots li.slick-active button::before {
    background-image: url(../img/slide-dots-active.svg);
    background-repeat: no-repeat;
    background-size: contain;
  }
  button {
    background: none;
    border: none;
    outline: none;
    /* padding: 0 7px; */
  }

  /* ttl共通
-------------------------------------*/
.sec-ttl {
    font-weight: 400;
    font-size:7.729vw;
    letter-spacing: 0.05em;
    line-height: 2.1875;
    position: relative;
    text-align: center;
    margin-bottom: 2.2vw;
}
.sec-ttl::before,
.sec-ttl::after {
    content: "";
    display: block;
    width: 23.2vw;
    height: 0.2vw;
    background: #212121;
    position: absolute;
    top: 56%;
    transform: translateY(-50%);
}
.sec-ttl::before {
    left: 0;
}
.sec-ttl::after {
    right: 0;
}

/* gallery
-------------------------------------*/
.gallery .list {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 6.7vw;
    width: 89.375vw;
    margin-inline: auto;
    padding: 2vw 0 11vw;
}
.gallery .list li .ttl-wrap {
    display: grid;
    grid-template-columns: 5.315vw 1fr;
    gap: 2.5vw;
    align-items: center;
    border-bottom: 0.2vw solid #212121;
    padding: 0 0 3.5vw;
    margin-bottom: 3.3vw;
}
.gallery .list li .ttl-wrap h3 {
    font-weight: normal;
    font-size:5.314vw;
    letter-spacing: 0.05em;
}
.gallery .list li .photo {
    margin-bottom: 3vw;
    position: relative;
}
.gallery .list li .photo::after {
    position: absolute;
    content: "";
    background: url(../img/open-icon_sp.svg)no-repeat;
    background-size: contain;
    width: 7.3vw;
    height: 7.3vw;
    bottom: 0;
    right: 0;
}
.gallery .list li .txt {
    font-weight: normal;
    font-size:3.382vw;
    letter-spacing: 0.05em;
    line-height: 2;
}

/* room-tour
-------------------------------------*/
.room-tour .inner {
    margin-inline: auto;
    padding: 13.1vw 0 0;
}
.room-tour .sec-ttl {
    margin-bottom: 3vw;
}
.room-tour .sec-ttl::before,
.room-tour .sec-ttl::after {
    width: 17.2vw;
}
.room-tour .ytArea {
    margin-inline: auto;
    width: 94.205vw;
    margin-bottom: 8vw;
}
.room-tour .ytArea iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
}
.room-tour .bnr-box {
    padding: 4vw 0 8.5vw;
    display: grid;
    width: 100%;
}
.room-tour .bnr-box li:nth-child(1) {
    order: 1;
    width: 94.205vw;
    margin-inline: auto;
    margin-bottom: 5.6vw;
}
.room-tour .bnr-box a  {
    order: 4;
    display: block;
}
.room-tour .bnr-box li:nth-child(3) {
    order: 2;
    width: 96.2vw;
    margin: 0 0 1.6vw 1vw;
}
.room-tour .bnr-box .item {
    display: contents;
}
.room-tour .desc {
    font-weight: normal;
    font-size:2.898vw;
    letter-spacing: 0;
    line-height: 2.083333;
    order: 3;
    width: 94.205vw;
    margin-inline: auto;
    margin-bottom: 9vw;
}


/* access
-------------------------------------*/
.access .sec-ttl {
    margin-bottom: 3.5vw;
}
.access .sec-ttl::before,
.access .sec-ttl::after {
    width: 27.1vw;
}
.access .map {
    margin-bottom: 2.7vw;
    height: 72.5vw;
}
.access .map iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: 100%;
}
.access .address {
    font-weight: normal;
    font-size:3.382vw;
    letter-spacing: 0.075em;
    text-align: center;
    line-height: 2;
}

/* contact
-------------------------------------*/
#kariyamodelhouse .cm-form {
    margin-top: 18.2vw;
}
#kariyamodelhouse .cm-form .form-blocks.bg-gray {
    padding: 0 0 14.49vw;
}
#kariyamodelhouse .contact {
    background: #F2F2F2;
}
#kariyamodelhouse .contact .inner {
    width: 94.375vw;
    margin-inline: auto;
    background: #FFFFFF;
    padding: 9vw 0 9.66vw;
}
#kariyamodelhouse .contact .wcm03 {
    position: relative;
    /* max-width: 1000px; */
    padding: 0;
}
#kariyamodelhouse .contact .ttl-box {
    position: relative;
    width: 70vw;
    margin-inline: auto;
    padding: 18.2vw 0 6.2vw;
}
#kariyamodelhouse .contact h2 {
    font-weight: normal;
    font-size: 7.729vw;
    letter-spacing: 0.05em;
    line-height: 1.75;
    text-align: center;
    margin-bottom: 1vw;
    position: relative;
    z-index: 2;
}
#kariyamodelhouse .contact .en {
    position: absolute;
    content: "";
    top: 13.2vw;
    left: 0.2vw;
}
#kariyamodelhouse .contact .en img {
    
width: 34.6vw;
}
#kariyamodelhouse .contact h3 {
    font-weight: normal;
    font-size: 4.348vw;
    letter-spacing: 0.075em;
    text-align: center;
}
#kariyamodelhouse .contact .form-note {
    font-weight: normal;
    font-size: 3.382vw;
    letter-spacing: 0.075em;
    line-height: 2;
    text-align: left;
    margin: 0;
    width: 84vw;
    margin-inline: auto;
}
#kariyamodelhouse .cm-form .box-form{
    margin-top: 8.7vw;
    padding: 0 4.9vw;
}
#kariyamodelhouse .form-group-title .ttl:before {
    content: none;
}
#kariyamodelhouse .form-group-title .ttl.is-required:before {
    background: #C13824;
    font-size: 3.14vw;
    font-weight: 400;
    line-height: 2.5;
    width: 12.1vw;
    height: 7.3vw;
    right: 0;
    left: initial;
    content: "必須";
    background: #C13924;
}
#kariyamodelhouse .form-group-title {
    font-weight: normal;
    font-size: 3.623vw;
    letter-spacing: 0.05em;
    line-height: 2.53333;
    text-align: left;
    padding: 0 0 0 1vw;
    /* max-width: 384px; */
    /* width: 40%; */
    margin-bottom: 1vw;
}

#kariyamodelhouse .form-group .day-subtxt{
 font-size: 2.90vw; line-height: 1.6; letter-spacing: 0.2vw;
 text-align: left; padding: 2vw 0 0 0;
}

#kariyamodelhouse .contact .form-group {
    border-bottom: 1px solid #DDDDDD;
    padding: 2.2vw 1.2vw 3vw;
}
#kariyamodelhouse .contact .form-group:first-child {
    padding: 0 1.2vw 3vw;
    /* border-top: 1px solid #DDDDDD; */
}
#kariyamodelhouse .contact .form-group:first-child:last-child {
    align-items: flex-start;
}
#kariyamodelhouse .form-group-content {
    width: 100%;
    margin-inline: auto;
}
#kariyamodelhouse .form-group-title .ttl {
    padding: 0;
}
#kariyamodelhouse .contact .form-group:first-child input {
    /* width: 320px; */
}
#kariyamodelhouse .contact .form-group:nth-child(2) input {
    /* width: 320px; */
}
#kariyamodelhouse .box-datetimepicker .input-date {
    height: 50px;
    border-radius: 5px;
    background: #f2f2f2;
    border: 1px solid #e6e6e6;
    color: #999999;
}
#kariyamodelhouse .box-select select {
    height: 50px;
    border-radius: 5px;
    background: #f2f2f2;
    border: 1px solid #e6e6e6;
    color: #999999;
}
#kariyamodelhouse .input-text {
    /* width: 320px; */
    height: 50px;
    border-radius: 1.2vw;
    background: #f2f2f2;
    border: 0.2vw solid #e6e6e6;
    color: #999999;
    font-size: 3.623vw;
}
#kariyamodelhouse .input-area {
    height: 38.7vw;
    border-radius: 5px;
    background: #f2f2f2;
    border: 1px solid #e6e6e6;
    color: #999999;
}
#kariyamodelhouse .form-policy {
    height: 38.7vw;
    background: #f2f2f2;
    border: 0.2vw solid #ddd;
    font-weight: normal;
    font-size: 2.657vw;
    letter-spacing: 0.05em;
    line-height: 1.72727;
    margin-top: 7vw;
    padding: 4.6vw 4.7vw;
    width: 82.2vw;
    margin-inline: auto;
    overflow-y: scroll;
}
#kariyamodelhouse .form-policy .policy-ttl{
    font-size: 2.898vw;
    text-indent: 0;
}
#kariyamodelhouse .form-policy .policy-list{
    margin-top: 1.2vw;
}
#kariyamodelhouse .form-action .btn-agree {
    max-width: 82.2vw;
    margin: 0 auto 7vw;
}
#kariyamodelhouse .form-action {
    margin-top: 5.1vw;
}
#kariyamodelhouse .form-action .btn-agree label {
    font-weight: normal;
    font-size: 3.623vw;
    letter-spacing: 0.05em;
    line-height: 2.235294;
    border-bottom: 0.2vw solid #212121;
    border-top: none;
    border-left: none;
    border-right: none;
    padding: 0 0 4vw;
}
#kariyamodelhouse .form-action .btn-agree label span {
    margin-left: 0;
}
#kariyamodelhouse .cm-btn02 {
    max-width: 82.2vw;
    font-weight: normal;
    font-size: 3.865vw;
    letter-spacing: 0.05em;
    line-height: 2.5;
    text-align: center;
    color: #fff;
    padding: 6vw 0 6.2vw;
}
#kariyamodelhouse .form-action .submit-button:after {
    background: url(../img/submit-arrow.svg)no-repeat;
    background-size: contain;
    width: 4.2vw;
    height: 3.2vw;
    right: 9vw;
}

/* event
-------------------------------------*/
.event {
margin:0vw 0vw 15vw 0vw;
}
.event .sec-ttl {
    margin-bottom: 0;
}
.event .sec-ttl::before,
.event .sec-ttl::after {
    width: 29vw;
}
.event .subt {
    font-weight: normal;
    font-size:4.348vw;
    letter-spacing: 0.075em;
    text-align: center;
margin:0vw 0vw 3vw 0vw;
}

#exhibition_kariyamodelhouse .cm-btn02 {
    max-width: 82.2vw;
    font-weight: normal;
    font-size: 3.865vw;
    letter-spacing: 0.05em;
    line-height: 2.5;
    text-align: center;
    color: #fff;
    padding: 6vw 0 6.2vw;
}
#exhibition_kariyamodelhouse .form-action .submit-button:after {
    background: url(../img/submit-arrow.svg)no-repeat;
    background-size: contain;
    width: 4.2vw;
    height: 3.2vw;
    right: 9vw;
}

    #kariyamodelhouse .form-step {
        padding: 4vw 0px 2vw 0px !important;
    }

.info-mail{text-align: center;}


/* bnr04
-------------------------------------*/
.bnr04 {
    padding: 14.6vw 0 14.3vw;
    text-align: center;
    width: 94.375vw;
    margin-inline: auto;
}


/* floating bnr
-------------------------------------*/
.side-fix {
    display: none;
}
.fix-list {
    display: none;
}

/* sp-fix-list
-------------------------------------*/
.sp-fix-list {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 96;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    align-items: flex-end;
    z-index: 400;
  }
  
}
/* ========================================
   @media screen and (max-height: 450px)
======================================== */
@media screen and (max-height: 450px) {
/* 高さ450px以下の場合 andoroidのフォーム対策 ストーカーバナー用　*/
    .sp-fix-list {
        display: none;
    }
}