@charset "UTF-8";
* {
  box-sizing: border-box; /*余白や線を幅や高さに含める*/
}

input, select {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
}

body {
  width: 100%;
  overflow-x: hidden;
  font-family: YakuHanJP, "Noto Sans JP", Meiryo, sans-serif;
  color: #222;
  font-weight: 400;
  font-size: 4vw;
  font-feature-settings: "palt";
  line-height: 1.8em;
  letter-spacing: 0.1em;
  overflow-x: hidden;
  -moz-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
@media screen and (min-width: 560px) {
  body {
    font-size: 16px;
  }
}

body * {
  color: #333;
}

body.fixed {
  position: fixed;
}

.smp-block {
  display: block;
}
@media screen and (min-width: 768px) {
  .smp-block {
    display: none;
  }
}

.pc-block {
  display: none;
}
@media screen and (min-width: 768px) {
  .pc-block {
    display: block;
  }
}

.pc-large-block {
  display: none;
}
@media screen and (min-width: 1280px) {
  .pc-large-block {
    display: block;
  }
}

img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

a {
  color: #000;
  text-decoration: none;
  transition: all 0.6s;
}

a:link, a:visited, a:hover, a:active {
  text-decoration: none;
}

a:hover {
  opacity: 0.6;
}
a:hover img {
  transition: all 0.6s;
  opacity: 0.6;
}

@media screen and (min-width: 768px) {
  a.tel-link {
    pointer-events: none;
  }
}

span.sup {
  font-size: 0.6em;
  vertical-align: top;
  position: relative;
  top: -0.1em;
}

span.inline-block {
  display: inline-block;
}

/****/
body {
  /*background-color   : #bbe1e8;
  background-image   : radial-gradient(#ddf0f4 18%, transparent 22%),
  					 radial-gradient(#ddf0f4 18%, transparent 22%);
  background-position: 0 0, 13px 13px;
  background-size    : 26px 26px;*/
  background-color: #a1d9f6;
}

div.smp-content-wrap {
  /*background: url(../img/cont-bg.png) repeat-y center top;
  background-size: 98%;*/
  max-width: 460px;
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  div.smp-content-wrap {
    background-size: 100%;
  }
}

main {
  margin: 0 auto;
}
main h1.main-image {
  width: 87%;
  margin: 0 auto;
  padding: 8% 0 0 0;
  margin-bottom: 18%;
}
main div.cont-box {
  width: 84%;
  margin: 0 auto;
  position: relative;
}
main div.cont-box.txt-box01 {
  margin-bottom: 12%;
}
main div.cont-box.txt-box01 h2 {
  width: 35.4%;
  position: absolute;
  left: 0;
  top: -10%;
}
main div.cont-box.txt-box01 h2 span {
  color: #FFF;
}
main div.cont-box.txt-box01 p span.icon01 {
  display: block;
  width: 32%;
  position: absolute;
  right: 0;
  top: 0;
  transform: translate(0, -50%);
}
main div.cont-box {
  /*txt-box01*/
}
main div.cont-box.txt-box02 {
  margin-bottom: 6%;
}
main div.cont-box.txt-box02 h2 {
  width: 35.4%;
  position: absolute;
  left: 0;
  top: -8%;
}
main div.cont-box {
  /*txt-box02*/
}
main div.cont-box.txt-box03 {
  margin-bottom: 10%;
}
main div.cont-box.txt-box03 h2 {
  background: #008ec3;
  text-align: center;
  color: #FFF;
}
main div.cont-box.txt-box03 h2 span {
  color: #FFF;
}
main div.cont-box.txt-box03 p {
  margin-top: 3%;
  letter-spacing: 0.02em;
}
main div.cont-box.txt-box03 p.coution {
  text-align: center;
  color: #111;
}
main div.cont-box.txt-box03 p.coution span {
  font-weight: 600;
}
main div.cont-box.txt-box03 p.finish {
  text-align: center;
}
main div.cont-box.txt-box03 p.finish span {
  font-weight: 600;
}
main div.cont-box.txt-box03 p.finish a {
  display: block;
  margin-top: 5%;
  margin-bottom: 15%;
  color: #fff;
  text-decoration: underline;
}

/*ここからフォーム*/
/***フォームリセット***/
input,
button,
select,
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  border-radius: 0;
  font: inherit;
  outline: none;
}

textarea {
  resize: vertical;
}

input[type=checkbox],
input[type=radio] {
  display: none;
}

input[type=submit],
input[type=button],
label,
button,
select {
  cursor: pointer;
}

span.required {
  display: inline-block;
  background: #ff776a;
  font-size: 0.8em;
  color: #FFF;
  margin-left: 10px;
  padding: 0 10px;
  border-radius: 60px;
}

div.form-wrap {
  width: 90%;
  background: #fff;
  margin: 0 auto;
  padding: 2em 1em;
  border-radius: 1em 1em 0 0;
}
div.form-wrap dl dd.radio-type02 {
  font-size: 0.9em;
}
div.form-wrap dl dd.radio-type02 span.mwform-radio-field {
  display: block;
  margin-top: 3%;
  margin-left: 0;
}
div.form-wrap dl dd.radio-type02 span.mwform-radio-field label span.mwform-radio-field-text {
  display: block;
  position: relative;
  padding-left: 30px;
  transition: 0.25s all ease;
}
div.form-wrap dl dd.radio-type02 span.mwform-radio-field label span.mwform-radio-field-text::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  border: 1px solid #008ec3;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
  transition: 0.25s all ease;
}
div.form-wrap dl dd.radio-type02 span.mwform-radio-field label input[type=radio]:checked + span.mwform-radio-field-text {
  transition: 0.25s all ease;
  padding-left: 0;
  padding: 5px 0;
  text-align: center;
  color: #FFF;
  z-index: 1;
}
div.form-wrap dl dd.radio-type02 span.mwform-radio-field label input[type=radio]:checked + span.mwform-radio-field-text::before {
  transition: 0.25s all ease;
  content: " ";
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  background: #008ec3;
  opacity: 1;
  position: absolute;
  z-index: -1;
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
}
div.form-wrap dl dd.radio-type02 {
  /*span.mwform-radio-field*/
}
div.form-wrap dl {
  /*dd*/
}

div.question-routeA {
  display: none;
  margin-top: 5%;
}
div.question-routeA ul li {
  margin-bottom: 4%;
}

div.select-box {
  width: 60%;
  display: block;
  margin-top: 3%;
  background: #eeeeee;
  position: relative;
}
div.select-box select {
  width: 100%;
  padding: 3%;
  color: #333;
}
div.select-box::after {
  display: block;
  content: "";
  width: 0.6em;
  height: 0.6em;
  border: 1px solid #222;
  border-top-color: transparent;
  border-left-color: transparent;
  position: absolute;
  top: 50%;
  right: 11px;
  transform: translate(0, -0.4em) rotate(45deg);
  z-index: 2;
}

input[type=number],
input[type=text] {
  display: block;
  width: 100%;
  box-sizing: border-box;
  font-size: 16px;
  margin-top: 3%;
  padding: 3%;
  background: #eeeeee;
}
input[type=number].name,
input[type=text].name {
  width: 100%;
  box-sizing: border-box;
  padding: 3%;
  display: inline-block;
}

/*input*/
div.mw_wp_form_preview div.select-box {
  background: none;
}
div.mw_wp_form_preview div.select-box::after {
  display: none;
}

/* チェックボックス01 */
div.checkbox-btn {
  text-align: center;
  margin-top: 5%;
}
div.checkbox-btn label span {
  display: inline-block;
  position: relative;
  padding-left: 25px;
  margin-right: 10px;
  margin-bottom: 15px;
  line-height: 1.5em;
}
div.checkbox-btn label span::before {
  background: #fff;
  border: 1px solid #192c68;
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  position: absolute;
  left: 0;
  top: 0.32em;
}
div.checkbox-btn label input[type=checkbox]:checked + span::before {
  background: rgb(25, 44, 104);
  background: linear-gradient(180deg, rgb(25, 44, 104) 0%, rgb(39, 47, 54) 100%);
}
div.checkbox-btn span {
  font-weight: 600;
}
div.checkbox-btn span a {
  text-decoration: underline;
}

div.submit-box {
  width: 100%;
  max-width: 310px;
  margin: 0 auto;
  margin-top: 8%;
}
div.submit-box span {
  display: block;
  margin-bottom: 5%;
}
div.submit-box input[type=submit] {
  display: block;
  width: 100%;
  margin: 0 auto;
  margin-top: 0;
  padding: 10px 0;
  border-radius: 10px;
  background: #f4a12c;
  text-align: center;
  color: #FFF;
  transition: all 0.6s;
  transform-origin: center center;
}
@media screen and (min-width: 768px) {
  div.submit-box {
    width: 90%;
    max-width: 1000px;
    margin-top: 40px;
    display: flex;
    justify-content: center;
  }
  div.submit-box span {
    width: 100%;
  }
  div.submit-box span:nth-child(2) {
    margin-left: 5%;
  }
  div.submit-box input[type=submit]:hover {
    transition: all 0.6s;
    transform-origin: center center;
    transform: scale(1.1);
  }
}

div.form-wrap.check div.question-routeA {
  display: block;
}
div.form-wrap div.checkbox-btn {
  text-align: left;
}
div.form-wrap div.checkbox-btn a {
  text-align: left;
}
div.form-wrap div.submit-box span:last-child input {
  background: #666;
}

p.link-txt {
  width: 80%;
  padding-left: 1.5em;
  line-height: 1;
  transform: translate(0, -10px);
}
p.link-txt a {
  font-size: 11px;
  color: #888;
  text-decoration: underline;
}

.mw_wp_form input[type=file].has-file::-webkit-file-upload-text {
  visibility: hidden;
}
.mw_wp_form input[type=file].has-file::-moz-file-upload-text {
  visibility: hidden;
}

/****************************************/
div.ft-image {
  width: 90%;
  margin: 0 auto;
  padding-top: 5%;
  background: #fff;
}
div.ft-image.thanks {
  border-radius: 1em 1em 0 0;
}
div.ft-image img {
  display: block;
  width: 90%;
  margin: auto;
}

footer {
  width: 90%;
  margin: 0 auto;
  padding-top: 10%;
  padding-bottom: 10%;
  background: #fff;
  position: relative;
}
footer::after {
  content: "";
  display: block;
  width: 90%;
  height: 1px;
  background: #444;
  position: absolute;
  top: 17%;
  left: 0;
  right: 0;
  margin: auto;
}
footer div {
  width: 46%;
  margin: 0 auto;
}

/****************************************/
div#waiting,
div#loading {
  display: none;
  width: 100%;
  height: 100vh;
  position: fixed;
  left: 0;
  top: 0;
  background: #FFF;
  z-index: 5;
}
div#waiting div.loading-inner,
div#loading div.loading-inner {
  max-width: 375px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
div#waiting div.loading-inner p,
div#loading div.loading-inner p {
  text-align: center;
}
div#waiting div.loading-inner p span,
div#loading div.loading-inner p span {
  display: block;
  font-size: 0.7em;
  line-height: 1.6em;
  margin-top: 3%;
}
div#waiting div.loading-inner div.img,
div#loading div.loading-inner div.img {
  width: 80%;
  margin: 0 auto;
}
div#waiting div.loading-inner div.wait-ani,
div#loading div.loading-inner div.wait-ani {
  width: 300px;
  margin: 0 auto;
  margin-top: 5%;
  margin-bottom: 5%;
}
div#waiting div.loading-inner div.wait-ani span.wait-dot,
div#loading div.loading-inner div.wait-ani span.wait-dot {
  display: block;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  position: relative;
  animation: wating-ani 16s 0.2s infinite;
}
div#waiting div.loading-inner div.wait-ani span.wait-dot span,
div#loading div.loading-inner div.wait-ani span.wait-dot span {
  display: block;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #CCC;
}
div#waiting div.loading-inner div.wait-ani span.wait-dot::before,
div#loading div.loading-inner div.wait-ani span.wait-dot::before {
  content: " ";
  display: block;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #CCC;
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(-200%, 0);
  opacity: 0;
  animation: dot-ani 16s 0.2s infinite;
}
div#waiting div.loading-inner div.wait-ani span.wait-dot::after,
div#loading div.loading-inner div.wait-ani span.wait-dot::after {
  content: " ";
  display: block;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #CCC;
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(200%, 0);
  opacity: 0;
  animation: dot-ani02 16s 0.2s infinite;
}

@keyframes wating-ani {
  0% {
    transform: translate(0, 0);
  }
  15% {
    transform: translate(300px, 0);
    opacity: 0;
  }
  16% {
    transform: translate(300px, 0);
  }
  30% {
    transform: translate(0px, 0);
    opacity: 1;
  }
  31% {
    transform: translate(0px, 0);
    opacity: 0;
  }
  32% {
    transform: translate(140px, 0);
    opacity: 0;
  }
  40% {
    transform: translate(140px, 0);
    opacity: 0;
  }
  45% {
    transform: translate(140px, 0);
    opacity: 1;
  }
  70% {
    transform: translate(140px, 0);
    opacity: 1;
  }
  90% {
    transform: translate(140px, 0);
    opacity: 1;
  }
  95% {
    transform: translate(140px, 0);
    opacity: 0;
  }
  100% {
    transform: translate(140px, 0);
    opacity: 0;
  }
}
@keyframes dot-ani {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0;
  }
  55% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  80% {
    opacity: 1;
  }
  85% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes dot-ani02 {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0;
  }
  60% {
    opacity: 0;
  }
  65% {
    opacity: 1;
  }
  85% {
    opacity: 1;
  }
  90% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}/*# sourceMappingURL=style.css.map */