/* -------------------------------------------------------------------------- 
/*	お問い合わせフォーム
/* -------------------------------------------------------------------------- */
.bl_contact{
  color: #366A86;
}
.mw_wp_form_confirm {
  color: black;
  font-weight: normal;
  font-family: 'Noto Sans JP', sans-serif;
}
.mw_wp_form_confirm h3{
  font-family: dnp-shuei-mgothic-std, sans-serif;
  font-weight: bold;
}
.mw_wp_form_confirm br{
  display: none;
}
.bl_contact input{
  color: black;
  font-size: 1.1em;
}
.bl_contact{
  max-width: 1000px;
}
/* 確認ボタン */
.bl_contact input[type="submit"]{
  width: 15em;
  padding-top: 1em;
  padding-bottom: 1em;
  margin-bottom: 1em;
  background-color: #FF9300;
  border-radius: 6px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 15%);
  border: none;
  color: white;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  font-size: 1.3em;
  font-weight: normal;
}
.bl_contact input[name="submitBack"]{
  background-color: white;
  color: #FF9300;
}
.bl_form_box{
  margin-bottom: 4em;
}
.mw_wp_form_confirm .bl_form_box {
  margin-bottom: 4em;
}
.bl_form_box input, .bl_form_box textarea,
.bl_form_table select{
  padding: 0 10px;
  height: 2em;
  border: 1px solid #DDD;
  border-radius: 3px;
}
/* 生年月日 */
.bl_form_table select{
  height: 33px;
}
.bl_form_box input[type="email"], .bl_form_box textarea{
  width: 100%;
}
.bl_form_box textarea{
  height: auto;
}
.bl_form_input{
  margin-bottom: 1em;
  display: flex;
}
.bl_name_input input{
  margin-right: .5rem;
}

/* 注意書き */
 #bl_caution{
  margin-bottom: 4em;
  padding: 2em 4em;
  background-color: #F7DEDE;
  border: #DC8381 1px solid;
}
#bl_caution .bl_caution_txt{
  max-width: 700px;
  margin: 0 auto 1em;
  color: #903D3D;
}
/* 電話番号ボタン */
#bl_caution .el_telbtn{
  width: 258px;
  height: 88px;
  margin: auto;
  padding: 1em;
  background-color: white;
  border-radius: 17px;
  text-align: center;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 15%);
  position: relative;
}
#bl_caution .el_telbtn_ttl{
  width: 40%;
  margin: auto;
  margin-bottom: .5em;
  background-color: #C8D72F;
  border-radius: 30px;
  color: white;
  font-size: .7em;
}
#bl_caution .el_telbtn_num{
  color: #366A86;
  font-size: 1.2em;
  position: relative;
  left: 20px;
}
#bl_caution .el_telbtn_num::before{
  content: url(../../assets/img/common/icon_tel.svg);
  position: absolute;
  left: 5%;
  top: 13%;
}
/* フォーム見出し */
.el_form_ttl{
  width: 100%;
  color: #366A86;
  background-color: #C8D72F;
  padding: .5em 1.5em .5em 1em;
  margin-bottom: 2em;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.el_form_ttl h3{
  line-height: 2em;
}
/* 必須マーク （入力画面のみ）*/
.mw_wp_form_input .required{
  width: 40px;
  padding: .4em 1.5em;
  color: #EA7E7E;
  font-size: .8em;
  background-color: white;
  border-radius: 5px;
}
.mw_wp_form_input .required__red{
  height: 1.2em;
  min-width: 2em;
  display: inline-block;
  padding: 0.4em 1.3em;
  color: white;
  font-size: .8em;
  line-height: 1.2em;
  background-color: #EA7E7E;
  border-radius: 5px;
  box-sizing: content-box;
}
.el_form_subttl{
  margin-bottom: 1em;
  color: #366A86;
  display: inline-block;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.el_form_subttl::before{
  content: url(../../assets/img/common/icon_select.png);
  position: absolute;
  top: -4px;
  left: -40px;
}

/* ラジオボタン */
.bl_form_radio{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .8em;
}
.bl_form_radio input[type="radio"] {
  display: none;
}
.bl_calender_radio{
  display: flex;
}
/* 日付ラジオボタン */
#bl_form_day label{
  margin-right: .5em;
}
#bl_form_day .bl_form_day_input{
  margin-left: 1em;
}
.bl_form_radio span{
  width: calc(50% - .6em);
}
.bl_form_radio label{
  width: 100%;
  height: 3em;
  display: inline-block;
  font-weight: bold !important;
  line-height: 3em;
  padding: 0 1em;
  border: 1px solid #DDDDDD;
  border-radius: 5px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 4%);
  box-sizing: border-box;
  cursor: pointer;
  color: #366A86;
}
.bl_form_radio input:checked + label{
  border: #4D90FE 3px solid;
  color: #4D90FE;
  /* 高さ - border*2 */
  line-height: calc(3em - 6px); 
  /* - border*1 */
  padding: 0 calc(1em - 3px);
}
.bl_form_radio input:checked:focus + label{
  outline-color: #BAE3F8;
}

/* 受診者について */
.mw_wp_form_input .bl_form_table{
  border: 1px solid #DDD;
}
.bl_form_table{
  display: flex;
}
.bl_form_table dl{
  display: flex;
  margin-bottom: 10px;
}
.mw_wp_form_confirm .bl_form_table{
  margin-bottom: 1rem;
}
.mw_wp_form_input .bl_form_table p{
  line-height: 0;
}
.mw_wp_form_input .bl_form_table dl{
  border-bottom: 1px solid #DDD;
}
.mw_wp_form_input .bl_form_table dl:nth-child(6){
  border: none;
}
.mw_wp_form_input .bl_form_table dt{
  width: 30%;
  background-color: #F4F4F4;
  padding: 2em 1em;
  display: flex;
  justify-content: space-between;
}
.mw_wp_form_input .bl_form_table dd{
  width: 70%;
  padding: 2em 1.5em;
}
.bl_name_input input{
  width: 43%;
}
.bl_name_txt{
  width: 2.5em;
}
.mw_wp_form_confirm .bl_name_txt:nth-child(even){
  margin-left: 2rem;
}
.bl_form_tel_txt{
  margin-right: .5em;
}
.mw_wp_form_confirm dt{
  width: 20%;
}
.mw_wp_form_confirm dd{
  width: 80%;
  padding-left: 3em;
  padding-right: 0;
}
.mw_wp_form_confirm .hp_bd-b{
  border: none;
}

.mw_wp_form_confirm .el_form_ttl{
  background-color: #F7F7F7;
}
.mw_wp_form_confirm .el_form_subttl{
  left: 0;
  transform: translateX(20%);
}

/*フォーム カレンダーデザイン */

/* カレンダーヘッダー */
#ui-datepicker-div .ui-widget-header{
  background: #F4F4F4;
}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year{
  width: 40% !important;
  margin-right: 10px;
}
.ui-datepicker .ui-datepicker-title select {
  margin: 2px 6px !important;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active{
  background: white !important;
}



/* 個人情報取り扱い */
.bl_form_consent{
  background-color: #F7F7F7;
  padding: 1em 2em;
  margin-bottom: 2em;
}
.bl_form_consent p{
  color: black;
  font-weight: normal;
  line-height: 1.5rem;
}
.bl_form_consent .bl_scrolle_box p{
  margin-bottom: 10px;
}
.bl_scrolle_box{
  height: 10em;
  margin: 1em;
  overflow: auto;
  padding: 1em 3em;
  background-color: white;
  border: 1px solid #DDDDDD;
  font-family: 'Noto Sans JP', sans-serif; ;
  font-weight: normal;
  font-size: .8rem;
  color: #535353;
}
.el_link{
  color: #2380C4;
}
.bl_form_consent a{
  text-decoration: underline;
}
.bl_form_consent_txt{
  text-align: center;
}

/* 確認画面 */
.el_ttl__center{
  text-align: center;
  margin-bottom: 2em;
  font-size: 1.2em;
}

/* 入力画面でのみ表示 */
.mw_wp_form_confirm .confirm-hidden {
   display: none;
  }
/* 確認画面でのみ表示 */
.mw_wp_form_input .input-hidden {
  display: none;
}

/* 送信完了画面 */
.mw_wp_form_complete{
  font-family: 'Noto Sans JP', sans-serif;
  color: black;
  font-weight: normal;
}
#bl_complete_caution{
  margin-bottom: 2em;
  padding: 2em 4em;
  background-color: #F7DEDE;
  border: #DC8381 1px solid;
  text-align: center;
  font-weight: 600;
}
#bl_complete_caution p{
  max-width: 700px;
  margin: 0 auto 0.2em;
  color: #903D3D;
}
.bl_coution_tel{
  width: 25em;
  margin: auto;
  padding: .8em;
  background-color: white;
  color: #903D3D;
  font-size: 1.3em;
  font-weight: bold;
}
/* 〇〇さん */
.bl_complete_ttl{
  text-align: center;
  margin-bottom: 2em;
}
.bl_complete_ttl h2{
  font-size: 1.5em;
  font-weight: bold;
  margin-bottom: .5em;
}
.bl_complete_ttl p{
  line-height: 1.5em;
}
/* 予約内容 */
.bl_complete_cont{
  background-color: #F7F7F7;
  padding: 2em 4em 4em;
  text-align: center;
  margin-bottom: 4em;
}
.bl_caution_txt{
  margin-bottom: 1em;
}
.bl_complete_cont h2{
font-size: 1.2em;
font-weight: 800;
margin-bottom: 1.5em;
}
.bl_complete_cont dl{
  display: flex;
  margin-bottom: 1em;
}
.bl_complete_cont dt{
  width: 40%;
  text-align: right;
  margin-right: 0.3em;
}
.bl_complete_cont dd{
  text-align: left;
  width: 80%;
}
.bl_complete_cont span{
  margin-left: 1em;
}
.bl_form_non{
  display: none;
}

/* iphone対策でinputデフォルトスタイルをoffにしたので、普通ラジオボタンのスタイルを指定 */
/* .bl_calender_radio input[type = "radio"]{
  width: 1rem;
  height: 1rem;
  border-radius: 30px;
} */

@media screen and (max-width: 800px) {
  .bl_calender_radio, .bl_form_radio span, .bl_calender_radio > input{
    width: 100%;
  }
}
@media screen and (max-width: 599px) {
  .bl_form_table{
    display: block;
  }
  .mw_wp_form_input .bl_form_table,
  .mw_wp_form_input .bl_form_table dl{
    border: none;
  }
  .el_telbtn_ttl{
    line-height: 1.5rem;
  }
  #bl_caution{
    padding: 2rem;
  }
  .el_form_ttl{
    margin-top: 2rem;
  }
  .el_form_subttl{
    transform: translateX(calc(-50% + 20px));
  }
  .bl_form_input_q{
    width: 40%;
  }
  .bl_calender_radio, .bl_form_table dl, .bl_name_input{
    display: block;
  }
  .mw_wp_form_input .bl_form_table dt, .mw_wp_form_input .bl_form_table dd{
    width: 100%;
    border: none;
  }
  .mw_wp_form_input .bl_form_table dt{
    padding: 1rem;
    margin-top: 20px;
  }
  .mw_wp_form_input .bl_form_table dd{
    padding: 1rem 0;
  }
  .bl_name_input input{
    width: 100%;
    margin-bottom: 10px;
  }
  .mw_wp_form_input .mwform-radio-field{
    margin-right: 10px;
  }
  .bl_form_box{
    margin-bottom: 0;
  }
  .bl_form_consent, .bl_scrolle_box{
    padding: 1rem;
  }
  .bl_scrolle_box{
    margin: 0;
  }
  .bl_form_consent_txt{
    margin-top: 20px;
    font-size: .8rem;
  }
  #bl_form_day .bl_form_day_input{
    margin-left: 0;
  }
  /* 確認画面 */
  .mw_wp_form_confirm .bl_calender_radio{
    display: flex;
  }
  .mw_wp_form_confirm .bl_form_table{
    margin-bottom: 20px;
  }
  .mw_wp_form_confirm dt{
    margin-bottom: 10px;
  }
  .mw_wp_form_confirm dd{
    padding-left: 0;
  }
  .mw_wp_form_confirm dt{
    width: 100%;
  }
  .bl_form_input{
    margin-bottom: 10px;
    display: block;
  }
  .mw_wp_form_confirm .bl_form_box{
    margin-bottom: 2rem;
  }
  .mw_wp_form_confirm .bl_name_txt{
    display: none;
  }

  /* 送信完了画面 */
  .bl_coution_tel{
    width: 100%;
  }
  .bl_coution_tel span{
    width: 100%;
    display: block;
  }
  #bl_complete_caution{
    padding: 2rem;
  }
  .bl_complete_cont{
    padding: 2rem;
  }
  .bl_complete_cont dl{
    display: block;
    margin-bottom: 2rem;
  }
  .bl_complete_cont dt, .bl_complete_cont dd{
    width: 100%;
    text-align: left;
  }
  /* カレンダー */
  .ui-datepicker .ui-datepicker-title{
    margin: 0 2rem;
  }
}