@charset "utf-8";
#contactBox.contact{
  margin:0 auto;
}
#contactBox.contact .form_title{
  width:100%;border:1px solid #cccc;padding:12px;text-align:left;background-color:#f3f3f3;
}

#contactBox.contact .contactcomment{
  margin:20px auto 0;
  text-align:center;
  font-size:1.4em;
  color:#fe7800;
}

#contactBox.contact .messagebox{
  text-align:center;
  padding:120px 0;
}
#contactBox.contact .messagebox h2{
  font-size:1.8em;
  padding-bottom:40px;
}
#contactBox.contact .messagebox p a{
  color:#d87500;
}
.contact .contentsin {
    width: 90%;
    max-width:800px;
    margin: 0 auto;
}
    #contactBox.contact p.topcom{font-weight:normal;width: 90%;margin: 0 auto;}

    #contactBox.contact table p{font-weight:bold;padding:0 0 10px;}

#contactBox.contact .errtext{
  margin:40px auto 0;
  background-color: #c30;
  color: #fff;
  text-align:center;
  padding: 10px 10px;
  line-height: 1.4;
}

#contactBox.contact table{
  width:100%;
  margin:0 auto;
  padding-bottom:15px;
}
#contactBox.contact table.table01{
  margin-top:30px;
}
#contactBox.contact table tr{
  border-bottom:1px solid #ccc;
}
#contactBox.contact table.table01 tr:last-child{
  border-bottom:none;
}
#contactBox.contact table tr.none-line{
  border-bottom:none;
}
#contactBox.contact table th{width:16em;text-align:left;vertical-align:middle;padding:10px 40px 10px 0;}
#contactBox.contact table .tr-pt2 th{width:100%;padding:10px 15px 10px 15px;}
#contactBox.contact table th .tb-title{
  color:#000;
}
#contactBox.contact table th .tb-title div{
  background-color:#c30;
  color:#fff;
  font-size:12px;
  padding:6px 8px;
  line-height:1;
  display:block;
  float:right;
}

#contactBox.contact table td{width: calc(100% - 16em);text-align:left;padding:20px 0;}
#contactBox.contact table tr.none-pt th,
#contactBox.contact table tr.none-pt td{
  padding-top:0;
}
#contactBox.contact table td input{
    padding: 8px 10px;
    background-color: #fff;
    border: none;
    border-radius: 4px;
    text-align:left;
    border:1px solid #ccc;
    margin:5px 0;
    line-height: 1.8;
    font-size: 0.9em;
    width:100%;
    box-sizing: border-box;
}
#contactBox.contact select{
    padding: 8px 10px;
    background-color: #fff;
    border: none;
    border-radius: 4px;
    text-align:left;
    border:1px solid #ccc;
    margin:5px 0;
    line-height: 1.8;
    font-size: 0.9em;
    width:50%;
    box-sizing: border-box;
}
#contactBox.contact table .message .comment{
  padding:10px 10px;
  margin:0 auto;
  width:100%;
  font-weight:normal;
  box-sizing: border-box;
}
#contactBox.contact table .message .comment dl{
  display:table;
}
#contactBox.contact table .message .comment dt{
  display:table-cell;
  text-align:left;
  padding-right:15px;
  white-space:nowrap;
  width:8em;
  font-size:0.9em;
}
#contactBox.contact table .message .comment dd{
  display:table-cell;
  text-align:left;
  font-size:0.9em;
}


#contactBox.contact .red{color:#c30;}
/*#contactBox.contact .err{
  background-color: #f9f9f9;
}*/
#contactBox.contact .err input,
#contactBox.contact .err textarea,
#contactBox.contact .err select{background-color:#fcc;}
#contactBox.contact .errbox{
  font-weight:bold;
  color:#c30;
  width:100%;
  display:table;
}

#contactBox.contact #eQuestionnaire01 input,
#contactBox.contact #eQuestionnaire02 input{width:auto;float:left;}
#contactBox.contact .form-box select{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
#contactBox.contact input#email,
#contactBox.contact input#emailchk{width:100%;}
#contactBox.contact textarea{
  width:100%;
  height:10em;
  padding:10px 10px;
  border:1px solid #ccc;
  box-sizing:border-box;
  line-height: 1.8;
  font-size: 1em;
}
    #contactBox.contact .form-box textarea#message{
        font-size: 1em;
        height:16em;
    }

#contactBox.contact .form-box input[type="checkbox"]{
  width:20px;height:20px;
  border:1px solid #ccc;
  background-color:#fff;
  border-radius:6px;
  margin-left:5px;
}
#contactBox.contact .form-box td div{
  display:table;
  float:left;
  margin-right:30px;
}
#contactBox.contact .form-box td div span{
  display: flex;
  justify-content: center;
  align-items: center;
  width:auto;
  padding:0;
  line-height:1;
}
  #contactBox.contact .form-box td label{
    font-weight:normal;
    float:left;
    line-height:1;
  }
#contactBox.contact .form-box input[type="radio"]{
  width:24px;height:24px;
  border:1px solid #ccc;
  background-color:#fff;
  border-radius:6px;
  margin-left:0;
}
#contactBox.contact .form-box input[type="radio"] + span{margin-top:-3px;display:block;float:left;}


#contactBox.contact .form-box.checkbox div{display:table;vertical-align:top;margin:0 0 15px;}
#contactBox.contact .form-box.checkbox span{vertical-align:top;}



#contactBox.contact.questionnaire .form-box dl dd .form-questionnaire,
#contactBox.contact.questionnaire textarea{
	border:2px solid #d87500;
  width:100%;
  float:none;
}

#contactBox.contact .button{display:table;width:80%;max-width:300px;margin:50px auto 60px;}
  #contactBox.contact .button a{
    font-size:1.2em;
    line-height:1;
    padding:15px 0;
    width:100%;
    border:none;
    background-color:#ea3636;
    color:#fff;
    border-radius:6px;
    display:table;
    text-align:center;
  }
    #contactBox.contact .button a:hover{
      background-color:#b71d1d;
    }
#contactBox.contact .buttonbox{width:70%;margin:0 auto;display:table;}
  #contactBox.contact .buttonbox .button{display:table;width:47%;float:left;}
  #contactBox.contact .buttonbox .button:last-child{float:right;}


#contactBox.contact .textarea textarea {
    background-color: #f4f4f4;
    border: none;
    width:100%;
    max-width:100%;
    height: 15em;
}

#contactBox.contact .button .back{width:45%;float:left;}
#contactBox.contact .button .apply{width:45%;float:right;}


.reservation.check #contents .button label{}

#contactBox.contact #frm_contact_check .form-box,
#contactBox.contact #frm_reservation_check .form-box {
    width: 100%;
    padding: 20px 20px 20px;
    text-align: left;
    font-size:1.2em;
}
#contactBox.contact #frm_contact_check .form-box p,
#contactBox.contact #frm_reservation_check .form-box p{font-size:1.2em;}
#contactBox.contact #frm_contact_check .form-set dl,
#contactBox.contact #frm_reservation_check .form-set dl{
  padding:0 0 15px;
}
#contactBox.contact #frm_contact_check .form-set dl dt,
#contactBox.contact #frm_contact_check .form-set dl dd,
#contactBox.contact #frm_reservation_check .form-set dl dt,
#contactBox.contact #frm_reservation_check .form-set dl dd{font-size:1em;}
#contactBox.contact #frm_contact_check .form-button,
#contactBox.contact #frm_reservation_check .form-button {
    width: 80%;
    max-width: 600px;
}
#contactBox.contact #frm_contact_check .form-button .gochk,
#contactBox.contact #frm_reservation_check .form-button .gochk {
    width: 45%;
    float:left;
}
#contactBox.contact #frm_contact_check .form-button .gochk:last-child,
#contactBox.contact #frm_reservation_check .form-button .gochk:last-child {
  float:right;
}


#contactBox.contact #thanks{
  padding-bottom:100px;
}

#contactBox.contact #sec_contact_thanks{
  display:table;
}



@media (max-width: 768px) {
  #contactBox.contact .form_title {
      padding: 16px 12px;
  }
  #contactBox.contact table th{display:block;width:100%;padding:15px 0 0;}
  #contactBox.contact table td{display:block;width:100%;padding:5px 0 15px;}
  #contactBox.contact textarea{
    height:12em;
    padding:15px 15px;
  }
  #contactBox.contact .button a {
      font-size: 1.3em;
      padding: 25px 0;
  }
}
