/*
.try-hear-form{width: 100%;height: 100%;position: fixed;top: 0;left: 0;background: rgba(0,0,0,0.6);z-index: 101;}
.fixed-form-outer{width: 100%;min-height: 180px;height: auto;position: fixed;bottom: -375px;left: 0;z-index: 200;background: #fff;}
.fixed-form-header{height: 50px;position: relative;line-height: 50px;font-size: 16px;background: #f9f9f9;color: #262626;text-align: center;}
.fixed-form-header .title-image{width: 24px;height: 24px;position: relative;top: 6px;margin-right: 5px;display: inline-block;}
.fixed-form-close{width: 50px;height: 50px;position: absolute;right: 0; top: 0;}
.fixed-form-close img{width: 18px;position: absolute;top: 15px;right: 16px;}
.form-content-inner{padding: 24px 24px 10px 24px;}
.inner-input-group .input-item{width: 100%;height: auto;position: relative;display: flex;padding-bottom: 8px;}
.inner-input-group .input-item input{width: 100%; height: 44px;padding: 0 10px; border-radius: 4px; font-size: 15px;border: solid 1px #d9d9da;background: #fff;color: #787878;}
.course-notice, .campus-notice, .phone-notice{font-size: 15px;color: #ababab;position: absolute;top: 13px;left: 12px;height: 18px;line-height: 18px;}
.inner-input-group .input-item .notice-image{width: 13px;height: 13px;position: absolute;top: 16px;right: 12px;}
.form-content-inner .inner-text{padding: 7px 0 20px;font-size: 12px;color: #595959;text-align: center;line-height: 17px;}
.awray-yy-try-hear-btn{width: 100%;height: 44px;border-radius: 4px;background: #1a8cff;font-size: 16px;font-weight: bold;color: #fff;}
.fadeInTop{animation: fadeInTop 0.6s ease forwards;-webkit-animation:fadeInTop 0.6s ease forwards;}
@keyframes fadeInTop{from{bottom: -375px;}
to{bottom: 0;}
}
@-webkit-keyframes fadeInTop{from{bottom:375px;}
to{bottom: 0;}
}
.fadeInBottom{animation: fadeInBottom 0.6s ease forwards;-webkit-animation:fadeInBottom 0.6s ease forwards;}
@keyframes fadeInBottom{from{bottom: 0;}
to{bottom:-375px;}
}
@-webkit-keyframes fadeInBottom{from{bottom: 0;}
to{bottom:-375px;}}
.form-success-box{padding: 24px 36px 60px;text-align: center;}
.form-success-box img{width: 60px;height: 60px;margin: 0 auto;}
.form-success-box .success-box-title{height: 26px;margin-top: 16px;font-size: 20px;line-height: 26px;color: #262626;}
.form-success-box .success-box-text{margin-top: 8px;font-size: 14px;line-height: 22px;color: #8c8c8c;}
.try-hear-loading{width: 20px;height: 20px;background: url(../fonts/loading.svg)no-repeat;background-size: 100% 100%;display: inline-block;vertical-align: middle;animation: weuiLoading 1s steps(12, end) infinite;-webkit-animation: weuiLoading 1s steps(12, end) infinite; margin-bottom: 3px;}
@keyframes weuiLoading{0%{transform: rotate3d(0, 0, 1, 0deg);}100%{transform: rotate3d(0, 0, 1, 360deg);}}
@-webkit-keyframes weuiLoading{0%{transform: rotate3d(0, 0, 1, 0deg);}100%{transform: rotate3d(0, 0, 1, 360deg);}}
.fixed-form-content .loading{display: none;}

.input-item input:focus{border: 1px solid #1a8cff;}
.toggleUser{font-size: 12px; color: #D9D9DA;position: absolute;right: 16px;top: calc(50% - 4px);transform: translateY(-50%);}
.toggleUser img{display: inline-block;width: 12px;height: 12px;vertical-align: middle;margin: 0 2px 2px 0;}
.pop-up{width: 100%;height: 100%; background: rgba(0,0,0,0.6);position: fixed;top: 0;left: 0;z-index: 999;}
.pop-up .hint-explain{width: 280px;height: 135px;background: #fff;position: absolute;top: 50%;left: 50%; transform: translate(-50%, -50%);border-radius: 8px;}
.hint-explain .hint-top{width: 100%;padding: 32px 20px 10px;font-size: 16px;color: #333;text-align: center;line-height: 22px;border-bottom: 1px solid #E5E5E5;}
.hint-explain .hint-bottom{width: 100%;display: flex;justify-content: space-between;}
.hint-explain .hint-bottom span{padding: 13px 0;width: 50%;text-align: center;font-size: 16px;color: #8C8C8C;position: relative;cursor: pointer;}
.hint-explain .finishTrue a{color: #FE8A00;}
.hint-explain .finishTrue::before{content: '';width: 1px;height: 48px;background: #E5E5E5;position: absolute;left: 0;top: 0;}*/

.try-hear-form {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 101;
    display: none;
}

.fixed-form-outer {
    width: 100%;
    min-height: 180px;
    height: auto;
    position: fixed;
    bottom: -445px;
    left: 0;
    z-index: 200;
    background: #fff;
    border-radius: 16px 16px 0px 0px;
}

.qy-alert-tip {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: #262626;
    line-height: 21px;
    text-align: center;
    padding-bottom: 16px;
}

.form-content-inner {
    padding-top: 12px 0px;
}

.inner-input-group {
    margin-top: 12px;
}

    .inner-input-group .input-item {
        width: 100%;
        height: auto;
        position: relative;
        display: flex;
        padding: 0 16px 8px;
    }

        .inner-input-group .input-item input {
            width: 100%;
            height: 44px;
            padding: 0 16px;
            border-radius: 22px;
            font-size: 14px;
            border: 1px solid transparent !important;
            background: #F5F6F7;
            color: #262626;    
            /* font-weight: 600; */

        }

.course-notice,
.campus-notice,
.phone-notice {
    font-size: 15px;
    color: #ababab;
    position: absolute;
    top: 13px;
    left: 12px;
    height: 18px;
    line-height: 18px;
}

.inner-input-group .input-item .notice-image {
    width: 13px;
    height: 13px;
    position: absolute;
    top: 16px;
    right: 28px;
}

.form-content-inner .inner-text {
    padding: 7px 0 20px;
    font-size: 12px;
    color: #595959;
    text-align: center;
    line-height: 17px;
}

.awray-yy-try-hear-btn {
    width: 100%;
    height: 44px;
    border-radius: 4px;
    background: #1a8cff;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
}

.fadeInTop {
    animation: fadeInTop 0.5s ease forwards;
    -webkit-animation: fadeInTop 0.5s ease forwards;
}

.fadeInTop2 {
    animation: fadeInTop2 0.5s ease forwards;
    -webkit-animation: fadeInTop2 0.5s ease forwards;
}

@keyframes fadeInTop {
    from {
        bottom: -445px;
    }

    to {
        bottom: 0;
    }
}

@keyframes fadeInTop2 {
    from {
        bottom: -550px;
    }

    to {
        bottom: 0;
    }
}

/*@-webkit-keyframes fadeInTop {
    from {
        bottom: 445px;
    }

    to {
        bottom: 0;
    }
}*/

.fadeInBottom {
    animation: fadeInBottom 0.5s ease forwards;
    -webkit-animation: fadeInBottom 0.5s ease forwards;
}

.fadeInBottom2 {
    animation: fadeInBottom2 0.5s ease forwards;
    -webkit-animation: fadeInBottom2 0.5s ease forwards;
}

@keyframes fadeInBottom {
    from {
        bottom: 0;
    }

    to {
        bottom: -445px;
    }
}

@keyframes fadeInBottom2 {
    from {
        bottom: 0;
    }

    to {
        bottom: -550px;
    }
}


@-webkit-keyframes fadeInBottom {
    from {
        bottom: 0;
    }

    to {
        bottom: -445px;
    }
}

.form-success-box {
    padding: 24px 36px 60px;
    text-align: center;
}

    .form-success-box img {
        width: 60px;
        height: 60px;
        margin: 0 auto;
    }

    .form-success-box .success-box-title {
        height: 26px;
        margin-top: 16px;
        font-size: 20px;
        line-height: 26px;
        color: #262626;
    }

    .form-success-box .success-box-text {
        margin-top: 8px;
        font-size: 14px;
        line-height: 22px;
        color: #8c8c8c;
    }

.try-hear-loading {
    width: 20px;
    height: 20px;
    background: url(../fonts/loading.svg)no-repeat;
    background-size: 100% 100%;
    display: inline-block;
    vertical-align: middle;
    animation: weuiLoading 1s steps(12, end) infinite;
    -webkit-animation: weuiLoading 1s steps(12, end) infinite;
    margin-bottom: 3px;
}

@keyframes weuiLoading {
    0% {
        transform: rotate3d(0, 0, 1, 0deg);
    }

    100% {
        transform: rotate3d(0, 0, 1, 360deg);
    }
}

@-webkit-keyframes weuiLoading {
    0% {
        transform: rotate3d(0, 0, 1, 0deg);
    }

    100% {
        transform: rotate3d(0, 0, 1, 360deg);
    }
}

.fixed-form-content .loading {
    display: none;
}

.input-item input:focus {
    border: 1px solid #1a8cff;
}

.toggleUser {
    font-size: 12px;
    color: #D9D9DA;
    position: absolute;
    right: 16px;
    top: calc(50% - 4px);
    transform: translateY(-50%);
}

    .toggleUser img {
        display: inline-block;
        width: 12px;
        height: 12px;
        vertical-align: middle;
        margin: 0 2px 2px 0;
    }

.pop-up {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
}

    .pop-up .hint-explain {
        width: 280px;
        height: 135px;
        background: #fff;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        border-radius: 8px;
    }

.hint-explain .hint-top {
    width: 100%;
    padding: 32px 20px 10px;
    font-size: 16px;
    color: #333;
    text-align: center;
    line-height: 22px;
    border-bottom: 1px solid #E5E5E5;
}

.hint-explain .hint-bottom {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

    .hint-explain .hint-bottom span {
        padding: 13px 0;
        width: 50%;
        text-align: center;
        font-size: 16px;
        color: #8C8C8C;
        position: relative;
        cursor: pointer;
    }

.hint-explain .finishTrue a {
    color: #FE8A00;
}

.hint-explain .finishTrue::before {
    content: '';
    width: 1px;
    height: 48px;
    background: #E5E5E5;
    position: absolute;
    left: 0;
    top: 0;
}