@charset "UTF-8";
/*
 * page-modelhouse_6.css
 * 藤田様邸モデルハウスLP（modelhouse6）専用の上書きCSS。
 *
 * ベースは page-modelhouse_5.css を共用しているため、このファイルには
 * modelhouse6 だけに効かせたい差分のみを書く。
 * 読み込み順は page-modelhouse_5.css → page-modelhouse_6.css なので、
 * 同じ詳細度なら後勝ちでこちらが優先される。
 * ※ page-modelhouse_5.css 本体は modelhouse5 と共有しているため編集しないこと。
 */

/* ===== 旧インライン style ブロック 1 ===== */
    /* 25029 追加 */
    .main {
      overflow: hidden;
    }

    .mv {
      margin-bottom: 260px;
    }

    .mv-info {
      padding-top: 9.625rem;
    }

    .mv-ph_child {
      position: absolute;
      left: 2.5rem;
      bottom: -100px;
      width: 40%;
    }

    .mv-ttl small {
      margin-top: 20px;
      font-size: 1.75rem;
      line-height: 1.5em;
    }

    @media screen and (max-width: 640px) {
      .mv-ph_child {
        position: relative;
        display: block;
        left: unset;
        right: 0;
        bottom: -40px;
        width: 72%;
        margin-left: auto;
        max-width: 380px;
      }

      .mv-ph_child img {
        max-width: unset;
      }
    }

    .mv-ph_child img {
      width: 100%;
      max-width: 428px;
    }

    .about-info__ph.about-info__ph-first {
      transform: translateY(220px);
    }

    .about-info__ph.about-info__ph-last {
      margin-left: 15.3vw;
    }

    @media screen and (max-width: 640px) {
      .about-info__ph.about-info__ph-last {
        margin-top: 4%;
      }
    }

    .cta-link {
      width: 24.8rem;
    }

    #form {
      padding: 0;
    }

    .contact .cmn-wrap {
      padding-bottom: 0;
    }

    #form input[type="submit"],
    #form input[type="button"] {
      line-height: 52px;
    }

    @media screen and (max-width: 900px) {
      .about-block {
        flex-wrap: wrap;
        gap: 0;
      }

      .about-info {
        width: 100%;
      }

      .about-info__txt {
        margin-bottom: 4%;
      }

      .about-info__ph.about-info__ph-first {
        transform: translateY(0px);
      }
    }

    .features-content__slide {
      margin-left: calc(50% - 50vw);
      width: 100vw;
    }

    .features-content__slide-item {
      width: 33.333%;
    }

    .features-content__slide-item img {
      width: 100%;
      /* height: 100%; */
      height: auto;
    }

    .features-content__slide-list.swiper-wrapper {
      height: 340px;
    }

    .gallery-slide__list {
      height: 607px;
    }

    @media screen and (max-width: 900px) {
      .features-content__slide-list.swiper-wrapper {
        height: auto;
      }

      /* SPはスライドの縦を固定せず、写真の比率（864:576）に任せる。
         固定値だと object-fit:contain の余白が上下に出て、間延びして見えるため */
      .gallery-slide__list {
        height: auto;
      }

      .gallery-slide__item {
        height: auto;
      }

      .gallery-slide__item img {
        height: auto;
        object-fit: cover;
      }
    }

    .gallery .cmn-wrap {
      padding-bottom: 1.375rem;
    }

    @media screen and (max-width: 640px) {
      .features-content__slide-list.swiper-wrapper {
        flex-wrap: wrap;
        width: 100%;
      }

      .features-content__slide-item:nth-of-type(1) {
        width: 50%;
        order: 2;
        height: auto;
      }

      .features-content__slide-item:nth-of-type(2) {
        width: 100%;
        height: auto;
        order: 1;
      }

      .features-content__slide-item:nth-of-type(3) {
        width: 50%;
        order: 3;
        height: auto;
      }

      .cta-link {
        width: 90%;
        bottom: 10%;
      }
    }

/* ===== 旧インライン style ブロック 2 ===== */
    @media screen and (min-width: 641px) {
      .mv-info {
        width: unset;
        position: absolute;
        padding-top: 5.625rem;
        padding-left: 2rem;
        color: #fff;
      }

      .mv-ph {
        width: 100%;
      }

      .mv-subttl {
        color: #fff;
        /* 空など明るい写真でも白文字が沈まないように、うっすら影を敷く */
        text-shadow: 0 1px 14px rgba(0, 0, 0, .2), 0 2px 28px rgba(0, 0, 0, .13);
      }

      .mv-subttl span {
        color: #fff;
        text-shadow: 0 1px 14px rgba(0, 0, 0, .2), 0 2px 28px rgba(0, 0, 0, .13);
      }

      .mv-subttl small {
        color: #fff;
        border: 1px solid #fff;
        text-shadow: 0 1px 14px rgba(0, 0, 0, .2), 0 2px 28px rgba(0, 0, 0, .13);
        box-shadow: 0 1px 16px rgba(0, 0, 0, .1);
      }

      .mv-ttl {
        text-shadow: 0 1px 18px rgba(0, 0, 0, .22), 0 4px 40px rgba(0, 0, 0, .14);
      }

      .mv-scroll span {
        text-shadow: 0 1px 12px rgba(0, 0, 0, .18);
      }
    }