/*-------------------------------------------------------------

page- contact CSS

-------------------------------------------------------------*/
.contact_about{
  width: 100%;
  margin-bottom: 100px;
}
/* お問い合わせ -------------- */
a.contact_tel_btn{
  width: 90%;
  max-width: 400px;
  display: block;
  margin: 10px auto;
  padding: 10px;
  background-color: #00bfff;
  border-radius: 10px;
  color: #fff;
  font-weight: bold;
  font-size: 1.5rem;
  transition: 0.3s;
}
a.contact_tel_btn:hover{
  background-color: #87cefa;
}
/* contact_area --------- */
.contact_area{
  margin: 20px 0;
  width: 100%;
  border: 15px solid #87cefa;
  padding: 30px;
}
.contact_area h4.item_title{
  width: 100%;
  margin-bottom: 10px;
  padding-left: 30px;
  position: relative;
}
.contact_area h4.item_title::before {
  content: "";
  position: absolute;
  background: #00bfff;
  top: 50%;
  left: 0px;
  margin-top :-10px;
  height: 20px;
  width: 20px;
  border-radius: 50%;
}
/* 必須アイコン */
span.icon_required{
  font-size: 0.8rem;
  color: #fff;
  background-color: #e64545;
  border-radius: 5px;
  padding: 1px 10px;
  display: inline-block;
  margin-left: 10px;
}
@media screen and (max-width: 768px) {
  .contact_area{
    border: 8px solid #87cefa;
    padding: 15px;
  }
}

/* contact_table ------- */
table.contact_table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 5px 10px;
}
table.contact_table th{
  width: 25%;
  text-align: left;
  vertical-align:top;
}
table.contact_table td{
  width: 75%;
}
table.contact_table input[type="text"],
table.contact_table input[type="tel"],
table.contact_table input[type="email"],
table.contact_table input[type="date"]{
  padding: 8px;
  border: 1px solid #cdcdcd;
  font-size: 100%;
}
table.contact_table select {
  padding: 8px;
  border: 1px solid #cdcdcd;
  font-size: 100%;
}
table.contact_table input.input_w100{
  width: 100%;
}
table.contact_table input.input_w50{
  width: 50%;
}
table.contact_table input.input_w30{
  width: 30%;
}
.facility_checkbox {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}
.facility_checkbox .wpcf7-list-item {
  width: 50%;
  margin: 5px 0;
  display: block;
}
.degree_radio span.wpcf7-list-item {
  width: 24%;
  margin: 5px 1% 5px 0;
  display: inline-block;
}
.contact_contents{
  width: 100%;
}
.contact_contents textarea {
  width: 100%;
  padding: 8px;
  border: 1px solid #cdcdcd;
  font-size: 100%;
}
.contact_checkbox span.wpcf7-list-item,
#for_gender span.wpcf7-list-item,
#for_situation span.wpcf7-list-item,
.gender span.wpcf7-list-item{
  display: inline-block;
  margin-right:10px;
  margin-left: 0;
}
.contact_submit{
  width: 100%;
  margin: 20px 0;
}
/* 確認・送信ボタン */
.contact_submit input[type="submit"]{
  width: 70%;
  max-width: 500px;
  background-color: #00bfff;
  border-radius: 10px;
  color: #fff;
  font-weight: bold;
  transition: 0.3s;
  border: none;
  padding: 15px;
  margin: 0 auto;
  display: block;
  font-size: 100%;
  cursor: pointer;
}
.contact_submit input[type="submit"]:hover{
background-color: #87cefa;
}
/* 戻るボタン */
.contact_submit input[type="button"]{
  width: 70%;
  max-width: 500px;
  background-color: #fff;
  border: 1px solid #00bfff;
  border-radius: 10px;
  color: #00bfff;
  font-weight: bold;
  transition: 0.3s;
  padding: 15px;
  margin: 0 auto;
  display: block;
  font-size: 100%;
  cursor: pointer;
}
.contact_submit input[type="button"]:hover{
  background-color: #87cefa;
  color: #fff;
}

@media screen and (max-width: 768px) {
  table.contact_table th{
    display: block;
    width: 100%;
    margin-bottom: 10px;
  }
  table.contact_table td{
    display: block;
    width: 100%;
    margin-bottom: 20px;
  }
  table.contact_table input.input_w50{
    width: 100%;
  }
  table.contact_table input.input_w30{
    width: 50%;
  }
  .degree_radio span.wpcf7-list-item {
    width: 48%;
  }
  .facility_checkbox .wpcf7-list-item {
    width: 100%;
  }
}

/* 採用情報のお問い合わせ用 */
.apply_readonly{
  background-color: #ebebeb;
}
.apply_gender span.wpcf7-list-item{
  display: inline-block;
  margin-right:10px;
  margin-left: 0;
}
textarea.apply_textarea {
  width: 100%;
  padding: 8px;
  border: 1px solid #cdcdcd;
  font-size: 100%;
}