@charset "UTF-8";

/* 768px 2021/2/2追加しました*/
@media (max-width: 48em) {


     /*---------------------------------------------
 *  TOPページ
 *---------------------------------------------*/

    .img-wrap.sp h1{
        font-size: 1rem;
        position: absolute;
        width: 54em;
        z-index: 1;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    #h-block-1{
        width: 39em;
    }

    #h-block-1.toppage{
        width: 50em;
      }
      #h-block-1 .seottl{
        font-size: 1.5em;
      }


    #logo{
        margin-top: 5.13em;
    }

    #logo img {
        object-fit: contain;
    }

    #logo.toppage {
        width: 50em;
        margin-top: 1.8em;

    }
    #logo.toppage > p > img{
        width: 39rem;
        margin-top: 5px;
        /* object-fit: contain; */
    }


    .top-event-link .desc{
        margin-top: .1em;
    }

    .home #header {
      /*box-shadow: 0 0 1em #ccc;*/
      left: 0;
      position: fixed;
      top: 0;
      -webkit-transition: height .3s ease;
      transition: .5s;
    }

    body:not(.home) #footer-contact{
        margin-top: 10em;
    }

    #top-voice-image p{
        margin-top: .6em;
    }

    #top-works-list-container{
        margin-top: 10em;
    }

    .slick-slide img {
        height: 50em;
    }

    .tr-slic li h3{
        font-size: 3.6rem;
        left: .8em;
        top: 0.8em;
    }

    .slic-des-text{
        bottom: -4em;
        left: 3em;
        font-size: 2.9rem;
    }

    .top-lineup-box {
        margin-top: 1.8em;
        width: 14.285714286em;
        height: 2.8571428571em;
        font-size: 2.8em;
    }

    .top-news-blog-list-li {
        margin-top: 1.3em;
         padding-bottom: 1.3em;
    }

    .top-news-blog-right .top-news-blog-list-li{
        margin-top: 1.5em;
        padding-bottom: 1.5em;
    }

    #footer-contact .btns{
        display: block;
    }

    .top-event-img .status, #archive-events-list .status{
        font-size: 2.6rem;
    }

    .top-lineup-wid-img-wrap:before,
    .top-lineup-wid-img-wrap img{
        display: none;
    }

    #subpage-header > .events img{
        object-position: 65%;
    }

    #subpage-header > .about img{
        object-position: 62%;
    }

    #subpage-header > .voice img{
        object-position: 36%;
    }

    .slick-list{
        height: 63em;
    }
      /*---------------------------------------------
 * sp HBメニュー
 *---------------------------------------------*/

    #sp-menu-nav-list li:first-of-type a{
        margin-top: 0;
    }

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

    .btns-btn-left{
        width: 100%;
        height: 14.3em;
    }


    .btns-btn-right{
        margin-top: 4em;
        width: 100%;
        height: 14.3em;
    }

    #footer-contact{
        margin-top: 20em;
        padding: 19.5em 4em;
    }

      /*---------------------------------------------
 * FIRST
 *---------------------------------------------*/

    .first-p-row-grid{
        grid-row-gap: 8.5em;
        padding: 0 3.5em;
    }

    .first-p-grid2{
        grid-row-gap: 10em;
    }

    .first-p-ingrid3{
        display: none;
    }
    .first-p-text br{
        display: none;
    }

    .first-p4-text3{
        text-align: left;
    }

    #first-main .first-p5-pa-bo .first-p-text2{
        margin-top: 1em;
    }

    .first-p5-pa-bo .first-p-h2{
        margin-top: 1em;
    }

    .first-p-grid5{
        margin-top: 7em;
        padding: 0 3.5em;
    }

    .first-p-grid5.first{
        margin-top: 10em;
        padding: 0 3.5em;
    }

    .first-p-grid6{
        margin-top: 7em;
        padding: 0 3.5em;
    }

    .first-text-sp-padding{
        padding: 0 1.2068965517em;
    }

    .first-p2-e2{
        padding: 0 3.5em;
    }

    .first-p-zeh{
        padding: 0 3.5em;
    }

    .first-p4-text3.first-text-sp-padding{
        padding:0 1.3461538462em;
    }

    .first-p-grid5-img{
        width: 100%;
    }

     /*---------------------------------------------
 *  ABOUT　ページ
 *---------------------------------------------*/

    .page-template-page-about-p4 .about-p-grid1{
        height: auto;
    }

    .about-p4-row-grid .d-f-l{
        display: block;
    }
    .about-subtitle{
        padding: 0 7.5em;
    }

    .about-p-head-wrap{
        padding: 0 7.5em;
    }

     /*---------------------------------------------
 * Archive EVENTS
 *---------------------------------------------*/

    #archive-events-list .desc{
        font-size: 2.6rem;
        line-height: 1;
        margin-top: .3em;
    }

    #archive-events-list .img-wrap img{
        height: calc((100vw - 8em)/1.7790697674);
    }

    #archive-events-list{
        row-gap: 8.2em;
        margin-top: 10em;
        margin-bottom: -1.7em;
    }

    #scroll-top-btn-sp-wrap {
        height: 8.6em;
        margin-top: 20em;
    }

    #scroll-top-btn-sp-wrap::after {
        height: 2.8em;
        width: 2.8em;
    }

    #archive-events-list .status{
        font-size: 2.6rem;
    }

    /*---------------------------------------------
 * Single EVENTS
 *---------------------------------------------*/

    .entry-events-cat{
        font-size: 2.4rem;
        max-width: 10em;
    }

    .entry-events-days{
        font-size: 3rem;
    }

    .entry-events-days img{
        width: 2em;
    }

    #booking-form-section {
    padding: 10em 4em 8em;}

    #booking-form-header.event-form > p{
        font-size: 2.6rem;
    }

    #booking-form-header > h2 {
        font-size: 4.4rem;
        line-height: 1.25;
    }

    .booking-form-block h3 {
        font-size: 3.6rem;
        line-height: 1.25;
        margin: 0;
    }

    .booking-form-block h3.small {
        font-size: 3.6rem;
        margin-right: 0;
    }

    #calendar,
    #model-calendar {
        margin: 3.8em 0;
    }

    #booking-form .auto-input {
        width: 13em;
    }

    #booking-form input {
        font-size: 3.2rem;
    }

    #booking-form .booking-form-block.border {
        padding: 8em 0;
        margin-top: 4em;
    }

    .booking-form-block-time {
        margin-top: 1.5em;
    }

    #booking-form select {
        font-size: 3.2rem;
        width: 100%;
    }

    .require::after {
        font-size: 2.2rem;
    }

    .booking-form-block h3 {
        font-size: 3.6rem;
        line-height: 1.25;
        margin: 0;
    }

    .text-notes-tel {
        font-size: 4.4rem;
    }

    #booking-form .booking-form-block.address > .require:first-of-type {
        margin-top: .8em;
    }

    #booking-form .booking-form-block.address > .require {
        font-size: 3.2rem;
        margin-top: 2em;
    }

    .booking-form-block h4 {
        font-size: 2.8rem;
    }

    .booking-form-block.privacy-notes {
        padding: 5em 4em;
        margin-top: 10em;
    }

    #page-article.contact .booking-form-block.personal .booking-form-item-text p{
        margin-top: 0.3em;
        font-size: 2.9rem;
    }

    .submit-note {
        font-size: 2.8rem;
    }

    #submit-btn.event {
        font-size: 3.2rem;
        margin-top: 3.125em;
        font-weight: bold;
    }

    #booking-form .flatpickr-monthDropdown-months,
    #booking-form .flatpickr-current-month input.cur-year {
        font-size: 3.4rem;
        padding: 0;
    }

    .flatpickr-months .flatpickr-month {
        height: 5em;
    }

    span.flatpickr-weekday,
    .flatpickr-day {
        font-size: 3rem;
    }

    .flatpickr-months .flatpickr-prev-month,
    .flatpickr-months .flatpickr-next-month {
        font-size: 2.4rem;
    }

    .flatpickr-calendar .flatpickr-months .flatpickr-next-month{
        right: 12px;
        padding-top: 1.3em;
    }

    .flatpickr-calendar .flatpickr-months .flatpickr-prev-month{
        left: 12px;
        padding-top: 1.3em;
    }

    .flatpickr-calendar.inline {
        width: 100%;
    }

    .flatpickr-current-month .numInputWrapper {
        width: 6em;
    }

    .flatpickr-current-month {
        top: 0;
    }

    .flatpickr-innerContainer {
        margin-top: 1em;
    }

    .text-notes {
        margin: 0 0 -.4em;
    }

    .text-notes > span, .text-notes > a {
        font-size: calc(40vw / var(--spwr));
    }

    #booking-form .booking-form-input > input,
    #booking-form .app-form-contact > input {
        font-size: 3.2rem;
        height: 3em;
        margin-top: .3em;
        padding: 0 0 0 1em;
        width: 100%;
        word-break: keep-all;
    }

    #booking-form .booking-form-input-sp >input{
        width: 49%;
    }


      /*---------------------------------------------
 * 施行事例　建築中
 *---------------------------------------------*/

    .works-comment p{
        font-size: 2.9rem;
    }

    .warks-380-230.bottom{
        margin-top: 0;
    }

    .warks-com.bottom{
        margin-bottom: 0;
    }

    .warks-a1{
        margin-top: 10em;
    }


      /*---------------------------------------------
 * lineup ページ
 *---------------------------------------------*/

    .tr-com br{
      display: none;
    }

    .tr-slic .slick-list{
      height: 58em;
    }

    .tr-slic.pc-none img{
        height: auto;
    }

    .tr-slic.pc-none .slick-list{
        height: 77em;
    }

       /*---------------------------------------------
 * 資料請求ページ
 *---------------------------------------------*/

    .booking-head{
        font-size: 4rem;
    }

    #page-article.contact #zipcode{
        width: 11em;
    }

    #page-article.contact .select-box{
        width: 35.2em;
        height: 10.3em;
        margin-top: 2em;
    }

    #page-article.contact #prefecture-selectbox{
        width: 100%;
    }

    .booling-radio-grid{
        display: block;
        margin-top: 3em;
    }

    .booking-radio{
        padding: .8em;
    }

    .sp-booking-radio-select{
        padding: 2em 7em;
    }

    .bokking-form-radiobutton{
        margin: 0;
    }

    #booking-form .bokking-form-radiobutton input{
        font-size: 2.6rem;
    }

    #page-article.contact .booking-form-block:last-of-type{
        margin-top: 5em;
    }

    .item-selects{
    grid-template-columns: repeat(2, 44.02985075%);
    grid-template-rows: 1fr 1fr 1fr;
    row-gap: 4em;
    margin: 6em 0 0 0;
    }

    .item-selects-part-img{
        height: auto;
    }

    .item-selects-part:last-of-type .item-selects-part-img img{
        width: 100%;
    }

    .item-selects-part:nth-of-type(4) .item-selects-part-img{
        height: 41.844em;
    }

    .item-selects-part label{
        font-size: 2.9rem;
    }

    /*---------------------------------------------
 * イメージハウス
 *---------------------------------------------*/

    #image-house-main{
        padding: 0 4em;
    }

    .consul-form-title{
        padding: 0 4em;
    }

    .consul-form-title h2{
        font-size: 4.5rem;
    }

    .booking-form-input .booking-form-width{
        font-size: 2.9rem;
    }

    .consul-date-text{
        font-size: 2.9rem;
    }

    .booking-form-block.border.consul > .require.small{
        font-size: 2.9rem;;
    }

    #booking-form .auto-input.consul {
        width: 11em;
    }

    #booking-form .booking-form-block.border.consul {
        padding: 5em 0;
        margin-top: 0;
    }

    .booking-form-block.address.consul{
        margin-top: 4.5em;
    }

    .booking-form-input.booking-people p{
        display: none;
    }

    .booking-form-input.booking-people label{
        font-size: 2.9rem;
    }

    .sp-booking-people{
        display: block;
        font-size: 2.4rem;
    }

    .booking-form-input.booking-people{
        margin-top: 2em;
    }

    .booking-form-block.address > .cf-massage-title {
    font-size: 3.2rem;
    }
    .booking-form-block textarea{
        font-size: 2.9rem;
    }
    .booking-form-input.textarea{
        margin-top: 2em;
    }

    #privacy-list > li > .title{
        font-weight: bold;
    }

    /*---------------------------------------------
 * first　環境への取り組み
 *---------------------------------------------*/
    .first-p-grid4 img{
        width: 100%;
    }

    .first-p-ingrid img{
    width: 100%;
    height: 44.1em;
    }

    .first-p-ingrid3 img{
        width: 100%;
    }

    #first-main a{
        display: inherit;
    }

      /*---------------------------------------------
 * lineup
 *---------------------------------------------*/
     .slick-dots{
        bottom: -4em;
    }

    #entry-lineup h2 {
      font-size: 6rem;
      text-align: center;
    }

    .tr-p1-title2{
        font-size: 6rem;
        text-align: center;
    }

    .top-lineup-wid.lineup{
        padding: 0;
        margin-top: 11em;
    }

    .tr-bottom{
        padding: 0;
    }

    .valo-tr-com{
        font-size: 2.9rem;
    }

    .valo-2f-plan-title-p:after{
        width: 8rem;
        height: 3px;
    }

    .valo-2f-plan-title-img{
        width: 50em;
    }

    .valo-2f-plan{
        padding: 0 4em;
    }

    .valo-floor{
        grid-template-columns: 1fr;
    }

    .valo-floor-direction{
        position: static;
        left: inherit;
        top: inherit;
        width: 13em;
        justify-self: center;
        margin-top: 8em;
    }

    .valo-floor-2nd{
        margin-top: 10em;
    }

    .valo-2f-number-1{
        font-size: 2.8rem;
        width: 1.5em;
        height: 1.5em;
        bottom: 7.5em;
        left: 3.6em;
    }

     .valo-2f-number-2{
        font-size: 2.8rem;
        width: 1.5em;
        height: 1.5em;
        bottom: 5.1em;
        left: 8.3em;
    }

    .valo-2f-number-3{
        font-size: 2.8rem;
        width: 1.5em;
        height: 1.5em;
        bottom: 6.6em;
        left: 14.8em;
    }

    .valo-2f-number-4{
        font-size: 2.8rem;
        width: 1.5em;
        height: 1.5em;
        bottom: 11em;
        left: 12.5em;
    }

    .valo-2f-number-5{
        font-size: 2.8rem;
        width: 1.5em;
        height: 1.5em;
        bottom: 12.3em;
        left: 18.3em;
    }

    .valo-2f-number-6{
        font-size: 2.8rem;
        width: 1.5em;
        height: 1.5em;
        bottom: 16.7em;
        left: 11.4em;
    }

    .valo-2f-number-7{
        font-size: 2.8rem;
        width: 1.5em;
        height: 1.5em;
        bottom: 6em;
        left: 7.7em;
    }

    .valo-modal-wrap{
        padding: 3em 5em 0;
    }

    .valo-modal-close{
        transform: translate(42em, -4.2em);
        font-size: 1.3rem;
    }

    .valo-modal-desc-h3{
        font-size: 4rem;
    }

    .valo-modal-title-h3{
        font-size: 4rem;
    }

    .valo-floor-desc-box-p{
        text-align: left;
    }

    .valo-2f-plan-flat-img{
        max-width: inherit;
    }

    .valo-2f-plan-direction{
        position: static;
        left: inherit;
        top: inherit;
        width: 13em;
        margin: 8em auto 0;
    }

    .valo-floor-flat-desc-box-p{
        text-align-last: left;
    }

    .valo-gallery-block{
        column-gap: 2em;
        row-gap: 2em;
        grid-template-columns: repeat(3, 21em);
        padding: 0 4em;
    }

    .lg-actions .lg-next{
        right: .5em;
    }

    .lg-actions .lg-prev{
        left: .5em;
    }

    .lg-toolbar .lg-icon{
        transform: none;
    }

    .lg-toolbar .lg-close:after{
        font-size: 3rem;
    }

    .tr-box2.valo{
        padding:  1rem 0.6666666667em;
        margin-top: 2.5em;
    }

    .valo-bg{
        padding: 0 4em;
    }

      /*---------------------------------------------
 *お客様の声
 *---------------------------------------------*/

    .voice-head-grid{
        display: block;
        height: auto;
    }

    .voice-s-thumbnail{
        width: 100%;
    }

    .voice-s-thumbnail:before{
        display: none;
    }

    .voice-s-thumbnail img{
        position: inherit;
    }

    .voice-s-title-wrap{
        width: 100%;
        display: block;
        height: auto;
    }

    .voice-s-main{
        padding: 0;
    }

        /*---------------------------------------------
 *news
 *---------------------------------------------*/

    .news-l-arrow.sp{
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    padding: 0;
    width: 2.4em;
    height: 3.4em;
    }
    .news-l-list:hover .news-l-arrow {
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    padding: 0;
    width: 2.4em;
    height: 3.4em;
    }

    .news-l-list a{
        padding: 0;
        line-height: 1.3333333333;
    }

    .aos-animate .expand::after {
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    pointer-events: auto;
    z-index: 1;
}
}
