@charset "UTF-8";





.completeTtl{

	text-align: center;

	margin-bottom: 5vw;

	font-size: 2vw;

}



.contBox.complete{

	margin-bottom :70px;

}







.formIntro{

    margin:0 auto 70px;

    text-align: center;

    font-size: 2rem;

}





.completeTxt{

    margin: 0 auto 100px;

}



.requredTxt{

    margin-bottom: 2vw;

}



.requredTxt span{

    color:#FF4221 



}



.formPart{

	display:flex;

	flex-wrap: wrap;

	justify-content: space-between;

    align-items: center;

}



.formPart dt{

	width:22%;

    display: flex;

    align-items: center;

    margin-bottom: 50px;

    justify-content: space-between;

}



.formPart dt span {

    display: block;

    border: 1px solid #1b91cc;

    text-align: center;

    color: #1b91cc;

    width: 100px;

    height: 30px;

    line-height: 28px;

}





.formPart dd {

    width: 70%;

    position: relative;

    margin-bottom: 50px;

    

}



.formPart dd span{

    display: block;

    padding-top: 4px;

    font-size: 1.2rem;

}



.txtFix{

    padding: 5px 20px;

}





input[type="text"],

input[type="tel"],

input[type="email"]

{

    border: 1px solid #dddddd;

    width: 100%;

    line-height: 50px;

    height: 50px;

    padding: 10px;

}



.radioWrap{

  height: auto;

}



.visible{

  background: #FFF!important;

}





textarea {

  border: 1px solid #dddddd;

  width: 100%;

  padding: 10px;

}



.inputWrap{

  display: flex;

  justify-content: space-between;

}



.inputWrap input{

  width:190px;

  margin-right:20px;

}





label{

    position: relative;

    display: inline-block;

    margin-right: 12px;

    line-height: 30px;

    cursor: pointer;

    padding-left: 24px;

}





.mw_wp_form .horizontal-item + .horizontal-item {

    margin-left: 0!important;

}



.radio {

  /*display: none;*/

  margin-left: -22px;

}



/*

.mwform-radio-field-text{

    padding-left: 23px;

}

*/



select{ 

    background: url("../img/contact/select_arrow.jpg") no-repeat 96% center !important;

    border: 1px solid #dddddd;

    padding: 10px;    

    -webkit-appearance: none;

    -moz-appearance: none;

    appearance: none;

    box-sizing: border-box;

    width: 300px;

    font-size: 16px!important;

    font-size:1.6rem!important;

}

select::-ms-expand{

    display: none;

}





.radio + span::before {

  content: "";

  position: absolute;

  top: 2px;

  left: 0;

  bottom: 0;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  display: block;

  width: 18px;

  height: 18px;

  margin: auto;

  background: #ffffff;

  border: 2px solid #0C7459;

  border-radius: 30px;

}



.radio:checked + span:after {

    content: "";

    position: absolute;

    top: 2px;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

    display: block;

    left: 5px;

    bottom: 0;

    /* right: 0; */

    width: 8px;

    height: 8px;

    margin: auto;

    background: #0C7459;

    border-radius: 8px;

}





input[type=checkbox] {

    display: inline-block;

    margin-right: -3px;

    display: none;

}





input[type=checkbox] + label {

    position: relative;

    display: inline-block;

    cursor: pointer;

    padding-left: 24px;

}





.checkbox-input + span::before, input[type="checkbox"] + label::before {

    content: "";

    position: absolute;

    top: 50%;

    left: 0;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

    display: block;

    width: 24px;

    height: 24px;

    margin-top: -10px;

    background: #ffffff;

}



.checkbox-input + span::before, input[type="checkbox"] + label::before {

    border: 2px solid #1b91cc;

}





input[type="checkbox"]:checked + label::after {

  content: "";

  position: absolute;

  top: 10px;

  left: 4px;

  width: 18px;

  height: 8px;

  border-left: 2px solid #1b91cc;

  border-bottom: 2px solid #1b91cc;

  -webkit-transform: rotate(-45deg);

  -ms-transform: rotate(-45deg);

  transform: rotate(-45deg);

}



.checkbox-input{

    display: none;

}



.checkbox-input:checked + .mwform-checkbox-field-tex::after

{

  content: "";

  display: block;

  position: absolute;

  top: -5px;

  left: 5px;

  width: 7px;

  height: 14px;

  transform: rotate(40deg);

  border-bottom: 3px solid #1b91cc;

  border-right: 3px solid #1b91cc;

}



input::placeholder,textarea::placeholder{

  color: #dddddd;

}





.agreeBox{

	margin-bottom:50px;

    text-align: center;

}



.agreeBox label{

     padding-left: 40px !important;

}

.agree-intro{

    padding-bottom: 30px;

}



.agree-intro a{

    color: #1b91cc;

}



.sumbitBox{

	max-width: 520px;

	margin:0 auto 5vw;

    text-align: center;

    display: flex;

    justify-content: space-between;

}



.btnSubmit {

  height: 60px;

  line-height: 60px;

  color: #fff;

  position: relative;

  text-align: center;

  overflow: hidden;

  display: block;

  background: #1b91cc;

  width: 250px;

  border-radius: 50px;

  font-size: 2rem;

  font-weight: bold;

}



  

.btnSubmit::after {

    display: none;

    content: "";

    position: absolute;

    top: 0px;

    bottom: 0;

    margin: auto;

    z-index: 2;

    right: 2vw;

    width: 0.8vw;

    height: 0.8vw;

    border-top: 1px solid #fff;

    border-right: 1px solid #fff;

    -webkit-transform: rotate(45deg);

    transform: rotate(45deg);

}



.btnSubmit.back {

    background: #a6a6a6;

}



.complete .btnSubmit{

    margin:0 auto;

}





.submit-confirm{

    margin:0 auto;

    display: block;

    pointer-events: none;

    opacity: 0.5;

}



.submit-confirm.clear{

    pointer-events: auto !important;

    cursor: pointer !important;

    transition: all 0.2s;

    opacity: 1 !important;

}







.confirm .agreeBox,

.confirm .nessceray,

.confirm dd span{

    display: none;

}







.confirm .formPart dd {

   padding: 1vw;

   background: none;

}



.formIntro strong{

  text-align: center;

  margin-bottom: 40px;

  font-size: 2rem;

  font-weight: bold;

  display: block;

}



.formIntro.complete{

  text-align: left;

  font-size: 1.6rem;

}


.intro {
  margin-bottom: 70px;
}


/* Media Queries ================================================== */

/*896*/

@media screen and (max-width: 896px) {





    .contBox p {

        padding: 0;

    }



    .formIntro {

      margin: 0 auto 50px;

      font-size: 1.6rem;

      padding: 0 20px;

    }





    .completeTxt{

        margin: 0 auto 50px;

    }



    .requredTxt {

      margin-bottom: 20px;

      font-size: 1.6rem;

    }



    .formPart {

      display: block;

      margin-bottom: 50px;

    }



    .formPart dt {

      width: 100%;

      font-size: 1.6rem;

      margin-bottom: 10px;

    }



    .formPart dd {

      width: 100%;

      margin-bottom: 30px;

      font-size: 1.6rem;

    }



    input[type="text"], input[type="tel"], input[type="email"]{

      line-height: 30px;

      height: 50px;

    }



    label {

      font-size: 1.6rem;

      display: block;

    }



    .radioWrap {

        height: auto;

        padding-top: 10px;

        line-height: 1.2;

    }



    select {

        line-height: 30px;

        width: 100%;

    }



    .inputWrap input {

      width: 58%;

      margin-right: 10px;

    }



    .formIntro{

        margin:0 auto 50px;

        font-size: 1.6rem;

        padding: 0;

    }



     .agreeBox {

        padding: 0;

        margin-bottom: 50px;

        text-align: center;

        font-size: 1.4rem;

    }



    .agree-intro {

      padding-bottom: 20px;

    }



    .agreeBox label {

      font-size: 1.6rem;

    }





    .sumbitBox {

        /*max-width: 90%;*/

        /*display: block;*/

    }    



    .btnSubmit {

        width: 100%;

        margin-bottom: 20px;

    } 



    .btnSubmit::after {

        right: 20px;

        width: 8px;

        height: 8px;  

    } 





    .sumbitBox .btnCommon{

      width: 46%;

      font-size: 18px;
      
      font-weight: bold;

    }


.intro {
  margin-bottom: 50px;
}


}