
.fv_style2 { background-image: url(../img/service/house/fv.jpg); }
.fv_style2 .btn_wrap { padding-top: 2rem; }
.fv_style2 .btn_wrap .btn { margin: 0 1rem; }

.house-heading1 { font-size: 2.5rem; }

.lineup { padding: 6rem 0 4rem; background-image: url(../img/service/house/bg1.jpg); }
.lineup-row { padding: 4rem 0 2rem; }
.lineup .facade img { width: calc((100% - 20px) / 4); }
.lineup-logo { padding: 4rem 0 3rem; }
.lineup-logo img { width: 450px; }
.lineup-logo span { display: block; font-size: 14px; font-weight: 500; padding-top: 1rem; }
.lineup-intro { padding-bottom: 4rem; }
.lineup-intro .ttl { font-size: 1.75rem; padding-bottom: 2rem; }
.lineup-intro .txt { line-height: 220%; font-size: 15px; } 

.lineup-points h4 { font-size: 1.5rem; padding-bottom: 2rem; }
.lineup-points ul { margin-left: -20px; }
.lineup-points ul li { width: calc((100% - 100px) / 5); margin-left: 20px; }
.lineup-points ul li .white_box { padding: 3rem 8% 0.75rem; box-shadow: 2px 2px 8px 1px #d4d4d4; }
.lineup-points ul li img { display: block; margin: auto; width: 70%; max-width: 130px; }
.lineup-points ul li .ttl { margin: 1rem 0; font-size: 1.125rem; min-height: 52px; line-height: 130%; box-sizing: border-box; }
.lineup-points ul li .txt { font-size: 14px; line-height: 160%; min-height: 90px; }
.lineup-points ul li .txt.compress { letter-spacing: -1px; }
.lineup-points ul li .note { font-size: 11px; line-height: 140%; padding-top: 0.75rem; display: block; }
.lineup .btn_wrap { padding-top: 3rem; }

.works { padding: 6rem 0; }
.works .head_style3 .icon { width: 3rem; }
.works .slider { padding-top: 3rem; }
.works .slider .slide { display: block; width: 370px !important; margin: 0 15px; }
.works .slider .slide figure { border-radius: 0.5rem; border: 2px solid #555; }
.works .slider .slide .ttl { font-size: 18px; font-weight: 500; padding-top: 0.5rem; }
.works .slider_nav { padding-top: 3rem; }
.works .btn_wrap { padding-top: 3rem; }

.shisan_mirai { padding: 4rem 0 22%; background: url(../img/service/house/bg2.jpg) no-repeat bottom center; background-size: 100% auto; color: #fff; background-color: #0156A7; }
.shisan_mirai h4 { font-size: 2.5rem; }
.shisan_mirai .txt { font-size: 14px; padding-top: 1rem; }
.shisan_mirai .btn_wrap { padding-top: 2rem; }

.sc-insta { background-image: url(../img/service/house/bg3.jpg); }

/* -------------------------------------------- tablet */

@media screen and (max-width: 1100px) {

    .house-heading1 { font-size: 2rem; }

    .lineup-row { padding: 2rem 0; }
    .lineup-logo { padding: 3rem 0 2rem; }
    .lineup-logo span { padding-top: 0.5rem; }
    .lineup-logo img { width: 350px; }
    
    .lineup-intro { padding-bottom: 3rem; }
    .lineup-intro .ttl { font-size: 1.5rem; padding-bottom: 1.5rem; }
    .lineup-intro .txt { font-size: 14px; }
    .lineup-intro .txt b { display: inline-block; }
    .lineup-points h4 { font-size: 1.25rem; padding-bottom: 1.5rem; }

    .lineup-points ul li { margin-bottom: 1rem; width: calc((100% - 100px) / 3); }

    .card1.style2 { width: 320px !important; }

    .works .slider .slide { width: 300px !important; }
    .works .slider .slide .ttl { font-size: 14px; }
    .works .inner { width: 100%; }

    .shisan_mirai { padding-bottom: 30%; background-size: 120% auto; }
}

/* -------------------------------------------- sp */

@media screen and (max-width: 767px) {

    .btn_wrap .btn.style2 { padding-right: 2.5rem; }
    .btn_wrap .btn.hover_anim span { font-size: 1rem; }

    .fv_style2 { height: 450px;  background-image: url(../img/service/house/fv-sp.jpg?v=3); align-items: flex-start; }
    .fv_style2 .fv_txt { padding: 2.5rem 0 0; }
    .fv_style2 .fv_txt p { font-size: 12px; }
    .fv_style2 .fv_txt h2 { padding-top: 0.5rem; font-size: 2.125rem; }
    .fv_style2 .btn_wrap { padding-top: 2rem; }
    .fv_style2 .btn_wrap .btn { margin-bottom: 0.5rem; min-width: 240px; height: 45px; line-height: 45px; }
    .fv_style2 .btn_wrap .btn.hover_anim span { font-size: 12px }

    .house-heading1 { font-size: 1.75rem; }

    .lineup { padding: 4rem 0 2rem; }
    .lineup .facade img { margin-bottom: 5px; width: calc((100% - 5px) / 2); }

    .lineup-logo { padding: 3rem 0; text-align: left; }
    .lineup-logo img { width: 300px; }
    .lineup-logo span { font-size: 12px; }

    .lineup-intro { padding-bottom: 2rem; }
    .lineup-intro .ttl { font-size: 1.75rem; text-align: left; }
    .lineup-intro .txt { text-align: left; }
    .lineup-intro .txt b { display: inline; }

    .lineup-points h4 {  }
    .lineup-points ul { margin-left: -15px; }
    .lineup-points ul li { margin-bottom: 1rem; margin-left: 15px; width: calc((100% - 30px) / 2); }
    .lineup-points ul li .ttl { line-height: 140%; }
    .lineup-points ul li img { width: 60%; max-width: 100px; }
    .lineup-points ul li .txt { font-size: 12px; min-height: 77px; }
    .lineup-points ul li .note { font-size: 10px; }

    .lineup .btn_wrap { padding-top: 2rem; }
    
    .works .slider { padding-top: 2rem; }
    .works .slider .slide { width: 210px !important; }
    .works .slider .slide .ttl { font-size: 12px; }

    .shisan_mirai { padding: 5rem 0 38%; background-size: 140% auto; }
    .shisan_mirai h4 { font-size: 1.75rem; }
    .shisan_mirai .txt { line-height: 200%; }
    .shisan_mirai .btn_wrap .btn.style2 { height: auto; line-height: 150%; padding: 0.5rem 3.5rem; width: 100%; max-width: 280px; }
    
}