/**********************************
 *
 * お問い合わせ一覧
 *
 **********************************/
#contact h4 {
    padding: 0 0 18px;
}

#contact h4 img {
    display: inline-block;
    width: 35px;
    vertical-align: middle;
    padding-right: 10px;
}

#contact .tel a img {
    display: inline-block;
    width: 45px;
    vertical-align: middle;
}

#contact .notice {
    padding: 40px 0 60px;
}

#contact a {
    color: #669219;
}

#contact .tel {
    padding: 0 0 100px;
}

#contact .tel a.telno {
    font-size: 36px;
    font-weight: 700;
    letter-spacing: 3.6px;
    color: #35312f;
    padding: 30px 0 0;
}

#contact .mail {
    padding: 0 0 40px;
}

#contact .tel p,
#contact .mail .mailDetail {
    padding: 40px 0 0 0;
}

#contact .mail .mailDetail span {
    font-weight: 700;
}

#contact .moreBtn {
    width: 280px;
    margin: 40px 0;
}

#contact .moreBtn:hover a {
    color: #fff;
}

#contact .emergency {
    margin-top: 30px;
}

#contact .emergency h1 {
    margin-bottom: 10px;
    font-size: 105%;
}

#contact .emergency h1,
#contact .emergency span {
    font-weight: 700;
}

/**********************************
 *
 * お問い合わせ一覧 > フォーム
 *
 **********************************/
form input[type="text"], form input[type="tel"], form input[type="email"], form input[type="number"]{
    width: 406px;
    height: 35px;
    background-color: #ffffff;
    border: solid 1px #d2d2d2;
    padding: 5px;
}

form input.short {
    width: 150px;
}

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

form .mwform-radio-field label {
    margin-right: 20px;
    display: inline-block;
}

form .mwform-radio-field label span {
    padding-left: 30px;
    position: relative;
    margin-right: 20px;
    cursor: pointer;
}

form .mwform-radio-field label span::before {
    content: "";
    display: block;
    position: absolute;
    top: 2px;
    left: 0;
    width: 15px;
    height: 15px;
    border: 2px solid #669219;
    border-radius: 50%;
}

form input[type="radio"]:checked + .mwform-radio-field-text::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0px;
    background: #669219;
    border-radius: 50%;
    bottom: 0;
    margin: auto;
    width: 19px;
    height: 19px;
}


form .mwform-checkbox-field  label {
    margin-right: 20px;
    display: inline-block;
}
form .mwform-checkbox-field label span {
    padding-left: 30px;
    position: relative;
    margin-right: 20px;
    cursor: pointer;
}

form .mwform-checkbox-field label span::before {
    -webkit-transition: border-color 0.2s linear;
    transition: border-color 0.2s linear;
    position: absolute;
    top: 50%;
    left: 0px;
    display: block;
    margin-top: -11px;
    width: 16px;
    height: 16px;
    border: 2px solid #669219;
    content: '';
}

form input[type="checkbox"]:checked + .mwform-checkbox-field-text::after {
    -webkit-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear;
    position: absolute;
    top: 50%;
    left: 5.5px;
    display: block;
    margin-top: -8px;
    width: 5px;
    height: 9px;
    border-right: 3px solid #669219;
    border-bottom: 3px solid #669219;
    content: '';
    opacity: 1;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}


form .checkbox {
    -webkit-transition: background-color 0.2s linear;
    transition: background-color 0.2s linear;
    position: relative;
    padding: 5px 30px;
    vertical-align: middle;
    cursor: pointer;
    font-size:14px;
    display: inline-block;
}

form .checkbox:hover:after {
    border-color: #669219;
}

form .checkbox:after {
    -webkit-transition: border-color 0.2s linear;
    transition: border-color 0.2s linear;
    position: absolute;
    top: 50%;
    left: 0px;
    display: block;
    margin-top: -11px;
    width: 16px;
    height: 16px;
    border: 2px solid #669219;
    content: '';
}

form .checkbox:before {
    -webkit-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear;
    position: absolute;
    top: 50%;
    left: 5.5px;
    display: block;
    margin-top: -7px;
    width: 5px;
    height: 9px;
    border-right: 3px solid #669219;
    border-bottom: 3px solid #669219;
    content: '';
    opacity: 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}



form select {
    width: 150px;
    height: 30px;
    border-radius: 4px;
    background-color: #ffffff;
    border: solid 1px #d2d2d2;
}

form textarea {
    width: 480px;
    height: 150px;
    background-color: #ffffff;
    border: solid 1px #d2d2d2;
    padding: 5px;
}

 form input:read-only, form textarea:read-only, select:disabled {
    border: none!important;
    background-color: #f7f4ee!important;
    resize: none;
    color: rgb(53, 49, 47)!important;
    cursor: auto!important;
    outline: none!important;
    font-size: 16px;
}

form textarea:read-only:focus {
    outline: none;
}

 select:disabled {
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
 }


 #frm.inputPage .inputMode {
    display: block;
 }
 #frm.inputPage .confirmMode {
    display: none;
 }
 #frm.confirmPage .inputMode {
    display: none;
 }
 #frm.confirmPage .confirmMode {
    display: block;
 }

 /*
form input[type="radio"]:disabled + label {
    display: none;
    padding: 0;
}

form input[type="radio"]:disabled:checked + label {
    display: block;
}

form input[type="radio"]:disabled:checked + label:before, form input[type="radio"]:disabled:checked + label:after {
    display: none;
}*/


#contact-form #underLayerTitle {
    border: none;
}

#contact-form #underLayerTitle p.notice {
    font-size: 14px;
    padding: 60px 0 0;
}

#contact-form .form {
    width: 840px;
    border-radius: 10px;
    background-color: #f7f4ee;
    margin: 0 auto;
    padding: 50px 60px;
}

#contact-form .form figure {
    width: 726px;
    margin: 0 auto;
    padding: 0 0 40px;
}

#contact-form .form h3 {
    padding: 0 0 50px;
    font-size: 24px;
    font-weight: 500;
    letter-spacing: 2.4px;
    text-align: center;
    color: #669219;
}

#contact-form .form h3 p {
    font-size: 14px;
    text-align: center;
    color: #35312f;
    padding: 30px 0 0;
}

#contact-form .wrap {
    display: inline-block;
}

#contact-form .form dl {
    border-bottom: 1px solid #dcdcdc;
    padding: 20px 0;
}

#contact-form .form dl dt {
    width: 100%;
    font-size: 18px;
    font-weight: 700;
    color: #669219;
    padding: 0 0 10px;
}

#contact-form .form dl dt span {
    width: 60px;
    height: 20px;
    background-color: #a0a0a0;
    line-height: 20px;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
    color: #ffffff;
    display: inline-block;
    margin: 0 0 0 20px;
}

#contact-form .form dl dt span.required {
    background-color: #eb6120;
}

#contact-form .form dl dd .attention {
    font-size: 12px;
    color: #669219;
    padding: 10px 0;
}

#contact-form .form .mw_wp_form .error {
    color: #eb6120;
    padding: 10px 0;
}


#contact-form .form dl dd .box{
    padding: 0 0 15px;
}

#contact-form .form dl dd .box span {
    padding: 0 20px 0 0;
    font-size: 16px;
}

#contact-form .form dl dd .box input {
    margin: 0 20px 0 0;
}

#contact-form .form dl dd p {
    padding: 15px 0 0;
}

#contact-form .form .apply {
    padding: 50px 0 0;
    text-align: center;
}

#contact-form .form.confirmPage {
    background-color: #fff;
}

form .confirmBtn {
    width: 210px;
    height: 50px;
    margin: 0 auto;
    border-radius: 25px;
    font-size: 14px;
    line-height: 46px;
    text-align: center;
    color: #a3ca0f;
    background-color:#fff;
    border: solid 2px #a3ca0f;
    box-shadow: 3.9px 3.1px 14.3px 0.8px #eff1e9;
    border-radius: 25px;
    cursor:pointer;
    outline: none;
    position: relative;
    -webkit-transition: all ease-in .2s;
    -o-transition: all ease-in .2s;
    transition: all ease-in .2s;
}

form .confirmBtn:after {
    content: "";
    position: absolute;
    top: 4px;
    bottom: 0;
    right: 15px;
    margin: auto;
    width: 8px;
    height: 8px;
    border-top: 1px solid #669219;
    border-right: 1px solid #669219;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

form .confirmBtn:hover {
    background-color:#a3ca0f;
    color: #fff;
}


.submitBtn {
    display:block;
    width: 210px;
    height: 50px;
    margin: 40px auto 20px;
    position: relative;
}

.submitBtn input {
    font-size: 14px;
    line-height: 44px;
    text-align: center;
    color: #a3ca0f;
    background-color:#fff;
    border: solid 2px #a3ca0f;
    box-shadow: 3.9px 3.1px 14.3px 0.8px #eff1e9;
    border-radius: 25px;
    cursor:pointer;
    width: 100%;
    outline: none;
    position: relative;
    -webkit-transition: all ease-in .2s;
    -o-transition: all ease-in .2s;
    transition: all ease-in .2s;
}

.submitBtn:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 15px;
    margin: auto;
    width: 8px;
    height: 8px;
    border-top: 1px solid #669219;
    border-right: 1px solid #669219;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.submitBtn input:hover {
    background-color:#a3ca0f;
    color: #fff;
}


input.returnBtn {
    position: relative;
    display: block;
    width: 210px;
    height: 50px;
    margin: 20px auto 40px;
    border-radius: 25px;
    box-shadow: 3.9px 3.1px 14.3px 0.8px #eff1e9;
    background-color: #ffffff;
    border: solid 2px #a0a0a0;
    text-align: center;
    font-size: 14px;
    line-height: 44px;
    color: #a0a0a0;
    cursor: pointer;
    -webkit-transition: all ease-in .2s;
    -o-transition: all ease-in .2s;
    transition: all ease-in .2s;
    outline: none;
}

input.returnBtn:after {
    content: "";
    position: absolute;
    top: 4px;
    bottom: 0;
    left: 15px;
    margin: auto;
    width: 8px;
    height: 8px;
    border-top: 1px solid #a0a0a0;
    border-left: 1px solid #a0a0a0;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

input.returnBtn:hover {
    background-color:#a0a0a0;
    color: #fff;
}



#contact-form-complete h3 {
    font-size: 24px;
    letter-spacing: 2.4px;
    text-align: center;
    color: #669219;
    padding: 0 0 30px;
}

#contact-form-complete p {
    text-align: center;
    padding: 0 0 60px;
}

#contact-form-complete figure {
    width: 726px;
    margin: 0 auto;
    padding: 0 0 40px;
}

/*------------------------------------------------------------*/
/* sp
 ------------------------------------------------------------*/
@media screen and (max-width: 768px) {
    /**********************************
    *
    * お問い合わせ一覧
    *
    **********************************/
    #contact h4 {
        padding: 0 0 10px;
    }

    #contact .notice {
        padding: 30px 0 60px;
    }

    #contact .tel {
        padding: 0 0 80px;
    }

    #contact .tel a.telno {
        font-size: 7vw;
        letter-spacing: 3px;
    }

    #contact .mail {
        padding: 0 0 60px;
    }

    #contact .mail .mailDetail {
        padding: 30px 0 0 0;
    }

    #contact .moreBtn {
        width: 280px;
        margin: 30px auto;
    }

    /**********************************
    *
    * お問い合わせ一覧 > フォーム
    *
    **********************************/
    form input[type="text"], form input[type="tel"], form input[type="email"], form input[type="number"] {
        width: 100%;
    }

    form input.short {
        width: 80%;
    }

    form select {
        width: 50%;
        height: 30px;
    }

    form textarea {
        width: 100%;
    }

    form input:read-only, form textarea:read-only, select:disabled {
        font-size: 4vw;
    }

    form input[name="zip1"], form input[name="zip2"], form input[name="age"] {
        width: 40%;
    }

    form input[name="tel1"], form input[name="tel2"], form input[name="tel3"] {
        width: 25%;
    }

    #contact-form .wrap {
        display: block;
    }

    #contact-form #underLayerTitle p {
        font-size: 3.2vw;
        padding: 40px 0 0;
    }

    #contact-form .form {
        width: 100%;
        padding: 30px 5%;
    }

    #contact-form .form figure {
        width: 100%;
        padding: 0 0 30px;
    }

    #contact-form .form h3 {
        padding: 0 0 30px;
        font-size: 4.2666vw;
    }

    #contact-form .form h3 p {
        font-size: 3.2vw;
    }

    #contact-form .form dl {
        padding: 10px 0;
    }

    #contact-form .form dl dt {
        width: 100%;
        font-size: 4vw;
    }

    #contact-form .form dl dd .attention {
        font-size: 3.2vw;
    }

    #contact-form .form dl dd .box{
        padding: 0 0 20px;
    }

    #contact-form .form dl dd .box span {
        padding: 0 10px 0 0;
        font-size: 3.7333vw;
    }

    #contact-form .form dl dd .box input {
        margin: 0 0 10px 0;
    }

    .submitBtnArea {
        padding: 30px 0;
        width: 100%;
    }

    .submitBtnArea .returnBtn {
        display: block;
        margin: 0 auto 20px;
    }


    .submitBtn {
        display: block;
    }

    .submitBtn input {
        -webkit-appearance:none
    }

    #contact-form-complete h3 {
        font-size: 6vw;
    }

    #contact-form-complete p {
        padding: 0 0 30px;
    }

    #contact-form-complete figure {
        width: 100%;
    }

    form .checkbox, form .radio {
        font-size: 4vw;
    }
}
