@charset "UTF-8";
@font-face {
  font-family: 'Arial Black';
  font-style: normal;
  font-weight: 400;
  display: swap;
  src: local("Arial Black"), url("ariblk_0.ttf") format("ttf");
}
html {
  font-size: 62.5%;
  min-height: 100%;
  overflow-y: scroll;
  background: #fff;
}
@media (max-width: 480px) {
  html {
    width: 100%;
    height: 100%;
  }
}
html body,
html dd,
html div,
html dl,
html dt,
html fieldset,
html form,
html h1,
html h2,
html h3,
html h4,
html h5,
html h6,
html input,
html li,
html ol,
html p,
html td,
html textarea,
html th,
html ul {
  padding: 0;
  margin: 0;
}
html article,
html aside,
html details,
html figcaption,
html figure,
html footer,
html header,
html hgroup,
html menu,
html nav,
html section {
  display: block;
  padding: 0;
  margin: 0;
}
html address,
html caption,
html em,
html strong,
html th {
  font-style: normal;
}
html caption,
html th {
  text-align: left;
}
html hr,
html legend {
  display: none;
}
html h1,
html h2,
html h3,
html h4,
html h5,
html h6 {
  font-size: 100%;
}
html ol,
html ul {
  list-style: none;
}
html a img,
html fieldset {
  border: none;
}
html a:visited {
  text-decoration: none;
}
html p {
  margin-bottom: 12px;
}
html * {
  box-sizing: border-box;
}
html blockquote,
html dl,
html ol,
html pre,
html table,
html ul {
  margin-bottom: 0;
}
html table {
  border-collapse: collapse;
  border-spacing: 0;
}

body {
  color: #333333;
  font-size: 1.4em;
  font-family: "Noto Sans JP", sans-serif;
  -webkit-text-size-adjust: none;
  letter-spacing: 1.5px;
  line-height: 1.8;
  min-height: 100vh;
  min-width: 1040px;
  background: url(../img/background.png) center center / cover no-repeat fixed;
}
@media (max-width: 480px) {
  body {
    position: relative;
    width: 100%;
    min-width: 100%;
    font-size: 1.5em;
    -webkit-overflow-scrolling: touch;
  }
}

#page {
  margin: 0 auto;
  width: auto;
}
@media (max-width: 480px) {
  #page {
    position: relative;
    width: 100%;
    margin: 0 auto;
  }
}

#header {
  min-width: 1020px;
  padding: 15px 15px;
  background: #fff;
}
#header h1{
  text-align: center;
}
@media (max-width: 480px) {
  #header {
    min-width: 100%;
  }
}


#contents .section {
  padding: 80px 0 40px;
}
@media (max-width: 480px) {
  #contents .section {
    padding: 20px 0 10px;
    max-height: 100%;
  }
}
#contents .section .section_title{
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  background: #fff;
  max-width: 1020px;
  padding: 10px;
  margin: 0 auto 30px;
}
@media (max-width: 480px) {
  #contents .section .section_title {
    font-size: 1.8rem;
    max-width: 100%;
    margin: 0 auto 15px;
  }
}
#contents .section.top .section_inner .colorbox {
  background: rgba(255, 255, 255, 0.6);
  border-radius: 10px;
  padding: 20px;
}
#contents .section .b_txt{
  color: #7b3201;
}
#contents .section .coment{
  border-top: 1px dotted #333;
  border-bottom: 1px dotted #333;
  padding: 10px 0 0;
}
#contents .section .section_inner {
  margin: 0 auto;
  padding: 0 0 20px;
  max-width: 1020px;
}
@media (max-width: 480px) {
  #contents .section .section_inner {
    padding: 0 10px 10px;
    max-width: 100%;
  }
}

.btn_base {
  width: 350px;
  text-align: center;
  padding: 20px 0;
}
@media (max-width: 480px) {
  .btn_base {
    width: 60%;
  }
}
.btn_base a {
  color: #fff;
  font-size: 1.4rem;
  letter-spacing: 1px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  padding: 10px 20px;
  display: inline-block;
  min-width: 100px;  
  background-color: #ff8b3e;
  border: 1px solid #ff8b3e;
  border-radius: 10px;
}

.btn_base a:hover {
    color: #fff;
    background-color: #c96c2f;
    border-color: #c96c2f;
}
@media (max-width: 480px) {
  .btn_base a {
    display: block;
  }
  .btn_base a:hover {
    background: #ff8b3e;
  }
}

/*フォーム用css*/
span.required{
  background: #269ADD;
  color: #FFF;
  border-radius: 3px;
  display: inline-block;
  padding: 2px 5px;
  line-height: 1;
  font-size: 12px;
}
.table_form {
  background: #fff;
  padding: 25px;
  margin: 25px auto 30px;
}
@media (max-width: 480px) {
.table_form {
    padding: 0;
    margin: 0;
    width: 100%;
    background: none;
  }
}
.table_form table {
  border: 2px #DDD solid;
  width: 100%;
}
@media (max-width: 480px) {
  .table_form table {
    border: 0;
  }
}
.table_form table td,
.table_form table th {
  font-weight: normal;
  border: 2px #DDD solid;
  padding: 20px 16px;
}

.table_form .list-table {
  border: none;
}

.table_form .list-table th,  
.table_form .list-table td {
  font-weight: normal;
  border: none;
  padding: 20px 16px;
}

.apply-summary .list-table td {
  font-size: 13px;
}

.st-summary .list-table td {
  font-size: 12px;
}
@media (max-width: 480px) {
  .table_form .list-table tr {
    display: flex;
  }
  .table_form .list-table td {
    font-weight: normal;
    padding: 0;
    border: none;
  }
  .table_form .list-table .list-title {
    width: 30%;
  }
  .table_form .list-table .list-content {
    width: 70%;
  }
  .table_form table th,  
  .table_form table td {
    font-weight: normal;
    padding: 0;
    display: block;
    border: none;
  }
  .table_form table td {
    margin-bottom: 10px;
  }
  .apply-area{
    margin-top: -10px;
    background-color: #ffffff;
  }
}
.table_form table tbody th {
  font-size: 1.5rem;
  font-weight: bold;
  text-align: left;
  width: 35%;
  background: #f3f3f3;
  padding: 20px 60px 20px 16px;
  position:relative;
}
@media (max-width: 480px) {
  .table_form table tbody th {
    padding: 0;
    width: 100%;
    border: none;
    background: none;
    vertical-align: middle;
    text-align: left;
    display: block;
  }
  .table_form.form_check table tbody th {
    background: #f3f3f3;
    padding: 5px 10px;
  }
  .table_form.form_check table tbody td {
    background: #ffffff;
    padding: 10px;
  }
  .table_form.form_check table tbody .list-table td {
    padding: 0;
  }
}
.table_form table tbody tr.kiyaku_back td .kiyaku {
  background: #fff;
  padding: 10px;
  height: 150px;
  overflow-y: scroll;
  margin-bottom: 15px;
  border: 1px #DDD solid;
}
@media (max-width: 480px) {
  .table_form table tbody tr.kiyaku_back th {
    text-align: center;
    background: #efefef;
    padding: 10px;
  }
  .table_form table tbody tr.kiyaku_back td {
    background: #efefef;
    padding: 0 10px 10px;
  }
  .table_form table tbody tr.kiyaku_back td .kiyaku {
    margin-bottom: 5px;
  }
  .table_form.form_check table tbody tr.kiyaku_back th {
    text-align: left;
    padding: 5px 10px;
  }
  .table_form.form_check table tbody tr.kiyaku_back td {
    background: #fff;
    padding: 10px;
  }
}

.form input,
.form textarea {
  color: #444;
  font-size: 1.5rem;
  font-family: "メイリオ";
  letter-spacing: 1px;
  line-height: 1.4;
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 10px;
}
/* iPhone */
.iPhone label.date{
  font-size: 1.5rem;
  line-height: 1.4;
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 0;
  background: #fff;
  width: 200px;
  height: 43px;
  display: block;
  position: relative;
}  
.iPhone label.date::before{
  color: #333;
  position: absolute;
  font-family: "Font Awesome 5 Free";
  content: "\f133";  /* FontAwesome Webアイコンここに設定 */
  top: 10px;
  right: 10px;
}
.iPhone input[type="date"] {
  line-height: 1.4;
  border: none;
  background: none;
  width: 200px;
  height: 43px;
  padding: 10px;
  box-sizing: border-box;
  position: relative;
}
/* safari */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  _::-webkit-full-page-media, _:future, :root label.date{
    font-size: 1.5rem;
    line-height: 1.4;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 0;
    background: #fff;
    width: 200px;
    height: 43px;
    display: block;
    position: relative;
  }  
  _::-webkit-full-page-media, _:future, :root label.date input[type="date"]::before{
    color: #999;
    position: absolute;
    content: "年/月/日";
    top: 10px;
    left: 10px;
  }
  _::-webkit-full-page-media, _:future, :root input[type="date"] {
    line-height: 1.4;
    border: none;
    background: none;
    width: 200px;
    height: 43px;
    padding: 10px;
    box-sizing: border-box;
  }
  _::-webkit-full-page-media, _:future, :root label.date input[type="date"]:not(:placeholder-shown)::before{
    content: none;
  }
}

@media (max-width: 480px) {
  .form input[type="text"],
  .form input[type="email"],
  .form textarea {
    width: 100%;
  }
}
.form select {
  color: #444;
  line-height: 1.4;
  font-size: 1.5rem;
  border: 1px solid #ccc;
  padding: 10px 27px 10px 13px;
  width: 30%;
  background: url("../img/select-arrow.png") no-repeat center right 7px/10px #fff;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.form .kiyaku_box {
  margin: 5px 0;
  padding: 10px;
  background-color: #DDD;
  text-align: center;
}

.form .kiyaku_box label {
  margin-top: 0;
  margin-bottom: 5px;
  display: inline-block;
}
.form .kiyaku_box label input[type="checkbox"]{
  zoom: 1.5;
  margin-right: 3px;
  vertical-align: middle;
}
.form label.error{
  padding: 2px 0;
  color: #be0000;
  display: block;
}

.form .form60 {
  width: 60%;
}
@media (max-width: 480px) {
  .form .form60 {
    width: 100%;
  }
}
.form .form90 {
  width: 93%;
}
@media (max-width: 480px) {
  .form .form90 {
    width: 100%;
  }
}
.form .date_time01:after,
.form .date_time02:after,
.form .date_time03:after {
  content: '';
  display: block;
  clear: both;
}
.form dl{
  float:left;
  margin-right:20px;
}
.submit_area{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  padding: 20px;
}

.apply-area {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  padding: 20px;
  text-align: center;
  padding: 5px;
  background-color: #fff;
}
.form input[type="submit"],
.form input[type="button"] {
  color: #fff;
  font-size: 1.6rem;
  letter-spacing: 1px;
  cursor: pointer;
  padding: 10px 40px;
  margin: 0 20px;
  color: #fff;
  background-color: #ff8b3e;
  border: none;
  border-radius: 8px;
  width: 320px;
  position: relative;
}

.form input[type="submit"]:disabled,
.form input[type="button"]:disabled {
  color: #fff;
  background-color: #AAA;
}

.form span.wrap_btn{
  position: relative;
}
@media (max-width: 480px) {
  .form span.wrap_btn {
    width: 90%;
  }
  .form input[type="submit"],
  .form input[type="button"] {
    max-width: 100%;
    margin: 0;
  }
}

.form span.wrap_btn::before{
  width: 8px;
  height: 12px;
  background: url(../img/arrow.png) top left /contain no-repeat;
  position: absolute;
  content: "";
  right: 40px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}
.form span.wrap_btn.wrap_btn_back::before{
  background: url(../img/arrow2.png) top left /contain no-repeat;
  right: auto;
  left: 40px;
}
@media (max-width: 480px) {
  .form span.wrap_btn::before{
    right: 15px;
  }
  .form span.wrap_btn.wrap_btn_back::before{
    left: 15px;
  }
}
.form input[type="submit"]:hover,
.form input[type="button"]:hover{
    color: #fff;
    background-color: #c96c2f;
}
.form input[type="submit"]:disabled,
.form input[type="button"]:disabled{
    color: #fff;
    background-color: #AAA;
}
.form input[type="button"].back {
  color: #fff;
  background-color: #428bca;
}
.form input[type="button"].back:hover{
  color: #fff;
  background-color: #336c9e;
}

@media (max-width: 480px) {
  .form span.wrap_btn.wrap_btn_back {
    margin-bottom: 8px;
  }
  .form input[type="submit"],
  .form input[type="button"] {
    border-radius: 0;
    -webkit-box-sizing: content-box;
    -webkit-appearance: button;
    appearance: button;
    border: none;
    border-radius: 8px;
    box-sizing: border-box;
    cursor: pointer;
  }
}
@media (max-width: 480px) {
  .form input[type="submit"]::-webkit-search-decoration,
  .form input[type="button"]::-webkit-search-decoration {
    display: none;
  }
}
@media (max-width: 480px) {
  .form input[type="submit"]:focus,
  .form input[type="button"]:focus {
    outline-offset: -2px;
  }
}