@charset "UTF-8";
/* CSS Document */
.pageTtl {
  height: 170px;
  margin-bottom: 50px;
}
@media screen and (min-width: 768px) {
  .pageTtl .txt {
    background: none;
  }
}
@media screen and (max-width: 767px) {
  .pageTtl {
    background: linear-gradient(to left, rgba(255, 255, 255, 1) 0%, rgba(201, 221, 241, 1) 100%);
    border-radius: 20px;
    height: 100px;
    margin: 0 3%;
    width: 94%;
  }
}
.contact {
  position: relative;
}
.sdTxt {
  bottom: auto;
  top: 0;
}
/* ------------------------------
    form layout
------------------------------ */
.formWrap {
  background: rgba(41, 114, 176, 0.1);
  padding: 60px 60px 35px;
  margin-top: 70px;
}
.form li {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 25px;
}
.form li .ttl {
  /*width: 115px;*/
  width: 180px;
}
.form li.required .ttl:after {
  content: "必須";
  color: #eb6153;
  display: inline-block;
  font-size: 1.2rem;
  margin: -5px 0 0 3px;
  vertical-align: middle;
}
.form li.required.detail .ttl:after {
  display: block;
  margin-top: 1px;
}
.form li .item {
  flex: 1;
}
.form .item {
  display: flex;
}
.btnWrap {
  margin: 70px 0 90px;
}
.btnWrap .btn {
  width: 196px;
}
.btnWrap .btn:after {
  content: none;
}
@media screen and (max-width: 767px) {
  .formWrap {
    margin-top: 30px;
    padding: 40px 5% 20px;
  }
  .form li.spBlk {
    display: block;
  }
  .form li.spBlk .ttl {
    margin-bottom: 8px;
    width: 100%;
  }
  .btnWrap {
    margin-bottom: 30px;
  }
  .btnWrap .btn {
    width: auto;
  }
}
@media screen and (max-width: 767px) and (orientation: landscape) {
  .form li.age .ttl,
  .form li.tel .ttl,
  .form li.mail .ttl {
    width: 30vw;
  }
}
/* ------------------------------
    form input
------------------------------ */
/*ios reset*/
input[type="text"],
input[type="email"],
input[type="tel"],
button,
textarea,
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
input[type="checkbox"] {
  visibility: hidden;
  width: 1px;
}
/*input[type="radio"] {
	visibility: hidden;
	width: 1px;
}*/
input[type="submit"],
input[type="button"] {
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}
/*original*/
.form input,
.form textarea {
  background: #fff;
  border: 1px solid #898989;
  padding: 2px 10px;
  width: 100%;
}
.form input[type="text"],
.form input[type="tel"],
.form input[type="email"],
.form .selectWrap {
  max-width: 365px;
}
.form input + input[type="text"] {
  margin-left: 15px;
}
_:-ms-input-placeholder,
:root input,
_:-ms-input-placeholder,
:root textarea {
}
input::placeholder,
textarea::placeholder {
  color: #9fa0a0;
}
.form .item .radio {
  cursor: pointer;
  position: relative;
}
.form .item .radio span {
  display: inline-block;
  position: relative;
  margin-right: 25px;
  padding-left: 25px;
}
.form .item .radio input {
  visibility: hidden;
  width: 1px;
  position: absolute;
}
.form .item .radio span:before,
.form .item input[type="radio"] {
  border-radius: 30px;
  border: 1px solid #898989;
  content: "";
  display: inline-block;
  vertical-align: middle;
  background: #fff;
  height: 18px;
  width: 18px;
  margin-right: 0;
  /*position: absolute;
	left: 0;
	top: 1px;*/
}
.form .item .radio span:after {
  background: #2972b0;
  border-radius: 30px;
  content: "";
  display: none;
  height: 8px;
  width: 8px;
  position: absolute;
  left: 5px;
  top: 6px;
}
.form .item .radio input:checked + span:after,
.form .item input[type="radio"]:checked:after {
  display: block;
}
.form .selectWrap {
  background: #fff;
  border: 1px solid #898989;
  padding: 1px 10px;
  position: relative;
  width: 100%;
  z-index: 0;
}
.form .selectWrap:after {
  content: "";
  display: block;
  position: absolute;
  right: 10px;
  top: calc(50% - 3px);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 5px 3.5px 0 3.5px;
  border-color: #9fa0a0 transparent transparent transparent;
  z-index: -1;
}
.form .selectWrap select {
  cursor: pointer;
  outline: none;
  width: 100%;
}
.form .reason .item {
  flex-wrap: wrap;
}
.form .reason .other {
  display: flex;
  margin-top: 20px;
  width: 100%;
}
.form .reason .other input[type="text"] {
  max-width: none;
  width: 650px;
}
.form .detail textarea {
  height: 145px;
}

/*確認画面*/
.confirm .form .selectWrap {
  background: transparent;
  border: none;
  width: auto;
}
.confirm .form .reason .other {
  margin-top: 0;
}
.confirm .form .selectWrap:after {
  display: none;
}

@media screen and (max-width: 767px) {
  .form input,
  .form textarea {
    font-size: 4.3vw;
  }
  .form li {
    margin-bottom: 30px;
  }
  .form li .ttl {
    font-size: 4.1vw;
  }
  .form .item .radio input {
    position: absolute;
  }
  .form .item .radio span {
    font-size: 3.9vw;
    white-space: nowrap;
    margin-right: 5.2vw;
    padding-left: 5.2vw;
  }
  .form .item .radio span:before {
    top: 0.5vw;
    height: 4.2vw;
    width: 4.2vw;
  }
  .form .item .radio span:after {
    left: 1.2vw;
    top: 1.6vw;
    height: 2vw;
    width: 2vw;
  }
  .form .reason .other {
    display: block;
  }
  .form .reason .other input[type="text"] {
    width: 100%;
    margin-left: 0;
  }
  .form .reason .other .mwform-radio-field {
    margin-bottom: 15px;
    display: block;
  }
}
/*confirm*/
.confirm .btnWrap {
  display: flex;
  justify-content: center;
}
.confirm .btnWrap .btn {
  margin: 0 20px;
}
@media screen and (max-width: 767px) {
  .confirm .form li {
    display: block;
  }
  .confirm .form li .ttl {
    margin-bottom: 8px;
  }
  .confirm .form li.required.detail .ttl:after {
    display: inline-block;
    margin-top: 0;
  }
  .confirm .form p {
    font-size: 4.1vw;
  }
  .confirm .btnWrap {
    display: block;
    margin-top: 30px;
  }
  .confirm .btnWrap .btn {
    margin: 0 auto 20px;
  }
}
/*thanks*/
.finish {
  margin-bottom: 80px;
}
.finish .thanks {
  font-size: 3.2rem;
  font-weight: bold;
  margin: 50px 0;
  text-align: center;
}
.finish .lead {
  margin-bottom: 50px;
  text-align: center;
}
.finish .btn:after {
  content: none;
}
@media screen and (max-width: 767px) {
  .finish .thanks {
    font-size: 5.5vw;
  }
  .finish .lead {
    font-size: 3.9vw;
  }
}