@charset "UTF-8";
/* CSS Document */

.main {
  background-color: #000;
  position: relative;
  overflow: hidden;
}

.contact-img {
  width: 100%;
  height: auto;
  z-index: 100;
}

.background_logo img {
  position: fixed;
  top: 90px;
  right: 20px;
}

.contact-title_img {
  position: relative;
  padding: 250px 100px;
}

.contact-title_img p {
  font-size: 2.5rem;
  padding: 30px 0 60px 110px;
}

.contact_back-title {
  padding-top: 20px;
  position: absolute;
  left: 100px;
}

.contact-form {
  width: 100%;
  position: relative;
  padding: 100px 40px 150px 40px;
  margin: 0 auto;
  height: auto;
}

.contact-form h3 {
  font-size: 2.2rem;
  padding: 0 0 0 110px;
  margin-bottom: 130px;
}

.center {
  margin: 0 auto;
  max-width: 500px;
  margin-bottom: 80px;
}

.conact-form_box {
  margin-bottom: 30px;
  display: flex;
  justify-content: center;
  position: relative;
}

.mw_wp_form .error {
  position: absolute;
  left: 150px;
  bottom: -20px;
}

.conact-form_box input {
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(4.5px);
  -webkit-backdrop-filter: blur(4.5px);
  padding: 15px 15px;
  width: 500px;
  color: #FFF;
}

.conact-form_box label {
  text-align: left;
  display: block;
  min-width: 9em;
}

.contact-small_label {
  display: flex;
  justify-content: flex-end;
  text-align: right;
}

.inquiary-form__privacy-link {
  padding-left: 15px;
}

#form_inpuiry_detail {
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(4.5px);
  -webkit-backdrop-filter: blur(4.5px);
  width: 500px;
  height: 500px;
  max-width: 500px;
  max-height: 400px;
  color: #FFF;
  margin-bottom: 20px;
  padding: 15px 15px;
}

.input_buttom {
  display: flex;
  justify-content: flex-end;
}

.form-box {
  vertical-align: top;
  padding-right: 10px;
}

.contact-small_label {
  margin-left: 85px;
}

.input_buttom {
  text-align: center;
}

.inquiry__submit {
  background: #FFF;
  color: #000;
  border: none;
  position: relative;
  height: 30px;
  font-size: 1.6rem;
  padding: 0 1.8em;
  margin-top: 35px;
  cursor: pointer;
  transition: opacity .3s ease, width .3s ease-out;
  outline: none;
  margin-bottom: 20px;
}

.inquiry__submit:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(4.5px);
  -webkit-backdrop-filter: blur(4.5px);
}

.back_button {
  background: #FFF;
  color: #000;
  border: none;
  position: relative;
  height: 30px;
  font-size: 1.6rem;
  padding: 0 1.8em;
  margin-top: 35px;
  cursor: pointer;
  transition: opacity .3s ease, width .3s ease-out;
  outline: none;
  margin-left: 20px;
}

#form_inpuiry_detail {
  color: #fff;
}

.back_button:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(4.5px);
  -webkit-backdrop-filter: blur(4.5px);
}

.fa-brands {
  font-family: "Font Awesome 5 Free";
}

.inquiry__submit:hover:before,
.inquiry__submit:hover:after {
  width: 100%;
  transition: 800ms ease all;
}

.inquiary-form__privacy-link {
  text-decoration: underline;
  margin-top: 30px;
  font-size: 1.5rem;
}

.gradient {
  width: 100%;
  background: linear-gradient(180deg, transparent 30%, rgba(0, 0, 0, 0.9)80%);
  height: 300px;
  position: absolute;
  bottom: 0;
  left: 0;
  pointer-events: none;
}

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

input[type="checkbox"]+span {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 3px;
  font: 15px/20px 'Open Sans', Arial, sans-serif;
  color: #ddd;
  cursor: pointer;
}

input[type="checkbox"]+span:last-child {
  display: inline-block;
}

input[type="checkbox"]+span::before {
  content: '';
  display: block;
  width: 20px;
  height: 20px;
  border: 1px solid #FFF;
  position: absolute;
  left: 0;
  top: 0;
  opacity: .6;
  -webkit-transition: all .12s, border-color .08s;
  transition: all .4s, border-color .08s;
}

input[type="checkbox"]:checked+span::before {
  width: 10px;
  top: -5px;
  left: 5px;
  border-radius: 0;
  opacity: 1;
  border-top-color: transparent;
  border-left-color: transparent;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.contact-small_label {
  text-align: right;
}

.contact-label {
  text-align: right;
}

.wpcf7-spinner {
  display: none !important;
}



.indent {
  display: block;
  text-indent: 1rem;
}

.mw_wp_form_input .top-text2 {
  display: none;
}

/* 確認ページのCSS */
.mw_wp_form .conact-form_box {
  display: block;
}

.mw_wp_form_preview .top-text2 {
  display: block;
}

.mw_wp_form_preview .top-text {
  display: none;
}

.mw_wp_form_preview .conact-form_box {
  max-width: 50vw;
}

/* 完了ページのCSS */
.mw_wp_form_complete .message-th {
  text-align: center;
}

.mw_wp_form_complete .message-th h2 {
  font-size: 2.5rem;
  margin-bottom: 90px;
}

.mw_wp_form_complete .text-th {
  font-size: 2.5rem;
  padding-bottom: 60px;
}

.mw_wp_form_complete .img-th {
  background-image: url(../img/photo-thanks.jpg);
  height: auto;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  padding-top: 600px;
  margin: 0 auto;
}

.mw_wp_form_complete .text-th2 {
  font-size: 2.5rem;
  padding-top: 60px;
}


/* MB 680px以下に適用されるcss*/
@media screen and (max-width: 680px) {

  .contact-title_img {
    padding: 250px 0px 100px 30px;
    width: 70vw;
  }

  .background_logo img {
    width: 60vw;
  }

  .contact-form h3 {
    font-size: 1.8rem;
    padding: 0;
  }

  .conact-form_box {
    display: block;
    max-width: 20vw;
  }

  .conact-form_box label {
    margin-bottom: 10px;
  }

  .conact-form_box input {
    max-width: 80vw;
  }

  .contact-small_label {
    margin-left: 0;
  }

  .small_label {
    font-size: 1.4rem;
  }

  .contact-label {
    text-align: center;
  }

  .inquiry__submit {
    margin-top: 15px;
    ;
  }

  input[type="checkbox"]+span {
    margin-bottom: 16px;
  }

  .input_buttom {
    display: block;
    padding-top: 20px;
  }

  .back_button {
    margin: 0 auto;
  }

  .mw_wp_form .error {
    left: 0;
  }

  #form_inpuiry_detail {
    max-width: 80vw;
  }

  .mw_wp_form_complete .img-th {
    padding-top: 300px;
  }

  .mw_wp_form_complete .message-th h2 {
    font-size: 2rem;
    margin-bottom: 50px;
  }

  .mw_wp_form_complete .text-th {
    font-size: 2rem;
    padding-bottom: 40px;

  }

  .mw_wp_form_complete .text-th2 {
    font-size: 2rem;
    padding-top: 40px;
  }


}

/* 414以下の時 */
@media screen and (max-width:414px) {
  .br-sp {
    display: block;
  }

  .br-tb {
    display: none;
  }

  .br-pc {
    display: none;
  }

  input[type="checkbox"]+span {
    padding-left: 30px;
  }

  .mw_wp_form .error {
    width: 500px
  }
}