.wpcf7-form.init,
.wpcf7-form.invalid,
.wpcf7-form.sent{
  padding-left: 50px;
  padding-right: 50px;
  background-color: rgba(200, 200, 200, 0.2);
  margin-top: 30px;
  padding-top: 30px;
}
.wpcf7-form.init span.suc,
.wpcf7-form.invalid span.suc,
.wpcf7-form.sent span.suc{
  display: inline-block;
  padding: 1px;
  border: solid 1.5px var(--main-color);
  color: var(--main-color);
  font-size: .6rem;
  margin-bottom: 5px;
  margin-left: 10px;
  transform: translateY(-2px);
}
.wpcf7-form.init span.nec,
.wpcf7-form.invalid span.nec,
.wpcf7-form.sent span.nec{
  display: inline-block;
  padding: 1px;
  border: solid 1.5px red;
  color: red;
  font-size: .6rem;
  margin-bottom: 5px;
  margin-left: 10px;
  transform: translateY(-2px);
}
.wpcf7-form-control.wpcf7-submit{
    margin-top: 50px;
    background: var(--main-color);
    color: white;
  }
  .page-id-29 .wpcf7 form.invalid .wpcf7-response-output{
    border-color: var(--main-color);
  }

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
  .wpcf7-form.init,
  .wpcf7-form.invalid,
  .wpcf7-form.sent{
    padding-left: 10px;
    padding-right: 10px;
  }
}