/* ---------------------------------------
  contactform7共通スタイル
---------------------------------------- */

/* お名前 フリガナ */
input[name="your-last-name"],
input[name="your-last-kana"]{
  width: 48% !important;
  margin-right: 10px !important;
}
input[name="your-first-name"],
input[name="your-first-kana"]{
  width: 48% !important;
}

/* メールアドレス */
input[name="your-email"] {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 100%;
  height: 40px;
  padding-left: 10px;
  border: 1px solid #eee;
  border-radius: 3px;
  background-color: #fff;
}

/* 来館日 */
input[name="visit-date"] {
  width: 150px !important;
  margin-right: 10px !important;
}

/* 来館時間 */
select[name="visit-time"] {
  width: 150px !important;
}


/* エラー表示の崩れを調整 */
.wpcf7-form-control-wrap {
  position: relative;
}
.wpcf7-not-valid-tip {
  position: absolute;
  left: 0;
  min-width: 150px;
  font-size: 12px;
  letter-spacing: 0;
  text-align: left;
}

/* 送信ボタンの表示調整（spinner） */
.wpcf7-spinner {
  position: absolute !important;
}

/* select のエラー文が隠れないようにする */
.l-contact-dl dd .m-select {
  overflow: visible !important;
}


/* ---------------------------------------
  資料請求、フリー会員、ゴールド会員のスタイル
---------------------------------------- */

/*
部分一致で下記に一括で適用する
body.page-catalogform,
body.page-form,
body.page-form2,
body.page-form3,
body.page-form-gold,
body.page-form-gold2,
body.page-thanks,
body.page-thanks-bank,
body.page-thanks-cash{
*/
body.page-catalogform,
body[class*="page-form"],
body[class*="page-thanks"] {
  margin-bottom: 0 !important;

  .l-header-tel-box,
  .l-header-btn-box {
    display: none;
  }

  .l-breadcrumbs-wrap {
    display: none;
  }
  .nav-box {
    display: none;
  }
  .l-footer {
    display: none;
  }
  .l-float {
    display: none;
  }
  .l-main-lower {
    max-width: 800px;
    width: 100%;
    margin-top: 33px;
    margin-left: auto;
    margin-right: auto;
  }

  @media screen and (max-width: 767px) {
    .l-main-lower {
      margin-top: 0px;
    }
  }

  /* フリー会員・ゴールド会員＞送信ボタン */
  .btn-contact-submit {
    width: 262px;
    height: 80px;
    display: block;
    border: none;
    cursor: pointer;
    background: url("../img/common/form_submit.svg") no-repeat center center / contain;
    font-size: 0;
    color: transparent;
    padding: 0;
  }

    /* 事前相談・資料請求＞送信ボタン */
  .btn-contact-submit_2 {
    width: 262px;
    height: 80px;
    display: block;
    border: none;
    cursor: pointer;
    background: url("../img/common/form_submit2.svg") no-repeat center center / contain;
    font-size: 0;
    color: transparent;
    padding: 0;
  }

  /* ゴールド会員＞支払い方法 */
  .l-contact-radio .wpcf7-list-item {
    display: inline-block;
    margin-right: 1.5em;
  }

  @media screen and (min-width: 768px) {
    .l-main-lower {
      margin-top: 56px;
    }
  }

  @media screen and (min-width: 1000px) {
    .l-side {
      display: none;
    }
    .l-header-logo {
      max-width: 230px !important;
      margin-bottom: 10px;
    }
    .l-header-tel-box,
    .l-header-btn-box {
      display: none;
    }
  }
}

/* ---------------------------------------
  資料請求、フリー会員、ゴールド会員のスタイル
---------------------------------------- */

/* 本アップ時は
body.page-form-gold {
に変えるコト */

body[class*="page-form-gold"] {
  .wpcf7-submit,
  .btn-contact-submit {
    pointer-events: auto !important;
  }

  /* pay-place のラジオのうち4番目（選択しない）だけ非表示 */
/* .wpcf7-form-control-wrap[data-name="pay-place"] .wpcf7-list-item:nth-child(4) {
  display: none;
}
} */

}

/* ---------------------------------------
  フォームのメインビジュアルのスタイル（h1代替）
---------------------------------------- */

/* フリー会員 */
body[class*="page-form"]{

  /* 親のセンタリング用ボックス */
  .l-lower-title-box {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
  }

  /* h1 */
  .l-lower-title {
    text-indent: 200%;
    white-space: nowrap;
    overflow: hidden;

    display: block;
    width: 100%;
    max-width: 1080px; 
    height: 370px;     
    background: url("../img/form/mv-form-pc.png?v=1127") no-repeat center center / contain;
    margin: 0 auto;
  }

  @media screen and (max-width: 767px) {
    .l-lower-title-box {
      position: relative;
    }
    .l-lower-title {
      max-width: 100%;
      height: auto;
      aspect-ratio: 780 / 987;
      background-image: url("../img/form/mv-form-sp.png?v=1201");
      background-size: contain;
    }
  }

  /* ゴールド会員促進バナー枠 */
  .l-main-lower{
    .wp-block-image{
      a{
        transition: opacity 0.3s ease;
      }
     a:hover{
opacity: 0.6;
     }
    }
  }

  /* ゴールド会員促進バナー枠デバイスによる表示切り替え */
  .bnr-to-form-gold-sp{
    display: none;    
  }
  .bnr-to-form-gold-pc{
    display: block;    
  }

  @media screen and (max-width: 767px) {
    .bnr-to-form-gold-sp{
      display: block;      
    }
    .bnr-to-form-gold-pc{
      display: none;      
    }
  }
  
}

/* ゴールド会員 */
body[class*="page-form-gold"]{

  /* 親のセンタリング用ボックス */
  .l-lower-title-box {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
  }

  /* h1 */
  .l-lower-title {
    text-indent: 200%;
    white-space: nowrap;
    overflow: hidden;

    display: block;
    width: 100%;
    max-width: 1080px; /* 2161/2 ≒ 1080 */
    height: 468px;     /* 936/2 = 468 */
    background: url("../img/form/mv-form-gold-pc.png?v=1127") no-repeat center center / contain;
    margin: 0 auto;
  }


  @media screen and (max-width: 767px) {
    .l-lower-title-box {
      position: relative;
    }
    .l-lower-title {
      max-width: 100%;
      height: auto;
      aspect-ratio: 780 / 1280;
      background-image: url("../img/form/mv-form-gold-sp.png?v=1127");
      background-size: contain;
    }
  }
}



/* 事前相談 */
body.page-consultation-child[class*="page-form"]{

  /* 親のセンタリング用ボックス */
  .l-lower-title-box {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
  }

  /* h1 */
  .l-lower-title {
    text-indent: 200%;
    white-space: nowrap;
    overflow: hidden;

    display: block;
    width: 100%;
    max-width: 1080px;
    height: 365px;
    background: url("../img/form/mv-consultationform-pc.png?v=1127") no-repeat center center / contain;
    margin: 0 auto;
  }

  @media screen and (max-width: 767px) {
    .l-lower-title-box {
      position: relative;
    }
    .l-lower-title {
      max-width: 100%;
      height: auto;
      aspect-ratio: 780 / 1050;
      background-image: url("../img/form/mv-consultationform-sp.png?v=1127");
      background-size: contain;
    }
  }
}

/* 資料請求 */
body.page-catalogform{

  /* 親のセンタリング用ボックス */
  .l-lower-title-box {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
  }

  /* h1 */
  .l-lower-title {
    text-indent: 200%;
    white-space: nowrap;
    overflow: hidden;

    display: block;
    width: 100%;
    max-width: 1080px;
    height: 330px;
    background: url("../img/form/mv-catalogform-pc.png?v=1127") no-repeat center center / contain;
    margin: 0 auto;
  }

  @media screen and (max-width: 767px) {
    .l-lower-title-box {
      position: relative;
    }
    .l-lower-title {
      max-width: 100%;
      height: auto;
      aspect-ratio: 780 / 900;
      background-image: url("../img/form/mv-catalogform-sp.png?v=1127");
      background-size: contain;
    }
  }
}

/* ---------------------------------------
  スクロール促しマーク（共通スタイル）
---------------------------------------- */
/* @keyframes scroll-bounce {
  0%, 100% {
    transform: translateX(-50%) translateY(0);
    opacity: 0.7;
  }
  50% {
    transform: translateX(-50%) translateY(10px);
    opacity: 1;
  }
} */

@media screen and (max-width: 767px) {
  /* 文字「フォームはこちら」 */
  /* e
    content: "スクロール";
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 11px;
    color: #E60012;
    white-space: nowrap;
    z-index: 11;
  } */
  
  /* 三角 */
  /* body[class*="page-form"] .l-lower-title-box::after,
  body[class*="page-form-gold"] .l-lower-title-box::after,
  body.page-consultation-child[class*="page-form"] .l-lower-title-box::after,
  body.page-catalogform .l-lower-title-box::after {
    content: "";
    position: absolute;
    bottom: -30px;
    left: 50%;
    width: 0;
    height: 0;
    border-left: 35px solid transparent;
    border-right: 35px solid transparent;
    border-top: 20px solid #E60012;
    transform: translateX(-50%);
    transform-origin: center bottom;
    box-sizing: border-box;
    
    z-index: 10;
    font-size: 16px;
    line-height: 1;
  } */
}