@charset "UTF-8";
.form-wrap{
  width: 100%;
  padding: 2rem 4rem;
  margin: 0 auto;
}
form{
  display: flex;
  flex-direction: column;
  align-items: center;
}
.inputContainer{
  display: grid;
  grid-template-columns: 22rem 1fr;
  column-gap: 6rem;

  width: 100%;
  margin-bottom: 2.4rem;
}
.inputContainer .title,
.inputContainer .text,
.inputContainer input,
.inputContainer iext,
.inputContainer select,
.inputContainer textarea{
  font-size: 1.7rem;
  line-height: 1.4;
  padding: .8rem 0;
}
.inputContainer select{
  /*セレクトの高さ調整*/
  padding: 1rem 0;
}
.inputContainer .title{
  position: relative;
  font-weight: 700;
}
.inputContainer .title.required::before{
  content: '必須';
  position: absolute;

  top: 1rem;
  right: 0;

  display: inline-block;
  padding: .2rem .4rem;
  font-size: 1.3rem;
  color: #fff;
  background: #f00;
}
.inputContainer input,
.inputContainer select,
.inputContainer textarea{
  width: 100%;
  padding-left: .8rem;
  padding-right: .8rem;

  border: solid 1px #90cbf9;
  background: #f7f7f7;
  border-radius: 2px;
  outline-color: #2196f3;
}
form input[type="submit"]{
  display: none;
}
form label.submitbtn{
  width: 100%;
  margin-top: 64px;
  padding: 1.2rem 0;
}
form > p{
  width: 100%;
}
#contact-result h2{
  padding-bottom: 3.2rem;
}
#contact-result .phraze{
  text-align: center;
  font-size: 2.4rem;
  color: #009b37;
  line-height: 1.4;
}
#contact-result .phraze small{
  font-size: 2rem;
  color: #333;
}

.wpcf7{
  width: 100%;
}


@media (max-width : 1024px){
  .form-wrap{
    padding: 2rem 0;
  }
}
@media (max-width : 599px){
  .inputContainer{
    display: grid;
    grid-template-columns: 1fr;
  }
}