@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');

*{
  margin: 0;
  padding: 0;
  font-size: 0;
  box-sizing: border-box;
  font-weight: normal;
  color: #333333;
  /* 全体的にcopperplateフォントでよかったでしょうか？ */
  /* copperplateフォントがブラウザによって対応してなかった場合は別のフォントを充てます */
  font-family: "Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
}

/* *************************************** */
/* HEADER & TOP IMG                        */
/* *************************************** */
.header{
  position: relative;
  background-color: #DE9158;
  margin: 0;
}
.header h1{
  position: absolute;
  color: #ffffff;
  top: 50%;
  transform: translateY(-50%);
  font-family: Copperplate,'arial black', sans-serif;
}
.topimg{
  display: grid;
  place-items: center;
}
@media screen and (min-width:840px){
  .header{
    height: 34px;
  }
  .header h1{
    margin-left: 10px;
    font-size: 15px;
  }
  .topimg{
    margin: 70px auto 30px auto;
  }
  .topimg img{
    width: 360px;
  }
}
@media screen and (max-width:839px){
  .header{
    height: 38px;
  }
  .header h1{
    margin-left: 5px;
    font-size: 18px;
    letter-spacing: 1px;
  }
  .topimg{
    margin: 0px auto 30px auto;
  }
  .topimg img{
    width: 42.86vw;
  }
}

/* *************************************** */
/* CONTACT-FORM                            */
/* *************************************** */
.mw_wp_form{
  position: relative;
  margin: 0 18.3vw;
}
@media screen and (min-width:840px){
  .mw_wp_form{
    margin: 0 18.3vw;
  }
}
@media screen and (max-width:839px){
  .mw_wp_form{
    margin: 0 10px;
  }
}
.contact-form-question{
  width: 100%;
  height: 30px;
  font-size: 15px;
  font-weight: bold;
}
.contact-form-question span{
  margin-left: 5px;
  height: 30px;
  font-size: 14px;
  color: red;
}
.contact-form-answer{
  font-size: 13px;
  margin-bottom: 20px;
}
.contact-form-answer input{
  width: 100%;
  height: 50px;
  font-size: 13px;
  padding-left: 10px;
  border: 1px solid #eeeeee;
}
.contact-form-answer input::placeholder{
  font-size: 13px;
  color: #eeeeee;
}
.mwform-radio-field label{
  display: grid;
  position: relative;
  height: 42px;
  padding: 10px;
}
.mwform-radio-field label input{
  position: absolute;
  width: 15px;
  left: 10px;
  font-size: 13px;
  padding-left: 10px;
}
.mwform-radio-field label span{
  position: absolute;
  top: 16px;
  left: 30px;
  font-size: 13px;
  padding-left: 10px;
}
.contact-form-answer select{
  width: 100%;
  height: 50px;
  font-size: 15px;
  padding-left: 10px;
  color: #333333;
  border: 1px solid #eeeeee;
}
.contact-form-answer-lg textarea{
  width: 100%;
  height: 100px;
  border: 1px solid #eeeeee;
  padding: 10px;
  font-size: 15px;
}
.contact-form-answer-lg textarea{
  border: 1px solid #eeeeee;
  font-size: 15px;
}
.contact-privacy-policy{
  margin: 30px auto 40px auto;
  text-align: center;
}
.contact-checkbox{
  margin-right: 10px;
}
.mwform-checkbox-field-text{
  color: #333333;
  font-size: 14px;
}
.contact-confirm{
  width: 500px;
  height: 32px;
  font-size: 14px;
}

.contact-confirm{
  position: relative;
  display: grid;
  text-align: center;
  align-content: center;
  font-size: 16px;
  font-weight: bold;
  color: #ffffff;
  text-decoration: none;
  padding: 0 auto;
  margin: auto;
  margin-bottom: 50px;
  width: 100%;
  height: 62px;
  border-radius: 31px;
  background: linear-gradient(to right, #1B5E8D, 70%, #2EA2E2);
}

/* *************************************** */
/* COMPLETE                                */
/* *************************************** */
.complete{
  position: relative;
  background-color: #DE9158;
  width: 100vw;
  height: 100vh;
}
.contents{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%);
}
.contents a{
  width: 100%;
  color: #ffffff;
  text-align: center;
  font-size: 36px;
  text-decoration: none;
  font-family: Copperplate,'arial black', sans-serif;
  left: 50%;
  transform: translateX(-50%);
}
.contents p{
  width: 100%;
  color: #ffffff;
  margin: 10px 0;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  font-family: Copperplate,'arial black', sans-serif;
}
.contents img{
  position: relative;
  margin: 10px 0;
  width: 76px;
  left: 50%;
  transform: translateX(-50%);
}
.mw_wp_form_send_error,.mw_wp_form_complete{
  width: 100%;
  color: #ffffff;
  margin: auto;
  text-align: center;
  font-size: 12px;
  font-weight: bold;
  font-family: Copperplate,'arial black', sans-serif;
}