#eyecatch {
  background-image: url(/assets/images/contact/title-img.png);
  background-size: cover;
  background-position: center;
  width: 100%;
  /*width: 75vh;*/
}
 #eyecatch .title-bg {
    background-image: url(/assets/images/service/housecleaning/title-purple.png);
    background-size: cover;
    background-position: right;
    height: auto;
    width: 70%;
  }
.vertical-align-bottom {
  vertical-align: bottom;
}
.vertical-align-sub {
  vertical-align: sub;
}



/* 上部バナーエリア */
  .contact-banner {
    background-color: #f7f3fb;
    padding: 2.5rem 1rem;
    border-radius: 4px;
  }
  .contact-badge {
    background-color: #ffffff;
    border: 2px solid #5d4b8b;
    font-size: 0.9rem;
    padding: 0.25rem 0.75rem;
    border-radius: 50rem;
    display: inline-block;
  }
  .contact-title {
    color: #d65c82; /* またはピンク系の色 */
    font-weight: bold;
  }
  .line-btn {
    background-color: #06c755;
    color: #ffffff;
    font-weight: bold;
    border-radius: 50rem;
    padding: 0.75rem 1.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
  }
  .line-btn:hover {
    color: #ffffff;
    opacity: 0.9;
  }
  .contact-tel-number {
    color: #332d42;
    font-weight: bold;
    font-size: 2rem;
    letter-spacing: 0.05em;
  }
  .contact-tel-time {
    color: #666666;
    font-size: 0.85rem;
  }

  /* 案内文エリア */
  .contact-desc {
    color: #333333;
    font-size: 0.95rem;
    line-height: 1.6;
  }

  /* テーブル（フォーム枠）エリア */
  .contact-table {
    border-top: 1px solid #5d4b8b;
    border-bottom: 1px solid #5d4b8b;
  }
  .contact-table th,
  .contact-table td {
    padding: 1.25rem 1.5rem;
    vertical-align: middle;
  }
  .contact-table th {
    background-color: #f4effa;
    color: #5d4b8b;
    font-weight: normal;
    text-align: center;
    width: 25%;
    white-space: nowrap;
  }
  .contact-table td {
    background-color: #ffffff;
  }
  .contact-table tr:not(:last-child) th,
  .contact-table tr:not(:last-child) td {
    border-bottom: 1px dotted #8d7cae;
  }

  /* 疑似フォームの枠線スタイル（側のみ） */
  .fake-input {
    border: 1px solid #bdafd8;
    border-radius: 6px;
    padding: 0.5rem 0.75rem;
    background-color: #ffffff;
    height: 40px;
  }
  .fake-textarea {
    border: 1px solid #bdafd8;
    border-radius: 6px;
    padding: 0.75rem;
    background-color: #ffffff;
    height: 120px;
    color: #888888;
    font-size: 0.9rem;
  }
  .note-text {
    font-size: 0.85rem;
    color: #555555;
    margin-left: 0.5rem;
  }

  /* レスポンシブ調整 */
  @media (max-width: 767.98px) {
    .contact-table th,
    .contact-table td {
      display: block;
      width: 100%;
      text-align: left;
    }
    .contact-table th {
      background-color: #f4effa;
      border-bottom: none !important;
      padding-bottom: 0.25rem;
    }
    .contact-table td {
      padding-top: 0.25rem;
    }
    .contact-tel-number {
      font-size: 1.5rem;
    }
  }


@media screen and (min-width: 769px) {
  #eyecatch {
    background-size: 60%;
    background-repeat: no-repeat;
    background-position: bottom right;
    height: auto;
    width: 100%;
  }
  #eyecatch .title-bg {
    background-size: cover;
    background-position: right;
    height: auto;
    width: 750px;
  }
}