@charset "utf-8";

/* --------------------------------
□  共通
--------------------------------*/ 
.contents {
    height: auto;
    overflow: hidden;
}
.contents section.wide{
    width:100%;
    max-width: inherit;
    padding: 90px 0;
}
.contents main > section,
.contents section.wide .container {
    max-width: 1228px;
    width: 100%;
    margin: 0 auto;
    text-align: left;
    box-sizing: border-box;
}

img {
    max-width: 100%;
    height: auto;
}

#index .buttonStyle {
    margin-bottom: 0;
}
#index .buttonStyle a {
    font-size: 87.5%;
    letter-spacing: 0.04em;
    width: 248px;
    padding: 13px 30px;
    position: relative;
    box-sizing: border-box;
    display: inline-block;
    color: #fff;
    background: #29288B;
    text-decoration: none;
    transition: all 300ms 0s ease;
    border-radius: 24px;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
}
    #index .buttonStyle a span:after {
        content: "";
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        right: 8%;
        display: inline-block;
        width: 6px;
        height: 11px;
        margin-left: 5px;
        background: url(../../images/common/icon/right_white.svg) no-repeat right center;
        background-size: contain;
        z-index: 1;
        transition: all 300ms 0s ease;
    }
    #index .buttonStyle a:hover {
        background: #111158;
    }
    #index .buttonStyle a:hover span:after {
        right: 5%;
    }
    #index .buttonStyle a span:before {
        content: none;
    }

/* 詳細はこちらボタン */
#index .buttonStyle.moreBtn {
    position: relative;
    text-align: center;
    font-size: 87.5%;
    letter-spacing: 0.1em;
    bottom: 0;
    right: 10px;
    margin-bottom: 0;
}
    #index .buttonStyle.moreBtn a {
        color: #222;
        background: transparent;
        padding: 8px 45px 8px 0;
        width: auto;
    }
    #index .buttonStyle.moreBtn span {
        width: auto;
    }
        #index .buttonStyle.moreBtn span:after {
            content: "";
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            -webkit-transform: translateY(-50%);
            right: 0;
            display: inline-block;
            width: 38px;
            height: 38px;
            background: url(../../images/index/next.svg) no-repeat right center;
            background-size: contain;
            transition: all 300ms 0s ease;
        }
        #index a .buttonStyle.moreBtn {
            display: inline-block;
            color: #222;
            background: transparent;
            padding: 8px 45px 8px 0;
            right: -10px;
            width: auto;
        }
        #index a:hover .buttonStyle.moreBtn span:after{
            right: -10px;
        }

/* ◇ title
-------------------------------- */
section h3.lv3 {
    color: #222;
    font-size: 106.25%;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-bottom: 50px;
}
    section h3.lv3 span {
        font-size: 294.11%;
        font-weight: 400;
        display: block;
    }

/* --------------------------------
□  news
--------------------------------*/
#news {
    padding: 130px 0 60px;
}
#news .newsInfo .title {
    min-width: 221px;
    margin-right: 7%;
}
    #news .newsInfo .title h3 {
        margin-bottom: 50px;
    }
#news .newsInfo ul.info {
    max-width: 913px;
    width: 75%;
    line-height: 1;
}
#news .newsInfo ul.info li {
    text-align: left;
    border-top: 1px solid #E5E5E5;
}
    #news .newsInfo ul.info li:last-child {
        border-bottom: 1px solid #E5E5E5;
    }
#news .newsInfo ul.info li a {
    display: block;
    width: 100%;
    position: relative;
    padding: 30px 0;
}
    #news .newsInfo ul.info li a:after {
        content: "";
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        right: 2%;
        display: inline-block;
        width: 8px;
        height: 16px;
        margin-left: 20px;
        background: url(../../images/common/icon/arrow.svg) no-repeat right center;
        background-size: contain;
        transition: all 300ms 0s ease;
    }
    #news .newsInfo ul.info li a:hover:after {
        right: 1%;
    }
    #news .newsInfo ul.info li a:hover {
        background-color: #F6F6F6;
        transition: all 300ms 0s ease;
    }

#news .newsInfo ul.info li dl {
    display: table;
    width: 100%;
}
    #news .newsInfo ul.info li dl > * {
        display: table-cell;
        vertical-align: middle;
        font-size: 93.75%;
        letter-spacing: 0.06em;
    }
    #news .newsInfo ul.info li dl > dt {
        width: 80px;
        color: #949494;
    }
    #news .newsInfo ul.info li dl > dd.text {
        padding-left: 40px;
        padding-right: 60px;
    }
#news .buttonStyle a {
    max-width: 221px;
}

/* --------------------------------
□  sns
--------------------------------*/
#sns {
    padding: 0;
}
#sns .inner {
    max-width: 872px;
    padding: 30px 90px;
    margin: auto;
    background-color: #F3F3F3;
    border-radius: 8px;
}
#sns h3.lv3 {
    font-size: 125%;
    margin-bottom: 0;
    min-width: 327px;
    text-align: center;
}
    #sns h3.lv3 span.fukidashi {
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 85%;
        margin-bottom: 10px;
    }
        #sns h3.lv3 span.fukidashi::before,
        #sns h3.lv3 span.fukidashi::after {
            content: '';
            width: 20px;
            height: 1px;
            background-color: #222;
        }
        #sns h3.lv3 span.fukidashi::before {
            margin-right: 10px;
            transform: rotate(60deg);
        }
        #sns h3.lv3 span.fukidashi::after {
            margin-left: 10px;
            transform: rotate(-60deg);
    }
.btn_area {
    width: 39%;
    max-width: 265px;
}

/* --------------------------------
□  event
--------------------------------*/ 
#event {
    padding-bottom: 216px;
}

/* ◆ slickSlider
-------------------------------- */
ul.slickSlider.slick-dotted.slick-slider {
    margin-bottom: 0;
}
ul.slickSlider .slick-list {
    overflow: visible;
}
ul.slickSlider li {
    margin-right: 32px;
}
ul.slickSlider li dt {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    filter: drop-shadow(0px 3px 12px rgba(0, 0, 0, 0.16));
    margin-bottom: 24px;
}
    ul.slickSlider li img,
    .slick-slide img {
        display: block;
        width:100%;
        height: auto;
        aspect-ratio: 3 / 2;
        object-fit: cover;
    }
ul.slickSlider li.end a{
    pointer-events: none;
}

    ul.slickSlider li.end dt::before {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        content: "イベントは終了しました。";
        background-color: rgba(0, 0, 0, 0.7);
        text-align: center;
        font-size: 93.75%;
        line-height: 1.4;
        letter-spacing: 0.1em;
    }

ul.slickSlider li dd.date {
    font-weight: 500;
    margin-bottom: 4px;
}
    ul.slickSlider li dd.date em {
        font-size: 137.5%;
        font-weight: 500;
    }
    ul.slickSlider li dd.date .en {
        letter-spacing: 0.1em;
        font-weight: 400;
    }
    ul.slickSlider li dd.date .en em {
        font-size: 175%;
    }
ul.slickSlider li dd.ttl {
    font-size: 100%;
    margin-bottom: 16px;
}
ul.slickSlider li dd.cat {
    display: inline-block;
    border: 1px solid #222;
    padding: 1px 10px;
    border-radius: 12px;
}
ul.slickSlider li .buttonStyle img {
    display: inline;
    width:auto;
    height: 23px;
}

ul.slickSlider .prev-arrow,
ul.slickSlider .next-arrow {
    position: absolute;
    bottom: -96px;
    z-index: 10;
}
    ul.slickSlider .prev-arrow {
        right: 72px;
    }
    ul.slickSlider .next-arrow {
        right: 0px;
    }
    ul.slickSlider .prev-arrow:hover,
    ul.slickSlider .next-arrow:hover {
        opacity: 0.7;
        cursor:pointer;
        transition: all 300ms 0s ease;
    }

ul.slickSlider .slick-dots {
    bottom: -84px;
    text-align: left;
    width: calc( 100% - 176px);
    display: table;
}
ul.slickSlider .slick-dots li {
    margin: 0;
    display: table-cell;
}
    ul.slickSlider .slick-dots li button,
    ul.slickSlider .slick-dots li button:before,
    ul.slickSlider .slick-dots li.slick-active button:before{
        width: 100%;
    }
ul.slickSlider .slick-dots li button{
    position: relative;
    text-indent: -9999px;
    padding: 0;
    border: none;
    background: none;
    cursor: pointer;
}
    ul.slickSlider .slick-dots li button:before{
        content:"";
        display:block;
        height:1px;
        background-color:#888;
        position:absolute;
        bottom:0;
        left:0;
    }
    ul.slickSlider .slick-dots li.slick-active button:before{
        background-color:#222222;
    }

/* --------------------------------
□  modelhouse
--------------------------------*/
#modelhouse {
    background: #F2F1EE;
    position: relative;
    max-width: inherit;
    width: 100%;
    padding: 0;
}
    #modelhouse:before{
        content: "";
        position: absolute;
        border-bottom: #F2F1EE solid 205px;
        border-right: #fff solid 50vw;
        border-left: #fff solid 50vw;
    }
#modelhouse .container {
    position: relative;
    z-index: 2;
    padding-top: 30px;
}
#modelhouse .text.lead {
    margin-bottom: 80px;
}
#modelhouse ul.mh_list > li{
    width: 49%;
    max-width: 598px;
    position: relative;
    margin-bottom: 70px;
}
    #modelhouse ul.mh_list > li .no{
        position: absolute;
        top: -34px;
        right: 32px;
        font-size: 375%;
        letter-spacing: 0.1em;
        color: #222;
        z-index: 9;
    }

#modelhouse ul.mh_list li dl dt {
	position: relative;
}
#modelhouse ul.mh_list li dl dt img {
	width: 100%;
}

#modelhouse ul.mh_list li dl dd.ttl {
    font-size: 137.5%;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin-bottom: 20px;
    margin-top: 20px;
}
#modelhouse ul.mh_list li dl dd.txt {
    margin-bottom: 30px;
    line-height: 1.8;
}
#modelhouse ul.mh_list li dl dd.location {
    display: inline-block;
    position: relative;
    padding-left: 20px;
}
    #modelhouse ul.mh_list li dl dd.location:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        display: inline-block;
        width: 13px;
        height: 18px;
        background: url(../../images/index/location.svg) no-repeat;
        background-size: contain;
    }
    #modelhouse ul.mh_list li dl dd.location a {
        text-decoration: underline;
    }

/* ボタン */
#modelhouse .btnArea{
    max-width: 440px;
    margin-top: 28px;
}
#modelhouse .btnArea .buttonStyle a{
    width: 100%;
    padding: 15px 30px;
    font-size: 100%;
    border-radius: 40px;
}

/* 詳細はこちらボタン */
#modelhouse .buttonStyle.whiteBtn a{
    color: #000;
    background: #fff;
    border: 1px solid #000;
}
#modelhouse .buttonStyle.whiteBtn a span:after{
    background-image: url(../../images/common/icon/arrow.svg);
}

/* 来場予約ボタン */
#modelhouse .buttonStyle.orangeBtn a {
    background: #F39700;
    border: 1px solid #F39700;
}

/* 宿泊体験可能 */
#modelhouse ul.mh_list li .stay {
    position: absolute;
    top: 20px;
    left: 20px;
    font-size: 87.5%;
    color: #29288B;
    background: #fff;
    border: 1px solid #29288B;
    border-radius: 8px;
    padding: 6px 14px;
    z-index: 9;
}

/* ◆ slickSlider_modelhouse
-------------------------------- */
ul.slickSlider_modelhouse .slick-dots {
    bottom: 4%;
    left: 4%;
    z-index: 10;
    text-align: left;
}
ul.slickSlider_modelhouse .slick-dots li {
    width: 10px;
    height: 10px;
    margin: 0 5px 0 0;
}
ul.slickSlider_modelhouse .slick-dots li button {
    width: 10px;
    height: 10px;
    padding: 0px;
}
    ul.slickSlider_modelhouse .slick-dots li button:before {
        font-size: 26px;
        color: #fff;
        opacity: 1;
        line-height: 10px;
        position: absolute;
        top: 0;
        left: -2px;
        width: 10px;
        height: 10px;
    }
    ul.slickSlider_modelhouse .slick-dots li.slick-active button:before,
    ul.slickSlider_modelhouse .slick-dots li button:focus:before {
        color: #F39700;
    }

/* --------------------------------
□  build
--------------------------------*/
#build {
    background: url(../../images/index/build_bg.jpg) 0 0 no-repeat;
    background-size: cover;
    padding: 120px 0;
}
#build > .container > .flexbox  {
    align-items:start;
}
#build .titleArea h3 {
    color: #fff;
}
#build .text {
    color: #fff;
    font-size: 137%;
    line-height: 1.7;
}
#build .menuArea {
    width: 808px;
}
#build .menuArea > div {
    margin-bottom: 32px;
}
#build .menuArea section {
    width: auto;
    margin: 0;
}
#build .menuArea section h4 {
    font-size: 1.06rem;
    font-weight: 600;
    border-bottom: 2px solid #fff;
    color: #fff;
    padding-bottom: 12px;
    margin-bottom: 24px;
}
#build .menuList {
    gap: 32px;
}
#build .menuList li {
    width: 248px;
}
#build .menuList li .buttonStyle a {
    width: 100%;
    padding: 28px 24px;
    text-align: left;
    border-radius: 4px;
    box-sizing: border-box;
    font-size: 1rem;
}
#build .comfortable .menuList li .buttonStyle a {
    background-color: #32A5CB;
}
#build .commonPoint .menuList li .buttonStyle a {
    background-color: #D0A54C;
}

@media only screen and
(max-width : 767px) {
    
    #build {
        background: url(../../images/index/build_bg_sp.jpg) 0 0 no-repeat;
        background-size: cover;
        padding: 80px 0;
    }
    #build .text {
        font-size: 120%;
        margin-bottom: 40px;
    }
    #build .menuArea section.comfortable {
        margin-top: 32px;
    }
    #build .menuList {
        width: auto;
        gap: 12px;
    }
    #build .menuList li {
        width: 100%;
    }
    #build .menuList li .buttonStyle a {
        padding: 24px 32px;
    }
}

/* --------------------------------
□  works
--------------------------------*/
#works {
    padding-bottom: 40px;
}
#works ul.works_list > li {
    width: 32%;
    max-width: 388px;
    margin-bottom: 50px;
}
#works ul.works_list > li dt {
    margin-bottom: 20px;
}
#works ul.works_list > li dd.txt {
    line-height: 1.8;
    margin-bottom: 8px;
}
#works ul.works_list > li dd.location {
    color: #818181;
    font-size: 82%;
}

/* --------------------------------
□  flow
--------------------------------*/
#flow {
    padding-top: 0;
}
#flow ul.flow_list > li {
    width: 20%;
    max-width: 250px;
    background-color: #F2F1EE;
    border-radius: 4px;
    text-align: center;
    margin-right: 6px;
    position: relative;
}
    #flow ul.flow_list > li:nth-child(even) {
        background-color: #EEEAE0;
    }
    #flow ul.flow_list > li:last-child {
        margin-right: 0;
    }
    #flow ul.flow_list > li:before {
        content: "";
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        right: -10px;
        width: 15px;
        height: 51px;
        background: url(../../images/index/arrow.svg) no-repeat right center;
        background-size: contain;
        z-index: 9;
    }
    #flow ul.flow_list > li:last-child:before {
        content: none;
    }
#flow ul.flow_list > li a {
    display: block;
    padding: 50px 10px 30px;
}
#flow ul.flow_list > li dt {
    margin: 0 auto 30px;
    border-radius: 8px;
    max-width: 120px;
    overflow: hidden;
}
#flow ul.flow_list > li dd .no {
    color: #F39700;
    letter-spacing: 0.1em;
    font-weight: 700;
    margin-bottom: 15px;
}
#flow ul.flow_list > li dd .ttl {
    font-size: 112.5%;
    letter-spacing: 0.04em;
    margin-bottom: 50px;
}
    #flow ul.flow_list > li dd .ttl .sml {
        display: block;
        color: #AFAFAF;
        font-size: 65%;
        letter-spacing: 0.1em;
        margin-top: 10px;
    }

/* --------------------------------
□  blog
--------------------------------*/
#blog {
    background: url(../../images/index/blog_bg.png) 0 0 repeat;
    padding-bottom: 190px;
    border-top: 1px solid #F3F3F3;
}
    #blog ul.slickSlider li dt {
        filter: none;
    }

/* --------------------------------
□  links
--------------------------------*/
#links {
    padding: 0 0 60px 0;
}
#links .container {
    max-width: inherit;
}
#links ul.links > li {
    width: calc( 100% /3);
    height: 395px;
    background: url(../../images/index/links1.jpg) no-repeat center;
    background-size: cover;
    position: relative;
}
    #links ul.links > li:nth-child(2) {
        background: url(../../images/index/links2.jpg) no-repeat center;
    }
    #links ul.links > li:nth-child(3) {
        background: url(../../images/index/links3.jpg) no-repeat center;
    }
#links ul.links > li a {
    display: block;
    width: 100%;
    height: 100%;
    color: #fff;
    transition: all 500ms 0s ease;
    text-decoration: none;
    box-sizing: border-box;
    padding: 4%;
}
    #links ul.links > li a:hover {
        opacity: 0.5;
    }
#links .txtArea {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
}
#links h3.lv3 {
    color: #fff;
    font-size: 162.5%;
    margin-bottom: 50px;
    text-align: center;
}
    #links h3.lv3 span {
        font-size: 50%;
        font-weight: 500;
        letter-spacing: 0.1em;
        display: block;
        margin-top: 15px;
    }

/* 詳細はこちらボタン */
#links a .buttonStyle.moreBtn {
    color: #fff;
}
    #links .buttonStyle.moreBtn span:after {
        width: 34px;
        height: 34px;
        background: url(../../images/index/next_w.svg) no-repeat right center;
        background-size: contain;
    }


/* --------------------------------
   □ スマートフォン用の記述
-------------------------------- */
.contents .pc {
    display:block;
}
.contents .sp {
    display:none;
}






@media (max-width: 1300px) and (min-width: 768px) {
    #index .wide .container {
        width: auto;
        margin-left: 4%;
        margin-right: 4%;
    }

    /* --------------------------------
    □  news
    -------------------------------- */
    #news {
        padding-top: 60px;
    }
    #news .newsInfo .title {
        margin-right: 4%;
    }
    #news .newsInfo ul.info li dl > dd.text {
        padding-left: 2%;
    }
    #news .newsInfo ul.info li a:after {
        width: 7px;
        height: 14px;
    }

    /* --------------------------------
    □  sns
    -------------------------------- */
    #sns .inner {
        max-width: 872px;
        padding: 30px 4%;
    }

    /* --------------------------------
    □  modelhouse 
    -------------------------------- */
    #modelhouse ul.mh_list > li {
        width: 48%;
        margin-bottom: 70px;
    }

    #modelhouse ul.mh_list li dl dd.ttl {
        font-size: 125%;
        padding-right: 120px;
    }

    /* --------------------------------
    □  flow 
    -------------------------------- */
    #flow ul.flow_list > li a {
        padding: 30px 10px;
    }

    /* 詳細はこちらボタン */
    #flow a .buttonStyle.moreBtn {
        margin-right: 10px;
    }

}






/* タブレット用
-------------------------------------------- */
@media (max-width: 999px) and 
(min-width: 768px) {

}






@media only screen and
(max-width : 767px) {
    /* --------------------------------
    □ スマートフォン用の記述
    -------------------------------- */
    .contents .pc {
        display:none;
    }
    .contents .sp {
        display:block;
    }

    /* --------------------------------
    □  共通
    --------------------------------*/ 
    .contents section.wide {
        padding: 60px 0;
    }
    .contents section.wide .container {
        width: auto;
        margin-left: 4%;
        margin-right: 4%;
    }

    section h3.lv3 {
        font-size: 87.5%;
        margin-bottom: 35px;
    }
        section h3.lv3 span {
            font-size: 250%;
        }

    /* --------------------------------
    □  news
    -------------------------------- */
    #news {
        padding: 40px 0 30px;
    }
    #news .newsInfo {
        padding: 0;
        margin-top: 0;
    }
    #news .newsInfo .title {
        margin-right: 0;
    }
        #news .newsInfo .title h3 {
            margin-bottom: 20px;
        }
    #news .newsInfo ul.info li a {
        display: block;
        background: url(../../images/common/icon/right.svg) 100% 50% no-repeat;
        padding: 15px 0px;
    }
    #news .newsInfo ul.info li dl > dt {
        display: block;
        width: auto;
        padding: 0px;
        font-size: 75%;
        margin-bottom: 5px;
    }
    #news .newsInfo ul.info li dl > dd.text {
        display: block;
        padding: 0;
        line-height: 1.5;
        font-size: 87.5%;
    }
    #news .newsInfo .buttonStyle {
        margin: 25px auto 0;
    }
        #news .newsInfo .buttonStyle a {
            width: auto;
            min-width: inherit;
            max-width: inherit;
            padding: 14px 50px;
            border-radius: 24px;
        }

    /* --------------------------------
    □  sns
    --------------------------------*/ 
    #sns .inner {
        max-width: inherit;
        padding: 40px 4%;
    }
    #sns h3.lv3 {
        font-size: 100%;
        margin-bottom: 30px;
    }
        #sns h3.lv3 span.fukidashi {
            font-size: 81.25%;
        }
    #sns .inner .btn_area {
        max-width: 215px!important;
    }

    /* --------------------------------
    □  event
    --------------------------------*/ 
    #event {
        padding-bottom: 60px;
    }
    ul.slickSlider.slick-dotted.slick-slider {
        padding-bottom: 70px;
        margin-bottom: 40px;
    }
    ul.slickSlider li {
        margin-right: 20px;
    }
    ul.slickSlider li dt {
        margin-bottom: 17px;
    }
    ul.slickSlider li dd.date {
        font-size: 81.25%;
        margin-bottom: 10px;
    }
        ul.slickSlider li dd.date em {
            font-size: 146.15%;
        }
        ul.slickSlider li dd.date .en em {
            font-size: 169.23%;
        }
    ul.slickSlider li dd.ttl {
        font-size: 87.5%;
        margin-bottom: 10px;
    }
    ul.slickSlider li dd.cat {
        font-size: 75%;
    }
    ul.slickSlider .slick-list {
        padding: 0!important;
    }
    ul.slickSlider .prev-arrow,
    ul.slickSlider .next-arrow {
        width: 35px;
        bottom: 0;
        z-index: 5;
    }
    ul.slickSlider .prev-arrow {
        right: 46px;
    }
    ul.slickSlider .next-arrow {
    }

    ul.slickSlider .slick-dots {
        width: calc( 100% - 107px);
        bottom: 0;
    }

    /* --------------------------------
    □  modelhouse
    --------------------------------*/
    #modelhouse {
        margin-bottom: 0;
    }
        #modelhouse:before {
            border-bottom: #F2F1EE solid 75px;
        }
    #modelhouse .text.lead {
        margin-bottom: 50px;
    }
    #modelhouse ul.mh_list {
        background-color: #F2F1EE;
        padding-bottom: 60px
    }
    #modelhouse ul.mh_list > li {
        margin-bottom: 60px;
    }
        #modelhouse ul.mh_list > li:last-child {
            margin-bottom: 0;
        }
        #modelhouse ul.mh_list > li .no {
            top: -24px;
            font-size: 250%;
        }
        ul.slickSlider_modelhouse .slick-dots li {
            width: 8px;
            height: 8px;
            margin: 0 4px 0 0;
        }
            ul.slickSlider_modelhouse .slick-dots li button:before {
                font-size: 20px;
                line-height: 8px;
                top: 0;
                left: 0px;
                width: 8px;
                height: 8px;
            }
        #modelhouse ul.mh_list li dl dt .slickSlider_modelhouse {
            margin-right: -4%;
            margin-left: -4%;
        }
    #modelhouse ul.mh_list li dl dt p {
        margin-bottom: 30px;
    }
    #modelhouse ul.mh_list li dl dd {
        font-size: 87.5%;
    }
    #modelhouse ul.mh_list li dl dd.ttl {
        font-size: 112.5%;
        margin-bottom: 20px;
        padding-right: 90px;
    }
    #modelhouse ul.mh_list li dl dd.txt {
        margin-bottom: 15px;
    }
    #modelhouse ul.mh_list li dl dd.location {
        margin-bottom: 15px;
    }

    /* ボタン */
    #modelhouse .btnArea{
        max-width: 100%;
        margin-top: 0;
    }
    #modelhouse .btnArea .buttonStyle a{
        font-size: 87.5%;
        padding: 13px 30px;
    }

    /* 宿泊体験可能 */
    #modelhouse ul.mh_list li .stay {
        left: 0;
    }
	#modelhouse ul.mh_list > li .no{
		position: absolute;
		top: -34px;
		right: 32px;
    }

    /* --------------------------------
    □  works
    --------------------------------*/
    #works {
        padding-bottom: 60px;
    }
    #works ul.works_list {
        margin: 0 -4% 10px;
    }
    #works ul.works_list > li {
        width: 49%;
        max-width: inherit;
        margin-bottom: 30px;
    }
    #works ul.works_list > li dt {
        margin-bottom: 15px;
    }
    #works ul.works_list > li dd {
        padding: 0 4%;
        font-size: 81.25%;
    }
        #works ul.works_list > li dd.txt {
            margin-bottom: 10px;
            font-weight: bold;
        }
        #works ul.works_list > li dd.location {
            font-size: 75%;
        }

    /* --------------------------------
    □  flow
    --------------------------------*/
    #flow ul.flow_list > li,
    #flow ul.flow_list > li:nth-child(even) {
        background: none;
        margin-right: 0;
        margin-bottom: 30px;
    }
        #flow ul.flow_list > li:before {
            top: auto;
            bottom: -34px;
            right: 50%;
            width: 10px;
            height: 34px;
            transform:rotate(90deg)
        }
        #flow ul.flow_list > li:last-child {
            margin-bottom: 0;
        }
    #flow ul.flow_list > li a {
        padding: 0;
        margin-right: -4%;
    }
    #flow ul.flow_list > li dl {
        position: relative;
    }
    #flow ul.flow_list > li dt {
        margin: 0;
        max-width: 82px;
        position: absolute;
        top: 50%;
        left: 0%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        z-index: 9;
    }
    #flow ul.flow_list > li dd {
        padding: 20px 60px;
        margin-left: 42px;
        background-color: #F2F1EE;
        border-radius: 8px 0 0 8px;
        position: relative;
    }
        #flow ul.flow_list > li:nth-child(even) dd {
            background-color: #EEEAE0;
        }
        #flow ul.flow_list > li dd:after {
            content: "";
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            -webkit-transform: translateY(-50%);
            right: 4%;
            display: inline-block;
            width: 35px;
            height: 35px;
            background: url(../../images/index/next.svg) no-repeat right center;
            background-size: contain;
            transition: all 300ms 0s ease;
        }
    #flow ul.flow_list > li dd .no {
        font-size: 87.5%;
    }
    #flow ul.flow_list > li dd .ttl {
        font-size: 106.25%;
        margin-bottom: 0;
    }
        #flow ul.flow_list > li dd .ttl .sml {
            font-size: 70.58%;
            margin-top: 5px;
        }
    #flow ul.flow_list > li a .buttonStyle.moreBtn {
        display: none;
    }

    /* --------------------------------
    □  blog
    --------------------------------*/
    #blog {
        padding-bottom: 60px;
    }

    /* --------------------------------
    □  links
    --------------------------------*/
    #links .container {
        margin: 0;
    }
    #links ul.links > li {
        height: 230px;
        margin-bottom: 2px;
    }
    #links .txtArea {
        position: static;
        transform: none;
    }
    #links h3.lv3 {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        color: #fff;
        font-size: 150%;
        margin-bottom: 0;
        text-align: left
    }
        #links h3.lv3 span {
            font-size: 54.16%;
            margin-top: 10px;
        }
    #links a .buttonStyle.moreBtn {
        position: absolute;
        top: auto;
        bottom: 4%;
        right: 4%;
    }

}