/* デフォルトのマージンをキャンセル */
.hs-contact-form-wrapper p{
    margin-block-start: 0;
    margin-block-end: 0;
}

.hs-contact-form-wrapper .eael-contact-form-7 .wpcf7-form p{
    margin-bottom:0;
    width: 100%;
}

.hs-contact-form-wrapper .wpcf7-list-item{
    margin: 0;
    display: inline-block;
    width: 100%;
}

/* フォーム全体 */
.hs-contact-form-wrapper {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 20px;
  max-width: 580px;
  margin: 0 auto;
  color: #3e3a39; /*タイトル部分のカラー*/
}

/* 枠線 */
.hs-contact-form-wrapper .contact-item-wrapper {
  border-top: 2px solid #b0dcc6;
  padding: 20px 0;
  position: relative;
}

/* 項目タイトル */
.hs-contact-form-wrapper .contact-item-title {
  font-size: 18px;
  font-weight: 500;
  display: inline-block;
  margin-bottom: 10px;
}

/**** 必須・任意ラベル ****/
.hs-contact-form-wrapper .required-box {
  position: absolute;
  top: 12px;
  right: 0;
}

/* 必須ピンク */
.hs-contact-form-wrapper .required-box p {
  font-size: 12px;
  color: #fff;
  background-color: #ffacd0;
  padding: 2px 6px;
  /* border-radius: 3px; */
}

/* 任意のみ背景グレー */
.hs-contact-form-wrapper .required-box.not-required p {
  background-color: #aaa;
}


/**** 入力ボックス（共通※チェックボックスを除く） ****/
.hs-contact-form-wrapper .contact-item-wrapper .wpcf7-form-control{
  width: 100%;
  padding: 12px;
  border: none;
  background-color: #f9f7f3 !important; /*背景グレー*/
  font-size: 18px;
  box-sizing: border-box;
  border-radius: 4px;
}

/* チェックボックスのpaddingはキャンセル（不要なグレー背景を防ぐ） */
.hs-contact-form-wrapper .check-box-wrapper .wpcf7-form-control{
    padding:0;
}

/* プレースホルダー */
.hs-contact-form-wrapper .wpcf7-form-control::placeholder {
  color: #afafaf;
}

/* テキストエリア（コメント） */
.hs-contact-form-wrapper textarea {
  height: 120px;
  resize: vertical;
}

/* ご相談内容：チェック項目全体 */
.hs-contact-form-wrapper .check-box-wrapper label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  background-color: #f9f7f3;
  padding: 10px 14px;
  border-radius: 4px;
  margin: 0 0 10px;
  box-sizing: border-box;
}

/* テキストは左寄せ */
.hs-contact-form-wrapper .check-box-wrapper .wpcf7-list-item-label {
  flex: 1;
  text-align: left;
  font-size: 18px;
}

/* チェックボックスを右端に */
.hs-contact-form-wrapper .check-box-wrapper input[type="checkbox"] {
  margin-left: 10px;
}

/* 全幅にする */
.hs-contact-form-wrapper .check-box-wrapper .wpcf7-list-item{
    width: 100%;
}

/**** 同意事項 ****/
.hs-contact-form-wrapper .acceptance-wrapper label{
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  background-color: #f9f7f3;
  padding: 10px 14px;
  border-radius: 4px;
  box-sizing: border-box;
  font-size: 18px;
}

.hs-contact-form-wrapper .acceptance-wrapper .wpcf7-form-control{
    padding: 0px;
}

/* 同意事項ラベル・注意文 */
.acceptance-wrapper p {
  margin: 0.4em 0;
  font-size: 14px;
}

.acceptance-wrapper a {
  color: #479e8f;
  text-decoration: underline;
}

/* 全幅にする */
.acceptance-wrapper .wpcf7-form-control{
    width: 100%;
}


/**** 送信ボタン（楕円形・アイコン付き） ****/
.hs-contact-form-wrapper .contact-btn-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 40px;
}

.hs-contact-form-wrapper .eael-contact-form input[type="submit"]{
  background-color: transparent;
  border: 2px solid #4fb89e;
  color: #3e3a39;
  padding: 10px 50px;
  font-size: 18px;
  border-radius: 40px;
  position: relative;
  cursor: pointer;
  transition: background-color 0.4s, border-color 0.4s, color 0.4s;
}

.hs-contact-form-wrapper input[type="submit"]:hover {
  background-color: #479E8F;
  border-color: #479E8F;
  color: white;
}

/* 送信ボタンを中央寄せにする */
.hs-contact-form-wrapper .contact-btn-wrapper p {
  text-align: center;
}
.hs-contact-form-wrapper input[type="submit"] {
  display: inline-block;
}


/*ローディングアイコンを非表示*/
.wpcf7-spinner{
  display: block;
}