.contactArea {
    padding: 3rem 0 6rem;
    align-content: center;

    background: var(--color-surface);
}

.contactContent {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.contactContent h3 {
    font-size: 1.5rem;
}


.wpcf7 {
    width: 100%;
    align-items: center;
}



.wpcf7-form {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1rem;


    padding: 2rem;
}



.formArea {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    width: 100%;
}

.wpcf7-form p {
    width: 100%;
    max-width: 40rem;
    padding-bottom: 0.5rem;

}

.wpcf7-form input {
    width: 100%;
    max-width: 40rem;
    height: 3rem;
    padding: 0 1rem;

}

.wpcf7-form textarea {
    resize: none;

    width: 100%;
    max-width: 40rem;
    height: 12rem;
    padding: 0.5rem 1rem;
}


/* テキスト・メール・テキストエリア全てのプレースホルダー */
.wpcf7 input::placeholder,
.wpcf7 textarea::placeholder {
    font-family: var(--font);
    color: var(--color-border);
}

/* フォーカス時のプレースホルダー */
.wpcf7 input:focus::placeholder,
.wpcf7 textarea:focus::placeholder {
    font-family: var(--font);
    color: var(--color-border);
}


#wpcf7-f8-o1 .wpcf7-form p:has(> input.wpcf7-submit.has-spinner.btn-primary) {
    /* ここにスタイル */
    display: flex;
    justify-content: center;
}

input.wpcf7-submit.has-spinner {
    width: 10rem;
    align-items: center;
}

.wpcf7-spinner {
    display: none;
}