.contact-form {
  .content-wrap {
    display: flex;
    gap: 32px;
    padding-top: 64px;
    padding-bottom: 80px;

    .support-wrap,
    .runway-wrap {
      display: none;
      flex: 1 1 auto;
      min-width: 0;
      flex-direction: column;
      @media (min-width: 1200px) {
        display: flex;
      }
    }
    .support-wrap {
      justify-content: space-between;

      .client {
        flex: 1 1 auto;
        min-width: 0;

        h2 {
          margin: 0;
          font-size: 16px;
          font-weight: 600;
        }

        .customer-slide {
          width: 142.86%;
          transform: scale(0.7);
          transform-origin: left top;

          .content-wrap {
            margin: 0;
            padding: 0;
          }
        }
      }

      .support {
        h2 {
          font-size: 24px;
          font-weight: 700;
          margin: 0;
        }

        ul {
          margin: 16px 0 0;
          padding: 0;
          list-style: none;

          li {
            display: flex;
            align-items: center;
            gap: 4px;

            li + & {
              margin-top: 4px;
            }
          }
        }
      }
    }
    .runway-wrap {
      .scroll-swiper {
        .viewport {
          display: flex;
          margin: 0;
          padding: 0;
          list-style: none;
          width: 100%;

          li {
            flex: 0 0 100%;
            border-radius: 32px;
            background: linear-gradient(103deg, #E9EDFF 8.6%, #A6ADFF 98.35%);
            display: flex;
            height: 355px;
            padding: 64px 80px;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            gap: 16px;

            .quote {
              margin: 0;
              font-size: 24px;
              color: rgba(0, 0, 0, 0.90);
              &::before {
                content: "\201D";
              }
              &::after {
                content: "\201C";
              }
              [lang=ja] &::before {
                content: "「";
              }
              [lang=ja] &::after {
                content: "」";
              }
            }

            .author {
              margin: 0;
              font-size: 16px;
              color: rgba(11, 18, 33, 0.80);
            }
          }
        }
        .controls {
          display: flex;
          gap: 16px;
          justify-content: center;
          align-items: center;
          margin-top: 16px;
        }
      }

      .features {
        margin-top: 80px;
        
        ul {
          margin: 0;
          padding: 0;
          list-style: none;

          li {
            color: var(--text-secondary);
            font-size: 16px;

            strong {
              color: #000;
              font-size: 20px;
              font-weight: 500;
              display: block;
              background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="19" height="13" viewBox="0 0 19 13" fill="none"><path d="M1.875 5.625L6.17418 9.92418C6.90641 10.6564 8.09359 10.6564 8.82583 9.92417L16.875 1.875" stroke="%2354C48C" stroke-width="3.75" stroke-linecap="round"/></svg>') no-repeat left center;
              padding-left: 30px;
            }

            li + & {
              margin-top: 32px;
            }
          }
        }
      }
    }

    .hbsform {
      --hsf-global__font-family: inherit;
      --hsf-background__padding: 0;

      /* button */
      --hsf-button__font-size: 15px;
      --hsf-button__padding: 15px calc(50% - 30px);

      /* field */
      --hsf-field-label__font-size: 14px;
      --hsf-field-input__background-color: #fff;
      --hsf-field-input__border-color: #E7E7EE;
      --hsf-field-input__border-radius: 4px;
      --hsf-field-input__padding: 12px 10px;

      margin: 0 auto;
      width: 100%;
      min-height: 900px;
      max-width: 640px;
      overflow: hidden;
      @media (min-width: 724px) {
        --hsf-background__padding: 32px;
        border-radius: 24px;
        border: 1px solid #E7E7EE;
      }
      @media (min-width: 1200px) {
        flex: 1 0 640px;
      }
    }
  }
}
