@charset "UTF-8";
/****************************************************
SCSSで制作しているため、このファイルは編集しないでください。

****************************************************/
/* local-path */
/* wp-path */
/* common
---------------------------------------------------*/
.sponsorship {
  text-align: right;
}

.contact .section {
  margin: 0 0 50px 0;
}
.contact h2 {
  border-bottom: solid 2px #ccc;
  padding: 10px 15px;
  margin: 0 0 20px 0;
  background: #f6f6f6;
}
.contact .pagenation {
  margin: 0 0 30px 0;
  border-top: solid 1px #ddd;
  border-right: solid 1px #ddd;
  border-left: solid 1px #ddd;
}
.contact .pagenation li {
  width: 33.333333%;
  float: left;
  border-bottom: solid 3px #e9eaec;
  color: #ccc;
  text-align: center;
  padding: 10px 0 7px;
}
.contact .pagenation li.active {
  color: #22589f;
  border-color: #22589f;
}
.contact th {
  display: block;
  width: 100%;
  text-align: left;
  font-weight: normal;
  margin: 0 0 5px 0;
}
.contact th.required::after {
  content: "必須";
  background: #cc1142;
  color: #fff;
  padding: 1px 5px;
  float: right;
  font-size: 11px;
  font-size: 1.1rem;
  margin-top: 2px;
  border-radius: 2px;
}
.contact th.any::after {
  content: "任意";
  background: #9d9d9d;
  color: #fff;
  padding: 1px 5px;
  float: right;
  font-size: 11px;
  font-size: 1.1rem;
  margin-top: 2px;
  border-radius: 2px;
}
.contact td {
  display: block;
  width: 100%;
  padding: 0;
  margin: 0 0 10px 0;
}
.contact input, .contact textarea {
  -webkit-appearance: none;
  background: #fff;
  width: 100%;
  border: solid 1px #ccc;
  padding: 5px;
  border-radius: 3px;
}
.contact input[type="submit"] {
  margin: 25px auto 8px;
  width: 45%;
  padding: 15px;
  background: #f88f08;
  display: block;
  border: none;
  color: #fff;
  cursor: pointer;
}
.contact .detail a {
  margin-bottom: 5px;
}
.contact .send-message a {
  text-decoration: underline;
  color: #367fc1;
}
.contact .radio {
  display: none;
}
.contact .radio + .radio-icon {
  position: relative;
  padding: 0 0 0 20px;
}
.contact .radio + .radio-icon:before {
  position: absolute;
  left: 0;
  top: -3px;
  content: "\f1db";
  font-family: "fontawesome";
  color: #ccc;
  font-size: 20px;
  line-height: 1;
}
.contact .radio:checked + .radio-icon:before {
  content: "\f192";
  color: #17bcdf;
}
.contact .checkbox {
  display: none;
}
.contact .checkbox + .checkbox-icon {
  position: relative;
  padding: 0 0 0 20px;
}
.contact .checkbox + .checkbox-icon:before {
  position: absolute;
  left: 0;
  top: -3px;
  content: "\f372";
  font-family: "Ionicons";
  color: #ccc;
  font-size: 22px;
  line-height: 1;
}
.contact .checkbox:checked + .checkbox-icon:before {
  content: "\f374";
  color: #17bcdf;
}
.contact .block {
  margin: 0 0 30px 0;
}
.contact input.year-old {
  width: 20%;
  margin: 0 10px 0 0;
}

.contact.confirm .contact-table {
  border-top: solid 1px #ddd;
  border-collapse: separate;
  margin: 0 0 40px 0;
}
.contact.confirm th {
  display: table-cell;
  width: 30%;
  margin: 0;
  vertical-align: top;
  padding: 16px 15px 14px 15px;
  border-top: solid 1px #fff;
  border-bottom: solid 1px #ddd;
  background: #f6f6f6;
}
.contact.confirm th::after {
  content: "";
  padding: 0;
  margin: 0;
  background: inherit;
}
.contact.confirm td {
  display: table-cell;
  width: 70%;
  margin: 0;
  padding: 15px;
  border-top: solid 1px #fff;
  border-bottom: solid 1px #ddd;
}

.contact.thanks p {
  text-align: center;
}
.contact.thanks .comp-title {
  font-size: 24px;
  font-size: 2.4rem;
  margin: 0 0 25px 0;
}

/* @media (min-width: 768px)
---------------------------------------------------*/
@media screen and (min-width: 768px) {
  .contact .section {
    margin: 0 0 70px 0;
  }
  .contact .contact-box {
    background: #f6f6f6;
    padding: 35px;
    border-radius: 5px;
  }
  .contact .pagenation li {
    font-size: 16px;
    font-size: 1.6rem;
  }
  .contact .contact-table {
    border-top: solid 1px #ddd;
    border-collapse: separate;
    margin: 0 0 40px 0;
  }
  .contact th {
    display: table-cell;
    width: 30%;
    margin: 0;
    vertical-align: top;
    padding: 20px 15px 0 15px;
    border-top: solid 1px #fff;
    border-bottom: solid 1px #ddd;
    background: #f6f6f6;
  }
  .contact td {
    display: table-cell;
    width: 70%;
    margin: 0;
    padding: 15px;
    border-top: solid 1px #fff;
    border-bottom: solid 1px #ddd;
  }
  .contact input, .contact textarea {
    padding: 4px 5px 2px;
  }
  .contact input[type="submit"] {
    width: 420px;
  }
  .contact .detail a {
    margin-bottom: 8px;
    width: 420px;
    padding: 15px;
    font-size: 16px;
    font-size: 1.6rem;
  }
  .contact .send-message {
    text-align: center;
    font-size: 14px;
    font-size: 1.4rem;
  }

  .contact.confirm section,
  .contact.thanks section {
    margin-bottom: 120px;
  }
}
/* @media (min-width: 1024px)
---------------------------------------------------*/
/* @media (min-width: 1230px)
---------------------------------------------------*/
@media screen and (min-width: 1230px) {
  .contact .section {
    margin: 0 0 90px 0;
  }
}
/* print
---------------------------------------------------*/
@media print {
  .contact .section {
    margin: 0 0 70px 0;
  }
  .contact .contact-box {
    background: #f6f6f6;
    padding: 35px;
    border-radius: 5px;
  }
  .contact .pagenation li {
    font-size: 16px;
    font-size: 1.6rem;
  }
  .contact .contact-table {
    border-top: solid 1px #ddd;
    border-collapse: separate;
    margin: 0 0 40px 0;
  }
  .contact th {
    display: table-cell;
    width: 30%;
    margin: 0;
    vertical-align: top;
    padding: 20px 15px 0 15px;
    border-top: solid 1px #fff;
    border-bottom: solid 1px #ddd;
    background: #f6f6f6;
  }
  .contact td {
    display: table-cell;
    width: 70%;
    margin: 0;
    padding: 15px;
    border-top: solid 1px #fff;
    border-bottom: solid 1px #ddd;
  }
  .contact input, .contact textarea {
    padding: 4px 5px 2px;
  }
  .contact input[type="submit"] {
    width: 420px;
  }
  .contact .detail a {
    margin-bottom: 8px;
    width: 420px;
    padding: 15px;
    font-size: 16px;
    font-size: 1.6rem;
  }
  .contact .send-message {
    text-align: center;
    font-size: 14px;
    font-size: 1.4rem;
  }

  .contact.confirm section,
  .contact.thanks section {
    margin-bottom: 120px;
  }
}