#index.contact .main {
    overflow-x: clip;
  }

  #index.contact .main__grid {
    display: block;
  }

  #index.contact .main__info {
    flex: 0 0 6.6rem;
    min-width: 0;
    padding: 0.4rem 0.44rem 0.25rem;
    background: var(--color-primary);
    color: var(--color-white);
    clip-path: none;
  }

  #index.contact .main__lead {
    margin-bottom: 0.18rem;
    font-family: var(--font-family-base);
    font-size: 0.24rem;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: 0.02em;
  }

  #index.contact .main__text {
    max-width: none;
    font-family: var(--font-family-base);
    line-height: 1.75;
    letter-spacing: 0.02em;
    font-size: 0.14rem;
  }

  #index.contact .c-edge-frame {
    --edge-frame-gap: 0.11rem;
    --edge-frame-left-cut: 0.04rem;
    --edge-frame-right-cut: 0.03rem;
    flex: 1 1 auto;
    min-width: 0;
    padding-bottom: 0.4rem;
    background-color: var(--color-primary);
  }

  #index.contact .main__form-panel {
    --beveled-cut: 0.03rem;
    flex: 0 0 3.29rem;
    width: 3.29rem;
    min-width: 0;
    padding: 0.1rem 0.1rem 0rem;
    background: var(--color-white);
  }

  /* フォームは formrun（form.run）の iframe 埋め込み。高さだけ px で持つ理由はPCと同じ。
高さは実測（幅287pxで847px）に入力エラー表示ぶんの余裕を足した値 */
  #index.contact .main__form-embed {
    display: block;
    width: 100%;
    height: var(--contact-form-embed-height, 1144px);
    border: 0;
  }

  /* 以下の .form* は静的サイト由来のフォーム用スタイル。現在は未使用（差し戻し時の参照用） */
  #index.contact .form {
    width: 2.87rem;
  }

  #index.contact .form__row {
    margin-bottom: 0.28rem;
  }

  #index.contact .form__label {
    display: block;
    margin-bottom: 0.1rem;
    color: var(--color-primary);
    font-family: var(--font-family-base);
    font-size: 0.16rem;
    font-weight: 600;
    line-height: 1.4;
  }

  #index.contact .form__select-field {
    position: relative;
  }

  #index.contact .form__select,
  #index.contact .form__input,
#index.contact .form__textarea {
    --beveled-cut: 0.03rem;
    display: block;
    width: 100%;
    border: 0;
    outline: 0;
    background: var(--color-surface-form);
    color: var(--color-primary);
    font-family: var(--font-family-base);
    font-size: 0.14rem;
    line-height: 1.5;
    clip-path: polygon(var(--beveled-cut) 0, calc(100% - var(--beveled-cut)) 0, 100% var(--beveled-cut), 100% calc(100% - var(--beveled-cut)), calc(100% - var(--beveled-cut)) 100%, var(--beveled-cut) 100%, 0 calc(100% - var(--beveled-cut)), 0 var(--beveled-cut));
  }

  #index.contact .form__select,
#index.contact .form__input {
    height: 0.56rem;
    padding: 0 0.24rem;
    padding-inline: 0.16rem;
    font-size: 0.12rem;
  }

  #index.contact .form__select {
    appearance: none;
    padding-right: 0.4rem;
    color: var(--color-primary-muted);
    cursor: pointer;
  }

  #index.contact .form__select-field::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0.17rem;
    width: 0.09rem;
    height: 0.09rem;
    border-right: 0.02rem solid var(--color-primary);
    border-bottom: 0.02rem solid var(--color-primary);
    transform: translateY(-70%) rotate(45deg);
    pointer-events: none;
  }

  #index.contact .form__input::placeholder,
#index.contact .form__textarea::placeholder {
    color: var(--color-primary-muted);
  }

  #index.contact .form__textarea {
    height: 2rem;
    padding: 0.16rem;
    resize: vertical;
    font-size: 0.12rem;
  }

  #index.contact .form__agree {
    display: flex;
    align-items: center;
    gap: 0.08rem;
    margin-top: 0.28rem;
    margin-bottom: 0.46rem;
    justify-content: center;
  }

  #index.contact .form__checkbox {
    appearance: none;
    flex: 0 0 auto;
    width: 0.14rem;
    height: 0.14rem;
    margin: 0;
    border: 0.01rem solid var(--color-primary);
    background: var(--color-white);
    cursor: pointer;
  }

  #index.contact .form__checkbox:checked {
    background: var(--color-primary);
    box-shadow: inset 0 0 0 0.03rem var(--color-white);
  }

  #index.contact .form__agree-label {
    color: var(--color-primary);
    font-family: var(--font-family-base);
    font-size: 0.12rem;
    line-height: 1.5;
    cursor: pointer;
  }

  #index.contact .form__privacy-link {
    text-decoration: underline;
  }

  #index.contact .form__submit {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0 0 0.22rem;
    color: var(--color-primary);
    font-family: var(--font-family-base);
    font-size: 0.15rem;
    font-weight: 600;
    padding-bottom: 0.2rem;
  }

  #index.contact .form__submit::after {
    content: "";
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    height: 0.02rem;
    background: var(--color-primary);
  }

  #index.contact .form__submit-icon,
#index.contact .form__submit-icon img {
    display: block;
    flex: 0 0 auto;
    width: 0.16rem;
    height: 0.16rem;
  }

  #index.contact .c-page-title {
    /* 字面の左右余白を揃える。理由は sp/common.css の .c-page-title を参照 */
    --page-title-heading-padding-end: 0.11rem;
    --page-title-notch-x: 1.17rem;
  }

  #index.contact .main + .c-site-footer {
    margin-top: 0.24rem;
  }