@charset "UTF-8";

input::-ms-clear {
    display: none;
}

input::-ms-reveal {
    display: none;
}

/*fix in safari*/
input[type=password]::-webkit-credentials-auto-fill-button {
    display: none !important;
    visibility: hidden;
    pointer-events: none;
    position: absolute;
    right: 0;
}

/*fix in sougou*/
input::-webkit-input-safebox-button {
    display: none;
}

input[type=radio], input[type=checkbox] {
    cursor: pointer;
}

input[type="radio"].radio,
input[type="checkbox"].checkbox,
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

input[type="text"],
input[type="text"]:focus,
input[type="number"],
input[type="number"]:focus,
input[type="tel"],
input[type="tel"]:focus,
input[type="password"],
input[type="password"]:focus {
    font-size: 0.9rem;
    font-weight: 400;
    color: #343E4C;
    line-height: 1.388;
    border: none;
    vertical-align: middle;
    outline: none;
    font-family: 'Microsoft Yahei', Arial, sans-serif;
}

input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
    background-color: rgb(255, 255, 255);
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
}

input::placeholder {
    font-weight: 300;
    font-size: 0.8rem;
    color: #B8BFCC;
    line-height: 1.3125;
    font-family: 'Microsoft Yahei', Arial, sans-serif;
}

input::-webkit-input-placeholder {
    font-weight: 300;
    font-size: 0.8rem;
    color: #B8BFCC;
    line-height: 1.3125;
    font-family: 'Microsoft Yahei', Arial, sans-serif;
}

input::-ms-input-placeholder {
    font-weight: 300;
    font-size: 0.8rem;
    color: #B8BFCC;
    line-height: 1.3125;
    font-family: 'Microsoft Yahei', Arial, sans-serif;
}

input::-moz-placeholder {
    font-weight: 300;
    font-size: 0.8rem;
    color: #B8BFCC;
    line-height: 1.3125;
    font-family: 'Microsoft Yahei', Arial, sans-serif;
}

.qs-radio,
.qs-checkbox {
    position: absolute;
    opacity: 0;
    z-index: 2;
}

.qs-radio :after,
.qs-checkbox :after {
    z-index: 3;
}

.qs-radio + label,
.qs-checkbox + label {
    display: inline;
    color: inherit;
    line-height: inherit;
    padding-left: 28px;
    cursor: pointer;
    letter-spacing: 0;
    font-size: 16px;
    font-weight: 400;
    position: relative;
}

.qs-radio + label span.qs-radio-label-point,
.qs-checkbox + label span.qs-checkbox-label-hook {
    width: 18px;
    height: 18px;
    position: absolute;
    left: 0;
    bottom: 0;
    top: 0;
    margin: auto;
    display: inline-block;
    background: #FFFFFF;
    border: 1px solid #CED6E6;
    text-align: center;
    box-sizing: content-box;
}

.qs-radio + .qs-radio-label:hover span.qs-radio-label-point,
.qs-radio + label span.qs-radio-label-point:hover,
.qs-checkbox + .qs-checkbox-label:hover span.qs-checkbox-label-hook,
.qs-checkbox + label span.qs-checkbox-label-hook:hover {
    border: 1px solid rgba(41, 121, 255, 0.6);
}

.qs-radio:checked + .qs-radio-label:hover span.qs-radio-label-point,
.qs-radio:checked + label span.qs-radio-label-point:hover,
.qs-checkbox:checked + .qs-checkbox-label:hover span.qs-checkbox-label-hook,
.qs-checkbox:checked + label span.qs-checkbox-label-hook:hover {
    border: 1px solid #CED6E6;
}

.qs-radio + label span.qs-radio-label-point {
    border-radius: 20px;
}

.qs-radio:checked + label span.qs-radio-label-point:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 8px;
    height: 8px;
    border-radius: 8px;
    background: #2979FF;
}

.qs-checkbox + label span.qs-checkbox-label-hook {
    border-radius: 4px;
}

.qs-checkbox:checked + label span.qs-checkbox-label-hook {
    background: #2979FF;
    border-radius: 4px;
}

.qs-checkbox:checked + label span.qs-checkbox-label-hook:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 2px;
    left: 1.5px;
    margin: auto;
    width: 55%;
    height: 36%;
    border: 2px solid #FFF;
    border-radius: 1px;
    border-top: none;
    border-right: none;
    background: transparent;
    transform: rotate(-45deg);
}

.qs-input {
    outline: none;
    padding: 13px 16px;
    font-size: 16px;
    color: #5C697B;
    background: #FFFFFF;
    border-radius: 4px;
    width: 100%;
    border: 1px solid #EEEEEE;
}
.qs-input:focus {
    border: 1px solid #00CEAA;
}
.qs-input::-moz-placeholder {
    color: #9AA1AB;
    opacity: 0.7;
}
.qs-input:-ms-input-placeholder {
    color: #9AA1AB;
    opacity: 0.7;
}
.qs-input::placeholder {
    color: #9AA1AB;
    opacity: 0.7;
}
.qs-input.error {
    border: 1px solid rgba(244, 72, 72, 0.6) !important;
}

@media screen and (max-device-width: 850px) {
    input[type="text"],
    input[type="text"]:focus,
    input[type="number"],
    input[type="number"]:focus,
    input[type="tel"],
    input[type="tel"]:focus,
    input[type="password"],
    input[type="password"]:focus {
        font-size: 1.6rem;
    }

    input::placeholder {
        font-size: 1.6rem;
    }

    input::-webkit-input-placeholder {
        font-size: 1.6rem;
    }

    input::-ms-input-placeholder {
        font-size: 1.6rem;
    }

    input::-moz-placeholder {
        font-size: 1.6rem;
    }
}