.carousel-indicators .active {
    width: 12px;
    height: 12px;
    margin: 0;
    background-color: #999
}

.carousel-indicators li {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin: 0px;
    text-indent: -999px;
    cursor: pointer;
    background-color: #000;
    background-color: rgba(153,153,153,0.5);
    border-radius: 10px;
    border: none !important
}

.modal-dialog {
    width: 600px
}

.btnV2 {
    background-color: #3e89f8;
    border-radius: 6px;
    border: none;
    outline: none;
    color: #fff
}

.modal-header {
    padding: 20px 26px;
    border-bottom: 1px solid #eee
}

.modal-body {
    padding: 20px 26px
}

.modal-footer {
    padding: 20px 26px
}

.modal-open .modal {
    overflow: hidden
}

.modal-content {
    box-shadow: none;
    border: none
}

.modal-footer {
    border: none
}

.modal-header .close {
    margin-top: 0px
}

.close {
    font-size: 24px;
    color: #999;
    opacity: 1
}

    .close:focus, .close:hover {
        color: #999;
        opacity: 1;
        outline: none
    }

.modal-footer .btn + .btn {
    margin: 0
}

.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle), .btn-group > .btn:last-child:not(:first-child), .btn-group > .dropdown-toggle:not(:first-child), .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle), .btn-group > .btn, .btn-group > .btn:focus {
    border-radius: 3px;
    outline: none
}

.btn {
    border-radius: 5px;
    padding: 6px 24px;
    display: inline-block
}

    .btn:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus, .btn {
        outline: none;
        box-shadow: none
    }

button[disabled], html input[disabled] {
    cursor: not-allowed
}

.btn:hover {
    color: #fff;
    outline: none
}

.btn-primary:active:focus, .btn-primary, .btn-primary:hover, .btn-primary.focus, .btn-primary:focus {
    background-color: #65a6fe;
    border-color: #65a6fe;
    color: #fff;
    outline: none
}

.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio] {
    outline: none
}

input[type=radio] {
    content: "\a0";
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    width: 1em;
    height: 1em;
    margin-right: .4em;
    border-radius: 50%;
    text-indent: .15em;
    line-height: 1
}

.form-group {
    margin-bottom: 20px
}

.form-control {
    display: inline-block;
    width: 0%;
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    border: 1px solid #ddd
}

    .form-control:focus {
        box-shadow: none
    }

.pager .disabled > a, .pager .disabled > a:focus, .pager .disabled > a:hover, .pager .disabled > span {
    color: #333;
    background-color: transparent
}

.pagination {
    margin: 0
}

.pager {
    margin: 0
}

.has-success .form-control, .has-success .form-control:focus {
    border-color: #18adf2;
    box-shadow: none
}

.has-error .form-control, .has-error .form-control:focus {
    border-color: #f75234;
    box-shadow: none
}

.has-error .checkbox, .has-error .checkbox-inline, .has-error .help-block, .has-error .radio, .has-error .radio-inline, .has-error.checkbox label, .has-error.checkbox-inline label, .has-error.radio label, .has-error.radio-inline label {
    color: #f75234
}

.bs-chinese-region .areas-item.current {
    background-color: #3e89f8
}

.help-block {
    margin: 0
}

.checkbox, .radio {
    margin: 0
}

label {
    font-weight: 400;
    cursor: pointer
}

.userinfo-list .has-error .control-label {
    color: #666
}

.carousel-control.right, .carousel-control.left {
    background-image: none
}

@media screen and (min-width:1367px) {
    .modal-dialog {
        width: 600px;
        margin: 230px auto
    }

    .modal-dialog2 {
        width: 430px;
        margin: 230px auto
    }

    .gre-modal-dialog {
        width: 660px;
        margin: 150px auto
    }

    .vocabulary-modal-dialog {
        width: 480px;
        margin: 230px auto
    }
}

@media screen and (min-width:960px) and (max-width:1366px) {
    .modal-dialog {
        width: 600px;
        margin: 130px auto
    }

    .modal-dialog2 {
        width: 430px;
        margin: 130px auto
    }

    .gre-modal-dialog {
        width: 660px;
        margin: 100px auto
    }

    .vocabulary-modal-dialog {
        width: 480px;
        margin: 130px auto
    }
}

.vocabulary-modal-dialog {
    width: 480px
}

@media screen and (min-width:768px) and (max-width:959px) {
    .modal-dialog {
        width: 600px;
        margin: 100px auto
    }

    .modal-dialog2 {
        width: 430px;
        margin: 100px auto
    }

    .gre-modal-dialog {
        width: 660px;
        margin: 60px auto
    }

    .vocabulary-modal-dialog {
        width: 480px;
        margin: 30px auto
    }
}

.carousel-inner > .item > a > img, .carousel-inner > .item > img, .img-responsive, .thumbnail a > img, .thumbnail > img {
    width: 100%
}

.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
    background-color: #3e89f8;
    border-color: #3e89f8
}

.pager li > a, .pager li > span {
    padding: 0;
    background-color: transparent;
    border: none;
    border-radius: 0
}

    .pager li > a:focus, .pager li > a:hover {
        background-color: transparent
    }

[v-cloak] {
    display: none
}

.blackBac {
    transition: background 1s;
    -moz-transition: background 1s;
    -webkit-transition: background 1s;
    -o-transition: background 1s;
    background-color: #000
}

::-webkit-scrollbar {
    width: 10px;
    height: 2px
}

::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background-color: transparent;
    border: 1px solid #c1c2c2
}

::-webkit-scrollbar-track {
    background-color: transparent
}

.ztpo-null {
    height: 544px;
    background: #fff;
    text-align: center;
    margin-top: 16px;
    margin-bottom: 20px
}

    .ztpo-null p {
        text-align: center
    }

        .ztpo-null p a {
            width: 216px;
            height: 30px;
            line-height: 30px;
            display: inline-block;
            background: #03a7e1;
            color: #fff;
            font-size: 14px
        }

.ztpo-modal-body {
    padding-bottom: 40px
}

    .ztpo-modal-body p {
        text-align: center;
        margin-top: 20px
    }

        .ztpo-modal-body p:last-child img {
            width: 100px
        }

@media screen and (min-width:1367px) {
    .reg-containerV2 .reg-contentV2 {
        margin: 150px auto 0
    }
}

@media screen and (min-width:960px) and (max-width:1366px) {
    .reg-containerV2 .reg-contentV2 {
        margin: 90px auto 0
    }
}

@media screen and (min-width:768px) and (max-width:959px) {
    .reg-containerV2 .reg-contentV2 {
        margin: 70px auto 0
    }
}

.g-wrapper {
    width: 1180px;
    margin: 0 auto
}

    .g-wrapper a:link {
        text-decoration: none
    }

.g-container-v2 {
    background-color: #fff;
    min-height: 648px;
    margin-top: 4px
}

.subnav-V2 {
    height: 60px;
    background-color: #fff
}

    .subnav-V2 a {
        display: inline-block;
        height: 60px;
        line-height: 60px;
        margin: 0 60px 0 0;
        text-align: center;
        font-size: 16px;
        color: #333 !important
    }

        .subnav-V2 .active, .subnav-V2 a:hover {
            text-decoration: none
        }

.g-container-v2 .subnav-V2 .subnav-record {
    margin-right: 0px
}

    .g-container-v2 .subnav-V2 .subnav-record .iconfont {
        padding-right: 4px
    }

.personal-nav {
    height: 120px;
    margin: 26px 0 0 56px
}

.r-content-main .smallTitle, .r-content-sideBar .smallTitle {
    position: relative;
    line-height: 56px;
    font-size: 18px;
    font-weight: 600;
    color: #333;
    border-bottom: 1px solid #eee;
    padding-left: 32px
}

.learn-record ul {
    margin: 22px auto 0;
    padding-bottom: 38px;
    text-align: center
}

    .learn-record ul li {
        display: inline-block;
        text-align: center;
        margin: 0 44px
    }

        .learn-record ul li .learn-circle {
            width: 80px;
            height: 80px;
            border-radius: 50%;
            border: 1px dashed #65a6fe;
            text-align: center
        }

        .learn-record ul li .learn-icon {
            width: 66px;
            height: 66px;
            border-radius: 50%;
            background-color: #eaf3ff;
            margin: 6px 0 0 6px
        }

        .learn-record ul li:hover .learn-icon {
            background-color: #65a6fe !important
        }

        .learn-record ul li i {
            padding-right: 0;
            font-size: 36px;
            color: #65a6fe;
            line-height: 66px
        }

        .learn-record ul li:hover i {
            color: #fff
        }

        .learn-record ul li p {
            margin-top: 16px;
            color: #333;
            font-size: 16px
        }

        .learn-record ul li:hover p {
            color: #65a6fe
        }

        .learn-record ul li span {
            font-size: 14px;
            color: #999;
            margin-top: 4px
        }

.smallTitle b {
    position: absolute;
    top: 20px;
    left: 20px;
    width: 4px;
    height: 18px;
    background-color: #65a6fe
}

.avatar-wrap {
    display: inline-block;
    position: relative
}

    .avatar-wrap .avatar {
        width: 120px;
        height: 120px;
        border-radius: 50%;
        margin: -40px 15px 0 -55px;
        border: 6px solid #fff
    }

.personal-profile .personal-info {
    vertical-align: top;
    display: inline-block;
    border-right: 1px solid #ddd;
    height: 45px;
    max-width: 110px;
    min-width: 100px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.personal-info .personal-name {
    display: block;
    font-size: 20px;
    font-weight: 600;
    line-height: 22px;
    max-width: 140px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.personal-info .personal-grade {
    font-size: 16px;
    color: #ffb532;
    margin-top: 6px;
    line-height: 14px
}

    .personal-info .personal-grade p {
        margin-right: 6px;
        display: inline-block;
        width: 23px;
        height: 17px;
        background: url("../images/tg_index.png") -390px -168px
    }

.personal-info-grow {
    vertical-align: top;
    display: inline-block;
    border-right: 1px solid #ddd;
    height: 45px;
    padding: 0px 30px;
    font-size: 16px;
    line-height: 14px
}

    .personal-info-grow i {
        font-size: 12px;
        color: #9f9f9f;
        vertical-align: 1px
    }

    .personal-info-grow .grow-number, .personal-info-grow .coin-number {
        color: #ffb532
    }

    .personal-info-grow span {
        font-weight: 600;
        text-align: center;
        display: inline-block;
        min-width: 30px;
        text-align: left
    }

    .personal-info-grow p a {
        font-size: 14px
    }

.personal-info-icon span {
    width: 40px;
    height: 40px;
    overflow: hidden;
    border-radius: 50%;
    display: inline-block;
    margin-right: 10px;
    vertical-align: -14px
}

    .personal-info-icon span img {
        width: 100%;
        height: 100%;
        vertical-align: top
    }

.personal-sign-detail {
    padding-left: 80px
}

.personal-sign {
    display: inline-block;
    vertical-align: top
}

.personal-sign-detail p {
    font-size: 14px;
    color: #999;
    display: inline-block;
    vertical-align: top
}

    .personal-sign-detail p span {
        color: #ffb532;
        font-weight: 600
    }

.personal-sign .sign-text {
    width: 120px;
    height: 46px;
    font-size: 16px;
    font-weight: 600;
    line-height: 46px;
    text-align: center;
    line-height: 46px;
    margin-left: 10px;
    color: #fff;
    background-color: #65a6fe;
    border-radius: 5px;
    position: relative;
    overflow: hidden;
    display: inline-block
}

.sign-appear {
    position: absolute;
    bottom: 88px;
    right: 64px;
    color: #ffb532;
    font-weight: 600
}

.personal-sign .sign-gray {
    background-color: #ddd
}

.sign-arrows {
    color: #65a6fe;
    cursor: pointer;
    text-decoration: underline;
    margin-top: 6px;
    text-align: right
}

.personal-sign .sign-num {
    font-size: 10px;
    vertical-align: top;
    line-height: 32px
}

.personal-sign a {
    color: #fff
}

.personal-sign i {
    color: #fef117;
    font-size: 10px;
    position: absolute;
    top: 0;
    right: 16px
}

.clock-info {
    display: inline-block;
    vertical-align: top;
    border-right: 1px solid #ddd;
    height: 45px;
    padding: 0px 30px;
    font-size: 16px;
    line-height: 14px
}

.clock-item {
    display: inline-block;
    margin: -6px 30px 0px;
    text-align: center
}

.clock-info .clock-item .icon-1 p {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url("../images/tg_index.png") -350px -168px;
    position: absolute;
    left: -24px
}

.clock-info .clock-item .icon-2 p {
    display: inline-block;
    width: 20px;
    height: 22px;
    background: url("../images/tg_index.png") -310px -168px;
    position: absolute;
    left: -23px;
    top: -2px
}

.clock-item .clock-bAct {
    color: #6abeff
}

.clock-item .clock-redAct {
    color: #ff7563
}

.clock-item span {
    font-size: 14px;
    font-weight: 600;
    color: #000;
    margin-left: 8px
}

.clock-info .clock-item dd {
    font-size: 30px;
    font-weight: 600;
    line-height: 24px
}

.clock-info .clock-item dt {
    font-weight: 400;
    font-size: 16px;
    margin-top: 10px;
    position: relative
}

    .clock-info .clock-item dt img {
        margin: -6px 6px 0 0
    }

.clock-info .clock-item i {
    font-size: 20px
}

.personal-profile {
    position: relative;
    padding-top: 40px
}

.pos-inquire {
    position: absolute;
    top: 0px;
    right: 20px
}

    .pos-inquire a {
        font-size: 16px;
        color: #666;
        font-weight: 400
    }

.analyze-atlas .title {
    line-height: 64px;
    font-size: 14px;
    padding-left: 20px
}

    .analyze-atlas .title b {
        width: 12px;
        height: 12px;
        border-radius: 50%;
        display: inline-block;
        margin-right: 10px
    }

    .analyze-atlas .title span {
        margin-right: 20px
    }

    .analyze-atlas .title .atlas-b {
        background-color: #ffb532
    }

    .analyze-atlas .title .atlas-y {
        background-color: #65a6fe
    }

.no-data-c {
    position: relative;
    text-align: center
}

    .no-data-c .no-data-icon {
        display: inline-block;
        color: #dbdbdb;
        font-size: 17px;
        position: absolute;
        top: -1px;
        right: 25px
    }

    .no-data-c .plan-pop-up {
        outline: none;
        cursor: pointer;
        width: 100px;
        line-height: 36px;
        color: #fff;
        font-size: 14px;
        background-color: #65a6fe;
        display: inline-block;
        border-radius: 6px;
        margin-top: 18px
    }

    .no-data-c .jBtn-editExamPlan .enact {
        line-height: 23px;
        vertical-align: -2px
    }

    .no-data-c .no-data-icon1 {
        width: 89px;
        height: 87px;
        background: url("../images/tg_index.png") -282px -230px;
        display: inline-block
    }

    .no-data-c .no-data-icon2 {
        width: 109px;
        height: 101px;
        background: url("../images/tg_index.png") -153px -230px;
        display: inline-block
    }

    .no-data-c .no-data-icon3 {
        width: 84px;
        height: 89px;
        background: url("../images/tg_index.png") -467px -10px;
        display: inline-block
    }

    .no-data-c .no-data-icon5 {
        width: 72px;
        height: 82px;
        background: url(../images/tg_index.png) -465px -117px;
        display: inline-block
    }

.jBtn-editExamPlan {
    cursor: pointer
}

.topic-memo {
    height: 280px
}

.topic-memo-title {
    font-size: 16px;
    text-align: center;
    margin: 16px 0px 10px 0;
    position: relative
}

.topic-list {
    width: 100%;
    height: 220px;
    overflow: auto;
    padding: 8px 16px 0px 20px;
    display: inline-block
}

    .topic-list li {
        font-size: 14px;
        padding: 8px 0
    }

        .topic-list li i {
            font-size: 18px;
            color: #999
        }

            .topic-list li i:hover {
                color: #65a6fe
            }

        .topic-list li .icon-shanchu1:hover {
            color: #fe4c0a
        }

.topic-memo::-webkit-scrollbar {
    width: 2px;
    height: 1px
}

.topic-memo::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #ccc
}

.topic-memo::-webkit-scrollbar-track {
    background-color: transparent
}

.topic-memo-title .icon-xie {
    font-size: 19px;
    font-weight: 600;
    color: #2bbbff;
    position: absolute;
    top: -4px;
    right: 28px;
    cursor: pointer
}

.topic-memo-li input {
    border: 1px solid #999;
    border-radius: 4px;
    line-height: 24px;
    height: 24px;
    outline: none;
    padding: 0 10px
}

.plan-menu {
    height: 316px;
    margin-top: 18px;
    overflow: hidden
}

    .plan-menu .topic-item {
        font-size: 14px;
        height: 78px;
        display: block;
        border-bottom: 1px solid #ddd;
        vertical-align: top;
        line-height: 78px
    }

.topic-info-item {
    height: 78px;
    padding-top: 22px
}

    .topic-info-item .item-icon {
        height: 36px;
        line-height: 36px;
        width: 36px;
        border: 1px solid #999;
        display: inline-block;
        border-radius: 50%;
        text-align: center;
        margin: 0 14px 0 24px;
        vertical-align: top;
        position: relative
    }

        .topic-info-item .item-icon i {
            font-size: 22px;
            padding: 0
        }

    .topic-info-item .item-icon-text {
        line-height: 16px;
        vertical-align: top
    }

    .topic-info-item .item-icon b {
        background-color: #65a6fe;
        border-radius: 50%;
        color: #fff;
        font-size: 12px;
        width: 16px;
        height: 16px;
        line-height: 16px;
        display: inline-block;
        position: absolute;
        top: 24px;
        left: 22px;
        font-weight: 400
    }

    .topic-info-item p {
        display: inline-block
    }

.plan-menu .topic-item a {
    font-size: 14px;
    border: 1px solid #999;
    color: #333;
    width: 80px;
    height: 30px;
    line-height: 30px;
    border-radius: 6px;
    display: inline-block;
    text-align: center;
    float: right;
    margin: 2px 20px 0 0
}

    .plan-menu .topic-item a.done {
        color: #999;
        border: 1px solid #eee
    }

    .plan-menu .topic-item a:hover {
        background-color: #65a6fe;
        border: 1px solid #65a6fe;
        color: #fff
    }

.sideBar-my-task .mission-title {
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    height: 50px;
    line-height: 50px;
    color: #333;
    position: relative
}

    .sideBar-my-task .mission-title span {
        border-bottom: 2px solid #3e89f8;
        padding-bottom: 4px
    }

.sideBar-my-task .mission-list span {
    color: #ffb532
}

.sideBar-my-task .mission-list li {
    text-align: left;
    font-size: 14px;
    color: #333;
    padding: 0px 22px 0 30px;
    height: 40px;
    line-height: 40px
}

    .sideBar-my-task .mission-list li:hover {
        background-color: #eaf3ff
    }

.sideBar-my-task .smallTitle a:hover {
    color: #666
}

.sideBar-my-task .mission {
    height: 290px;
    overflow: auto
}

.r-content-sideBar {
    margin-top: 28px;
    display: inline-block;
    vertical-align: top;
    width: 280px;
    float: right
}

.sideBar-b-top {
    display: inline-block;
    background: url("../images/tg_index.png") -10px -10px;
    height: 200px;
    width: 200px;
    color: #fff;
    font-size: 12px
}

    .sideBar-b-top ul li img {
        position: absolute;
        top: -49px;
        right: 47px;
        vertical-align: top;
        margin-left: 18px
    }

.r-pos-r {
    position: relative
}

    .r-pos-r .jBtn-editExamPlan {
        position: absolute;
        top: 0px;
        right: 18px;
        cursor: pointer
    }

.r-content-sideBar .icon-edit {
    position: absolute;
    top: -14px;
    right: 8px;
    cursor: pointer
}

.r-shade {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2000;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0;
    background-color: rgba(0,0,0,0.5);
    margin: 0 auto;
    text-align: center
}

.sideBar-b-top {
    width: 100%;
    text-align: center
}

.capacity-subject {
    margin: 10px auto 0;
    padding-bottom: 30px;
    text-align: center
}

.capacity-subject-item .r-grayAct, .capacity-subject-item .r-grayAct:hover {
    background-color: #ccc;
    border: 1px solid #ccc;
    color: #fff
}

.capacity-subject-item {
    width: 358px;
    height: 66px;
    padding-left: 20px;
    line-height: 66px;
    border: 1px solid #eee;
    margin: 0px 20px 20px 20px;
    display: inline-block;
    font-size: 16px;
    color: #333;
    position: relative;
    border-radius: 6px;
    text-align: left;
    transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    top: 20px
}

    .capacity-subject-item .capacity-result {
        color: #2bbbff;
        position: absolute;
        top: 67px;
        right: 65px;
        line-height: 14px;
        font-size: 14px
    }

    .capacity-subject-item:hover {
        box-shadow: 4px 4px 6px rgba(0,0,0,0.05);
        top: 10px
    }

    .capacity-subject-item .capacity-subject-num {
        font-size: 14px;
        padding: 0 86px 0 14px;
        color: #999
    }

    .capacity-subject-item a {
        font-size: 14px;
        border: 1px solid #999;
        color: #333;
        width: 120px;
        height: 32px;
        line-height: 32px;
        border-radius: 4px;
        display: inline-block;
        text-align: center;
        background-color: #fff;
        outline: none;
        cursor: pointer
    }

        .capacity-subject-item a:hover {
            background-color: #65a6fe;
            border: 1px solid #65a6fe;
            color: #fff
        }

#CapacityModal a {
    width: 120px;
    line-height: 36px;
    color: #fff;
    font-size: 16px;
    background-color: #65a6fe;
    display: inline-block;
    border-radius: 6px
}

.ranking-tabs a {
    width: 80px;
    display: inline-block;
    border: 1px solid #f2f2f2
}

.ranking-tabs .ranking-tabs-item {
    text-align: center;
    width: 100%
}

.ranking-tabs .tab-b {
    margin-top: 20px;
    font-size: 12px;
    background-color: #e5e5e5;
    height: 26px;
    line-height: 26px
}

.ranking-tabs .ranking-tabs-item .r-bacAct {
    border-bottom: 2px solid #3e89f8;
    color: #3e89f8
}

.ranking-tabs .ranking-tabs-item td {
    font-size: 12px;
    cursor: pointer;
    line-height: 40px;
    display: inline-block;
    margin: 0px 20px
}

    .ranking-tabs .ranking-tabs-item td:last-child {
        border-right: none
    }

.capacity-subject-item .subject-forbid {
    color: #ccc;
    cursor: default
}

.personal-info .medal {
    width: 20px;
    height: 20px
}

.ranking-tabs ul li {
    text-align: left;
    vertical-align: top;
    padding: 0px 12px;
    display: block;
    height: 88px;
    line-height: 88px;
    border-bottom: 1px solid #eee;
    position: relative
}

.ranking-avatar-wrap .ranging-img {
    position: absolute;
    top: 54px;
    left: 63px;
    width: 59px;
    height: 16px
}

.ranking-avatar-my .ranging-img {
    position: absolute;
    top: 54px;
    left: 75px;
    width: 36px;
    height: 16px
}

.ranking-tabs .ranking-avatar-wrap span {
    font-size: 12px;
    display: inline-block;
    line-height: 18px;
    position: relative
}

.sideBar-b-bottom .ranking-tabs .ranking-avatar-wrap .serial {
    font-size: 18px;
    display: inline-block;
    width: 57px;
    color: #666;
    text-align: center
}

.sideBar-b-bottom .ranking-info {
    display: inline-block;
    vertical-align: top;
    margin-top: 24px;
    line-height: 14px
}

    .sideBar-b-bottom .ranking-info span {
        display: block
    }

    .sideBar-b-bottom .ranking-info .personal-name {
        font-size: 14px;
        font-weight: 400
    }

.sideBar-b-bottom {
    min-height: 340px;
    max-height: 1068px;
    overflow: hidden;
    margin-bottom: 40px
}

    .sideBar-b-bottom .ranking-avatar-wrap p.ranking-num {
        font-size: 16px
    }

    .sideBar-b-bottom .ranking-avatar-wrap p.f16 {
        font-weight: 600
    }

    .sideBar-b-bottom .ranking-tabs .ranking-avatar-wrap .order {
        font-size: 18px;
        font-weight: 600;
        display: inline-block;
        width: 57px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        text-align: center
    }

    .sideBar-b-bottom .ranking-submenu span {
        display: inline-block
    }

    .sideBar-b-bottom .personal-info {
        display: inline-block
    }

        .sideBar-b-bottom .personal-info .personal-grade img {
            margin-right: 4px;
            width: 18px;
            vertical-align: top
        }

        .sideBar-b-bottom .personal-info .personal-grade {
            font-size: 14px
        }

    .sideBar-b-bottom .ranking-submenu .personal-info .personal-grade {
        margin-top: 4px
    }

    .sideBar-b-bottom .personal-info .personal-name {
        max-width: 76px
    }

.ranking-submenu-num {
    font-size: 16px
}

.sign-header {
    height: 116px
}

.sign-data {
    display: inline-block
}

.data-item-dashed {
    border-right: 1px dashed #ccc
}

.sign-data .sign-data-item {
    display: inline-block;
    width: 384px;
    text-align: center;
    font-size: 16px;
    padding: 26px 0 21px 0;
    color: #333;
    margin: 0
}

    .sign-data .sign-data-item dt, .sign-data-today dt {
        margin-top: 10px;
        font-size: 26px;
        color: #2bbbff
    }

.sign-data-today {
    display: inline-block;
    width: 362px;
    text-align: center;
    margin: 0;
    font-size: 16px;
    padding: 26px 0 21px 0;
    vertical-align: top;
    position: relative
}

    .sign-data-today .sign-btn {
        width: 120px;
        height: 38px;
        line-height: 38px;
        background-color: #2bbbff;
        color: #fff;
        font-size: 18px;
        border-radius: 26px;
        display: inline-block;
        font-weight: 400;
        box-shadow: 0px 2px 4px rgba(0,0,0,0.3);
        cursor: pointer
    }

    .sign-data-today .bcccc {
        background-color: #ccc
    }

    .sign-data-today .sign-btn a {
        color: #fff
    }

        .sign-data-today .sign-btn a:hover {
            background-color: #ccc
        }

    .sign-data-today .sign-appear {
        position: absolute;
        bottom: 27px;
        right: 27px;
        color: #ffb400
    }

.calendar-main-l {
    width: 764px;
    height: 509px;
    display: inline-block;
    margin-right: 18px
}

.switch-month {
    height: 48px;
    line-height: 48px;
    margin-left: 48px;
    display: block
}

    .switch-month .show-month {
        display: inline-block;
        padding: 0 20px
    }

.left-btn, .right-btn {
    font-weight: 600;
    cursor: pointer
}

.top-week-list {
    height: 56px;
    background-color: #e5f7ff
}

    .top-week-list li {
        float: left;
        display: inline-block;
        width: 108px;
        text-align: center;
        line-height: 56px
    }

.month-list {
    height: 412px;
    overflow: hidden;
    padding-top: 20px
}

    .month-list li {
        font-weight: 600;
        float: left;
        text-align: center;
        width: 108px;
        height: 76px;
        line-height: 76px;
        display: inline-block;
        color: #999;
        position: relative;
        z-index: 2;
        cursor: pointer
    }

.sign-main .month-list .day-out {
    color: #ccc
}

.month-list .already-clock {
    color: #fff
}

.sign-main .month-list li.is-day {
    background-color: #bdeaff
}

.sign-main .month-list .already-clock:before {
    content: '';
    position: absolute;
    width: 36px;
    height: 36px;
    line-height: 36px;
    border-radius: 50%;
    background: #2bbbff;
    left: 50%;
    top: 50%;
    z-index: -3;
    margin: -18px 0 0 -18px
}

.sign-main .month-list .icon-kao {
    color: #d81e06;
    position: absolute;
    top: 0px;
    right: 22px
}

.calendar-wrap-main {
    position: relative
}

.calendar-main-r {
    display: inline-block;
    text-align: center;
    vertical-align: top;
    width: 358px;
    height: 509px;
    position: absolute;
    top: 0;
    right: 0
}

    .calendar-main-r .calendar-day-show {
        color: #f05816;
        padding: 22px 0 30px 0
    }

    .calendar-main-r .calendar-that-day {
        width: 154px;
        height: 116px;
        margin: 0 auto;
        background-color: #f5f5f5;
        border: 1px solid #e6e6e6;
        border-radius: 5px
    }

    .calendar-main-r .calendar-that-week {
        display: block;
        padding-top: 14px
    }

.calendar-that-t {
    height: 230px;
    border-bottom: 1px dashed #ccc
}

.calendar-main-r .calendar-td {
    font-size: 50px;
    color: #f05816;
    display: block
}

.calendar-icon {
    font-size: 28px;
    position: absolute;
    top: 0px;
    left: 0px;
    color: #979797
}

.calendar-that-b {
    height: 280px;
    background: url(../images/beijing.png) bottom no-repeat
}

    .calendar-that-b .today-study-target {
        vertical-align: top;
        line-height: 28px;
        position: relative;
        text-align: left;
        padding-left: 40px
    }

.radio-check li {
    margin-left: 24px;
    text-align: left;
    font-size: 14px;
    cursor: default;
    color: #333;
    height: 30px;
    line-height: 30px;
    list-style-type: disc;
    padding-left: 0
}

    .radio-check li.radio-select {
        text-decoration: line-through;
        color: #999
    }

.target-from .target-from-item {
    margin-bottom: 24px;
    position: relative
}

.target-from .target-from-l {
    font-size: 14px;
    width: 82px;
    display: inline-block;
    font-weight: 400
}

.target-from .target-from-exam {
    width: 112px
}

.target-from .target-from-time {
    width: 80px;
    text-align: center
}

.target-from-footer .cancel {
    display: inline-block;
    cursor: pointer;
    padding-right: 20px;
    color: #65a6fe
}

.target-from-item .time-p {
    font-size: 14px;
    padding: 0 6px
}

.item-subject {
    display: inline-block;
    margin-right: 34px
}

    .item-subject .item-subject-t {
        display: block;
        font-size: 14px;
        width: 80px;
        text-align: center;
        font-weight: 400
    }

.target-from-footer {
    margin-top: 50px;
    text-align: right
}

.due-today .due-today-title {
    display: block;
    color: #333
}

.due-today .plan-btn {
    width: 540px
}

.des-btn {
    padding: 6px 12px;
    margin: 0 10px 10px 0;
    background-color: #65a6fe;
    color: #fff;
    outline: none
}

.forbid-btn {
    background-color: #999;
    color: #fff
}

    .forbid-btn:hover {
        background-color: #999;
        color: #fff;
        border: 1px solid #999
    }

.due-today .plan-myself .myself-btn {
    background-color: #fff;
    color: #333;
    border: 1px solid #e6e6e6;
    margin-right: 28px;
    position: relative
}

.pos-iconshanchu1 {
    color: #cdcdcd;
    position: absolute;
    top: -11px;
    right: -12px
}

.viewDetails-title ul {
    padding: 10px 0;
    font-size: 16px;
    background-color: transparent
}

    .viewDetails-title ul li {
        display: inline-block
    }

        .viewDetails-title ul li a {
            text-decoration: none
        }

.viewDetails-title .breadcrumb-title > li + li:before {
    content: ">\00a0";
    padding: 0 5px;
    color: #999
}

.analyze-info {
    padding-left: 78px
}

.vertical-line {
    height: 66px;
    width: 1px;
    background-color: #e6e6e6;
    display: inline-block;
    vertical-align: sub
}

.analyze-item {
    display: inline-block;
    width: 194px;
    text-align: center
}

.account-center .analyze-item {
    width: 168px
}

.grow-info dd {
    color: #ffb532
}

.grow-info i {
    position: absolute;
    top: -6px;
    left: 18px;
    color: #ffb532;
    font-size: 24px
}

.analyze-item dt {
    position: relative;
    margin-top: 10px
}

.analyze-item img {
    position: absolute;
    top: -10px;
    left: 18px
}

.account-center img {
    position: absolute;
    top: -8px;
    left: 6px
}

.account-center .pos-img1 img {
    position: absolute;
    top: -8px;
    left: 12px
}

.account-center .pos-img2 img {
    position: absolute;
    top: -8px;
    left: -8px
}

.analyze-item .analyze-icon {
    color: #e6e6e6;
    position: absolute;
    top: -6px;
    left: 42px;
    font-size: 24px
}

.analyze-item .pa44 {
    position: absolute;
    top: -6px;
    left: 36px
}

.analyze-sideBar {
    display: block;
    width: 520px;
    margin: 20px auto 0px
}

.analyze-item .pa44 {
    position: absolute;
    top: -6px;
    left: 36px
}

.analyze-bottom {
    padding-bottom: 33px;
    position: relative
}

.analyze-bottom-echarts {
    width: 650px;
    display: block;
    vertical-align: top;
    margin: 0 auto
}

.subject-echarts .sub-tit {
    height: 48px;
    line-height: 48px;
    font-size: 16px;
    padding-left: 10px;
    border-bottom: 1px solid #ddd;
    text-align: left
}

.analyze-echarts {
    width: 727px;
    border: 1px solid #ddd;
    text-align: center;
    margin: 0 auto 40px
}

.analyze-sideBar .sub-tit {
    font-size: 16px;
    padding: 0 0 20px 36px
}

.analyze-sideBar-list {
    font-size: 16px;
    border: 1px solid #e6e6e6;
    border-radius: 5px;
    width: 100%;
    text-align: center
}

.analyze-list {
    font-size: 16px;
    border-radius: 5px;
    width: 100%;
    text-align: center;
    border-left: 1px solid #ddd
}

.analyze-sub {
    width: 400px
}

.analyze-sideBar-list .list-tit {
    background: #ccebff;
    border-bottom: 1px solid #e6e6e6;
    height: 36px;
    color: #333;
    font-size: 14px;
    line-height: 36px
}

.analyze-list .list-tit {
    border-bottom: 1px solid #e6e6e6;
    color: #666;
    font-size: 14px;
    line-height: 47px
}

.analyze-list tr th {
    width: 100px;
    text-align: center
}

.analyze-list tr td {
    text-align: center
}

.analyze-sideBar-list tr th, .analyze-sideBar-list tr td {
    width: 136px;
    text-align: center
}

.analyze-sideBar-list tbody {
    padding: 12px 0
}

.analyze-sideBar-list .list-data {
    height: 42px;
    line-height: 42px
}

.analyze-list .list-data {
    height: 42px;
    line-height: 42px
}

    .analyze-list .list-data a {
        width: 60px;
        height: 30px;
        line-height: 30px;
        font-size: 14px;
        color: #333;
        border-radius: 4px;
        display: inline-block;
        border: 1px solid #ddd
    }

        .analyze-list .list-data a:hover {
            background-color: #65a6fe;
            border: 1px solid #65a6fe;
            color: #fff
        }

.small-title {
    height: 40px;
    line-height: 40px;
    font-size: 18px;
    color: #fff;
    background-color: #2bbbff;
    text-align: center;
    display: inline-block;
    padding: 0 34px;
    border-radius: 0 3px 3px 0px
}

.myself-grow-title {
    height: 628px
}

.myself-grade-value {
    height: 350px;
    background: url("../images/grow-icon/bg_01.png") no-repeat;
    padding-top: 46px
}

.grade-portrait {
    width: 94px;
    height: 94px;
    border-radius: 50%;
    border: 4px solid #e6e6e6;
    overflow: hidden;
    margin: 0px auto 14px
}

    .grade-portrait img {
        width: 100%
    }

.grade-portrait-lV {
    width: 84px;
    display: inline-block;
    position: relative;
    height: 30px;
    line-height: 30px
}

    .grade-portrait-lV img {
        position: absolute;
        top: 0px;
        left: 0px
    }

.grow-grade-schedule .schedule-item {
    border-radius: 50%;
    background-color: #d9d9d9;
    width: 46px;
    height: 46px;
    text-align: center;
    display: inline-block;
    position: relative;
    margin-right: 56px;
    vertical-align: top
}

.schedule-item .item-ring {
    border-radius: 50%;
    margin-top: 5px;
    height: 36px;
    line-height: 34px;
    width: 36px;
    border: 2px solid #b3b3b3;
    color: #808080;
    display: inline-block;
    z-index: 10;
    overflow: hidden
}

.schedule-item .transverse-line {
    position: absolute;
    top: 23px;
    left: 46px;
    width: 60px;
    height: 3px;
    background-color: #efefef;
    z-index: 9
}

.schedule-item .imaginary-line {
    position: absolute;
    top: 13px;
    left: 18px;
    width: 160px;
    height: 4px;
    z-index: 8
}

    .schedule-item .imaginary-line span {
        display: inline-block;
        width: 4px;
        height: 4px;
        background-color: #efefef;
        margin-right: 4px
    }

.schedule-item img {
    padding-top: 1px
}

.grow-grade-schedule .schedule-item-continue {
    margin-right: 100px
}

.grow-grade-schedule .schedule-already {
    background-color: #fde793
}

    .grow-grade-schedule .schedule-already .item-ring {
        color: #cc634d;
        border: 2px solid #edaa76;
        vertical-align: top;
        display: inline-block
    }

    .grow-grade-schedule .schedule-already .transverse-line {
        background-color: #f8c362
    }

.grow-grade-schedule .schedule-already-light {
    width: 60px;
    height: 60px;
    margin-top: -6px
}

.schedule-already-light .item-ring {
    width: 48px;
    height: 48px;
    line-height: 45px;
    margin-top: 6px;
    font-size: 20px
}

.schedule-item .schedule-already-line {
    position: absolute;
    top: 18px;
    left: 45px;
    width: 90px;
    height: 4px;
    z-index: 8
}

.schedule-already .transverse-line-cir {
    position: absolute;
    top: 22px;
    left: 45px;
    width: 24px;
    height: 4px;
    background-color: #f8c362;
    z-index: 9
}

.privilege-list {
    vertical-align: top;
    display: inline-block;
    margin-left: 50px;
    width: 840px
}

    .privilege-list li {
        display: inline-block;
        width: 100px;
        text-align: center;
        margin-bottom: 40px
    }

        .privilege-list li img {
            display: block;
            margin: 0 auto 16px
        }

.grow-item {
    width: 400px
}

.grow-course {
    width: 912px;
    margin: 0 auto
}

.grow-no-data {
    padding-top: 60px;
    height: 200px;
    color: #999
}

.grow-introduce-detail {
    width: 1020px
}

.grow-course-list {
    width: 100%;
    display: inline-block;
    font-size: 14px;
    border-radius: 5px;
    border-top: 1px solid #e6e6e6;
    border-left: 1px solid #e6e6e6;
    border-right: 1px solid #e6e6e6;
    overflow: hidden;
    margin-top: 20px
}

    .grow-course-list .list-tit {
        background: #7fccff;
        border-bottom: 1px solid #e6e6e6;
        height: 36px;
        color: #333;
        font-size: 14px;
        line-height: 36px
    }

.grow-introduce-detail .list-tit {
    height: 64px
}

.grow-introduce-detail .grow-course-list th {
    font-weight: 600
}

.grow-introduce-detail .grow-course-list td {
    height: 40px
}

.grow-introduce-detail .grow-course-list .icon-yes {
    color: #2bbbff
}

.grow-course-list .list-data {
    height: 36px;
    color: #333;
    font-size: 14px;
    line-height: 36px
}

    .grow-course-list .list-data:last-child {
        border-bottom: none
    }

    .grow-course-list .list-data:nth-of-type(even) {
        background-color: #e5f5ff
    }

.grow-course-list tr th, .grow-course-list tr td {
    width: 230px;
    text-align: center;
    border-bottom: 1px solid #e6e6e6
}

.grow-introduce-detail tr th, .grow-introduce-detail tr td {
    width: 68px;
    vertical-align: center
}

.grow-introduce-detail .grow-course-list .w144 {
    width: 166px;
    text-align: left
}

.grow-course-pagination {
    padding: 20px 0 40px 0
}

    .grow-course-pagination li a, .grow-course-pagination li span {
        padding: 0px 6px !important;
        border: none;
        border-radius: 0;
        color: #333
    }

    .grow-course-pagination .pager a:hover, .grow-course-pagination .pager a:focus {
        background-color: #209fff;
        color: #fff;
        border-radius: 3px
    }

.grow-introduce .grow-introduce-list {
    width: 760px
}

    .grow-introduce .grow-introduce-list i {
        width: 20px;
        height: 20px;
        background: #7fd7ff;
        border-radius: 10px;
        display: inline-block;
        text-align: center;
        color: #fff;
        position: absolute;
        top: 0;
        left: 0
    }

    .grow-introduce .grow-introduce-list .postop {
        position: absolute;
        top: 12px;
        left: 0
    }

    .grow-introduce .grow-introduce-list li {
        position: relative;
        margin-top: 12px;
        font-size: 14px;
        color: #666;
        padding-left: 34px
    }

.myself-mission .icon-xiangqing {
    color: #8a8a8a
}

.myself-mission-hover {
    margin: 12px 12px 0 0;
    display: inline-block;
    position: relative;
    float: right
}

    .myself-mission-hover:hover .mission-detail-hover {
        display: inline-block;
        position: absolute;
        top: 42px;
        right: -3px
    }

.mission-detail-hover {
    display: none
}

    .mission-detail-hover .mission-mes {
        position: relative;
        width: 222px;
        background-color: #e6e6e6;
        float: right;
        border-radius: 3px;
        padding: 10px;
        line-height: 16px
    }

.mission-mes ul li {
    line-height: 20px
}

.mission-detail-hover .mission-mes b {
    position: absolute;
    top: -10px;
    right: 10px;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #e6e6e6
}

.mission-info .mission-list {
    width: 314px;
    border: 1px solid #e6e6e6;
    border-radius: 3px;
    color: #333;
    margin-bottom: 24px
}

.mission-item-hover {
    display: inline-block;
    position: relative;
    float: right
}

    .mission-item-hover:hover .mission-detail-hover {
        display: inline-block;
        position: absolute;
        top: 34px;
        right: -8px
    }

.mission-info .mission-list .icon-tixingicon {
    color: #2bbbff;
    cursor: pointer
}

.mission-item-title {
    padding: 13px 26px;
    border-bottom: 1px solid #e6e6e6
}

.mission-item-d {
    padding: 18px 26px
}

.back-letter1 {
    background: url("../images/mission-icon/icon_Signin.png") no-repeat 133px 12px
}

.back-letter2 {
    background: url("../images/mission-icon/icon_Plan.png") no-repeat 133px 12px
}

.back-letter3 {
    background: url("../images/mission-icon/icon_Register.png") no-repeat 133px 12px
}

.back-letter4 {
    background: url("../images/mission-icon/icon_Share.png") no-repeat 133px 12px
}

.back-letter5 {
    background: url("../images/mission-icon/icon_Upload.png") no-repeat 133px 12px
}

.back-letter6 {
    background: url("../images/mission-icon/icon_Fllin.png") no-repeat 133px 12px
}

.back-letter7 {
    background: url("../images/mission-icon/icon_Data.png") no-repeat 133px 12px
}

.back-letter8 {
    background: url("../images/mission-icon/icon_Comment.png") no-repeat 133px 12px
}

.back-letter9 {
    background: url("../images/mission-icon/icon_Answer.png") no-repeat 133px 12px
}

.back-letter10 {
    background: url("../images/mission-icon/icon_Feedback.png") no-repeat 133px 12px
}

.back-letter11 {
    background: url("../images/mission-icon/icon_Collect.png") no-repeat 133px 12px
}

.mission-item-d a {
    display: inline-block;
    font-size: 14px;
    width: 100px;
    height: 26px;
    line-height: 22px;
    text-align: center;
    padding-left: 10px
}

    .mission-item-d a:after {
        content: ">\00a0";
        padding: 0 0 0 2px
    }

.save-warn {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1060;
    height: 100%;
    width: 100%;
    background: black;
    background: rgba(0,0,0,0.2);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40)
}

.save-warn-center {
    background: white;
    width: 100%;
    height: 100%;
    border-radius: 6px
}

.warn-header {
    height: 60px;
    width: 100%;
    border-bottom: 1px solid #e6e6e6;
    padding: 0px 26px;
    font-size: 18px;
    line-height: 60px;
    vertical-align: top;
    position: relative
}

    .warn-header .icon-tishi {
        color: #f8c808;
        font-size: 28px;
        position: absolute;
        top: 0px;
        left: 22px
    }

    .warn-header span {
        padding-left: 28px
    }

.warn-bottom {
    padding: 20px 26px;
    font-size: 16px
}

    .warn-bottom .btn {
        padding: 6px 12px
    }

.text-point {
    cursor: pointer
}

#btnOpenGift {
    color: #fff;
    background-color: #3e89f8
}

#jBtnOpenGift img {
    cursor: pointer
}

#giftBoxModal .gift-img {
    width: 200px
}

.nav-use {
    display: inline-block;
    font-size: 14px;
    padding: 20px 0;
    margin-left: 20px
}

    .nav-use b {
        display: inline-block;
        width: 1px;
        height: 14px;
        background-color: #999;
        margin-right: 20px
    }

    .nav-use .nav-use-item {
        color: #999;
        margin-right: 40px
    }

    .nav-use .use-active {
        padding-bottom: 19px;
        color: #3e89f8;
        border-bottom: 2px solid #3e89f8
    }

    .nav-use .nav-use-item:link {
        text-decoration: none
    }

.use-pagination {
    margin: 20px 56px 36px 0;
    padding: 0
}

    .use-pagination ul li a {
        min-width: 10px;
        display: inline-block;
        padding: 0 4px
    }

    .use-pagination .pager {
        margin: 0;
        padding: 0
    }

        .use-pagination .pager .previous a, .use-pagination .pager .next a {
            float: none
        }

.pagination li .pagination-active {
    background-color: #209fff;
    color: #fff;
    border-radius: 3px
}

.grow-use-detail {
    width: 100%;
    display: inline-block;
    font-size: 16px;
    overflow: hidden;
    margin-bottom: 78px;
    text-align: center;
    border-bottom: 1px solid #eee
}

    .grow-use-detail th {
        text-align: center;
        width: 300px;
        height: 60px;
        background-color: #f3f5f7
    }

    .grow-use-detail td {
        height: 46px
    }

.personal-center-l2 {
    width: 270px;
    overflow: hidden
}

.personal-center-r2 {
    width: 890px;
    min-height: 720px;
    margin-bottom: 96px
}

.personal-top-img {
    height: 100px
}

.personal-img {
    display: inline-block;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    cursor: pointer;
    overflow: hidden;
    margin: 20px 10px 0px 20px;
    position: relative;
    text-align: center
}

    .personal-img .personal-img-icon {
        height: 100%
    }

    .personal-img:hover .portrait-boxV2 {
        display: block
    }

.portrait-fromV2 .portrait-boxV2 {
    width: 60px;
    height: 76px;
    background: #3e89f8;
    position: absolute;
    bottom: 0px;
    left: 0px;
    text-align: center;
    line-height: 90px;
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
    display: none
}

    .portrait-fromV2 .portrait-boxV2 img {
        text-align: center
    }

.personal-img-detail {
    display: inline-block;
    vertical-align: top;
    margin-top: 26px
}

    .personal-img-detail p {
        width: 160px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap
    }

.personal-list li {
    height: 58px;
    line-height: 58px;
    text-align: center;
    border-top: 1px solid #eee;
    position: relative;
    overflow: hidden
}

    .personal-list li.my-video-h {
        height: 180px
    }

        .personal-list li.my-video-h p {
            line-height: 36px
        }

            .personal-list li.my-video-h p a {
                color: #666
            }

                .personal-list li.my-video-h p a.active {
                    color: #3e89f8
                }

    .personal-list li a {
        color: #333;
        display: inline-block;
        width: 100%
    }

        .personal-list li a i {
            position: absolute;
            left: 62px;
            top: 0px;
            font-size: 24px
        }

            .personal-list li a i.icon-notice-count {
                position: absolute;
                left: 164px;
                top: -2px;
                font-size: 22px
            }

    .personal-list li:hover a, .personal-list .personal-list-active a {
        color: #3e89f8
    }

.personal-list .my-video .icon-xia {
    position: absolute;
    top: 3px;
    right: 56px;
    color: #999
}

.personal-list .my-video .icon-shang {
    position: absolute;
    top: 3px;
    right: 56px;
    color: #999;
    display: none
}

.personal-list li.icon-up .icon-shang {
    display: block
}

.personal-list li.icon-up .icon-xia {
    display: none
}

.personal-center-r2 .top-nav {
    height: 74px;
    line-height: 74px;
    vertical-align: top
}

    .personal-center-r2 .top-nav span {
        vertical-align: top
    }

    .personal-center-r2 .top-nav i {
        font-size: 28px
    }

.personal-center-r2 a {
    color: #3e89f8
}

.userinfo-list {
    padding: 0 0 80px 80px
}

.portrait-fromV2 .personal-img2 .img-s {
    height: 100%
}

.userinfo-item {
    width: 50%;
    display: inline-block;
    float: left
}

    .userinfo-item label {
        margin-top: 20px;
        font-weight: 400;
        font-size: 16px;
        color: #666;
        display: block;
        padding-left: 4px;
        margin-bottom: 7px
    }

    .userinfo-item .form-control {
        width: 300px;
        height: 40px;
        line-height: 40px
    }

    .userinfo-item .radio-inline {
        margin-top: 10px;
        margin-bottom: 10px;
        display: inline-block;
        padding-left: 20px
    }

    .userinfo-item.checkbox-inline + .checkbox-inline, .radio-inline + .radio-inline {
        margin-left: 46px
    }

    .userinfo-item .radio-inline input {
        margin-left: 20px;
        margin-top: 4px
    }

    .userinfo-item .userinfo-textarea {
        width: 100%
    }

.userinfo-list .userinfo-item textarea {
    padding: 10px 10px;
    height: 84px;
    line-height: 24px
}

.userinfo-item .form-control .select-type-c {
    color: #666
}

.userinfo-item .bs-chinese-region a {
    color: #999
}

.center-headshot .modal-body {
    padding: 36px 0px 0px
}

.center-headshot .modal-title span {
    position: absolute;
    top: 22px;
    left: 65px;
    color: #4d576c
}

.center-headshot .modal-header .close {
    font-weight: 400;
    color: #4d576c
}

.center-headshot .modal-body .avatar-input {
    background-color: #fff;
    color: #4d576c
}

.center-headshot .modal-body .avatar-body {
    padding: 0 80px 40px
}

.center-headshot .avatar-btns {
    padding: 0;
    height: 62px;
    border-top: 1px solid #eee;
    margin: 0
}

    .center-headshot .avatar-btns .avatar-save {
        color: #0188fb
    }

    .center-headshot .avatar-btns button {
        background-color: #fff;
        color: #a1aab3;
        font-size: 18px;
        font-weight: 600;
        display: inline-block;
        padding: 0;
        margin: 0;
        height: 60px;
        line-height: 60px;
        outline: none
    }

        .center-headshot .avatar-btns button:focus {
            outline: none
        }

        .center-headshot .avatar-btns button:hover {
            border: 1px solid #fff;
            color: #0188fb
        }

.center-headshot .avatar-btn-db {
    display: inline-block;
    width: 49%
}

.center-headshot .modal-body .a-upload {
    padding: 4px 14px;
    height: 34px;
    line-height: 22px;
    font-size: 16px;
    position: relative;
    cursor: pointer;
    color: #4d576c;
    background: #fff;
    border: 1px solid #4d576c;
    border-radius: 6px;
    overflow: hidden;
    display: inline-block
}

.a-upload input {
    position: absolute;
    font-size: 100px;
    right: 0;
    top: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    cursor: pointer
}

.a-upload:hover {
    color: #4d576c
}

.a-upload .icon-shangchuan {
    font-size: 22px
}

.personal-top-nav a {
    color: #666;
    display: inline-block;
    padding: 17px 0px 17px 0px;
    position: relative;
    text-decoration: none
}

.common-shuohuaxiaohongdian {
    color: #d81e06;
    position: absolute;
    top: 30px;
    right: -14px;
    font-size: 34px
}

.personal-top-nav ul li {
    display: inline-block;
    padding: 0 22px
}

    .personal-top-nav ul li a.active {
        color: #3e89f8;
        border-bottom: 2px solid #3e89f8
    }

.personal-main-list {
    min-height: 700px;
    padding-bottom: 100px;
    position: relative
}

    .personal-main-list .personal-item li {
        padding: 20px 0 20px 0;
        border-bottom: 1px solid #eee
    }

    .personal-main-list .rel i {
        position: absolute;
        top: 8px;
        left: -16px;
        width: 8px;
        height: 8px;
        background-color: #3e89f8;
        border-radius: 50%
    }

.personal-center-r2 .pagination {
    position: absolute;
    right: -10px;
    bottom: 0px
}

.personal-main-list .personal-item .abs {
    position: absolute;
    top: 0;
    right: 0
}

.personal-main-list ul li:hover .hover-c {
    color: #3e89f8;
    cursor: pointer
}

.common-us .common-us-top {
    height: 400px;
    padding-top: 110px
}

.common-us-bac1 {
    background: url("../images/us/bg_banner_gy.png") no-repeat
}

.common-us-bac2 {
    background: url("../images/us/bg_banner_lx.png") no-repeat
}

.common-us-bac3 {
    background: url("../images/us/bg_banner_gy.png") no-repeat
}

.common-us-top .us-text b {
    display: inline-block;
    width: 60px;
    height: 2px;
    background-color: #fff
}

.common-us {
    z-index: 10
}

    .common-us .common-us-text {
        margin-top: -70px;
        position: relative
    }

.us-img img {
    position: absolute;
    top: 59px;
    left: 464px
}

.reg-containerV2 {
    position: fixed;
    width: 100%;
    height: 100%;
    background-size: cover;
    background: url("../images/login_bg.png");
    overflow: hidden
}

.reg-wrapV2 .reg-bottom {
    font-size: 14px;
    color: #999;
    text-align: center;
    width: 640px;
    margin: 32px auto 0
}

.reg-contentV2 {
    width: 640px;
    border-radius: 6px;
    margin: 70px auto 0;
    min-height: 380px;
    overflow: hidden
}

    .reg-contentV2 .reg-left {
        background: url("../images/login_6.png") no-repeat;
        height: 380px;
        width: 240px;
        color: #fff;
        text-align: center;
        font-size: 14px
    }

        .reg-contentV2 .reg-left p img {
            position: absolute;
            top: 4px;
            left: 72px;
            height: 12px
        }

        .reg-contentV2 .reg-left .reg-l-logo {
            margin-top: 94px;
            height: 26px
        }

            .reg-contentV2 .reg-left .reg-l-logo img {
                height: 100%
            }

    .reg-contentV2 .reg-right {
        text-align: center;
        padding: 30px;
        width: 400px;
        height: 380px;
        vertical-align: top;
        background-color: #fff
    }

.reg-right .form-control {
    height: 40px;
    line-height: 40px;
    width: 100%;
    padding: 0 30px
}

.reg-contentV2 .form-group .iconfont {
    position: absolute;
    left: 8px;
    top: 8px;
    font-size: 18px;
    color: #999
}

.reg-contentV2 .form-group .help-block {
    margin: 0;
    position: absolute;
    top: 40px;
    left: 8px
}

.reg-contentV2 .form-group .icon-yanzhengma {
    position: absolute;
    left: 3px;
    top: 8px
}

.reg-right .login-btnV2, .reg-right .login-btnV2:hover, .reg-right .login-btnV2:focus, .reg-right .login-btnV2:active:focus:hover {
    font-size: 18px;
    background-color: #3e89f8;
    border-color: #3e89f8
}

    .reg-right .login-btnV2 a {
        font-size: 14px;
        color: #fff
    }

.reg-right .checkboxV2 {
    margin-top: 20px;
    font-size: 14px;
    color: #999;
    font-weight: 400
}

.reg-containerV2 .reg-already {
    color: #999;
    display: inline-block;
    margin-top: 10px;
    font-size: 14px
}

.reg-contentV2 .form-group .auth-input {
    padding: 0 140px 0 30px
}

.checkboxV2 a {
    color: #3e89f8;
    vertical-align: top
}

.checkboxV2 b {
    background-color: #ddd;
    height: 14px;
    width: 1px;
    margin: 3px 10px
}

.reg-contentV2 .reg-right .auth-code {
    color: #666;
    position: absolute;
    top: 12px;
    right: 12px;
    border-left: 1px solid #ddd;
    border-top: none;
    border-right: none;
    border-bottom: none;
    padding-left: 10px;
    background: none;
    font-size: 14px;
    height: 17px;
    line-height: 17px;
    outline: none
}

.reg-contentV2 .icon-mimaxiugaichenggong {
    display: inline-block;
    color: #04be02;
    font-size: 55px;
    margin: 34px 0 10px
}

.video-main .live-content {
    height: 600px
}

.video-main .video-column {
    min-height: 476px
}

.video-main .h-top-rec {
    min-height: 426px
}

.video-main .video-column .carousel-control {
    position: absolute;
    top: 50%;
    margin: -72px 4px 0 4px;
    width: 40px;
    height: 62px;
    overflow: hidden;
    font-size: 24px;
    color: #fff;
    text-align: center;
    line-height: 60px;
    text-shadow: 0 2px 4px rgba(7,17,27,0.6)
}

    .video-main .video-column .carousel-control.right {
        border-top-left-radius: 6px;
        border-bottom-left-radius: 6px;
        padding: 0px 14px
    }

    .video-main .video-column .carousel-control.left {
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px;
        padding: 0px 11px
    }

.video-main .v-intro {
    height: 360px;
    background-color: #f0f1f2
}

.carousel-control:hover {
    background-color: #000;
    filter: alpha(opacity=40);
    outline: 0;
    opacity: .4
}

.video-column .v-title {
    height: 46px;
    position: relative
}

.v-title-bac1 {
    background: url("../images/video/icon_remen.png") no-repeat center center;
    color: #f83e61
}

.v-title-bac2 {
    background: url("../images/video/icon_jingpin.png") no-repeat center center;
    color: #65a6fe
}

.v-title-bacvip {
    background: url("../images/video/icon_vip.png") no-repeat center center;
    color: #ff8309
}

.video-column .v-title span.v-title-txt {
    font-size: 20px;
    font-weight: 600;
    top: 15px;
    left: 50%;
    margin-left: -25px
}

.video-column .v-title a.more {
    right: 0;
    top: 14px
}

    .video-column .v-title a.more:link, .video-column .v-title a.more:visited {
        color: #666
    }

.video-column .video-list {
    margin-right: -20px;
    padding-bottom: 28px;
    overflow: hidden;
    border-bottom: 1px solid #eee;
    min-height: 372px
}

.video-column-more .video-list {
    min-height: 318px;
    border: none
}

.video-column .commentV2 .pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
    color: #fff;
    z-index: 2;
    cursor: default;
    background-color: #3e89f8;
    border-color: #3e89f8
}

.video-column .commentV2 .pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover {
    z-index: 3;
    color: #3e89f8;
    background-color: #eee;
    border-color: #ddd
}

.video-column .commentV2 .pagination > li > a, .pagination > li > span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #3e89f8;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #eee
}

.video-main .v-more-nav {
    margin-top: 20px;
    font-size: 14px;
    text-align: left
}

    .video-main .v-more-nav li {
        display: inline-block
    }

        .video-main .v-more-nav li i {
            font-size: 12px
        }

    .video-main .v-more-nav .active {
        color: #333
    }

        .video-main .v-more-nav .active:hover {
            color: #3e89f8
        }

.v-more-nav a {
    color: #999
}

.video-main .h-top-rec .video-list {
    min-height: 334px
}

.video-column .v-subnav {
    width: 1180px;
    margin: 30px 0 0 0
}

    .video-column .v-subnav b {
        position: absolute;
        top: 2px;
        left: 4px;
        width: 6px;
        height: 26px;
        border-radius: 2px;
        display: inline-block;
        background-color: #599cff
    }

    .video-column .v-subnav a {
        font-size: 16px;
        color: #999;
        padding-right: 4px;
        height: 28px;
        line-height: 28px;
        color: #999
    }

        .video-column .v-subnav a:hover {
            color: #3e89f8
        }

.video-column .v-item {
    width: 278px;
    height: 258px;
    border-radius: 6px;
    overflow: hidden;
    float: left;
    margin: 26px 16px 0 4px;
    transition: all .3s
}

.video-main {
    overflow: hidden
}

    .video-main .video-column .v-item-mt {
        margin: 46px 16px 0 4px
    }

.video-column .v-item:hover {
    transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    margin-top: 10px;
    -moz-box-shadow: 0px 4px 12px #d1e0ff;
    -webkit-box-shadow: 0px 4px 12px #d1e0ff;
    box-shadow: 0px 4px 12px #d1e0ff
}

.video-main .video-column .v-item-mt:hover {
    margin-top: 30px
}

.video-list .v-item .v-item-img {
    height: 158px;
    overflow: hidden
}

    .video-list .v-item .v-item-img img {
        width: 100%;
        height: 100%
    }

.video-list .v-item .v-item-text {
    padding: 14px 10px 0;
    font-size: 16px
}

    .video-list .v-item .v-item-text p {
        text-align: left;
        width: 218px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap
    }

    .video-list .v-item .v-item-text span {
        color: #fb6a50
    }

.video-list .v-item .v-item-icon {
    padding: 10px 10px 0
}

    .video-list .v-item .v-item-icon i {
        padding-right: 0px;
        font-size: 18px
    }

.video-course .v-course-img {
    width: 370px;
    height: 240px;
    display: inline-block;
    overflow: hidden
}

    .video-course .v-course-img img {
        height: 100%
    }

.video-course .v-course-list {
    margin-left: 20px;
    width: 780px
}

.v-course-list .v-course-details {
    margin-left: -10px
}

.v-course-list .v-course-text {
    display: inline-block;
    padding: 0 10px;
    border-right: 1px solid #ddd;
    line-height: 14px
}

    .v-course-list .v-course-text:last-child {
        border: none
    }

.v-course-list .active {
    color: #65a6fe
}

.v-course-promptly a, .v-course-promptly button {
    display: inline-block;
    text-align: center;
    line-height: 40px;
    border-radius: 6px;
    width: 140px;
    height: 40px;
    background-color: #65a6fe;
    color: #fff;
    border: none
}

.v-course-action .v-action-ul {
    min-height: 400px
}

    .v-course-action .v-action-ul .v-action-rec {
        font-size: 16px;
        padding: 20px 0 20px 0
    }

    .v-course-action .v-action-ul .v-action-intro {
        padding: 20px 10px 20px 0;
        border-bottom: 1px solid #eee
    }

.v-course-promptly a:hover {
    color: #fff
}

.v-course-action .v-action-down img {
    margin: -1px 10px 0 0
}

.v-course-action .v-action-ul .v-action-catalog {
    padding: 20px 40px 0px 30px;
    overflow: hidden
}

.v-action-catalog .v-c-item .w288 {
    width: 288px
}

.v-action-catalog .v-percent-column {
    margin: 13px 20px 0 0px;
    display: inline-block;
    width: 120px;
    height: 14px;
    box-shadow: inset 0 0px 1px rgba(0,0,0,0.6);
    -moz-box-shadow: inset 0 0px 1px rgba(0,0,0,0.6);
    -webkit-box-shadow: inset 0 0px 1px rgba(0,0,0,0.6);
    -o-box-shadow: inset 0 0px 1px rgba(0,0,0,0.6);
    border-radius: 50px;
    overflow: hidden
}

.v-action-catalog .v-c-list i {
    cursor: pointer
}

.v-percent-column .v-percent-fill {
    display: inline-block;
    height: 14px;
    border: 1px solid #63be36;
    background: #63be36;
    border-radius: 50px;
    float: left
}

.v-percent i {
    position: absolute;
    top: 0px;
    right: -40px;
    font-size: 18px;
    color: #63be36
}

.v-duration i, .v-hover-enter i {
    position: absolute;
    top: 1px;
    left: -30px;
    font-size: 22px
}

.v-action-catalog .v-c-item li:hover {
    background-color: #d8e9ff;
    margin: 0 -28px 0 -30px;
    padding: 0 28px 0 30px
}

.v-action-catalog .v-item-close {
    overflow-y: hidden;
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
    height: 0px
}

.v-hover-enter {
    display: none
}

    .v-hover-enter .not-pay-c {
        color: #f75234
    }

.v-action-catalog .v-c-item li:hover .v-duration {
    display: none
}

.v-action-catalog .v-c-item li:hover .v-hover-enter {
    display: block
}

.video-player {
    display: block;
    min-height: 622px;
    background-color: #464649;
    margin-bottom: 50px
}

    .video-player .video-player-title {
        font-size: 18px;
        color: #fff;
        height: 60px;
        line-height: 60px;
        text-align: left;
        padding: 0 10px
    }

.video-player-user {
    width: 40px;
    height: 40px;
    border-radius: 50%
}

.video-player-content {
    position: relative;
    overflow: hidden;
    height: 629px
}

.video-section-list {
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 999;
    width: 220px;
    height: 100%;
    background: #242424;
    -webkit-transition: right .4s ease-in-out;
    -moz-transition: right .4s ease-in-out;
    -o-transition: right .4s ease-in-out;
    transition: right .4s ease-in-out
}

.video-main .v-operator-close {
    -webkit-transition: right .4s ease-in-out;
    -moz-transition: right .4s ease-in-out;
    -o-transition: right .4s ease-in-out;
    transition: right .4s ease-in-out;
    right: -220px
}

.video-section-item {
    padding: 24px 20px 20px 20px;
    text-align: left;
    font-size: 14px;
    height: 100%;
    overflow: auto
}

    .video-section-item .item-title {
        width: 174px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap
    }

.video-main::-webkit-scrollbar {
    width: 4px;
    height: 2px
}

.video-main::-webkit-scrollbar-thumb {
    border-radius: 6px;
    background-color: #666
}

.video-main::-webkit-scrollbar-track {
    background-color: transparent;
    position: fixed
}

.video-section-item .item-title {
    color: #ccc;
    height: 36px;
    display: inline-block;
    line-height: 36px
}

.video-section-item ul li.sub-title span {
    font-size: 16px;
    display: inline-block;
    width: 56px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.video-section-item ul li.video-section-low span {
    display: inline-block;
    width: 48px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    line-height: 36px;
    height: 36px
}

.video-section-item ul li a {
    color: #808080;
    font-size: 14px;
    padding-left: 10px
}

    .video-section-item ul li a:hover {
        color: #3e89f8
    }

.video-section-low i {
    line-height: 36px;
    height: 36px;
    display: inline-block;
    vertical-align: top
}

.video-section-item ul li a.video-being, .video-section-item ul li .icon-mimaxiugaichenggong {
    line-height: 36px;
    height: 36px;
    color: #65a6fe
}

.video-section-item ul li .icon-mimaxiugaichenggong {
    font-size: 14px
}

.video-section-item ul li {
    height: 36px;
    line-height: 36px;
    font-size: 14px;
    color: #808080
}

.video-section-list .v-operator {
    padding-top: 16px;
    cursor: pointer;
    background: #242424;
    position: absolute;
    top: 50%;
    left: -34px;
    margin-top: -68px;
    width: 34px;
    height: 90px;
    color: #fff;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
    color: #808080
}

    .video-section-list .v-operator:hover {
        color: #fff
    }

    .video-section-list .v-operator i {
        padding: 0;
        font-size: 14px;
        display: block
    }

.v-operator span {
    width: 16px;
    display: inline-block
}

.video-player-content .pv-skin-blue {
    z-index: 1000
}

.carousel .close {
    position: absolute;
    top: 26px;
    right: 8px;
    width: 18px;
    line-height: 18px;
    height: 18px;
    color: #000;
    text-shadow: none;
    font-size: 20px
}

.min-w {
    min-width: 1180px
}

.read-practice-v2 {
    min-width: 600px;
    font-size: 16px
}

.read-type-search {
    width: 640px;
    position: relative
}

    .read-type-search input {
        width: 100%;
        height: 30px;
        background-color: #ffffff;
        border-radius: 4px;
        border: solid 1px #dddddd;
        padding-left: 20px;
        font-size: 14px;
        color: #333;
        line-height: 24px
    }

        .read-type-search input:-ms-input-placeholder, .read-type-search input::-moz-placeholder, .read-type-search input::-webkit-input-placeholder {
            width: 140px;
            font-size: 14px;
            letter-spacing: 0px;
            color: #999999
        }

    .read-type-search i {
        width: 17px;
        height: 17px;
        color: #333333;
        position: absolute;
        top: 6px;
        right: 15px
    }

        .read-type-search i:hover {
            cursor: pointer;
            *cursor: hand
        }

    .read-type-search ul.read-search-result {
        font-size: 14px;
        color: #333;
        width: 640px;
        height: auto;
        background-color: #ffffff;
        border: solid 1px #dddddd;
        border-top: none;
        position: absolute;
        left: 0px;
        top: 30px;
        z-index: 10
    }

        .read-type-search ul.read-search-result li.read-search-list {
            width: 100%;
            padding: 3px 11px
        }

            .read-type-search ul.read-search-result li.read-search-list:hover {
                background-color: #eee
            }

        .read-type-search ul.read-search-result li span {
            display: inline-block
        }

        .read-type-search ul.read-search-result li:hover {
            cursor: pointer;
            *cursor: hand
        }

        .read-type-search ul.read-search-result li.read-search-list .search-type {
            float: right
        }

.read-type-v2 {
    background: #fff;
    overflow: hidden;
    border-bottom: 1px solid #eee;
    padding: 10px 0
}

    .read-type-v2 .y-read-search-warn {
        font-size: 14px;
        color: #999999;
        padding: 29px 0 20px
    }

    .read-type-v2:last-child {
        border: 0 none
    }

        .read-type-v2:last-child .read-type-tit-v2 {
            display: none
        }

        .read-type-v2:last-child .read-type-main-v2 {
            margin-left: 30px;
            min-width: 150px
        }

.read-type-tit-v2 {
    font-size: 16px;
    color: #666666;
    text-align: left;
    min-width: 90px;
    line-height: 34px;
    margin-right: 32px
}

.read-type-detail-v2 li {
    float: left;
    line-height: 34px;
    font-size: 14px;
    margin-right: 26px
}

.read-type-main-v2 li {
    float: left
}

.read-tip-v2 {
    vertical-align: middle;
    position: absolute;
    top: 0;
    right: 30px;
    cursor: pointer;
    color: #f1bc55
}

    .read-tip-v2:hover b {
        display: block
    }

    .read-tip-v2 b {
        position: absolute;
        left: 24px;
        top: -2px;
        font-size: 12px;
        color: #000000;
        display: inline-block;
        width: 164px;
        border: 1px solid #dedfdf;
        box-shadow: 1px 0 6px #ececec;
        height: 22px;
        line-height: 22px;
        text-align: center;
        display: none;
        font-weight: normal;
        background: #fff;
        z-index: 10
    }

.read-type-main-v2 a {
    color: #333333;
    display: inline-block;
    height: 34px;
    line-height: 34px;
    min-width: 160px;
    text-align: left
}

.read-type-main-v2 .active, .read-type-detail-v2 .active {
    color: #3e89f8
}

.read-type-main-v2 a:hover, .read-type-detail-v2 a:hover {
    color: #3e89f8
}

.read-content-v2 {
    padding-bottom: 24px;
    position: relative;
    z-index: 1
}

    .read-content-v2 .iconfont {
        padding-right: 4px
    }

.order-list-v2 ul {
    margin-bottom: 34px;
    display: inline-block;
    width: 1300px;
    margin-top: -22px
}

    .order-list-v2 ul li {
        width: 380px;
        height: 314px;
        border-radius: 6px;
        margin: 20px 20px 16px 0px;
        transition: all .3s;
        overflow: hidden;
        display: inline-block;
        position: relative;
        top: 20px
    }

.order-list-v2-new ul li.y-search {
    width: 380px;
    height: 100%;
    border-radius: 6px;
    margin: 20px 20px 16px 0px;
    transition: all .3s;
    display: inline-block;
    position: relative;
    top: 20px
}

.order-list-v2-new ul li .new-content-item-v2:hover {
    transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    -moz-box-shadow: 0px 4px 12px #d1e0ff;
    -webkit-box-shadow: 0px 4px 12px #d1e0ff;
    box-shadow: 0px 4px 12px #d1e0ff;
    position: absolute;
    top: 55px
}

.order-list-v2 ul li.y-search {
    width: 380px;
    height: 100%;
    border-radius: 6px;
    margin: 20px 20px 16px 0px;
    transition: all .3s;
    display: inline-block;
    position: relative;
    top: 20px
}

    .order-list-v2 ul li.y-search a {
        color: #333333
    }

.img-nothing {
    margin-top: 144px;
    text-align: center
}

.new-y-search {
    height: 380px !important
}

    .new-y-search .new-content-item-v2 {
        position: absolute;
        top: 65px;
        border-radius: 6px;
        width: 380px;
        overflow: hidden;
        cursor: pointer
    }

.order-list-v2 ul li:hover {
    transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    -moz-box-shadow: 0px 4px 12px #d1e0ff;
    -webkit-box-shadow: 0px 4px 12px #d1e0ff;
    box-shadow: 0px 4px 12px #d1e0ff;
    position: relative;
    top: 8px
}

.order-list-v2 ul li:last-child {
    margin-right: 0
}

.order-list-title {
    padding-top: 10px;
    line-height: 60px
}

.order-list-v2 .order-list-title img {
    margin-right: 6px;
    margin-top: -4px
}

.order-list-v2 .order-list-title span {
    font-size: 20px;
    vertical-align: top
}

.order-list-v2 .order-list-title .hover-img a {
    font-size: 16px;
    color: #999
}

.order-list-v2 .order-list-title .hover-img:hover a {
    color: #3e89f8
}

.order-list-v2 .hover-img:hover .block, .order-list-v2 .hover-img .none {
    display: none
}

.order-list-v2 .hover-img:hover .none {
    display: inline-block
}

.order-list-v2 ul li .hover-c:hover .icon-you {
    color: #3e89f8
}

.write-list-v2 .content-item-v2 .content-item-img {
    max-height: 214px;
    overflow: hidden;
    vertical-align: top
}

.content-item-v2 h3 {
    margin: 0 0 18px 0;
    font-size: 18px;
    color: #333333
}

.content-item-v2 .content-item-img img {
    display: block;
    width: 100%;
    height: 214px
}

.content-item-v2 h4 {
    color: #333;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0
}

.listen-detail-v2 {
    font-size: 14px;
    color: #999
}

    .listen-detail-v2 .icon-erji {
        position: absolute;
        top: -2px;
        left: -26px
    }

.content-item-v2 b {
    color: #666666;
    font-weight: normal
}

.content-item-v2 .hover-c:hover i {
    color: #3e89f8
}

.speak-content-item-v2 {
    padding: 26px 20px 0 40px
}

    .speak-content-item-v2 .speak-item-title {
        font-size: 20px;
        color: #333;
        vertical-align: top;
        position: relative;
        padding-left: 24px
    }

        .speak-content-item-v2 .speak-item-title:hover {
            color: #3e89f8
        }

        .speak-content-item-v2 .speak-item-title i {
            font-size: 24px;
            position: absolute;
            top: -1px;
            left: -3px
        }

    .speak-content-item-v2 .speak-list {
        width: 200px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap
    }

.writing-list-v2 {
    width: 570px;
    margin-right: 38px
}

    .writing-list-v2 ul {
        min-height: 200px;
        width: 570px;
        vertical-align: top
    }

        .writing-list-v2 ul li {
            width: 272px;
            height: 118px;
            border: 1px solid #ddd;
            margin: 20px 0px 16px 0px
        }

            .writing-list-v2 ul li:first-child {
                margin: 20px 20px 16px 0px
            }

            .writing-list-v2 ul li .speak-content-item-v2 {
                padding: 26px 20px 0 20px
            }

                .writing-list-v2 ul li .speak-content-item-v2 .speak-item-title {
                    font-size: 16px
                }

    .writing-list-v2 .speak-content-item-v2 .speak-item-title i {
        font-size: 20px
    }

.special-list-v2 ul li {
    height: 118px;
    border: 1px solid #ddd;
    width: 280px
}

.special-list-v2 li .speak-content-item-v2 {
    padding: 22px 14px 0 22px
}

    .special-list-v2 li .speak-content-item-v2 .item-btn a {
        width: 88px;
        height: 32px;
        line-height: 32px;
        text-align: center;
        border-radius: 4px;
        color: #65a6fe;
        border: 1px solid #65a6fe;
        display: inline-block;
        margin-left: 6px
    }

        .special-list-v2 li .speak-content-item-v2 .item-btn a:hover {
            color: #fff;
            background-color: #65a6fe
        }

.ztpo-null p a {
    background: #65a6fe
}

.mockV2-content-title .top-text i {
    color: #333;
    font-size: 20px;
    vertical-align: -2px
}

.mockV2-list-top {
    line-height: 70px
}

    .mockV2-list-top i {
        vertical-align: -2px;
        margin-right: 2px
    }

.mockV2-rank {
    border: 1px solid #ddd;
    border-radius: 6px;
    margin-top: 20px
}

    .mockV2-rank li {
        line-height: 88px;
        border-bottom: 1px solid #ddd;
        position: relative
    }

        .mockV2-rank li:last-child {
            border: none
        }

        .mockV2-rank li b {
            font-size: 18px;
            margin-right: 10px;
            font-weight: 400
        }

        .mockV2-rank li span {
            width: 40px;
            height: 40px;
            overflow: hidden;
            border-radius: 50%;
            display: inline-block;
            margin-right: 10px;
            vertical-align: -14px
        }

            .mockV2-rank li span img {
                width: 100%;
                height: 100%;
                vertical-align: top
            }

        .mockV2-rank li i {
            font-size: 20px
        }

        .mockV2-rank li em {
            font-size: 14px
        }

        .mockV2-rank li.active i {
            color: #f75234;
            font-weight: 600
        }

        .mockV2-rank li.active b {
            font-weight: 600
        }

    .mockV2-rank .ranging-img {
        position: absolute;
        top: 60px;
        left: 36px
    }

.mockV2-content-tpo {
    width: 860px
}

.mockV2-tpo-title {
    margin-top: 20px;
    font-size: 20px;
    font-family: Arial
}

    .mockV2-tpo-title b {
        width: 4px;
        height: 20px;
        background-color: #3e89f8;
        display: inline-block;
        margin-right: 10px;
        vertical-align: -2px
    }

.mockV2-tpo-item {
    margin: -20px 0 60px -20px
}

    .mockV2-tpo-item li {
        width: 200px;
        height: 118px;
        float: left;
        border-radius: 6px;
        margin: 20px 0px 0px 20px;
        transition: all .3s;
        overflow: hidden;
        display: inline-block;
        position: relative;
        top: 20px;
        border: 1px solid #ddd;
        padding: 0px 24px 0px 20px
    }

        .mockV2-tpo-item li:hover {
            transition: all .3s;
            -moz-transition: all .3s;
            -webkit-transition: all .3s;
            -o-transition: all .3s;
            -moz-box-shadow: 0px 4px 12px #d1e0ff;
            -webkit-box-shadow: 0px 4px 12px #d1e0ff;
            box-shadow: 0px 4px 12px #d1e0ff;
            position: relative;
            top: 10px;
            cursor: pointer
        }

.mockV2-item-definite .definite-top .headline {
    font-size: 40px;
    font-family: Arial;
    vertical-align: top;
    display: inline-block;
    margin-top: 18px;
    line-height: 40px;
    font-weight: 600
}

.mockV2-tpo-item li:hover .mockV2-item-definite .definite-top .headline {
    color: #3e89f8
}

.mockV2-item-definite .definite-top i {
    vertical-align: -1px
}

.mockV2-item-definite .definite-bottom b {
    width: 70px;
    height: 2px;
    background-color: #999;
    display: inline-block;
    margin-top: 24px
}

.mockV2-item-definite .definite-bottom {
    font-family: Arial
}

.mockV2-list-right {
    width: 280px
}

.txtMarquee-left {
    width: 1180px;
    overflow: hidden
}

    .txtMarquee-left .infoList li {
        display: inline-block;
        color: #999;
        font-size: 16px;
        line-height: 40px;
        margin: 20px 20px 20px 0;
        width: 380px
    }

        .txtMarquee-left .infoList li img {
            display: inline-block;
            vertical-align: top;
            margin-right: 10px;
            width: 40px;
            height: 40px;
            border-radius: 50%
        }

        .txtMarquee-left .infoList li p {
            display: inline-block;
            vertical-align: top
        }

        .txtMarquee-left .infoList li span {
            color: #3e89f8;
            margin-right: 4px
        }

.boxV2-body {
    text-align: center;
    padding: 40px 0 10px 0
}

.mockV2-btn-app {
    border-radius: 6px !important;
    position: relative;
    margin: 0 0 10px 22px;
    width: 80px;
    height: 80px;
    text-align: center;
    color: #666 !important;
    border: 1px solid #999 !important;
    font-size: 16px;
    background-color: #fff !important
}

    .mockV2-btn-app.active {
        border: 1px solid #3e89f8 !important;
        box-shadow: 0 0 0;
        color: #3e89f8 !important;
        background-color: #eee
    }

        .mockV2-btn-app.active .fa {
            color: #3e89f8
        }

    .mockV2-btn-app > .fa {
        font-size: 28px;
        display: block;
        color: #999999;
        padding: 0
    }

    .mockV2-btn-app.active .mock-icon {
        display: block
    }

    .mockV2-btn-app > .mock-icon {
        position: absolute;
        bottom: -10px;
        right: -10px;
        font-size: 20px;
        color: #3e89f8;
        display: none
    }

#ajaxCrubModal .modal-footer {
    text-align: center
}

    #ajaxCrubModal .modal-footer button {
        background-color: #3e89f8;
        margin-bottom: 20px
    }

.mockV2-body .tooltip.right .tooltip-arrow {
    display: none
}

.mockV2-body .tooltip-inner {
    background-color: #fff;
    color: #f75234;
    font-size: 14px;
    position: absolute;
    top: 150px;
    left: -354px;
    opacity: 1
}

.answer-order-btn {
    padding-left: 50px
}

    .answer-order-btn .btn, .answer-order-btn .btn:focus, .answer-order-btn .btn:hover {
        background-color: #fff;
        width: 330px;
        height: 50px;
        line-height: 50px;
        font-size: 18px;
        color: #333;
        display: block;
        border: 1px solid #ddd;
        border-radius: 6px !important;
        margin-bottom: 12px;
        padding: 0px;
        position: relative
    }

        .answer-order-btn .btn.active {
            color: #3e89f8;
            box-shadow: none;
            border: 1px solid #3e89f8
        }

            .answer-order-btn .btn.active i {
                color: #3e89f8
            }

        .answer-order-btn .btn i {
            font-size: 40px;
            color: #666;
            position: absolute;
            top: 1px;
            left: 16px
        }

            .answer-order-btn .btn i.icon-weibiaoti1 {
                transform: rotate(90deg);
                -ms-transform: rotate(90deg);
                -moz-transform: rotate(90deg);
                -webkit-transform: rotate(90deg);
                -o-transform: rotate(90deg);
                position: absolute;
                top: 2px;
                left: 13px
            }

    .answer-order-btn .doubt {
        width: 40px;
        height: 50px;
        margin-bottom: 12px;
        display: inline-block
    }

        .answer-order-btn .doubt i {
            color: #65a6fe;
            font-size: 20px;
            position: absolute;
            top: 12px;
            left: 9px
        }

        .answer-order-btn .doubt span {
            position: absolute;
            top: -14px;
            left: -139px;
            line-height: 24px;
            border: 1px solid #ddd;
            color: #999;
            font-size: 14px;
            width: 185px;
            text-align: center;
            border-radius: 6px;
            background-color: #fff;
            z-index: 10;
            display: none
        }

        .answer-order-btn .doubt img {
            position: absolute;
            top: 11px;
            right: 16px;
            z-index: 10;
            overflow: hidden;
            display: none
        }

.vocabulary-modal-dialog .answer-order-btn .doubt .w-item-text1 {
    width: 248px;
    left: -203px
}

.vocabulary-modal-dialog .answer-order-btn .doubt .w-item-text2 {
    width: 345px;
    left: -300px
}

.answer-order-btn .doubt:hover span {
    display: inline-block
}

.answer-order-btn .doubt:hover img {
    display: inline-block
}

.answer-order-btn .doubt b {
    position: absolute;
    top: 7px;
    left: 16px;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 10px solid #ddd;
    z-index: 11
}

.answer-order-footer {
    margin: 24px auto 20px;
    text-align: center
}

    .answer-order-footer .btn, .answer-order-footer .btn:focus {
        padding: 9px 26px;
        background-color: #3e89f8;
        border-radius: 6px;
        border: none;
        outline: none;
        margin: 0 5px;
        color: #fff
    }

.answer-order-title {
    font-size: 14px;
    color: #666
}

.answer-order .answer-round-btn {
    padding-left: 27px
}

    .answer-order .answer-round-btn .btn {
        height: 84px;
        width: 84px;
        border-radius: 50% !important;
        background-color: #fff;
        margin: 1px;
        border: 1px dashed #3e89f8;
        padding: 0;
        text-align: center;
        margin: 0 20px 16px
    }

.answer-order .round-btn-border .btn {
    border: 1px solid #3e89f8
}

.answer-order .answer-round-btn .btn.active {
    box-shadow: none
}

.answer-order .answer-round-btn .btn .round-in {
    height: 74px;
    width: 74px;
    border-radius: 50%;
    background-color: #d8e9ff;
    margin-left: 4px;
    color: #3e89f8
}

.answer-order .answer-round-btn .btn.active .round-in {
    background-color: #3e89f8;
    color: #fff
}

.answer-order .answer-round-btn .btn .round-in span {
    display: block
}

@media screen and (min-width:1367px) {
    .pattern-img {
        margin: 290px auto
    }
}

@media screen and (min-width:960px) and (max-width:1366px) {
    .pattern-img {
        margin: 190px auto
    }
}

@media screen and (min-width:768px) and (max-width:959px) {
    .pattern-img {
        margin: 90px auto
    }
}

.pattern-img {
    width: 350px
}

    .pattern-img i {
        position: absolute;
        top: 0px;
        right: 0px;
        font-size: 34px;
        color: #fff;
        cursor: pointer
    }

    .pattern-img .pattern-test {
        position: absolute;
        bottom: 42px;
        left: 50%;
        margin-left: -54px;
        display: inline-block;
        padding: 9px 26px;
        background-color: #3e89f8;
        border-radius: 6px;
        border: none;
        outline: none;
        color: #fff
    }

.pattern-test-two {
    color: #3e89f8;
    position: absolute;
    bottom: 14px;
    left: 50%;
    margin-left: -75px
}

.vocabulary-header-right a {
    height: 30px;
    line-height: 30px;
    padding: 0 12px;
    font-size: 14px;
    color: #333;
    background-color: #fff;
    border-radius: 6px;
    display: inline-block;
    margin-right: 20px
}

.listen-make-top b {
    background-color: #fa6c6c;
    color: #fff;
    border-radius: 50px;
    line-height: 18px;
    width: 40px;
    display: inline-block;
    margin-right: 8px;
    font-weight: 400
}

.listen-make-top i {
    padding: 0;
    font-size: 20px
}

.listen-vocabulary-main .title {
    margin: 30px auto
}

    .listen-vocabulary-main .title span {
        position: absolute;
        top: 0px;
        right: 119px;
        line-height: 30px;
        height: 30px;
        border: 1px solid #ddd;
        display: inline-block;
        padding: 0px 14px 0 36px;
        border-radius: 6px;
        color: #333
    }

        .listen-vocabulary-main .title span i {
            position: absolute;
            top: 0px;
            right: 42px;
            color: #65a6fe;
            font-size: 20px
        }

.listen-vocabulary-main .listen-vocabulary-gif {
    background: url("../images/vocabulary/teofl_listen_img1.png") no-repeat;
    width: 414px;
    height: 252px;
    display: inline-block
}

.vocabulary-audio-control {
    padding: 32px 18px 0;
    width: 536px
}

    .vocabulary-audio-control .audio-progress-v2 {
        height: 52px;
        border-radius: 6px;
        border: 1px solid #eee;
        padding: 16px 22px 0 22px;
        position: relative
    }

        .vocabulary-audio-control .audio-progress-v2 .glyphicon {
            font-size: 23px;
            color: #65a6fe;
            top: -8px
        }

        .vocabulary-audio-control .audio-progress-v2 .progress-bar-v2 {
            height: 9px;
            margin-left: 32px;
            background-color: #ddd
        }

        .vocabulary-audio-control .audio-progress-v2 .ui-widget.ui-widget-content {
            margin-top: 6px;
            border-radius: 10px;
            border: none;
            width: 316px
        }

        .vocabulary-audio-control .audio-progress-v2 .ui-state-default, .vocabulary-audio-control .ui-widget-content .ui-state-default, .vocabulary-audio-control .ui-widget-header .ui-state-default, .vocabulary-audio-control .ui-button, html .vocabulary-audio-control .ui-button.ui-state-disabled:hover, html .vocabulary-audio-control .ui-button.ui-state-disabled:active {
            border-radius: 50%;
            background-color: #fff;
            border: 2px solid #3e89f8;
            height: 16px;
            width: 16px;
            top: -4px;
            outline: none;
            z-index: 10
        }

#wi-slider-play .ui-slider-range {
    background: #65a6fe;
    border-radius: 10px
}

#Volume-bar .ui-slider-range {
    background: #4d505a
}

#Volume-bar-pc .ui-slider-range {
    background: #4d505a
}

#Volume-bar-phone .ui-slider-range {
    background: #4d505a
}

.vocabulary-audio-control .audio-progress-time {
    position: absolute;
    top: 15px;
    right: 90px
}

.listen-vocabulary-main .import-text input {
    margin-top: 40px;
    width: 502px;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid #ababab;
    height: 46px;
    line-height: 46px;
    font-size: 16px;
    text-align: center
}

    .listen-vocabulary-main .import-text input:focus {
        outline: none
    }

.listen-vocabulary-main .import-text .btnV2 {
    display: block;
    line-height: 35px;
    width: 150px;
    text-align: center;
    margin: 50px auto 0px
}

.listen-vocabulary-main .l-v-list {
    display: inline-block;
    width: 878px;
    margin-top: 24px
}

.listen-vocabulary-main .content-list tbody {
    max-height: 578px;
    overflow: auto;
    display: inline-block;
    margin-top: 27px
}

.listen-vocabulary-main .l-v-list table {
    display: inline-block;
    border: 1px solid #eee;
    text-align: center;
    table-layout: fixed;
    width: 100%
}

.listen-vocabulary-main .l-v-list tr th, .listen-vocabulary-main .l-v-list tr td {
    width: 190px;
    text-align: center
}

    .listen-vocabulary-main .l-v-list tr td div {
        text-align: center
    }

.listen-vocabulary-main .l-v-list thead {
    font-size: 18px;
    background-color: #f0f1f2;
    line-height: 41px;
    height: 41px;
    position: absolute;
    top: -9px;
    left: 0px
}

    .listen-vocabulary-main .l-v-list thead tr:hover {
        background-color: #f0f1f2 !important
    }

.listen-vocabulary-main .l-v-list tbody {
    font-size: 16px
}

    .listen-vocabulary-main .l-v-list tbody td {
        height: 70px
    }

    .listen-vocabulary-main .l-v-list tbody .btnV2 {
        padding: 0 30px;
        line-height: 34px;
        background-color: #fff;
        color: #333;
        border: 1px solid #ddd;
        margin: 0 10px
    }

.listen-vocabulary-main .l-v-list .breadth {
    width: 310px
}

    .listen-vocabulary-main .l-v-list .breadth .active {
        border: 1px solid #3e89f8;
        color: #3e89f8
    }

.listen-vocabulary-main .content-list td.item-title {
    text-align: left;
    padding-left: 72px;
    border-bottom: 1px solid #f0f1f2;
    line-height: 50px;
    height: 50px;
    color: #3e89f8;
    vertical-align: top;
    position: relative
}

    .listen-vocabulary-main .content-list td.item-title b {
        position: absolute;
        top: 16px;
        left: 60px;
        width: 4px;
        height: 18px;
        background-color: #3e89f8;
        display: inline-block
    }

.listen-vocabulary-main .grade .grade-number {
    margin-top: 36px
}

    .listen-vocabulary-main .grade .grade-number span {
        font-size: 50px;
        font-weight: 600
    }

    .listen-vocabulary-main .grade .grade-number img {
        position: absolute;
        top: 10px;
        left: 498px
    }

.listen-vocabulary-main .grade ul li {
    line-height: 90px;
    display: inline-block;
    position: relative;
    margin: 0 45px
}

    .listen-vocabulary-main .grade ul li .iconfont {
        position: absolute;
        top: 1px;
        left: -26px;
        font-size: 22px
    }

    .listen-vocabulary-main .grade ul li i.icon-dui {
        position: absolute;
        top: -1px;
        left: -26px;
        font-size: 20px
    }

.listen-vocabulary-main .icon-cuowu {
    color: #f75538
}

.listen-vocabulary-main .icon-Percentage_01 {
    color: #fdb110
}

.listen-vocabulary-main .statistics ul li {
    display: inline-block;
    width: 162px;
    margin-top: 20px;
    padding-bottom: 40px
}

    .listen-vocabulary-main .statistics ul li p {
        font-size: 18px;
        color: #666;
        margin-bottom: 28px;
        border-right: 1px solid #e1e1e1
    }

    .listen-vocabulary-main .statistics ul li:last-child p {
        border-right: none
    }

    .listen-vocabulary-main .statistics ul li span {
        font-size: 20px;
        color: #3e89f8
    }

.listen-vocabulary-main .statistics .vocabulary-chart {
    width: 1000px;
    height: 400px;
    display: inline-block;
    margin: -19px 0 16px 0
}

.listen-vocabulary-main .statistics .vocabulary-chart-title {
    position: absolute;
    top: -12px;
    left: 160px;
    font-size: 16px;
    color: #666
}

.listen-vocabulary-main .answer-detail-item tr {
    border: 1px solid #ddd
}

.listen-vocabulary-main .answer-detail-item td {
    width: 166px;
    font-size: 18px;
    color: #3e89f8;
    text-align: center;
    line-height: 60px
}

    .listen-vocabulary-main .answer-detail-item td.sidebar-left {
        width: 200px;
        color: #666;
        background-color: #f0f1f2
    }

.listen-vocabulary-main .answer-detail-item table td span {
    font-weight: 600
}

.listen-vocabulary-main .answer-detail-form select {
    border-radius: 6px;
    border-color: #3e89f8;
    color: #3e89f8;
    width: 92px;
    padding-right: 0px;
    margin-right: 120px
}

    .listen-vocabulary-main .answer-detail-form select option {
        color: #666
    }

.listen-vocabulary-main .statistics-list {
    width: 1000px
}

    .listen-vocabulary-main .statistics-list tr th {
        width: 300px
    }

    .listen-vocabulary-main .statistics-list tr:hover {
        background-color: #fafcff
    }

    .listen-vocabulary-main .statistics-list tr {
        border: 1px solid #eee
    }

        .listen-vocabulary-main .statistics-list tr td {
            width: 268px;
            height: 60px
        }

            .listen-vocabulary-main .statistics-list tr td i {
                font-size: 22px;
                padding-top: 8px;
                display: inline-block
            }

            .listen-vocabulary-main .statistics-list tr td .icon-duihao {
                color: #3e89f8
            }

            .listen-vocabulary-main .statistics-list tr td div .icon-erji {
                color: #999;
                display: inline-block;
                vertical-align: top;
                padding: 0 0 0 4px;
                font-size: 26px
            }

                .listen-vocabulary-main .statistics-list tr td div .icon-erji:hover {
                    color: #3e89f8
                }

            .listen-vocabulary-main .statistics-list tr td div .icon-star1, .listen-vocabulary-main .statistics-list tr td div .icon-star2 {
                color: #ffcb00;
                display: inline-block;
                line-height: 66px;
                vertical-align: top;
                padding: 0 0 0 4px;
                font-size: 18px
            }

            .listen-vocabulary-main .statistics-list tr td .icon-cuo {
                color: #f75538
            }

            .listen-vocabulary-main .statistics-list tr td div.spe {
                width: 218px
            }

            .listen-vocabulary-main .statistics-list tr td div.spe-en {
                width: 300px
            }

        .listen-vocabulary-main .statistics-list tr th.details-title {
            width: 440px
        }

    .listen-vocabulary-main .statistics-list tbody {
        width: 100%
    }

    .listen-vocabulary-main .statistics-list td.item-title b {
        left: 91px
    }

    .listen-vocabulary-main .statistics-list tbody .item-title {
        padding-left: 100px
    }

.listen-vocabulary-main .statistics-list-chinese tr td {
    width: 200px
}

.listen-vocabulary-main .statistics-list-chinese tr th {
    width: 260px
}

    .listen-vocabulary-main .statistics-list-chinese tr th.details-title {
        width: 400px
    }

.gre-modal-dialog {
    width: 660px
}

.gre-modal-content {
    min-width: 660px
}

    .gre-modal-content .simditor {
        width: 100%
    }

.gre-model-header h4 {
    text-align: center;
    font-size: 28px;
    color: #666666 !important;
    height: 60px;
    line-height: 60px
}

.gre-model-header .close span {
    font-size: 40px;
    font-weight: 200;
    height: 60px;
    line-height: 60px
}

.gre-modalCenter-title {
    padding: 0;
    font-size: 16px
}

.gre-modalCenter-btn {
    font-size: 16px
}

    .gre-modalCenter-btn li {
        width: 100px;
        height: 36px;
        border: 1px solid #ddd;
        line-height: 34px;
        text-align: center;
        display: inline-block;
        margin-right: 16px;
        margin-top: 10px;
        position: relative;
        border-radius: 6px;
        color: #333;
        font-size: 14px
    }

        .gre-modalCenter-btn li:hover {
            color: #3e89f8;
            border: 1px solid #3e89f8
        }

    .gre-modalCenter-btn .gre-button-active {
        color: #3e89f8;
        border: 1px solid #3e89f8
    }

.gre-modal-footer {
    text-align: center
}

.gre-modal-footer-submit {
    background: #3e89f8;
    width: 120px;
    line-height: 36px;
    font-size: 16px;
    text-align: center;
    display: inline-block;
    color: #ffffff;
    margin: 36px 0 20px;
    border-radius: 6px;
    border-style: none;
    outline: none
}

    .gre-modal-footer-submit:hover {
        color: #ffffff
    }

.gre-modalCenter-btn img {
    position: absolute;
    bottom: -10px;
    right: -10px;
    display: none
}

    .gre-modalCenter-btn img.gre-button-type-img {
        display: block
    }

.my-live {
    background: #fff;
    border-radius: 5px;
    min-height: 720px
}

    .my-live .my-live-tab {
        padding: 0 15px;
        border-bottom: 1px solid #eee
    }

        .my-live .my-live-tab a {
            color: #666;
            height: 60px;
            line-height: 60px;
            padding: 0 5px;
            font-size: 18px;
            border-bottom: 2px solid #fff
        }

            .my-live .my-live-tab a.cur {
                color: #3e89f8;
                border-bottom-color: #3e89f8
            }

.my-live-tab-line {
    width: 1px;
    height: 40px;
    background: #eee;
    margin: 10px 20px 0
}

.my-live-main {
    padding: 37px 27px
}

    .my-live-main ul li {
        border: 1px solid #ddd;
        padding: 10px 20px;
        margin-top: 20px
    }

        .my-live-main ul li:first-child {
            margin-top: 0
        }

        .my-live-main ul li .p-1 {
            font-size: 20px;
            padding-bottom: 15px
        }

        .my-live-main ul li .p-2, .my-live-main ul li .p-3, .my-live-main ul li .p-4 {
            line-height: 24px
        }

        .my-live-main ul li .p-4 {
            color: #999;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis
        }

        .my-live-main ul li a.status-one {
            background: #fe7065;
            color: #fff
        }

        .my-live-main ul li a.status-two {
            background: #ddd;
            color: #999;
            cursor: not-allowed
        }

.my-live .loading-wrap {
    width: 100px;
    height: 100px;
    left: 50%;
    top: 200px;
    margin-left: -50px
}

.my-live .no-data-tip {
    padding: 100px 0;
    text-align: center
}

.my-video .tab {
    padding: 36px 40px 16px 40px
}

.my-video-tab {
    line-height: 28px;
    font-size: 16px
}

    .my-video-tab .tab-line {
        display: inline-block;
        margin-right: 40px
    }

    .my-video-tab .tab-line-l {
        display: inline-block;
        margin-right: 30px
    }

    .my-video-tab a {
        color: #333
    }

        .my-video-tab a.cur {
            color: #3e89f8
        }

.my-video-main {
    min-height: 528px
}

    .my-video-main ul {
        padding-left: 40px
    }

        .my-video-main ul li {
            width: 390px;
            height: 144px;
            border-radius: 6px;
            border: 1px solid #ddd;
            padding: 16px;
            margin: 20px 20px 0 0;
            display: inline-block;
            float: left;
            position: relative
        }

            .my-video-main ul li:hover {
                transition: all .3s;
                -moz-transition: all .3s;
                -webkit-transition: all .3s;
                -o-transition: all .3s;
                -moz-box-shadow: 0px 4px 12px #d1e0ff;
                -webkit-box-shadow: 0px 4px 12px #d1e0ff;
                box-shadow: 0px 4px 12px #d1e0ff
            }

            .my-video-main ul li img {
                width: 172px;
                height: 100%;
                overflow: hidden;
                vertical-align: top;
                margin-right: 14px
            }

            .my-video-main ul li .title {
                width: 160px;
                text-overflow: ellipsis;
                overflow: hidden;
                white-space: nowrap
            }

    .my-video-main a {
        height: 32px;
        line-height: 30px;
        width: 90px;
        border: 1px solid #999;
        border-radius: 6px;
        text-align: center;
        float: right;
        color: #333
    }

        .my-video-main a:hover {
            background-color: #65a6fe;
            color: #fff;
            border-color: #65a6fe
        }

    .my-video-main ul li .cancelcoll i {
        position: absolute;
        top: 6px;
        right: 6px;
        display: none;
        color: #999
    }

        .my-video-main ul li .cancelcoll i:hover {
            color: #65a6fe
        }

    .my-video-main ul li:hover .cancelcoll i {
        display: block
    }

.my-video-list {
    min-height: 620px;
    text-align: center
}

    .my-video-list .comment-list:hover {
        background-color: #f3f8ff
    }

    .my-video-list .comment-title {
        border-bottom: 1px dashed #ddd;
        line-height: 26px;
        padding: 14px 0 6px 0
    }

        .my-video-list .comment-title .delete {
            position: absolute;
            top: 26px;
            right: 0px;
            font-size: 14px;
            color: #3e89f8;
            cursor: pointer;
            display: none
        }

    .my-video-list .comment-list:hover .delete {
        display: inline-block
    }

    .my-video-list .comment-title .delete i {
        vertical-align: -1px;
        padding: 0
    }

    .my-video-list .comment-content {
        padding: 12px 0;
        line-height: 26px
    }

    .my-video-list .loading-wrap {
        width: 100px;
        text-align: center;
        margin: 0 auto;
        padding-top: 200px
    }

        .my-video-list .loading-wrap img {
            width: 100%
        }

.r-pagination {
    margin: 20px auto;
    text-align: center
}

    .r-pagination ul {
        display: inline-block
    }

        .r-pagination ul li {
            float: left;
            margin: 0 6px;
            font-size: 16px
        }

            .r-pagination ul li a {
                color: #666
            }

            .r-pagination ul li i {
                font-size: 14px;
                padding: 0px
            }

            .r-pagination ul li.all {
                font-size: 14px;
                color: #999;
                line-height: 23px
            }

    .r-pagination .pager .disabled > a, .r-pagination .pager .disabled > a:focus, .r-pagination .pager .disabled > a:hover, .r-pagination .pager .disabled > span {
        color: #3e89f8
    }

.col-xs-9 {
    width: 70%
}

.y-result-top, #mock-result-main {
    background-color: #fff;
    border-radius: 6px
}

.y-result-top {
    height: 210px;
    padding: 42px 145px 43px 88px
}

    .y-result-top .icon-show {
        width: 125px;
        height: 125px;
        background-color: #65a6fe;
        border-radius: 50%;
        text-align: center;
        padding-top: 20px;
        margin-left: 30px;
        margin-right: 110px
    }

        .y-result-top .icon-show i {
            font-size: 46px;
            color: #ffffff;
            padding-left: 15px
        }

        .y-result-top .icon-show p {
            font-size: 18px;
            color: #ffffff
        }

    .y-result-top .y-mock-type h3 {
        color: #3e89f8;
        padding-bottom: 20px;
        font-weight: bold
    }

    .y-result-top .y-mock-type h4 {
        color: #666666
    }

#mock-result-main {
    width: 100%;
    padding: 0 41px 0 22px
}

    #mock-result-main .y-result-main-top {
        height: 60px;
        border-bottom: 1px solid #ccc
    }

        #mock-result-main .y-result-main-top .a_e_ch {
            padding-top: 18px
        }

    #mock-result-main .y-result-main-center {
        height: 94px;
        border-bottom: 1px solid #ccc
    }

        #mock-result-main .y-result-main-center ul.my-mock-types {
            height: 100%;
            padding-top: 30px
        }

            #mock-result-main .y-result-main-center ul.my-mock-types li.my-mock-type {
                float: left;
                width: 89px;
                height: 32px;
                border: solid 1px #3e89f8;
                border-radius: 6px;
                font-size: 16px;
                line-height: 32px;
                text-align: center;
                margin-right: 19px
            }

                #mock-result-main .y-result-main-center ul.my-mock-types li.my-mock-type:hover {
                    border: none
                }

                #mock-result-main .y-result-main-center ul.my-mock-types li.my-mock-type a {
                    display: inline-block;
                    width: 100%;
                    height: 100%;
                    color: #3e89f8
                }

                    #mock-result-main .y-result-main-center ul.my-mock-types li.my-mock-type a:hover {
                        background-color: #65a6fe;
                        border-radius: 6px;
                        border: none;
                        color: #fff
                    }

            #mock-result-main .y-result-main-center ul.my-mock-types li.typeActive {
                background-color: #65a6fe;
                border-radius: 6px;
                border: none
            }

                #mock-result-main .y-result-main-center ul.my-mock-types li.typeActive a {
                    color: #fff
                }

.square {
    width: 0;
    height: 0;
    margin: 0 auto;
    border: 6px solid transparent;
    border-top: 6px solid #65a6fe
}

#mock-result-main .y-result-main-bottom {
    margin-bottom: 93px;
    font-size: 16px
}

    #mock-result-main .y-result-main-bottom .listen-topic {
        padding-top: 20px
    }

        #mock-result-main .y-result-main-bottom .listen-topic div, #mock-result-main .y-result-main-bottom .write-topic div {
            width: 3px;
            height: 15px;
            background-color: #3e89f8;
            margin-top: 20px;
            display: inline-block
        }

        #mock-result-main .y-result-main-bottom .listen-topic span, #mock-result-main .y-result-main-bottom .write-topic span {
            color: #333;
            font-size: 18px;
            font-weight: bold
        }

    #mock-result-main .y-result-main-bottom li.border-xia-s {
        height: auto;
        width: 100%;
        border-bottom: 1px dashed #ccc;
        padding: 31px 0 30px
    }

        #mock-result-main .y-result-main-bottom li.border-xia-s:hover {
            background-color: rgba(101,166,254,0.1)
        }

        #mock-result-main .y-result-main-bottom li.border-xia-s b {
            color: #999999;
            font-size: 18px
        }

        #mock-result-main .y-result-main-bottom li.border-xia-s .a_e_span {
            color: #999;
            width: 10px;
            float: left
        }

        #mock-result-main .y-result-main-bottom li.border-xia-s .listen-sentence {
            padding-left: 20px;
            color: #333;
            text-indent: 0.2em
        }

#mock-result-main .a_e_an a {
    color: #999;
    padding-left: 30px
}

    #mock-result-main .a_e_an a:hover {
        color: #3e89f8
    }

.wrong-answer {
    color: #f75234
}

.right-answer {
    color: #3e89f8
}

#mock-result-main .y-result-main-bottom .write-topic-list {
    padding-top: 25px;
    padding-bottom: 15px
}

#mock-result-main .y-result-main-bottom li.border-xia-s .write-sentence {
    padding-left: 0px
}

.write-myanswer {
    padding-left: 15px
}

    .write-myanswer h4 {
        font-size: 16px;
        color: #333;
        font-weight: bold;
        margin-bottom: 10px
    }

    .write-myanswer .result_word {
        height: auto;
        border: solid 1px #dddddd;
        padding: 26px 35px 32px 28px;
        font-size: 14px
    }

#mock-result-main .y-result-main-bottom .read-sentence {
    padding-bottom: 15px;
    font-size: 16px
}

#mock-result-main .audio-control-v2 {
    height: 44px;
    margin-left: 10px
}

#mock-result-main .audio-progress-v2 {
    width: 677px;
    height: 44px;
    border-radius: 6px;
    border: 1px solid #ddd;
    padding: 5px 20px
}

#mock-result-main #detail-play-audio {
    font-size: 20px;
    color: #65a6fe;
    top: -6px;
    top: -7px
}

#mock-result-main .audio-progress-v2 .slide-con {
    margin-top: 12px
}

#mock-result-main .audio-progress-v2 .radio-control {
    margin-left: 30px
}

    #mock-result-main .audio-progress-v2 .radio-control .slide {
        position: relative;
        width: 507px;
        height: 8px;
        background-color: #d4d4d4;
        border-radius: 10px;
        border: none
    }

        #mock-result-main .audio-progress-v2 .radio-control .slide .audio-time {
            position: absolute;
            right: -70px;
            top: -5px
        }

        #mock-result-main .audio-progress-v2 .radio-control .slide .ui-slider-range {
            background-color: #65a6fe;
            border-radius: 10px;
            height: 100%;
            top: -2px
        }

        #mock-result-main .audio-progress-v2 .radio-control .slide .ui-state-default {
            position: absolute;
            display: inline-block;
            border-radius: 50%;
            background-color: #fff;
            border: 1px solid #65a6fe;
            height: 12px;
            width: 12px;
            top: -2px;
            outline: none;
            z-index: 10
        }

#mock-result-main .ui-slider-time {
    position: absolute;
    right: -50px;
    top: -5px
}

.detail-content {
    position: relative;
    margin-top: 20px;
    height: 760px
}

    .detail-content hr {
        margin: 4px 0px 0px 0px !important
    }

.detail-content-left .true-answer-content {
    color: #65a6fe
}

.detail-content-left .c-l-title {
    line-height: 60px;
    height: 60px;
    padding-left: 20px;
    font-size: 18px;
    border-bottom: 1px solid #eee
}

#true-answer-box {
    display: none;
    font-size: 16px;
    margin-bottom: 20px
}

.answer-key {
    margin-top: 12px;
    vertical-align: top
}

.answer-key-text {
    width: 450px;
    display: inline-block;
    vertical-align: top
}

.answer-key video {
    vertical-align: top
}

.analysis-text {
    margin-top: 10px;
    vertical-align: top
}

    .analysis-text span {
        vertical-align: top
    }

    .analysis-text video {
        background-color: #666;
        width: 420px;
        margin-top: 5px
    }

    .analysis-text p {
        display: inline-block;
        width: 84%;
        margin: 0;
        color: #666
    }

.read-translate-hover:hover .read-translate, #question-title:hover .read-translate {
    display: block;
    font-size: 14px
}

.detail-content-right {
    width: 580px;
    height: 760px;
    overflow: hidden;
    border-radius: 6px;
    background-color: #fff
}

.detail-content-left .dragAnsItem {
    border: 1px solid #dfdfdf;
    margin: 10px 0px;
    padding: 10px
}

.read-collect {
    border-radius: 4px;
    border: 1px solid #ddd;
    display: inline-block;
    line-height: 22px;
    margin: 17px 18px 0 0
}

    .read-collect a {
        font-size: 14px;
        color: #333;
        line-height: 22px;
        text-align: right;
        display: inline-block;
        padding: 0 6px 0 4px
    }

    .read-collect .icon-shoucang2:before {
        padding-right: 3px
    }

    .read-collect .icon-shoucang-mian:before, .speak-collect .icon-shoucang-mian:before {
        color: #ffde5c;
        padding-right: 3px
    }

.view-answer-content {
    padding-left: 20px
}

    .view-answer-content .pager {
        margin: 0
    }

        .view-answer-content .pager .previous #view-answer-btn {
            font-size: 14px;
            background-color: #65a6fe;
            color: #fff;
            border-radius: 6px;
            border: none;
            padding: 8px 18px
        }

    .view-answer-content .pager {
        margin: 0px
    }

.question-form {
    margin: 10px 0;
    color: #666;
    font-size: 16px
}

    .question-form input {
        float: left;
        width: 18px;
        height: 18px;
        margin-top: 3px !important
    }

    .question-form .ans-option {
        font-size: 16px;
        padding-right: 10px
    }

.listen-v2 .que-inner-result .my-anwer {
    margin: 0 -20px
}

.detail-content-right .article-tab {
    height: 58px;
    border-bottom: 1px solid #eee
}

    .detail-content-right .article-tab .tab-translate {
        font-size: 16px;
        font-weight: 400
    }

.original .o-translate {
    cursor: pointer;
    position: relative
}

    .original .o-translate:hover {
        color: #3e89f8
    }

.original .o-translate-text {
    display: none;
    position: absolute;
    top: 82px;
    left: -292px;
    width: 526px;
    background-color: #fff;
    box-shadow: 0px 0px 5px rgba(0,0,0,0.2);
    padding: 8px;
    font-size: 14px;
    color: #333
}

.original .o-translate:hover .o-translate-text {
    display: inline-block
}

.answers-inner {
    display: none;
    word-wrap: break-word
}

.exercise-result {
    padding: 20px;
    text-align: left
}

    .exercise-result .grade {
        vertical-align: top;
        float: left;
        margin-right: 20px
    }

    .exercise-result .duration {
        text-align: center;
        vertical-align: top;
        float: right;
        margin: 0px 24px 0 0
    }

    .exercise-result ul {
        display: inline-block;
        width: 360px;
        float: left;
        margin-top: -12px
    }

        .exercise-result ul li {
            display: inline-block
        }

            .exercise-result ul li a {
                width: 36px;
                height: 36px;
                display: inline-block;
                border: 1px solid #ddd;
                border-radius: 4px;
                margin: 12px 12px 0 0;
                text-align: center;
                line-height: 34px;
                font-size: 18px;
                color: #333
            }

                .exercise-result ul li a:hover {
                    color: #333
                }

.que-inner-result {
    padding: 20px 20px 0 20px !important;
    border: none
}

    .que-inner-result #question-title {
        margin: 0 0 18px 0;
        line-height: 22px;
        font-size: 16px;
        position: relative
    }

    .que-inner-result .question-form .ans-option {
        position: absolute;
        top: 0;
        left: 22px
    }

.e-result .anwer .my-anwer p {
    padding-left: 40px;
    font-size: 14px;
    color: #999;
    padding-bottom: 34px
}

.detail-content-result .original {
    padding: 24px
}

    .detail-content-result .original .title {
        font-size: 24px;
        margin: 6px 0 20px;
        color: #333;
        display: block;
        text-align: center
    }

.detail-content-result .audio-progress-v2 {
    height: 50px;
    border-radius: 6px;
    border: 1px solid #ddd;
    padding: 22px 66px 0 22px;
    width: 330px;
    margin-bottom: 14px;
    display: inline-block
}

    .detail-content-result .audio-progress-v2 .glyphicon {
        font-size: 20px;
        color: #65a6fe;
        top: -7px;
        left: -7px
    }

    .detail-content-result .audio-progress-v2 .ui-widget.ui-widget-content {
        border-radius: 10px;
        border: none;
        margin-top: 1px;
        position: relative
    }

    .detail-content-result .audio-progress-v2 .progress-bar-v2 {
        height: 6px;
        margin-left: 27px;
        background-color: #ddd
    }

.detail-content-result .ui-slider-time {
    position: absolute;
    right: -46px;
    top: -10px;
    font-size: 14px;
    font-weight: 400;
    color: #999
}

.detail-content-result .audio-progress-v2 .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    position: absolute;
    display: inline-block;
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #3e89f8;
    height: 16px;
    width: 16px;
    top: -5px;
    outline: none;
    z-index: 10
}

.detail-content-result .audio-times-v2 {
    display: inline-block;
    vertical-align: top;
    font-size: 14px;
    position: relative
}

    .detail-content-result .audio-times-v2 select {
        border-color: #ddd;
        border-radius: 6px;
        height: 50px;
        color: #999;
        margin-left: 10px;
        outline: none;
        padding-left: 10px
    }

.detail-content-right .elapsed {
    height: 34px;
    line-height: 34px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 14px;
    display: inline-block;
    padding: 0px 16px;
    margin-bottom: 20px
}

    .detail-content-right .elapsed span {
        font-weight: 600;
        color: #3e89f8
    }

.detail-content-right .respond {
    border: 1px solid #ddd;
    padding: 20px;
    font-size: 16px;
    height: 756px;
    overflow: auto
}

.e-result .result-common-top {
    padding: 42px 0;
    margin: 0 auto;
    text-align: center
}

    .e-result .result-common-top li {
        text-align: center;
        display: inline-block
    }

    .e-result .result-common-top .text {
        padding: 34px 80px 0;
        vertical-align: top
    }

    .e-result .result-common-top .icon {
        height: 126px;
        width: 126px;
        background-color: #65a6fe;
        border-radius: 50%;
        padding-top: 12px;
        margin-right: 110px
    }

        .e-result .result-common-top .icon i {
            padding: 0;
            font-size: 46px;
            color: #fff
        }

.e-result .result-common-center input {
    vertical-align: -2px
}

.e-result .result-common-center .special-detail {
    padding: 40px 0px 30px 0px;
    border-bottom: 1px solid #eee;
    margin: 0 40px
}

.result-common-center .special-detail ul li {
    display: inline-block;
    font-size: 16px;
    color: #666;
    padding-right: 30px
}

.result-common-center .special-detail .new-word {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 0px 6px;
    vertical-align: top;
    line-height: 34px;
    height: 34px;
    cursor: pointer
}

    .result-common-center .special-detail .new-word i {
        vertical-align: -1px;
        padding: 0
    }

    .result-common-center .special-detail .new-word .icon-yiwancheng2 {
        color: #3e89f8
    }

    .result-common-center .special-detail .new-word i span {
        vertical-align: 1px
    }

.que-index {
    display: inline-block;
    text-align: center;
    width: 20px;
    margin: 0 10px;
    cursor: pointer
}

    .que-index:hover {
        border-bottom: 4px solid #3e89f8;
        line-height: 61px;
        color: #3e89f8
    }

.detail-content .detail-content-left h3 {
    height: auto;
    padding: 16px 0;
    text-indent: 22px;
    text-align: justify
}

.question-form .ans-line {
    text-align: justify;
    font-size: 16px
}

.detail-content .detail-content-right {
    left: 0;
    position: static;
    padding: 0
}

.detail-content-right p {
    width: 100%
}

.active-cur {
    color: #3e89f8;
    border-bottom: 2px solid #3e89f8
}

.read-container {
    padding-bottom: 40px
}

.lis-detail-main {
    width: 100%
}

.lis-nav-bar .lis-nav-l {
    left: 0
}

div > .directory-box {
    margin-left: 0
}

.analyse-tabs {
    text-align: left;
    margin: 0
}

    .analyse-tabs a {
        font-size: 14px;
        display: inline-block;
        width: 100%
    }

        .analyse-tabs a i {
            margin-right: 4px
        }

    .analyse-tabs li {
        position: relative;
        margin: 0;
        display: inline-block;
        font-size: 14px
    }

        .analyse-tabs li span {
            margin-right: 30px
        }

.statistics .progress {
    height: 10px;
    width: 172px;
    background-color: #eee;
    display: inline-block;
    vertical-align: top;
    margin: 5px 14px 0 18px
}

.statistics-item {
    margin-bottom: 16px
}

    .statistics-item .span {
        vertical-align: top
    }

.statistics .progress-bar-danger {
    background-color: #ff715e;
    border-radius: 10px
}

.statistics span.progress-bar-danger {
    background-color: #fff;
    color: #ff715e
}

.statistics .progress-bar-success {
    background-color: #5cb95c;
    border-radius: 10px
}

.statistics span.progress-bar-success {
    color: #5cb95c;
    background-color: #fff
}

.statistics .progress-bar {
    line-height: 10px
}

.analyse-tabs .active a {
    color: #03a7e1
}

.analyse-tabs .active span {
    display: block;
    display: none
}

.u-icon-arr {
    position: absolute;
    bottom: -14px;
    left: 50%;
    margin-left: -8px;
    width: 10px;
    height: 10px;
    border-style: solid;
    border-width: 1px 1px 0 0;
    border-color: #e5e5e5;
    -webkit-transform-origin: 75% 25%;
    -webkit-transform: rotateZ(45deg);
    -webkit-transition: 100ms ease-in .1s;
    transition: 100ms ease-in .1s;
    background: #fff;
    display: none
}

.u-icon-arrU {
    -webkit-transform: rotateZ(-45deg)
}

.analyse-item02 {
    padding-top: 10px
}

.analyse-item02-content p {
    font-size: 14px;
    color: #666666;
    line-height: 22px
}

.analyse-percent {
    margin-bottom: 20px
}

.analyse-percent-content {
    margin-top: 10px
}

    .analyse-percent-content .percent-title {
        margin-right: 20px
    }

    .analyse-percent-content .statistics {
        margin-bottom: 0px
    }

.analyse-percent-list {
    border-bottom: 1px solid #ccc;
    overflow: hidden;
    padding: 10px 0
}

.view-answer-result {
    padding-left: 24px
}

.promotion-tip-span {
    border-radius: 10px;
    background: #ff4242;
    color: #fff;
    padding: 3px 10px;
    font-size: 12px
}

.promotion-tip a:hover {
    color: #3e89f8
}

.popUpSafari {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 999;
    height: 100%;
    width: 100%;
    background: black;
    background: rgba(0,0,0,0.4);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40)
}

.popUpSafari-center {
    position: absolute;
    top: 6%;
    left: 50%;
    opacity: 1;
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    z-index: 1000;
    background: white;
    margin-left: -290px;
    width: 610px;
    padding: 40px
}

    .popUpSafari-center .s-img-top {
        width: 235px;
        height: 166px;
        border-radius: 10px;
        overflow: hidden;
        margin: 20px 0;
        display: inline-block
    }

    .popUpSafari-center .s-img-bottom {
        width: 274px;
        border-radius: 10px;
        overflow: hidden;
        margin: 20px 0;
        display: inline-block
    }

    .popUpSafari-center img {
        width: 100%
    }

.Safari-btn {
    outline: none;
    cursor: pointer;
    color: #fff;
    font-size: 14px;
    background-color: #65a6fe;
    border-radius: 6px;
    margin: 10px auto 0;
    text-align: center
}

.course-table thead tr td {
    background: #f0f1f2;
    text-align: center;
    padding: 12px 8px;
    color: #333333
}

.course-table > tbody > tr > td {
    border-top: 1px solid #f0f1f3;
    border-bottom: 1px solid #f0f1f3;
    padding: 15px 8px;
    vertical-align: middle
}

.btn-stutas {
    height: 30px;
    line-height: 28px;
    font-size: 14px;
    border-radius: 4px;
    text-align: center;
    display: inline-block;
    padding: 0 15px;
    position: relative
}

    .btn-stutas:hover {
        color: #999999
    }

    .btn-stutas:link {
        color: #999999
    }

    .btn-stutas:visited {
        color: #999999
    }

    .btn-stutas.finished {
        color: #fff;
        border: 1px solid #65a6fe
    }

    .btn-stutas.finish-disabled {
        color: #999;
        border: 1px solid #999
    }

    .btn-stutas.disregard {
        color: #434343;
        border: 1px solid #434343
    }

        .btn-stutas.disregard:hover {
            color: #fff;
            border: 1px solid #65a6fe
        }

    .btn-stutas.finish-disabled-n {
        color: #999
    }

    .btn-stutas.hmark {
        color: #65a6fe
    }

    .btn-stutas.undone-n {
        color: #f75234
    }

        .btn-stutas.undone-n:hover {
            color: #f75234
        }

    .btn-stutas.undone {
        border: 1px solid #f75234;
        color: #f75234
    }

        .btn-stutas.undone:hover {
            color: #f75234
        }

    .btn-stutas.clickable {
        border: 1px solid #65a6fe;
        color: #65a6fe
    }

        .btn-stutas.clickable:hover {
            color: #fff;
            background: #65a6fe
        }

.btn-search {
    outline: none;
    cursor: pointer;
    width: 100px;
    text-align: center;
    height: 36px;
    line-height: 36px;
    color: #fff;
    font-size: 14px;
    background-color: #65a6fe;
    display: inline-block;
    border-radius: 6px
}

    .btn-search:hover {
        color: #fff;
        background: #4f99fe
    }

    .btn-search:link {
        color: #fff
    }

    .btn-search:visited {
        color: #fff
    }

.btn-yellow {
    color: #fff;
    background: #f4ad49
}

.course-cont-list .more {
    position: absolute;
    bottom: 7px;
    right: 10px
}

.r-content-sideBar #notepad-list .smallTitle .more {
    font-weight: normal;
    font-size: 12px;
    padding-right: 5px;
    color: #999
}

.plan-myself-date-c .des-defaule-btn {
    margin: 0 10px 10px 0;
    background-color: #fff;
    color: #333;
    border: 1px solid #e6e6e6;
    position: relative
}

    .plan-myself-date-c .des-defaule-btn:hover {
        background-color: #fff;
        color: #333;
        border: 1px solid #e6e6e6
    }

.plan-myself-date-c .active {
    color: #fff;
    background-color: #65a6fe;
    border: 1px solid #65a6fe;
    box-shadow: none
}

    .plan-myself-date-c .active:hover {
        color: #fff;
        background-color: #65a6fe;
        border: 1px solid #65a6fe;
        box-shadow: none
    }

    .plan-myself-date-c .active:active {
        color: #fff;
        box-shadow: none
    }

    .plan-myself-date-c .active:visited {
        color: #fff;
        box-shadow: none
    }

.comSetModal .vocabulary-modal-dialog .modal-content {
    display: none
}

.comSetModal .vocabulary-modal-dialog .stepShow {
    display: block
}

.main.p10 {
    padding: 10px 150px
}

.bgc2b {
    background-color: #c2bfbf
}

.strong-insert {
    display: inline-block;
    width: 10px;
    height: 16px;
    margin: 0 3px;
    background: #444;
    vertical-align: middle
}

.strong-line {
    background: #c2bfbf;
    font-weight: 700
}

.strong-star {
    width: 10px;
    height: 15px;
    margin-left: 3px;
    margin-right: 3px;
    display: inline-block;
    line-height: 24px;
    font-size: 20px;
    position: relative
}

    .strong-star img {
        font-size: 24px;
        position: absolute;
        top: 0px;
        left: -10px
    }

.read-main {
    position: relative;
    width: 980px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px
}

.que-box .tab-question {
    position: relative;
    border-bottom: 1px solid #eee;
    line-height: 35px;
    font-size: 16px
}

    .que-box .tab-question .current {
        color: #333
    }

    .que-box .tab-question .prev {
        position: absolute;
        left: -20px;
        top: 16px;
        z-index: 2;
        width: 20px;
        height: 20px;
        display: none;
        cursor: pointer
    }

    .que-box .tab-question .q-slider {
        height: 70px;
        line-height: 70px;
        color: #333;
        font-size: 0
    }

        .que-box .tab-question .q-slider a {
            font-size: 18px
        }

    .que-box .tab-question .list {
        position: relative;
        overflow: hidden
    }

    .que-box .tab-question .next {
        position: absolute;
        right: -20px;
        top: 16px;
        z-index: 2;
        width: 20px;
        height: 20px;
        display: none;
        cursor: pointer
    }

    .que-box .tab-question .current {
        color: #333
    }

    .que-box .tab-question .question-sn {
        float: left;
        width: 58px;
        display: block;
        color: #4c91ff;
        text-align: center
    }

.index-hover {
    border-bottom: 4px solid #3e89f8;
    line-height: 61px;
    color: #3e89f8
}

.detail-content-right .article-tab .active-cur {
    color: #3e89f8;
    border-bottom: 2px solid #3e89f8
}

.detail-top .top-title-strong {
    color: #333333
}

.detail-top {
    height: 60px;
    background-color: #fff;
    padding: 0 20px;
    border-radius: 6px
}

    .detail-top .area-action {
        margin-right: 0px;
        width: 10%;
        text-align: right
    }

        .detail-top .area-action a {
            color: #666;
            font-size: 16px;
            position: relative;
            line-height: 60px;
            display: inline-block
        }

            .detail-top .area-action a i {
                position: absolute;
                top: 1px;
                left: -22px;
                font-size: 20px
            }

    .detail-top .top-title {
        margin-left: 0px;
        display: inline-block;
        line-height: 60px;
        font-size: 18px;
        overflow: hidden;
        color: #666;
        width: 10%
    }

    .detail-top .top-title-strong {
        display: inline-block;
        line-height: 60px;
        color: #21a899;
        font-size: 18px;
        color: #333;
        width: 80%;
        overflow: hidden;
        text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        white-space: nowrap;
        text-align: center
    }

.list-group {
    margin-top: 4px
}

.detail-content {
    position: relative;
    margin-top: 20px;
    height: 760px
}

    .detail-content hr {
        margin: 4px 0px 0px 0px !important
    }

.detail-content-left .true-answer-content {
    color: #65a6fe
}

.detail-content-left .c-l-title {
    line-height: 60px;
    height: 60px;
    padding-left: 20px;
    font-size: 18px;
    border-bottom: 1px solid #eee
}

#true-answer-box {
    display: none;
    font-size: 16px;
    margin-bottom: 20px
}

.answer-key {
    margin-top: 12px;
    vertical-align: top
}

.answer-key-text {
    width: 450px;
    display: inline-block;
    vertical-align: top
}

.answer-key video {
    vertical-align: top
}

.analysis-text {
    margin-top: 10px;
    vertical-align: top
}

    .analysis-text span {
        vertical-align: top
    }

    .analysis-text video {
        background-color: #666;
        width: 420px;
        margin-top: 5px
    }

    .analysis-text p {
        display: inline-block;
        width: 84%;
        margin: 0;
        color: #666
    }

#question-title {
    font-size: 16px;
    line-height: 30px;
    margin-top: 6px;
    position: relative
}

.read-translate {
    position: absolute;
    top: 30px;
    left: 66px;
    background-color: #fff;
    line-height: 40px;
    color: #666;
    box-shadow: 0px 0px 4px rgba(0,0,0,0.4);
    padding: 0 20px;
    overflow: hidden;
    z-index: 10;
    display: none
}

.read-translate-hover:hover .read-translate, #question-title:hover .read-translate {
    display: block;
    font-size: 14px
}

.detail-content-left {
    width: 580px;
    height: 760px;
    overflow: auto;
    border-radius: 6px;
    background-color: #fff
}

.detail-content-right {
    width: 580px;
    height: 760px;
    overflow: hidden;
    border-radius: 6px;
    background-color: #fff
}

.detail-content-left .dragAnsItem {
    border: 1px solid #dfdfdf;
    margin: 10px 0px;
    padding: 10px
}

.detail-content-left .que-box {
    width: 100%;
    overflow: hidden;
    font-size: 16px
}

.que-inner-box {
    padding: 10px 20px 0px
}

.detail-content-left .que-inner-box li {
    line-height: 32px;
    position: relative;
    padding-left: 22px;
    margin-bottom: 8px;
    display: block;
    width: 100%
}

    .detail-content-left .que-inner-box li input {
        position: absolute;
        top: 5px;
        left: 0px;
        width: 13px
    }

.read-collect {
    border-radius: 4px;
    border: 1px solid #ddd;
    display: inline-block;
    line-height: 22px;
    margin: 17px 18px 0 0
}

    .read-collect a {
        font-size: 14px;
        color: #333;
        line-height: 22px;
        text-align: right;
        display: inline-block;
        padding: 0 6px 0 4px
    }

    .read-collect .icon-shoucang2:before {
        padding-right: 3px
    }

    .read-collect .icon-shoucang1:before {
        color: #ffde5c;
        padding-right: 3px
    }

.view-answer-content .pager .previous #view-answer-btn {
    font-size: 14px;
    background-color: #65a6fe;
    color: #fff;
    border-radius: 6px;
    border: none;
    padding: 8px 18px
}

.question-form {
    margin-top: 10px
}

    .question-form .ans-line {
        float: left;
        font-size: 16px;
        cursor: pointer
    }

    .question-form .ans-option {
        font-size: 16px;
        padding-right: 10px
    }

.detail-content-right .article-tab {
    height: 58px;
    border-bottom: 1px solid #eee
}

    .detail-content-right .article-tab .tab-box {
        display: inline-block;
        margin: 0 15px;
        height: 58px;
        line-height: 58px;
        text-align: center;
        font-size: 18px;
        cursor: pointer
    }

    .detail-content-right .article-tab .tab-translate {
        font-size: 16px;
        font-weight: 400
    }

.detail-content-right .original {
    overflow: auto;
    padding: 20px 20px;
    font-size: 16px;
    line-height: 26px
}

#artic-zh {
    display: none
}

.original {
    color: #333
}

    .original .o-translate {
        cursor: pointer;
        position: relative
    }

        .original .o-translate:hover {
            color: #3e89f8
        }

    .original .o-translate-text {
        display: none;
        position: absolute;
        top: 82px;
        left: -292px;
        width: 526px;
        background-color: #fff;
        box-shadow: 0px 0px 5px rgba(0,0,0,0.2);
        padding: 8px;
        font-size: 14px;
        color: #333
    }

    .original .o-translate:hover .o-translate-text {
        display: inline-block
    }

.answers-inner {
    display: none;
    word-wrap: break-word
}

.directory-box .directory-title {
    display: inline-block;
    margin-top: 10px;
    height: 45px;
    line-height: 45px;
    color: #21a899;
    font-size: 20px
}

.discuss-box {
    position: relative;
    top: 15px;
    width: 688px;
    padding: 0px 35px 15px 35px;
    background-color: #ffffff;
    display: none
}

    .discuss-box .discuss-wrap {
        margin-top: 10px
    }

    .discuss-box .discuss-item {
        width: 618px;
        padding-bottom: 5px;
        border-bottom: 1px dashed #ccc;
        border-top: 1px dashed #ccc
    }

    .discuss-box .itemhover {
        background-color: #f7f8fc
    }

    .discuss-box .user-head-img {
        width: 60px;
        height: 60px;
        margin: 10px 10px;
        cursor: pointer
    }

    .discuss-box .user-info-box {
        width: 525px
    }

.discuss-wrap .user-responses-wrap button {
    background-color: #62a4ef;
    width: 50px;
    height: 28px;
    color: #ffffff;
    border: 0;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px
}

    .discuss-wrap .user-responses-wrap button:hover {
        background-color: #4f7cef
    }

.discuss-wrap .user-responses-wrap textarea {
    width: 525px;
    height: 120px
}

.discuss-review {
    margin-top: 10px
}

    .discuss-review textarea {
        width: 618px;
        height: 165px
    }

.discuss-box .discuss-review button {
    background-color: #62a4ef;
    width: 106px;
    height: 33px;
    color: #ffffff;
    border: 0;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px
}

    .discuss-box .discuss-review button:hover {
        background-color: #4f7cef
    }

.topic-inner {
    margin: 15px 0px
}

    .topic-inner hr {
        margin: 3px
    }

.topic-bar {
    margin: 10px 0px;
    width: 25%\9;
    padding: 0px 1% \9;
    float: left\9
}

.topic-content {
    border: 1px solid #ccc
}

    .topic-content img {
        width: 100%
    }

    .topic-content .info {
        padding: 20px
    }

        .topic-content .info .info-title {
            height: 42px;
            overflow: hidden;
            text-overflow: ellipsis;
            -o-text-overflow: ellipsis
        }

.question-form li {
    padding-left: 50px !important;
    margin-bottom: 10px;
    line-height: 32px;
    position: relative;
    margin-bottom: 8px
}

    .question-form li.read-translate-hover {
        padding-left: 32px !important
    }

.question-form li {
    display: inline-block;
    width: 100%
}

    .question-form li.read-translate-exam {
        padding-left: 30px !important;
        color: #333;
        line-height: 40px
    }

.new-main .question-form li.read-translate-exam {
    line-height: 26px
}

.question-form li.read-translate-exam input {
    margin-top: 12px !important;
    margin-right: 8px
}

.anwer-k {
    width: 100%;
    resize: none;
    line-height: 24px;
    padding: 22px 10px 10px 65px;
    font-size: 16px;
    min-height: 90px;
    border: none
}

.left-y {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 10px;
    height: 10px;
    border-radius: 100%;
    background-color: #333
}

.anwer-k1 {
    width: 100%;
    min-height: 90px;
    resize: none;
    border: 1px #D1D1D1 double;
    line-height: 32px;
    padding: 10px 4% 10px 4%;
    margin-bottom: 4px;
    margin-left: 8%;
    font-size: 16px
}

.anwer-f {
    resize: none;
    border: 1px #D1D1D1 double;
    width: 96%;
    min-height: 80px
}

.new-main .anwer-r {
    height: 100px;
    padding: 0;
    cursor: move;
    display: inline-block;
    width: 49%;
    position: relative;
    margin-bottom: 20px
}

.main .anwer-r {
    min-height: 60px;
    padding: 0;
    cursor: move;
    display: inline-block;
    width: 49%;
    position: relative;
    margin-bottom: 20px
}

.anwer-r p {
    position: absolute;
    -moz-user-select: none;
    -webkit-user-select: none;
    margin: 0px;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    line-height: 24px;
    font-size: 16px;
    color: #333;
    padding: 0 20px
}

.anwer-l {
    min-height: 60px;
    width: 100%;
    border: 1px #CCCCCC double;
    padding: 10px 4% 10px 4%;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    background-color: #Fff
}

    .anwer-l p {
        min-height: 50px
    }

.anwer-k1 {
    width: 100%;
    resize: none;
    border: 1px #D1D1D1 double;
    min-height: 60px;
    margin-bottom: 10px
}

.r6_3_ans {
    width: 100%;
    min-height: 80px;
    border: 1px dashed #ccc;
    border-radius: 4px;
    padding: 4px;
    margin-top: 10px
}

.r7_5_ans {
    width: 100%;
    min-height: 50px;
    border: 1px dashed #ccc;
    border-radius: 4px;
    padding: 4px;
    margin-top: 10px
}

.border-xia2 {
    border-bottom: 1px #CCCCCC dashed
}

.text-end {
    border: 1px #CCCCCC double;
    margin-bottom: 30px;
    text-align: center
}

.text-end {
    font-size: 18px
}

.mokao-e a {
    display: block;
    width: 29px;
    line-height: 29px;
    border: 1px #d0d0d0 double;
    text-align: center;
    transition: 0.5s;
    color: #666
}

.back {
    padding: 4px 10px 4px 10px !important;
    background-color: #FFF !important;
    margin-top: 8px !important;
    display: none;
    border-radius: 30px
}

.back2 {
    padding: 4px 12px 4px 12px !important;
    background-color: #FFF !important;
    margin-top: 16px;
    margin-right: 10px
}

.mokao-e a:hover {
    background-color: #E0E0E0;
    color: #fff;
    border: none
}

.a-ture.border-green {
    background-color: #3e89f8;
    color: #FFF !important;
    border: 0px
}

.a-ture.border-red {
    background-color: #ff4242;
    color: #FFF !important;
    border: 0px
}

.mokao-p {
    font-size: 16px;
    line-height: 28px;
    color: #333;
    padding-bottom: 40px
}

.word-break {
    word-break: break-all;
    word-wrap: break-word;
    white-space: pre-wrap
}

.border-red {
    border: 1px #ff4242 solid !important
}

.border-green {
    border: 1px #3e89f8 solid !important
}

.y-exercise-top {
    height: 347px;
    margin-top: 21px;
    margin-bottom: 16px;
    border-radius: 6px
}

.y-exercise-bottom {
    height: 495px
}

.big-title {
    height: 54px;
    width: 1180px;
    border-bottom: 1px solid #eee
}

.show-tips {
    width: 4px;
    height: 18px;
    background-color: #3e89f8;
    margin: 20px 5px 0 20px;
    display: inline-block
}

.show-title {
    font-size: 18px;
    color: #333;
    font-weight: bold
}

.show-total {
    font-size: 16px;
    line-height: 16px;
    color: #666
}

.y-exercise-type, .exercise-times, .exercise-degrees {
    display: flex;
    justify-content: space-around;
    align-items: center
}

.bottom-left {
    padding-top: 76px
}

.exercise-times {
    margin-bottom: 47px
}

    .exercise-times .lis, .exercise-degrees .lis {
        float: left;
        font-size: 14px;
        height: 36px;
        line-height: 36px;
        margin-right: 9px;
        color: #65a6fe;
        border-radius: 6px;
        border: 1px solid #65a6fe;
        text-align: center
    }

    .exercise-times .lis {
        width: 90px
    }

.exercise-degrees .lis {
    width: 142px
}

.exercise-degrees .show-explain {
    position: relative
}

    .exercise-degrees .show-explain .hover-item {
        font-size: 14px;
        color: #999;
        width: 187px;
        height: 36px;
        border: 1px solid #ddd;
        box-shadow: 0px 1px 8px 0px rgba(6,6,6,0.15);
        border-radius: 6px;
        line-height: 36px;
        text-align: center;
        position: absolute;
        left: -8px;
        top: -36px
    }

.y-exercise-type li:hover, .start-exercise:hover {
    cursor: pointer;
    background-color: #65a6fe;
    color: #fff !important
}

.exercise-times p, .exercise-degrees p {
    font-size: 18px;
    width: 150px;
    color: #333
}

.hover-item {
    display: none
}

.show-explain:hover .hover-item {
    display: inline-block
}

.lis.active {
    background-color: #65a6fe;
    color: #fff;
    border-radius: 6px
}

.square1 {
    width: 0;
    height: 0;
    margin: -2px auto;
    border: 6px solid transparent;
    border-top: 6px solid #fff
}

.bottom-right {
    position: relative;
    margin-top: 100px;
    padding-right: 50px
}

    .bottom-right .shuqian {
        width: 64px;
        height: 79px;
        position: absolute;
        left: 75px;
        top: -65px
    }

    .bottom-right .start-exercise {
        width: 211px;
        height: 75px;
        line-height: 75px;
        background-color: #65a6fe;
        border-radius: 6px;
        border: solid 2px #65a6fe;
        font-size: 26px;
        color: #fff;
        font-weight: bold;
        text-align: center
    }

.y-echart-type {
    display: flex
}

    .y-echart-type .vocabulary-chart {
        margin-top: 45px;
        padding: 0 113px 0 123px
    }

.shuoming1, .shuoming2 {
    margin-left: 75px;
    font-size: 16px;
    color: #333
}

.shuoming2 {
    margin-left: 97px
}

.input {
    outline: none;
    box-shadow: none;
    border: none
}

textarea {
    outline: none;
    box-shadow: none
}

@media only screen and (min-device-width: 1200px){
    .exam-container {
        position: absolute;
        top: 0;
        left: 0;
        transform: translate(0,0);
        width: 100%;
        height: 100%;
        box-sizing: border-box !important;
        background-color: #f5f5f5;
        overflow: hidden;
        min-width: 1200px
    }

}


@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
    /* 在此处添加可用于iPad的CSS样式 */
    .exam-container {
        position: absolute;
        top: 0;
        left: 0;
        transform: translate(0,0);
        width: 100%;
        height: 100%;
        box-sizing: border-box !important;
        background-color: #f5f5f5;
    }
}

body {
    overflow-x: auto !important
}

.header {
    background: -moz-linear-gradient(left,#000 0%,#fff 100%);
    background: -webkit-gradient(linear,left right,left right,color-stop(0%,#000),color-stop(100%,#fff));
    background: -webkit-linear-gradient(left,#000 0%,#fff 100%);
    background: -o-linear-gradient(left,#000 0%,#fff 100%);
    background: -ms-linear-gradient(left,#000 0%,#fff 100%);
    background: linear-gradient(to right,#3e4f7b 0%,#723646 100%);
    background-color: #21a899\0;
    background-color: #21a899;
    height: 90px;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0;
    right: 0
}

.header-title-left {
    line-height: 90px
}

.header-center-text {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: 16px;
    color: #fff;
    line-height: 90px
}

.header-doing-right ul {
    padding-top: 12px
}

    .header-doing-right ul li {
        display: inline-block;
        margin: 0 10px;
        vertical-align: top;
        line-height: 36px
    }

        .header-doing-right ul li .btn {
            padding: 0 14px;
            margin: 0px;
            line-height: 32px;
            background-color: #fff;
            color: #333;
            font-size: 14px;
            border-radius: 6px;
            min-width: 80px;
            border: none
        }

        .header-doing-right ul li .s-btn {
            font-size: 12px
        }

        .header-doing-right ul li .wrong-btn {
            color: #fff;
            background-color: #f75234
        }

.header-doing-right .hideTime {
    font-size: 14px;
    color: #333;
    background-color: #fff;
    border-radius: 3px;
    line-height: 20px;
    padding: 0 8px;
    margin: 12px 18px 0 0;
    cursor: pointer
}

.header-doing-right ul li a .h-arrow {
    font-size: 12px;
    color: #333;
    padding: 0px
}

.header-doing-right ul li a .icon-yuedu1 {
    font-size: 22px;
    padding: 10px 0px 0px;
    line-height: 22px;
    vertical-align: -2px
}

.header-doing-right ul li a .icon-wenhao {
    padding: 0px
}

.header .timing {
    margin: 10px 10px 0 0;
    min-width: 47px
}

.main .read-left, .main .read-right {
    width: 49.7%;
    height: 100%;
    overflow: hidden;
    border: 1px solid #ddd
}

.main {
    position: absolute;
    top: 90px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    background: #fff
}

    .main .table-box {
        margin: 0 148px 50px
    }

.table-box .view-thead tr {
    background-color: #e7d4b5;
    display: table-row;
    vertical-align: inherit;
    border-color: inherit;
    text-align: center;
    font-weight: bold
}

.table-box tr .number {
    width: 12.5%;
    text-align: center
}

.view-thead tr .description {
    width: 70%
}

.view-table tr {
    cursor: pointer
}


@media only screen and (min-device-width: 1200px) {
    .view-table {
        width: 960px;
        margin: 0 auto;
        font-size: 16px;
        border-radius: 10px
    }
}


@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
    .view-table {      
        margin: 0 auto;
        font-size: 16px;
        border-radius: 10px
    }
}


    .view-table .view-tbody tr:hover {
        background-color: #c0d1da
    }

    .view-table .view-tbody tr.active {
        background-color: #c0d1da
    }

    .view-table td {
        padding: 5px 24px;
        border: 1px solid #000;
        color: #333;
        font-size: 16px
    }

.main .three-choice {
    text-align: center
}

.three-choice .top-text {
    font-size: 18px;
    color: #434343;
    line-height: 22px;
    text-align: left
}

.main .three-choice .top-text {
    font-size: 16px;
    color: #666;
    padding: 30px 130px 30px 50px;
    text-align: left
}

.prompt {
    font-size: 16px;
    background-color: #dedede;
    color: #434343;
    padding: 0 30px;
    line-height: 26px;
    display: inline-block;
    width: 100%
}

.main .three-choice .prompt {
    font-size: 18px;
    background-color: #eee;
    color: #333;
    padding: 0 30px;
    line-height: 50px;
    display: inline-block
}

.three-choice .center-anwer {
    width: 600px;
    margin: 40px auto 0;
    box-sizing: border-box;
    border: 1px solid #666
}

.main .three-choice .center-anwer {
    width: 600px;
    margin: 46px auto;
    padding: 40px 20px 20px 20px;
    box-sizing: border-box;
    border: 1px solid #666
}

.answer-choice {
    position: relative;
    padding: 0 20px;
    margin-bottom: 30px
}

.main .answer-choice {
    position: relative;
    padding: 0 160px;
    margin-bottom: 60px
}

.left-circle {
    position: absolute;
    top: 30px;
    left: 30px;
    width: 12px;
    height: 12px;
    background-color: #333;
    border-radius: 100%
}

.main .question-form li input {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 15px
}

.question-form li label {
    position: absolute;
    top: 5px;
    left: 0px
}

.border-left {
    border-left: 1px #ccc double
}

.choose {
    padding: 30px 30px 90px 34px;
    position: relative;
    overflow-y: auto;
    height: 100%
}

.choose-five {
    position: relative;
    overflow-y: auto
}

.choose .title {
    padding-right: 80px
}

.read-collect-exam {
    position: absolute;
    top: 30px;
    right: 24px;
    border-radius: 4px;
    border: 1px solid #ddd;
    display: inline-block;
    line-height: 22px
}

    .read-collect-exam a {
        font-size: 14px;
        color: #333;
        line-height: 20px;
        text-align: right;
        display: inline-block;
        padding: 0 6px 0 4px
    }

        .read-collect-exam a:hover {
            color: #333
        }

    .read-collect-exam .icon-shoucang-mian:before {
        color: #ffde5c;
        padding-right: 3px
    }

.text {
    color: #333;
    box-shadow: none;
    padding: 30px;
    overflow-y: auto;
    height: 100%
}

.anwer-five-r {
    width: 50%;
    cursor: move;
    position: relative;
    font-size: 16px;
    margin-bottom: 20px
}

.main .anwer-five-r {
    width: 100%;
    cursor: move;
    display: inline-block;
    position: relative;
    padding: 40px 20px;
    font-size: 16px;
    margin: 0
}

.main .read-five-choice {
    width: 49.7%;
    height: 100%;
    border: 1px solid #ddd
}

.anwer-f-t {
    resize: none;
    width: 100%;
    border: none;
    min-height: 80px;
    padding: 25px 10px 10px 70px;
    font-size: 16px;
    display: block
}

.main .anwer-f-t {
    resize: none;
    border: 1px #d1d1d1 double;
    width: 97.3%;
    min-height: 80px;
    margin: 0 10px 10px;
    padding: 10px;
    font-size: 16px
}

.anwer-f-t-dot {
    width: 14px;
    height: 14px;
    border-radius: 2000px;
    background: #333;
    left: 30px;
    top: 30px
}

.mokao-drags-item {
    border: 1px solid #CCCCCC;
    min-height: 80px;
    padding: 10px 10px;
    margin: 0px 10px 10px 0px
}

.color-2 {
    color: #3e89f8 !important
}

.color-3 {
    color: #fe6817
}

.color-4 {
    color: #666666
}

.ready-text p {
    text-align: left
}

.title-Directions {
    padding: 30px 0 12px;
    line-height: 30px
}

.click-tips {
    background-color: #ddd;
    color: #666;
    display: inline-block;
    padding: 0 24px;
    margin-top: 50px
}

.click-show-message {
    display: block;
    width: 100%;
    height: 34px;
    border: 1px dashed #d2e3ff;
    background: #fdfdfd;
    line-height: 34px;
    text-align: center;
    color: #2072e9;
    position: relative
}

.commentV2 {
    margin: 20px auto 0px
}

    .commentV2 .comment-center-container {
        margin: 0px;
        padding: 0px
    }

    .commentV2 .comment-center-left {
        background-color: #fff;
        padding: 0px 0px;
        font-size: 16px;
        border: none;
        width: 780px;
        margin-bottom: 50px;
        float: left;
        text-align: left;
        border-radius: 6px
    }

    .commentV2 .nav-tabs {
        border-bottom: 1px solid #eee
    }

    .commentV2 .comment-center-left .nav-tabs > li.active > a, .commentV2 .comment-center-left .nav-tabs > li.active > a:focus, .commentV2 .comment-center-left .nav-tabs > li.active > a:hover {
        background: none;
        color: #3e89f8;
        font-size: 18px;
        border-bottom: 2px solid #3e89f8;
        font-weight: 400;
        border: none
    }

    .commentV2 .comment-center-left .nav-tabs > li > a, .commentV2 .comment-center-left .nav-tabs > li > a:focus, .commentV2 .comment-center-left .nav-tabs > li > a:hover {
        font-size: 18px;
        color: #333;
        margin-left: 20px;
        padding: 20px 0;
        font-weight: 400;
        border-color: #fff;
        background-color: #fff
    }

    .commentV2 .comment-center-left .nav li {
        margin-bottom: 0px
    }

    .commentV2 .tab-pane {
        padding: 0 20px 20px 20px
    }

    .commentV2 .comment-center-left .tab-pane textarea {
        width: 100%;
        height: 110px;
        resize: none;
        border-color: #ddd;
        outline: none;
        padding: 10px;
        margin-top: 20px;
        color: #333;
        border-radius: 0px;
        box-shadow: none
    }

        .commentV2 .comment-center-left .tab-pane textarea:focus, .commentV2 .comment-center-left .tab-pane textarea:active {
            box-shadow: none;
            outline: none
        }

    .commentV2 .comment-center-left .form-group {
        color: #999;
        font-size: 14px;
        margin: 4px 0 26px 0
    }

    .commentV2 .comment-center-left .btn-primary, .commentV2 .comment-center-left .btn {
        background: #65a6fe;
        border: none;
        color: #fff;
        padding: 8px 22px
    }

        .commentV2 .comment-center-left .btn-primary:focus, .commentV2 .comment-center-left .btn:focus {
            outline: none;
            background-color: #65a6fe;
            box-shadow: none
        }

    .commentV2 .comment-center-left .media-list {
        margin: -1px 0 0 0
    }

        .commentV2 .comment-center-left .media-list .media {
            border-top: 1px solid #eee;
            padding: 22px 0px 0px;
            color: #666;
            display: inline-block;
            margin: 0 0 -5px 0
        }

.comment-center-right {
    background-color: #fff;
    border-radius: 6px
}

label {
    font-weight: 400;
    color: #333
}

.commentV2 .comment-center-left .media-list .media img, .commentV2.comment-center-right .media-list .media img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    vertical-align: top;
    margin: 0px
}

.commentV2 .media-left, .media > .pull-left {
    padding-right: 20px
}

.commentV2 .comment-center-left .media-heading .media-author, .commentV2 .comment-center-right .media-heading .media-author {
    margin-right: 12px;
    font-size: 16px;
    color: #3e89f8
}

.commentV2 .wx-media-time {
    font-size: 14px;
    color: #999;
    line-height: 24px
}

.commentV2 .comment-center-left .media-content {
    font-size: 14px;
    word-break: break-all;
    padding-bottom: 10px;
    color: #333
}

.commentV2 .comment-center-left .media-content-question {
    color: #f75234;
    display: inline-block;
    padding-right: 4px
}

.commentV2 .comment-center-left .media-action {
    display: inline-block;
    position: relative;
    width: 150px;
    padding-bottom: 6px
}

    .commentV2 .comment-center-left .media-action .media-action-sec {
        width: 660px
    }

.commentV2 .comment-center-left .media-action-sec .form-group {
    margin-bottom: 4px
}

    .commentV2 .comment-center-left .media-action-sec .form-group textarea {
        height: 80px;
        margin-top: 0px;
        border-radius: 0px
    }

.media-action .media-action-sec .form-group textarea {
    width: 100%
}

.commentV2 .icon-thumbs-o-up:before {
    color: #999;
    content: "\e64d";
    position: absolute;
    top: -7px;
    left: 11px
}

.commentV2 .icon-thumbs-up:before {
    content: "\e650";
    position: absolute;
    top: -7px;
    left: 11px
}

.commentV2 .comment-center-left .media-action em {
    color: #999
}

.commentV2 .icon-reply-em {
    display: inline-block;
    position: absolute;
    top: -3px;
    left: 34px;
    font-size: 14px
}

.commentV2 .icon-reply-span {
    color: #999;
    font-size: 14px;
    display: inline-block;
    position: absolute;
    top: -3px;
    right: 0px
}

.commentV2 .comment-center-left .media-action .iconfont {
    font-size: 18px;
    display: inline-block;
    color: #999
}

.commentV2 .pagination {
    text-align: center;
    margin: 0 auto;
    padding: 30px 0
}

.commentV2 .comment-center-left .media-list .media .media {
    margin: 0 0 -5px 0px
}

.commentV2 .comment-center-right {
    padding: 0;
    font-size: 16px;
    margin: 0;
    width: 380px;
    float: right;
    border: none
}

.commentV2 .help-block {
    display: none
}

.commentV2 .comment-right-nav {
    font-size: 18px;
    text-align: left;
    padding: 21px 0 21px 21px;
    border-bottom: 1px solid #eee
}

.commentV2 .culture-carouse {
    height: 587px;
    overflow: hidden;
    position: relative
}

    .commentV2 .culture-carouse .carouse-con .culture-list {
        -webkit-transition: opacity 1s ease-in-out;
        -moz-transition: opacity 1s ease-in-out;
        -o-transition: opacity 1s ease-in-out;
        transition: opacity 1s ease-in-out
    }

.pos-reply {
    position: absolute;
    top: -4px;
    right: 30px
}

.culture-list {
    height: 84px;
    position: relative
}

.commentV2 .comment-center-right .media-list {
    padding: 0 20px;
    overflow: hidden;
    margin-top: -1px;
    position: relative
}

    .commentV2 .comment-center-right .media-list .media {
        border-top: 1px solid #eee;
        padding: 18px 0px 0px;
        color: #333;
        display: inline-block;
        margin: 0 0 -5px 0;
        text-align: left
    }

        .commentV2 .comment-center-right .media-list .media img {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            vertical-align: top;
            margin-right: 0px
        }

.commentV2 .comment-center-right .media-left, .media > .pull-left {
    padding-right: 10px
}

.commentV2 .comment-center-right .media-content {
    word-break: break-all;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
    font-size: 14px
}

.commentV2 .comment-center-right .media-answer a {
    font-size: 14px;
    color: #999
}

    .commentV2 .comment-center-right .media-answer a i {
        font-size: 14px;
        color: #949494
    }

.lis_cInput .radio-inline {
    margin-left: 0px !important
}

.lis_form input {
    margin-left: 0px !important
}

.lis_choice .alert {
    padding: 12px !important;
    margin-bottom: 12px !important
}

.lis_choice_app p {
    margin-bottom: 6px !important;
    line-height: 20px !important
}

.lis_span_in {
    width: 100%;
    min-height: 50px;
    border: 1px dashed #ccc;
    border-radius: 4px;
    padding: 12px;
    margin-top: 10px
}

.listening-content .audio-control-v2 {
    padding: 32px 18px 0
}

.audio-progress-v2 {
    height: 76px;
    border-radius: 6px;
    border: 1px solid #ddd;
    padding: 30px 20px 0
}

    .audio-progress-v2 .round {
        border-radius: 50%;
        background-color: #fff;
        border: 1px solid #3e89f8;
        height: 28px;
        width: 28px;
        left: 60px;
        top: 23px;
        z-index: 999
    }

    .audio-progress-v2 .glyphicon {
        font-size: 32px;
        color: #65a6fe;
        top: -10px
    }

    .audio-progress-v2 .progress-bar-v2 {
        height: 16px;
        margin-left: 60px;
        background-color: #ddd;
        border-radius: 2000px
    }

    .audio-progress-v2 .ui-widget.ui-widget-content {
        border-radius: 10px;
        border: none;
        position: relative
    }

.listening-content .audio-progress-v2 .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #3e89f8;
    height: 28px;
    width: 28px;
    top: -7px;
    outline: none;
    z-index: 10
}

.drop-down-answer .analyse-percent {
    padding: 36px 0 0 24px
}

.w-progress-v2 {
    width: 940px;
    display: inline-block;
    vertical-align: top
}

.audio-control-v2 .detail-listen {
    height: 76px;
    line-height: 76px;
    border-radius: 6px;
    border: 1px solid #ddd;
    color: #666;
    font-size: 24px;
    width: 180px;
    display: inline-block;
    text-align: center;
    margin-right: 4px
}

.drop-down-check {
    text-align: center;
    height: 75px;
    line-height: 75px;
    font-size: 14px;
    color: #666;
    cursor: pointer
}

.drop-answer {
    text-align: center;
    height: 75px;
    line-height: 75px;
    font-size: 14px;
    color: #666;
    cursor: pointer
}

    .drop-down-check i, .drop-answer i {
        vertical-align: middle;
        margin-left: 2px
    }

.control-h {
    height: 108px
}

.answers-title {
    display: inline-block;
    line-height: 85px;
    color: #21a899;
    font-size: 20px
}

.directory-box {
    padding-left: 20px;
    border-bottom: 1px solid #eee;
    height: 56px;
    line-height: 56px;
    font-size: 18px
}

    .directory-box .directory-title {
        display: inline-block;
        margin-top: 10px;
        padding-left: 5px;
        height: 45px;
        line-height: 45px;
        color: #21a899;
        font-size: 20px
    }

.question-content .q-c-title {
    cursor: pointer;
    display: block;
    margin: 20px;
    position: relative
}

.listeningUrl-play {
    display: inline-block
}

    .listeningUrl-play span {
        color: #666;
        cursor: pointer;
        display: inline-block;
        position: relative;
        top: 5px;
        font-size: 20px;
        display: inline-block
    }

        .listeningUrl-play span:hover {
            color: #3e89f8
        }

.lis-nav-r .index-hover {
    line-height: 54px
}

.que-index-dashed {
    display: inline-block;
    width: 20px;
    height: 54px;
    line-height: 54px;
    cursor: pointer;
    color: #333;
    text-align: center;
    margin-right: 14px
}

.que-index-dashed1 {
    display: inline-block;
    color: #333;
    font-weight: bold
}

.lisDet_rad {
    width: 14px !important;
    height: 15px !important;
    margin-left: -24px !important;
    vertical-align: top
}

.listenDetails input[type=checkbox], .listenDetails input[type=radio] {
    margin-right: 6px
}

.translateV2 {
    position: relative
}

    .translateV2 .translate-text {
        position: absolute;
        top: 28px;
        left: 36px;
        font-size: 14px;
        padding: 2px 10px;
        border-radius: 4px;
        color: #333;
        line-height: 14px
    }

    .translateV2 .translate-icon {
        height: 10px;
        width: 10px;
        border: 1px solid #03a7e1;
        color: #03a7e1;
        font-size: 14px;
        padding: 2px 6px;
        border-radius: 6px;
        margin-left: 4px;
        cursor: pointer
    }

        .translateV2 .translate-icon:hover, .translateV2 .translate-active {
            background-color: #03a7e1;
            color: #fff
        }

.listenDetails .radio-inline {
    font-size: 16px;
    color: #666;
    padding-left: 24px;
    cursor: pointer;
    display: block
}

.listen-translate {
    position: absolute;
    top: 30px;
    left: 66px;
    background-color: #fff;
    line-height: 40px;
    color: #666;
    box-shadow: 0px 0px 4px rgba(0,0,0,0.4);
    padding: 0 20px;
    overflow: hidden;
    z-index: 10;
    display: none
}

.listenDetails .radio-inline:hover {
    color: #3e89f8
}

    .listenDetails .radio-inline:hover .listen-translate {
        display: block
    }

.q-c-title:hover .listen-translate {
    display: block
}

.listen-collect {
    border-radius: 4px;
    border: 1px solid #ddd;
    display: inline-block;
    margin: 17px 18px 0 0;
    color: #333;
    font-size: 14px;
    position: absolute;
    top: 65px;
    right: 0px;
    line-height: 22px;
    text-align: right;
    padding: 0 6px 0 4px
}

    .listen-collect .icon-shoucang-mian:before {
        color: #ffde5c;
        padding-right: 3px
    }

    .listen-collect .icon-shoucang2:before {
        padding-right: 3px
    }

    .listen-collect a:hover, .listen-collect a:active, .listen-collect a:focus {
        color: #333
    }

.drop-down-answer .view-answer-content {
    width: 590px;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    margin-left: 24px
}

.answer-key {
    margin-top: 12px;
    vertical-align: top
}

.answer-key-text {
    display: inline-block;
    vertical-align: top;
    max-height: 154px;
    overflow-y: auto
}

.answer-mask-v2 {
    position: relative;
    top: -94px;
    height: 182px;
    overflow: hidden
}

.mask-tip-v2 {
    position: relative;
    top: 28% !important;
    left: 36% !important
}

.drop-originalText {
    height: 400px;
    overflow-y: auto;
    padding: 20px 24px 0;
    font-size: 16px;
    color: #666
}

.answer-key video {
    vertical-align: top
}

.true-answer-content {
    color: #65a6fe
}

.answers-view {
    font-size: 14px;
    background-color: #65a6fe;
    color: #fff;
    border-radius: 6px;
    border: none;
    padding: 8px 18px;
    display: inline-block;
    margin-bottom: 20px;
    cursor: pointer
}

.drop-down-answer .analyse-item {
    display: inline-block;
    border-left: 1px solid #eee
}

#wi-slider-play .ui-slider-range {
    background: #65a6fe;
    border-radius: 10px
}

#Volume-bar .ui-slider-range {
    background: #4d505a
}

#Volume-bar-pc .ui-slider-range {
    background: #4d505a
}

#Volume-bar-phone .ui-slider-range {
    background: #4d505a
}

.fiexd-top-list {
    position: fixed !important;
    top: 72px;
    width: 200px;
    z-index: 9
}

.media-control-play {
    height: 50px;
    border-radius: 6px;
    border: 1px solid #ddd;
    padding: 22px 66px 0 22px;
    width: 418px;
    margin-bottom: 14px;
    display: inline-block
}

.media-control-bar {
    margin: 10px 0;
    padding: 0px 10px
}

.time-contain {
    margin-top: -5px !important;
    padding: 0
}

.begin-time {
    margin-right: 20px;
    color: #ffffff
}

.js-paragraph-sn {
    font-size: 16px;
    padding-bottom: 12px;
    line-height: 24px;
    width: 911px;
    height: 24px;
    position: relative;
    text-align: center;
    color: #CECBCB
}

.lrc-sentence-current {
    color: #4c91ff
}

.original-en {
    padding-bottom: 2px;
    font-size: 18px;
    display: block;
    word-spacing: .05em;
    letter-spacing: .02em
}

.original-cn {
    color: #999;
    font-size: 14px
}

.w-listen-write {
    padding: 20px 30px;
    background: #ffffff
}

    .w-listen-write .word {
        position: relative;
        margin: 0 14px 40px;
        display: inline-block;
        height: 30px;
        border-bottom: 1px solid #c2b7b7;
        vertical-align: middle
    }

    .w-listen-write .in-word {
        border: 0 none;
        text-align: center;
        ime-mode: disabled;
        background: none !important
    }

    .w-listen-write .word .word-tags {
        position: absolute;
        top: 36px;
        left: 0;
        width: 100%;
        height: 24px;
        border: 1px dashed #d1d1d1;
        cursor: pointer
    }

        .w-listen-write .word .word-tags b {
            position: absolute;
            width: 100%;
            height: 24px;
            line-height: 24px;
            text-align: center;
            color: #999
        }

.s98_ul li {
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px dashed #ccc
}

.s98_ul {
    padding-right: 40px;
    padding-bottom: 40px
}

.s98_s {
    background-color: #4c91ff;
    color: #fff;
    border-radius: 10px;
    width: 16px;
    height: 16px;
    text-align: center;
    line-height: 16px;
    display: block;
    float: left;
    margin-top: 2px;
    margin-right: 4px
}

.loadint {
    background: -moz-linear-gradient(left,#000 0%,#fff 100%);
    background: -webkit-gradient(linear,left right,left right,color-stop(0%,#000),color-stop(100%,#fff));
    background: -webkit-linear-gradient(left,#000 0%,#fff 100%);
    background: -o-linear-gradient(left,#000 0%,#fff 100%);
    background: -ms-linear-gradient(left,#000 0%,#fff 100%);
    background: linear-gradient(to bottom,#7baaf7 0%,#6b98e1 100%);
    background-color: #7baaf7\0;
    background-color: #7baaf7;
    height: 34px;
    border-radius: 20px
}

.loadout {
    background: #eff0ec;
    -moz-box-shadow: inset 0 2px 6px rgba(0,0,0,0.3);
    -webkit-box-shadow: inset 0 2px 6px rgba(0,0,0,0.3);
    box-shadow: inset 0 2px 6px rgba(0,0,0,0.24);
    height: 34px;
    border-radius: 20px;
    overflow: hidden;
    border-bottom: 1px solid #fff
}

.list-que-clk {
    background: #ececec !important
}

.f_tit {
    font-family: "微软雅黑";
    color: #fff;
    font-size: 16px
}

.exercise-result .bs-example table {
    display: inline-block;
    width: 360px;
    float: left;
    margin-top: -12px
}

    .exercise-result .bs-example table tr {
        display: inline-block;
        width: 36px;
        height: 36px;
        margin: 17px 12px 0 0;
        overflow: hidden;
        border-radius: 4px;
        border: 1px solid #ddd;
        text-align: center;
        line-height: 34px;
        font-size: 18px;
        color: #333
    }

        .exercise-result .bs-example table tr td {
            display: block;
            cursor: pointer
        }

    .exercise-result .bs-example table .list-que-clk.border-green {
        background-color: #3e89f8 !important;
        color: #FFF !important;
        border: 0px
    }

    .exercise-result .bs-example table .list-que-clk.border-red {
        background-color: #ff4242 !important;
        color: #FFF !important;
        border: 0px
    }

.border-red {
    border: 1px #ff4242 solid !important
}

.border-green {
    border: 1px #3e89f8 solid !important
}

.listen-v2 .detail-content-left .que-inner-result.active {
    display: block
}

.listen-v2 .detail-content-left .que-inner-result {
    display: none
}

.speed {
    overflow: hidden;
    text-align: center;
    width: 80px;
    background: #fff;
    cursor: pointer;
    border: 1px solid #ddd;
    border-radius: 6px;
    height: 50px;
    line-height: 50px;
    color: #999;
    margin-left: 10px
}

.perfect-lis {
    overflow: hidden;
    text-align: center;
    width: 80px;
    background: #fff;
    cursor: pointer;
    border: 1px solid #ddd;
    border-radius: 6px;
    height: 50px;
    line-height: 50px;
    color: #999;
    margin-left: 10px;
    vertical-align: top
}

.speed2 {
    border: 1px solid #ddd;
    position: absolute;
    top: 44px;
    right: 0px;
    height: 104px;
    overflow: hidden;
    border-radius: 6px;
    text-align: center;
    width: 80px;
    background: #fff;
    cursor: pointer;
    line-height: 24px;
    padding-top: 4px
}

.audio-times-v2 a {
    display: inline-block;
    color: #999
}

.mask-tip-2 {
    position: absolute;
    z-index: 11;
    left: 10%;
    width: 360px;
    padding: 0;
    opacity: 1;
    font-size: 16px;
    top: 0%
}

.l-progress {
    width: 500px;
    margin: 0 auto;
    overflow: hidden
}

.l-img-center {
    width: 500px;
    height: 300px;
    margin: 110px auto 40px;
    position: relative
}

    .l-img-center img {
        width: 100%;
        height: 100%
    }

.listen-title {
    width: 800px;
    margin: 200px auto 0;
    font-size: 16px;
    font-weight: 600;
    padding-right: 80px
}

.question-lists {
    margin-top: 14px
}

.listen-question {
    width: 800px;
    margin: 0 auto;
    font-size: 16px
}

    .listen-question .question-lists li {
        line-height: 40px
    }

    .listen-question input {
        vertical-align: top;
        margin-top: 12px;
        cursor: pointer
    }

        .listen-question input[type=checkbox] {
            margin-right: 8px
        }

.listen-main .collect {
    border-radius: 4px;
    border: 1px solid #ddd;
    display: inline-block;
    color: #333;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    text-align: right;
    padding: 0 6px;
    position: absolute;
    right: 0px;
    top: 0px
}

    .listen-main .collect a {
        font-size: 14px;
        color: #333
    }

.listen-main .icon-shoucang-mian:before {
    color: #ffde5c;
    padding-right: 3px
}

.listen-main .icon-shoucang2:before {
    padding-right: 3px
}

.question-sequence {
    width: 1000px;
    margin: 120px auto 0;
    font-size: 16px
}

    .question-sequence .mh60 {
        min-height: 60px
    }

    .question-sequence .lis_Cheak_title {
        padding-right: 80px
    }

.listen-progress-v2 {
    width: 420px;
    height: 40px;
    border: 2px solid #333;
    background-color: #b4b8b8;
    display: inline-block
}

    .listen-progress-v2 .l-progress-v2 {
        border-radius: 0;
        border: none;
        height: 12px;
        margin: 12px 28px 0 28px;
        background-color: #ddd
    }

    .listen-progress-v2 .loadout-v2 {
        width: 100% !important;
        padding: 1px;
        height: 12px;
        border-radius: 0;
        position: relative;
        overflow: hidden;
        background-color: #070a0b
    }

    .listen-progress-v2 .loadint-v2 {
        height: 100%;
        border-radius: 0;
        display: block;
        position: relative;
        background-color: #3fe9e7
    }

    .listen-progress-v2 .loadout-v2 span {
        border-radius: 50%;
        background-color: #fff;
        border: 1px solid #3e89f8;
        position: absolute;
        height: 28px;
        width: 28px;
        top: -7px;
        outline: none
    }

.listen-current-time {
    font-size: 20px;
    color: #666;
    padding-bottom: 14px
}

.exam-listen-text {
    font-size: 16px;
    padding: 20px
}

    .exam-listen-text .title {
        padding: 70px 0 40px
    }

    .exam-listen-text p {
        line-height: 40px;
        text-align: left
    }

        .exam-listen-text p .icon-erji {
            font-size: 36px;
            vertical-align: middle
        }

    .exam-listen-text .click-text {
        margin-top: 48px;
        padding: 0px 20px;
        color: #666;
        background-color: #ddd;
        display: inline-block;
        text-align: center;
        line-height: 42px
    }

.listen-question .choice-two input[type=checkbox] {
    margin-top: 14px;
    margin-right: 8px
}

.listen-question .choice-two {
    cursor: pointer
}

.speak-collect .icon-shoucang2:before {
    padding-right: 3px
}

.speak-collect .icon-shoucang1:before {
    color: #ffde5c;
    padding-right: 3px
}

.speak-collect {
    border-radius: 4px;
    border: 1px solid #ddd;
    display: inline-block;
    line-height: 22px;
    padding: 0 6px 0 4px;
    text-align: right;
    font-size: 14px
}

.speak-play-icon .listeningUrl-play {
    font-size: 20px;
    position: absolute;
    top: -6px;
    left: 42px
}

    .speak-play-icon .listeningUrl-play:hover {
        color: #3e89f8
    }

    .speak-play-icon .listeningUrl-play:focus {
        color: #333
    }

.play-icon-hover {
    display: none
}

.speak-play-icon .listeningUrl-play:hover .play-icon-hover {
    position: absolute;
    top: 0px;
    right: -56px;
    border-radius: 6px;
    font-size: 16px;
    border: 1px solid #eee;
    display: inline-block;
    width: 51px;
    line-height: 24px;
    text-align: center
}

.speak-practice-btn {
    font-size: 14px;
    background-color: #65a6fe;
    color: #fff;
    border-radius: 6px;
    border: none;
    padding: 8px 18px;
    display: inline-block;
    cursor: pointer;
    text-align: center;
    margin-top: 14px
}

    .speak-practice-btn a {
        color: #fff
    }

        .speak-practice-btn a:hover, .speak-practice-btn a:focus {
            color: #fff
        }

    .speak-practice-btn a {
        display: inline-block
    }

.speak-example {
    padding: 20px 74px 20px 24px
}

.spa_ra {
    position: absolute;
    bottom: 16px;
    width: 100%;
    text-align: center;
    padding-left: 60px
}

    .spa_ra a {
        display: block;
        width: 400px;
        height: 36px;
        background: #fff;
        opacity: 0.8;
        line-height: 36px;
        margin-bottom: 6px;
        border-radius: 2px;
        cursor: pointer
    }

.fist_h3 {
    text-align: center;
    font-size: 28px;
    line-height: 100px;
    padding-top: 30px
}

.img_df {
    width: 500px;
    height: 292px;
    margin: 0 auto !important;
    overflow: hidden
}

.speaking-center {
    text-align: center;
    margin: 0 auto
}

    .speaking-center .title-text {
        font-size: 18px;
        margin: 70px 0 24px 0;
        color: #666;
        text-align: center
    }

.speak-img {
    width: 500px;
    height: 300px;
    margin: 0 auto 40px
}

    .speak-img img {
        width: 100%;
        height: 300px
    }

.speaking-center .record-common {
    padding: 0;
    margin: 0;
    border: none;
    display: inline-block;
    text-align: center;
    background: transparent;
    position: relative;
    outline: none !important;
    margin: 0 55px
}

.speak-btn {
    width: 68px;
    height: 68px;
    background-color: #65a6fe;
    border-radius: 50px;
    padding-top: 1px
}

.speak-again {
    background-color: #fff;
    width: 68px;
    height: 68px;
    border-radius: 50px;
    border: 1px solid #9e9e9e
}

#speaking-btn p {
    font-size: 18px;
    color: #3e89f8;
    position: absolute;
    bottom: -28px;
    left: -18px
}

.speaking-center button i {
    color: #fff;
    font-size: 46px;
    line-height: 68px;
    padding: 0px
}

.speak-play-btn .speak-btn i {
    color: #65a6fe;
    font-size: 30px;
    padding-left: 4px
}

#speaking-btn.speak-play-btn p, .record-common p {
    font-size: 18px;
    color: #666;
    position: absolute;
    bottom: -33px;
    left: 0px
}

.speaking-center .speak-again i {
    color: #676767;
    font-size: 30px
}

.start-btn {
    padding-top: 66px
}

.speak-play-btn .speak-btn {
    background-color: #fff;
    width: 68px;
    height: 68px;
    border-radius: 50px;
    border: 1px solid #9e9e9e
}

#speaking-btn .icon-luyin {
    padding-right: 3px
}

.speak-play-btn .speak-btn .icon-zanting {
    padding: 0;
    font-weight: 600
}

.start-btn .start-speak-btn, .start-btn .start-speak-btn:hover {
    background: #ddd;
    width: 145px;
    height: 48px;
    border: none;
    color: #666;
    border-radius: 6px;
    font-size: 18px;
    opacity: 1;
    outline: none
}

.start-btn-do .start-speak-btn, .start-btn-do .start-speak-btn:hover {
    background: #3e89f8;
    color: #fff
}


@media only screen and (min-device-width: 1200px) {
    .audio-test-infomsg {
        text-align: left;
        font-size: 18px;
        color: #333;
        line-height: 30px;
        width: 868px;
        margin: 120px auto 44px;
        border-bottom: 2px solid #333333;
        padding-bottom: 36px
    }
}


@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
    /* 在此处添加可用于iPad的CSS样式 */
    .audio-test-infomsg {
        text-align: left;
        font-size: 18px;
        color: #333;
        line-height: 30px;     
        margin: 120px auto 44px 30px;
        border-bottom: 2px solid #333333;
        padding-bottom: 36px
    }
}



.step-3 .audio-test-infomsg {
    border-bottom: none
}

.getReady-time {
    width: 322px;
    text-align: center;
    font-size: 18px;
    color: #fff;
    margin: 0 auto 4px;
    border: 1px solid #666;
    font-weight: 500
}

    .getReady-time .time-title {
        height: 50px;
        line-height: 46px;
        background: #333;
        border: 2px solid #333
    }

    .getReady-time .step-new-time {
        display: block;
        height: 50px;
        line-height: 46px;
        background: #fff;
        border: 2px solid #333;
        color: #333
    }

.getReady-time-new {
    width: 322px;
    height: 30px;
    line-height: 28px;
    text-align: center;
    font-size: 18px;
    margin: 0 auto 4px
}

.getReady-progress {
    width: 576px;
    margin: 64px auto 0
}

    .getReady-progress .progress {
        height: 13px;
        background: #ddd;
        box-shadow: none
    }

    .getReady-progress .progress-bar-success {
        background: -moz-linear-gradient(left,#000 0%,#fff 100%);
        background: -webkit-gradient(linear,left right,left right,color-stop(0%,#000),color-stop(100%,#fff));
        background: -webkit-linear-gradient(left,#000 0%,#fff 100%);
        background: -o-linear-gradient(left,#000 0%,#fff 100%);
        background: -ms-linear-gradient(left,#000 0%,#fff 100%);
        background: linear-gradient(to bottom,#7baaf7 0%,#6b98e1 100%);
        background-color: #7baaf7\0;
        background-color: #7baaf7;
        height: 100%;
        border-radius: 20px;
        display: block;
        position: relative
    }

.speak-record {
    width: 942px;
    margin: 0 auto
}

    .speak-record b {
        margin: 50px 0 20px 0;
        font-size: 18px;
        display: inline-block
    }

.speak-v2 .audio-control-v2 {
    padding: 0 20px
}

.speak-record .audio-control-v2 {
    height: 76px;
    border-radius: 6px;
    border: 1px solid #ddd;
    padding: 21px 20px 0;
    position: relative
}

    .speak-record .audio-control-v2 .ui-widget.ui-widget-content {
        border-radius: 10px;
        border: none;
        height: 10px;
        margin: 12px 66px 0 42px;
        background-color: #ddd;
        position: relative
    }

.speak-record .glyphicon {
    font-size: 25px;
    color: #65a6fe;
    top: -7px
}

.g-container-v2 .audio-progress-v2 .ui-state-default, .g-container-v2 .audio-progress-v2 .ui-widget-content .ui-state-default, .g-container-v2 .audio-progress-v2 .ui-widget-header .ui-state-default, .ui-button {
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #3e89f8;
    height: 28px !important;
    width: 28px !important;
    top: -7px !important;
    outline: none;
    z-index: 10
}

.exam-container .speak-record .ui-state-default, .exam-container .ui-widget-content .ui-state-default, exam-container .speak-record .ui-widget-header .ui-state-default, .ui-button {
    position: absolute;
    display: inline-block;
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #3e89f8;
    height: 15px;
    width: 15px;
    top: -2px;
    outline: none;
    z-index: 10
}

.speak-record .jp-duration {
    position: absolute;
    right: 28px;
    top: 26px;
    font-size: 18px;
    color: #999
}

.speak-record .ui-slider .ui-slider-range {
    background-color: #65a6fe;
    border-radius: 10px
}

.step-main-1 {
    padding: 0 40px;
    margin: 120px auto 0
}

.computer-do {
    cursor: pointer;
    color: #3e89f8;
    text-decoration: underline;
    margin-top: 46px;
    display: inline-block
}

.choic-img {
    margin-top: 36px;
    width: 260px;
    height: 260px;
    display: inline-block
}

.mock-speak-text {
    line-height: 22px;
    font-size: 16px;
    text-align: left
}

    .mock-speak-text p {
        margin-bottom: 20px
    }

.exam-speak-center .click-text {
    margin-top: 20px;
    padding: 0px 20px;
    color: #666;
    background-color: #ddd;
    display: inline-block;
    text-align: center;
    line-height: 42px
}

.phone-do-exercise {
    width: 164px;
    height: 164px;
    border-radius: 50%;
    margin: 60px auto 0;
    background-color: #65a7fe;
    cursor: pointer;
    padding-top: 28px
}

.speak-finished-btn {
    width: 120px;
    height: 46px;
    font-size: 16px;
    line-height: 46px;
    text-align: center;
    line-height: 46px;
    margin-left: 10px;
    color: #fff;
    background-color: #65a6fe;
    border-radius: 5px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    cursor: pointer
}

    .speak-finished-btn:hover {
        color: #fff
    }

.continue-content {
    font-size: 16px
}

.listen-img-center {
    width: 500px;
    margin: 110px auto 40px;
    position: relative
}

.writing-top {
    border: 1px solid #000;
    border: none;
    border-bottom: 1px solid #000;
    margin-bottom: 2px;
    overflow-y: auto;
    height: 170px;
    top: 2px;
    right: 2px;
    left: 2px
}

.continue-content {
    padding: 22px;
    font-size: 16px
}

.writing-left, .writing-right {
    width: calc(50% - 5px);
    border: 1px solid #000;
    box-sizing: border-box
}

.writing-left {
    top: 174px;
    bottom: 2px;
    left: 2px
}

.writing-right {
    top: 174px;
    right: 2px;
    bottom: 2px
}

.write-top-desc {
    margin: 2px;
    padding: 12px 19px;
    background: #aeb6c8;
    border: 1px solid #000;
    box-sizing: border-box;
    line-height: 18px
}

.writing-right .tool-bar p {
    line-height: 34px
}

.writing-right .tool-bar .btn {
    background-color: transparent;
    border: 1px solid #000;
    color: #333;
    outline: none;
    margin: 0 10px;
    padding: 6px;
    font-weight: bold;
    border-radius: 4px;
    width: 60px
}

    .writing-right .tool-bar .btn:focus {
        outline: none
    }

    .writing-right .tool-bar .btn:hover {
        background-color: #DEDEDE;
        color: #333
    }

.textarea-box {
    box-sizing: border-box;
    position: absolute;
    top: 62px;
    left: 2px;
    bottom: 2px;
    right: 2px;
    padding: 20px;
    border: 1px solid #000
}

.p2 {
    padding: 2px
}

.textarea-box form {
    height: 100%
}

.textarea-box textarea {
    width: 100%;
    height: 100%;
    resize: none;
    border: none
}

.write-collect-exam {
    position: absolute;
    top: 0px;
    right: -108px;
    border-radius: 4px;
    border: 1px solid #ddd;
    display: inline-block;
    line-height: 22px
}

    .write-collect-exam a {
        font-size: 14px;
        color: #333;
        line-height: 20px;
        text-align: right;
        display: inline-block;
        padding: 0 6px 0 4px;
        background: #fff
    }

        .write-collect-exam a:hover {
            color: #333
        }

.write-top-section {
    margin: 8px 120px 8px 11px;
    position: relative;
    min-height: 22px
}

.write-collect-exam .icon-shoucang2:before {
    padding-right: 3px
}

.write-collect-exam .icon-shoucang-mian:before {
    color: #ffde5c;
    padding-right: 3px
}

.writing-dir-text .title {
    padding: 30px 0 12px
}

.writing-dir-text p {
    font-size: 16px;
    line-height: 40px;
    text-align: left
}

.writing-dir-text .click-tips {
    background-color: #ddd;
    color: #666;
    display: inline-block;
    padding: 0 24px;
    margin-top: 50px;
    line-height: 40px;
    font-size: 16px
}

.independent-writing-l {
    width: calc(50% - 5px)
}

.independent-writing-r {
    width: calc(50% - 5px);
    border: 1px solid #000;
    top: 2px;
    right: 2px;
    bottom: 2px
}

.independent-writing-r-v3 .independent-writing-r-top {
    position: absolute;
    top: 20px;
    height: 200px;
    left: 20px;
    right: 20px;
    overflow-y: auto;
    font-size: 16px
}

    .independent-writing-r-v3 .independent-writing-r-top .independent-dis {
        display: flex;
        min-height: 100px
    }

        .independent-writing-r-v3 .independent-writing-r-top .independent-dis .head {
            width: 60px;
            height: 90px
        }

        .independent-writing-r-v3 .independent-writing-r-top .independent-dis .independent-dis-r {
            display: flex;
            align-items: center;
            margin-bottom: 20px
        }

.independent-writing-r-v3 .independent-writing-r-bto {
    position: absolute;
    top: 240px;
    bottom: 0;
    left: 0;
    right: 0
}

.independent-writing-l {
    top: 2px;
    bottom: 2px;
    left: 2px
}

.independent-writing-l-top {
    height: 150px;
    background: #ddd
}

.independent-writing-l-bot {
    top: 152px;
    right: 0;
    bottom: 0;
    left: 0
}

.writing-right .tool-bar, .independent-writing-r .tool-bar {
    padding: 14px;
    background-color: #f2f2f2;
    position: absolute;
    top: 0;
    width: 100%
}

    .independent-writing-r .tool-bar .btn {
        background-color: transparent;
        border: 1px solid #000;
        color: #333;
        outline: 0;
        margin: 0 10px;
        padding: 6px;
        font-weight: bold;
        border-radius: 4px;
        width: 60px
    }

        .independent-writing-r .tool-bar .btn:focus {
            outline: none
        }

        .independent-writing-r .tool-bar .btn:hover {
            background-color: #DEDEDE;
            color: #333
        }

    .independent-writing-r .tool-bar p {
        line-height: 34px
    }

.word-v2 {
    margin-top: 60px
}

    .word-v2 .word-content {
        width: 980px;
        margin: 0 auto;
        padding: 0px 100px 40px
    }

        .word-v2 .word-content .title-top {
            padding-top: 30px;
            line-height: 54px;
            border-bottom: 1px solid #eee
        }

        .word-v2 .word-content .center {
            padding-top: 20px
        }

    .word-v2 .word-choice {
        line-height: 40px;
        cursor: pointer
    }

        .word-v2 .word-choice input {
            width: 16px;
            height: 16px;
            margin-top: -4px;
            cursor: pointer
        }

.word-next {
    width: 980px;
    margin: 0 auto;
    text-align: center;
    line-height: 50px;
    background-color: #fff;
    border-top: 1px solid #eee
}

.record-main {
    min-height: 900px
}

.record-header {
    height: 54px;
    line-height: 54px
}

    .record-header .gt {
        font-size: 14px;
        padding: 0
    }

.record-sidebar {
    width: 200px;
    background-color: #fff;
    border-radius: 5px
}

.record-sidebar-item {
    border-top: 1px solid #eee
}

.record-sidebar .record-sidebar-item:first-child {
    border-top: none
}

.record-sidebar-item .one-level {
    font-size: 18px;
    position: relative;
    padding: 16px 0 16px 60px;
    text-align: left
}

    .record-sidebar-item .one-level .icon-one {
        position: absolute;
        left: 34px;
        top: 14px;
        font-size: 20px
    }

    .record-sidebar-item .one-level .icon-two {
        position: absolute;
        right: 30px;
        top: 16px;
        color: #999
    }

.record-sidebar-item .two-level.active a {
    background: #f3f8ff;
    color: #3e89f8;
    border-left-color: #65a6fe
}

.record-sidebar-item .two-level a {
    font-size: 16px;
    color: #666;
    display: block;
    padding: 8px 0 8px 60px;
    border-left: 4px solid #fff
}

.two-level-wrap {
    display: none
}

.record-sidebar-item li.cur a, .record-sidebar-item li.cur {
    color: #3e89f8
}

    .record-sidebar-item li.cur .icon-two {
        color: #3e89f8
    }

.record-content {
    padding-left: 210px
}

.record-content-inner {
    background: #fff;
    border-radius: 5px;
    min-height: 900px
}

.record-title {
    font-size: 24px;
    font-weight: bold;
    padding: 30px 40px
}

.record-nav {
    padding: 0 40px 15px;
    border-bottom: 1px solid #eee
}

    .record-nav ul li {
        line-height: 28px
    }

        .record-nav ul li:first-child {
            color: #666;
            padding-right: 28px
        }

        .record-nav ul li.nav-type-item a:hover {
            color: #3e89f8
        }

        .record-nav ul li a.cur {
            color: #3e89f8
        }

.record-list-item {
    border-bottom: 1px solid #eee
}

.list-item-title {
    padding: 14px 40px
}

.record-times .item-title-icon {
    padding: 0 20px 0 35px
}

.record-line {
    height: 1px;
    background: url("../../toefl/public/images/record_xuxian_bg_03.png") repeat-x center top
}

.list-item-con {
    padding: 0 40px;
    display: none
}

.speak-list-item-con, .write-list-item-con {
    display: block
}

.ctb-style-one-inner, .dtjl-style-three-inner, .dtjl-style-two-inner, .dtjl-style-one-inner {
    padding: 0 75px 18px 0
}

.dtjl-style-three-inner-r a, .dtjl-style-two-inner-r a, .dtjl-style-one-inner-r a {
    color: #666
}

    .dtjl-style-three-inner-r a:hover, .dtjl-style-two-inner-r a:hover, .dtjl-style-one-inner-r a:hover {
        color: #3e89f8
    }

.dtjl-style-three-inner-l {
    padding-left: 45px
}

.record-content-inner .pager {
    padding: 30px 0 30px
}

.glossary-main .pager {
    padding: 10px 0 30px
}

.glossary-main .com-loading, .comment-list .com-loading, .record-list .com-loading {
    left: 50%;
    top: 200px;
    margin-left: -50px;
    z-index: 999
}

.glossary-main .nodata-tip, .comment-list .nodata-tip, .record-list .nodata-tip {
    width: 240px;
    left: 50%;
    top: 200px;
    margin-left: -120px
}

    .glossary-main .nodata-tip p, .comment-list .nodata-tip p, .record-list .nodata-tip p {
        padding: 25px 0 40px
    }

    .glossary-main .nodata-tip a, .comment-list .nodata-tip a, .record-list .nodata-tip a {
        width: 100px;
        height: 34px;
        line-height: 34px;
        background: #3e89f8;
        border-radius: 5px;
        color: #fff
    }

.dialog-tip {
    position: fixed;
    width: 380px;
    height: 230px;
    background: #fff;
    border-radius: 10px;
    left: 50%;
    top: 50%;
    margin-left: -190px;
    margin-top: -115px;
    z-index: 1
}

    .dialog-tip .dialog-tip-txt {
        padding: 85px 0 50px
    }

    .dialog-tip button {
        width: 100px;
        height: 36px;
        border: none;
        background: #3e89f8;
        border-radius: 6px;
        outline: none
    }

    .dialog-tip .close-btn {
        margin: 18px 20px 0 0
    }

.public-a-link {
    color: #333
}

    .public-a-link:hover {
        color: #3e89f8
    }

.dtjl-style-one-inner-r .time {
    padding: 0 0 20px
}

.dtjl-style-one-inner-l li .p-1 {
    padding: 10px 0 4px
}

    .dtjl-style-one-inner-l li .p-1.status-one {
        color: #f75234
    }

    .dtjl-style-one-inner-l li .p-1.status-two {
        color: #3e89f8
    }

.dtjl-style-two-inner-l dl dd span {
    color: #3e89f8
}

.dtjl-style-two-inner-r {
    padding-top: 35px
}

.ques-type a {
    margin-right: 27px
}

.speaking-list .speaking-slider-wrap {
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 15px
}

    .speaking-list .speaking-slider-wrap .play-and-pause {
        color: #3e89f8
    }

.speaking-list .speaking-slider {
    width: 320px;
    border-radius: 2000px;
    background: #ddd;
    border-color: #ddd;
    height: 10px;
    margin: 6px 22px 0 10px
}

    .speaking-list .speaking-slider .ui-widget-header {
        background: #3e89f8
    }

.tag a {
    margin-right: 27px
}

.record-nav ul li.tag {
    width: 700px
}

.ui-slider-horizontal .ui-slider-handle {
    margin-left: -10px
}

.ui-slider .ui-slider-range {
    position: absolute;
    z-index: 1;
    font-size: .7em;
    display: block;
    border: 0
}

.ui-slider-horizontal .ui-slider-range-min {
    left: 0
}

.ui-slider-horizontal .ui-slider-range {
    top: 0;
    height: 100%
}

.speak-list-item-con:hover, .listen-list-item-con:hover, .scj-style-one-inner-l .collect-ques-con:hover {
    background: #f3f8ff
}

    .speak-list-item-con:hover .del, .listen-list-item-con:hover .del, .scj-style-one-inner-l .collect-ques-con:hover .del, .write-list-item-con:hover .scj-style-two-inner .del {
        display: block
    }

.scj-style-one .record-line {
    margin: 0 40px
}

.scj-style-one-inner-l ul li {
    padding: 8px 2px;
    margin-left: 28px;
    border-bottom: 4px solid #fff;
    cursor: pointer
}

    .scj-style-one-inner-l ul li.cur {
        border-bottom-color: #3e89f8;
        color: #3e89f8
    }

    .scj-style-one-inner-l ul li:first-child {
        margin-left: 0
    }

.scj-style-one-inner-l .p-2 {
    width: 668px
}

.scj-style-one-inner-l ul {
    padding-left: 85px
}

.scj-style-one-inner-l .collect-ques-con {
    padding: 14px 0 22px 85px
}

.scj-style-two-inner-l {
    padding: 0 112px 18px 45px
}

.scj-style-two-inner .del, .scj-style-one-inner .del {
    color: #3e89f8;
    display: none
}

.scj-style-one-inner .del {
    right: 65px;
    top: 28px
}

.scj-style-two-inner .del {
    right: 28px;
    top: 15px
}

.ctb-list-item-con {
    display: block
}

.record-title a {
    width: 100px;
    height: 36px;
    line-height: 36px;
    color: #3e89f8;
    border: 1px solid #3e89f8;
    border-radius: 5px;
    text-align: center;
    line-height: 36px
}

    .record-title a:hover {
        color: #3e89f8
    }

.ctb-style-one-inner-l {
    padding-left: 45px
}

    .ctb-style-one-inner-l .ul-1 li {
        margin-right: 55px
    }

    .ctb-style-one-inner-l .ul-2 li {
        margin-right: 65px
    }

        .ctb-style-one-inner-l .ul-1 li.blue, .ctb-style-one-inner-l .ul-2 li span.blue {
            color: #3e89f8
        }

        .ctb-style-one-inner-l .ul-2 li span.orange {
            color: #f75234
        }

.ctb-footer-btn a {
    margin-right: 40px
}

    .ctb-footer-btn a.del {
        margin-right: 20px
    }

.ctb-footer-btn .icon-shoucang-mian {
    color: #ffde5c
}

.glossary {
    color: #666
}

.glossary-menu {
    background: #fff;
    border-radius: 5px
}

.glossary-menu-tab {
    padding: 0 35px
}

    .glossary-menu-tab a {
        height: 44px;
        line-height: 44px;
        text-align: center;
        padding: 0 12px;
        font-size: 18px;
        border-bottom: 2px solid #fff
    }

        .glossary-menu-tab a.cur {
            border-bottom-color: #3e89f8
        }

.glossary-menu-con {
    border-top: 1px solid #f0f1f2;
    padding: 15px 35px;
    font-size: 14px;
    height: 63px
}

    .glossary-menu-con a {
        font-size: 14px
    }

        .glossary-menu-con a.check-word, .glossary-menu-con a.check-all-word {
            width: 78px;
            height: 32px;
            line-height: 32px;
            text-align: center;
            border-radius: 5px;
            border: 1px solid #3e89f8;
            color: #3e89f8;
            margin-right: 15px
        }

            .glossary-menu-con a.check-all-word.cur {
                background: #3e89f8;
                color: #fff
            }

        .glossary-menu-con a.cancel-check {
            color: #3e89f8;
            line-height: 32px;
            margin: 0 45px 0 0
        }

.sort-rule dt {
    color: #3e89f8;
    height: 32px;
    line-height: 32px;
    padding-right: 20px
}

.sort-rule dd {
    width: 14px;
    right: 0;
    top: 4px
}

    .sort-rule dd span {
        padding: 0;
        font-size: 12px;
        line-height: 8px;
        cursor: pointer;
        font-weight: bold
    }

        .sort-rule dd span:first-child {
            margin-bottom: 8px
        }

        .sort-rule dd span.cur {
            color: #3e89f8
        }

.initials-sort {
    margin-left: 30px
}

.check-word-num {
    line-height: 32px
}

    .check-word-num b {
        padding: 0 2px;
        font-size: 16px;
        color: #3e89f8
    }

.glossary-menu-con span.test-all-word, .glossary-menu-con a.del-all-word {
    width: 100px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    background: #f75234;
    color: #fff;
    border-radius: 5px
}

.glossary-menu-con span.test-all-word {
    background: #3e89f8;
    cursor: pointer
}

.glossary-menu-con a.del-all-word {
    margin: 0 15px 0 25px
}

.glossary-main {
    background: #fff;
    border-radius: 5px;
    padding: 25px 0 25px 35px;
    margin-top: 20px;
    min-height: 620px
}

    .glossary-main .glossary-main-con ul li.glossary-main-item {
        width: 50%;
        border-right: 35px solid #fff;
        border-bottom: 20px solid #fff
    }

.glossary-main-item-inner {
    border: 1px solid #ddd;
    border-radius: 5px;
    height: 135px;
    padding: 15px 70px 15px 45px
}

    .glossary-main-item-inner .origin-type {
        height: 20px;
        right: 12px;
        top: 12px
    }

        .glossary-main-item-inner .origin-type a {
            width: 20px;
            height: 20px;
            line-height: 20px;
            text-align: center;
            border-radius: 3px;
            color: #fff;
            margin-left: 4px;
            cursor: default
        }

            .glossary-main-item-inner .origin-type a:first-of-type {
                margin-left: 0
            }

            .glossary-main-item-inner .origin-type a.status1 {
                background-color: #14b0d8
            }

            .glossary-main-item-inner .origin-type a.status2 {
                background-color: #dc5661
            }

            .glossary-main-item-inner .origin-type a.status3 {
                background-color: #f3ae47
            }

            .glossary-main-item-inner .origin-type a.status4 {
                background-color: #50c086
            }

    .glossary-main-item-inner:hover {
        box-shadow: 0 5px 20px #ccc
    }

        .glossary-main-item-inner:hover .del {
            display: block
        }

    .glossary-main-item-inner .word .pronunciation {
        color: #65a5fc;
        cursor: pointer
    }

    .glossary-main-item-inner .word {
        padding-bottom: 15px
    }

        .glossary-main-item-inner .word .p-1 {
            color: #333;
            font-size: 16px;
            font-weight: bold
        }

            .glossary-main-item-inner .word .p-1 span {
                padding-left: 10px
            }

    .glossary-main-item-inner .translation {
        line-height: 22px
    }

    .glossary-main-item-inner .gray {
        color: #ccc
    }

    .glossary-main-item-inner .uncheck {
        width: 18px;
        height: 18px;
        left: 10px;
        top: 10px;
        border: 1px solid #7fb5fe;
        border-radius: 3px;
        font-size: 14px;
        color: #7fb5fe
    }

        .glossary-main-item-inner .uncheck::before {
            position: relative;
            left: 1px;
            top: -1px
        }

    .glossary-main-item-inner .del {
        right: 8px;
        top: 50%;
        margin-top: -11px;
        cursor: pointer;
        color: #fa5333;
        font-weight: bold;
        display: none
    }

.record-comment-tab {
    padding: 0 40px;
    border-bottom: 1px solid #eee
}

    .record-comment-tab li {
        height: 54px;
        line-height: 54px;
        border-bottom: 2px solid #fff
    }

        .record-comment-tab li.cur {
            border-bottom-color: #3e89f8
        }

.comment-list-item {
    padding: 17px 40px
}

    .comment-list-item .p-2 {
        padding: 7px 0
    }

    .comment-list-item .p-3 {
        padding: 17px 0 15px
    }

    .comment-list-item .p-5 {
        padding: 4px 0 6px
    }

        .comment-list-item .p-5 .teacher {
            color: #3e89f8
        }

    .comment-list-item .p-6 {
        line-height: 26px
    }

    .comment-list-item .del {
        color: #3e89f8;
        right: 60px;
        top: 25px;
        display: none
    }

    .comment-list-item:hover {
        background: #f3f8ff
    }

        .comment-list-item:hover .del {
            display: block
        }

.comment-record-title {
    padding-bottom: 16px
}

.class-list {
    width: 100%;
    margin: 20px auto 0 auto;
    border-top: 1px solid #eeeeee;
    padding: 20px 0
}

.class-list-ul {
    width: 100%;
    overflow: hidden
}

    .class-list-ul li {
        cursor: pointer;
        float: left;
        height: 35px;
        line-height: 34px;
        border-radius: 4px;
        padding: 0 15px;
        border: solid 1px #ababab;
        margin-right: 13px;
        margin-top: 13px
    }

    .class-list-ul .active {
        background-color: #65a6fe;
        color: #fff;
        border: none;
        border: 1px solid #65a6fe
    }

.table-hover tbody tr:hover {
    background-color: #eaf3ff
}

.hw-title-span {
    max-width: 280px;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.h-showmore {
    cursor: pointer
}

.homeworkModal .modal-dialog {
    width: 550px
}

.course-detail-modal-sec {
    max-height: 240px;
    overflow: auto;
    max-width: 446px
}

.no-data-c .no-data-icon4 {
    margin: 0 auto;
    width: 251px;
    height: 251px;
    background: url("/themes/v2/public/images/my-class/img_noarrange.png") no-repeat
}

.selectDoSecDiv {
    width: 93%;
    height: 42px;
    line-height: 42px;
    position: relative
}

.selectDoSec {
    background: #fff;
    width: 100%;
    border-radius: 5px
}

.selectDoSecUl {
    width: 10000px
}

    .selectDoSecUl li {
        height: 40px;
        line-height: 40px;
        border: 1px solid #ddd;
        padding: 0px 0px;
        border-radius: 5px;
        width: 101px;
        text-align: center
    }

.selectDoSecUlDiv {
    width: 100%;
    margin: 0 auto;
    overflow: hidden
}

.selectDoSecUl li a {
    display: block
}

    .selectDoSecUl li a:hover {
        color: #3e89f8
    }

.selectDoSecUl .active {
    color: #fff;
    background-color: #65a6fe;
    border: 1px solid #65a6fe
}

    .selectDoSecUl .active a {
        color: #fff
    }

        .selectDoSecUl .active a:hover {
            color: #fff
        }

.h-lsdt {
    height: 42px;
    line-height: 42px;
    display: inline-block
}

.result-zcdt {
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 13px;
    height: 30px;
    line-height: 30px
}

.selectDoSecUl .zxdt {
    border: 1px solid #65a6fe;
    color: #65a6fe
}

    .selectDoSecUl .zxdt a {
        color: #65a6fe
    }

.newsPolicy-ul {
    width: 100%;
    height: 50px;
    line-height: 50px
}

    .newsPolicy-ul li {
        float: left;
        font-weight: normal
    }

.newsPolicy-li {
    position: relative
}

    .newsPolicy-li a {
        display: block
    }

    .newsPolicy-li .newsPolicy-i {
        position: absolute;
        top: 15px;
        right: -12px;
        width: 44px;
        height: 21px;
        line-height: 21px;
        background: #ff4242;
        color: #fff;
        border-radius: 3px;
        text-align: center
    }

.newsPolicy-ul li.active a {
    color: #3e89f8
}

.read-type-main-v2 li {
    float: left;
    font-weight: normal
}

.read-type-main-v2 .newsPolicy-i {
    top: 2px;
    right: 9px;
    width: 36px
}

.double-border {
    box-sizing: border-box;
    border: 4px #000;
    border-style: double
}

.new-header {
    overflow: hidden;
    /*position: absolute;*/
    left: 0;
    top: 0;
    right: 0;
    font-size: 16px
}

@media only screen and (min-device-width: 1200px) {
    /* 在此处添加可用于iPad的CSS样式 */
    .new-header-top {
        width: 100%;
        height: 60px;
        margin: 0 auto;
        background: #077F83;
        min-width: 1200px;
    }
    .new-header-bot {
        min-width: 1200px;
        height: 34px;
        line-height: 34px;
        background: #f4f4f4;
        padding: 0 20px
    }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
    /* 在此处添加可用于iPad的CSS样式 */
    .new-header-top {
        width: 100%;
        height: 60px;
        margin: 0 auto;
        background: #077F83
    }
    .new-header-bot {       
        height: 34px;
        line-height: 34px;
        background: #f4f4f4;
        padding: 0 20px
    }
}



.new-header-top-r {
    padding-top: 6px;
    font-size: 0
}

    .new-header-top-r li {
        display: inline-block;
        padding-right: 6px;
        vertical-align: top
    }

        .new-header-top-r li a {
            min-width: 68px;
            height: 48px;
            padding: 0 6px;
            border-radius: 5px;
            text-align: center;
            font-size: 16px
        }

            .new-header-top-r li a:link, .new-header-top-r li a:visited {
                color: #fff
            }

            .new-header-top-r li a.new-green-btn {
                background-image: linear-gradient(180deg,#09353b,#527075);
                border: none;
                border-radius: 3px;
                color: #a6bbbc
            }

            .new-header-top-r li a[class*=-btn] .iconfont {
                font-size: 12px
            }

            .new-header-top-r li a[class*=-btn] .icon-xiangyou, .new-header-top-r li a[class*=-btn] .icon-shangyishou, .new-header-top-r li a[class*=-btn] .icon-xiangzuo {
                font-size: 18px
            }

            .new-header-top-r li a[class*=-btn] p {
                line-height: 1;
                padding-top: 6px
            }

            .new-header-top-r li a.blue-btn {
                cursor: pointer;
                opacity: 1;
                background: #fff;
                border: none;
                border-radius: 3px;
                color: #4f797f
            }

            .new-header-top-r li a.gray-btn {
                cursor: pointer;
                opacity: 1;
                background: #2a9095;
                border: 2px solid #94c6c6
            }

                .new-header-top-r li a.gray-btn p {
                    line-height: 1;
                    padding-top: 6px
                }

            .new-header-top-r li a.blue-disabled-btn, .new-header-top-r li a.blue-btn[disabled=disabled], .new-header-top-r li a.gray-disabled-btn[disabled=disabled], .new-header-top-r li a.blue-btn[disabled=true], .new-header-top-r li a.gray-disabled-btn[disabled=true], .new-header-top-r li a.gray-disabled-btn {
                background-image: linear-gradient(180deg,#09353b,#527075);
                border: none;
                border-radius: 3px;
                color: #a6bbbc;
                cursor: not-allowed;
                opacity: 1
            }


@media only screen and (min-device-width: 1200px) {
    .new-main {
        position: absolute;
        min-width: 1200px;
        top: 94px;
        bottom: 5px;
        width: 100%;
        background: #fff;
        overflow-x: hidden;
        overflow-y: auto;
        border-top: none
    }

}


@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
    /* 在此处添加可用于iPad的CSS样式 */
    .new-main {
        position: absolute;      
        top: 94px;
        bottom: 5px;
        width: 100%;
        background: #fff;
        overflow-x: hidden;
        overflow-y: auto;
        border-top: none
    }
}


.multiple-check {
    display: none
}

    .multiple-check + label {
        background-color: white;
        border-radius: 0px;
        border: 1px solid #000;
        width: 16px;
        height: 16px;
        display: inline-block;
        text-align: center;
        vertical-align: middle;
        line-height: 16px
    }

    .multiple-check:checked + label {
        background: url("../images/checkedx.png") 16px 16px
    }

.single-check {
    display: none !important
}

    .single-check + label {
        background-color: white;
        border-radius: 0px;
        border: 1px solid #333;
        width: 23px;
        height: 16px;
        display: inline-block;
        text-align: center;
        vertical-align: middle;
        border-radius: 50% / 50%;
        line-height: 16px
    }

    .single-check:checked + label {
        background-color: #333
    }

.show-time-btn {
    background: #fff;
    width: 80px;
    text-align: center;
    border-radius: 5px;
    height: 20px;
    line-height: 20px;
    vertical-align: middle;
    display: inline-block;
    margin: 5px 5px 0 0
}

.header-doing-right .hideTime {
    font-size: 14px;
    color: #333;
    background-color: #fff;
    border-radius: 3px;
    line-height: 20px;
    padding: 0 8px;
    margin: 3px 14px 0 0;
    cursor: pointer
}

.time-word {
    color: #333;
    font-weight: bold
}

.add-or-minus {
    height: 18px;
    width: 18px;
    border-radius: 50%;
    border: 1px solid #333;
    line-height: 13px;
    font-size: 22px;
    margin-top: 6px;
    color: #333
}

.details-single-check {
    opacity: 0
}

    .details-single-check + label {
        border-radius: 0px;
        width: 18px;
        height: 18px;
        display: inline-block;
        text-align: center;
        vertical-align: middle;
        line-height: 18px
    }

    .details-single-check:checked + label {
        background: url("../images/gou1.png") 18px 18px
    }

.table-striped > tbody > tr:nth-of-type(2n-1) {
    background-color: #fff
}

.lis_span_in {
    border: 1px solid #aeaeae;
    border-radius: 0px
}

.listen-title {
    font-weight: normal
}

.tip-background {
    height: 40px;
    background-color: #c2c8d8
}

.blue-btn {
    background: #3e68a4;
    border: 1px solid #fff;
    color: #fff
}

.listen-make-top .alert-span1 {
    border: 1px solid #999;
    padding: 1px 13px;
    border-radius: 24px
}

    .listen-make-top .alert-span1:hover {
        color: #3e89f8;
        border: 1px solid #3e89f8
    }

    .listen-make-top .alert-span1 .rc {
        color: #fa6c6c
    }

    .listen-make-top .alert-span1 .alert-show {
        width: 286px;
        height: 110px;
        padding: 15px 18px;
        background: #fff;
        border: 1px solid #999;
        line-height: 26px;
        border-radius: 6px;
        left: 0px;
        top: 35px
    }

        .listen-make-top .alert-span1 .alert-show:before, .listen-make-top .alert-span1 .alert-show:after {
            content: "";
            display: block;
            border-width: 10px;
            position: absolute;
            top: -21px;
            left: 18px;
            border-style: solid dashed dashed solid;
            border-color: transparent transparent #999 transparent;
            font-size: 0;
            line-height: 0
        }

        .listen-make-top .alert-span1 .alert-show:after {
            top: -20px;
            border-color: transparent transparent #FFF transparent
        }

.listen-make-top .alert-span2 {
    border: 1px solid #3e89f8;
    padding: 5px 12px;
    border-radius: 6px;
    color: #3e89f8;
    right: 0px;
    top: 23px
}

    .listen-make-top .alert-span2:hover {
        background: #3e89f8;
        color: #fff;
        border: 1px solid #3e89f8
    }

.click-btn button {
    width: 150px;
    height: 38px;
    line-height: 38px;
    background: #3e89f8;
    color: #fff;
    font-size: 16px;
    text-align: center;
    border-radius: 6px
}

    .click-btn button.btn-disabled {
        background: #999
    }

.show-mode .show-mode-ul .show-mode-li {
    border-bottom: 1px dashed #ddd;
    color: #bbb;
    padding: 16px 0 11px
}

.show-mode .show-mode-ul .cur-li {
    color: #3e89f8
}

.toefl-listening-point {
    position: fixed;
    padding-bottom: 10px;
    bottom: 9px;
    left: 50%;
    background: #fff;
    width: 1050px;
    margin-left: -525px
}

.textEllipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.textEllipsis2 {
    overflow: hidden;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical
}

#course .course-list .course-item {
    width: 380px;
    height: 224px;
    border-radius: 6px;
    margin-right: 20px;
    cursor: pointer;
    transition: transform .3s;
    background-color: #ffffff;
    box-shadow: 0px 0px 6px 0px rgba(174,176,204,0.4);
    border-radius: 4px;
    position: relative
}

    #course .course-list .course-item:hover {
        transform: translateY(-10px);
        box-shadow: 0 0 16px rgba(152,186,255,0.5)
    }

    #course .course-list .course-item:nth-child(3n) {
        margin-right: 0px
    }

    #course .course-list .course-item .pic {
        height: 180px;
        position: relative
    }

        #course .course-list .course-item .pic img {
            height: 180px;
            width: 376px;
            border: 0
        }

    #course .course-list .course-item .content {
        position: relative;
        top: 32px;
        height: 192px;
        box-sizing: border-box;
        padding: 16px 32px 24px;
        background-color: #fff !important
    }

        #course .course-list .course-item .content .title {
            font-size: 18px;
            line-height: 18px;
            color: #333;
            font-weight: bold
        }

        #course .course-list .course-item .content .c-time {
            font-size: 14px;
            margin: 10px 0;
            height: 20px
        }

        #course .course-list .course-item .content .c-teacher-info {
            height: 55px;
            margin-top: 5px;
            display: flex
        }

            #course .course-list .course-item .content .c-teacher-info .cti-item {
                text-align: center;
                width: 60px;
                display: flex;
                flex-direction: column;
                align-items: center
            }

                #course .course-list .course-item .content .c-teacher-info .cti-item > img {
                    height: 36px;
                    width: 36px;
                    border-radius: 50%;
                    -webkit-border-radius: 50%;
                    -moz-border-radius: 50%;
                    -ms-border-radius: 50%;
                    -o-border-radius: 50%
                }

                #course .course-list .course-item .content .c-teacher-info .cti-item .cti-name {
                    color: #666;
                    font-size: 12px;
                    width: 50px;
                    text-align: center;
                    padding-top: 5px
                }

        #course .course-list .course-item .content .info {
            padding-top: 15px;
            display: flex;
            justify-content: space-between;
            align-items: center
        }

            #course .course-list .course-item .content .info .teacher {
                display: flex
            }

                #course .course-list .course-item .content .info .teacher .icon {
                    margin-right: 10px
                }

                    #course .course-list .course-item .content .info .teacher .icon i {
                        color: #666666;
                        font-size: 24px;
                        vertical-align: middle;
                        margin-right: 3px
                    }

                    #course .course-list .course-item .content .info .teacher .icon span {
                        display: inline-block;
                        max-width: 60px;
                        color: #666;
                        vertical-align: middle
                    }

                    #course .course-list .course-item .content .info .teacher .icon:nth-child(2) {
                        margin-right: 0
                    }

            #course .course-list .course-item .content .info .price {
                font-size: 18px;
                font-weight: 600;
                color: #3e89f8;
                line-height: 34px
            }

                #course .course-list .course-item .content .info .price .init-price {
                    color: #666;
                    font-weight: normal;
                    font-size: 14px;
                    text-decoration: line-through
                }

                #course .course-list .course-item .content .info .price .real-price {
                    color: #ff6c00;
                    font-size: 24px;
                    line-height: 24px
                }

            #course .course-list .course-item .content .info .full {
                color: #999999;
                font-weight: normal
            }

#course .course-list .course-item-label {
    position: absolute;
    min-width: 60px;
    height: 24px;
    padding: 0 10px;
    line-height: 24px;
    background-color: rgba(236,21,21,0.2);
    border-radius: 0px 12px 12px 0px;
    color: #ec1515;
    font-size: 14px;
    text-align: center;
    top: 8px
}

#courseDetail {
    background-color: #fff
}

    #courseDetail .teacher-name {
        display: inline-block;
        width: 60px;
        margin-right: 10px
    }

        #courseDetail .teacher-name:nth-last-child(1) .comma {
            display: none
        }

    #courseDetail .order-loading {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        margin: auto;
        background-color: transparent;
        z-index: 100
    }

        #courseDetail .order-loading .img-loading {
            width: 300px;
            height: 150px;
            background-color: #fff;
            border-radius: 5px;
            position: relative;
            top: 50%;
            left: 50%;
            transform: translateY(-50%);
            transform: translateX(-50%);
            z-index: 101
        }

            #courseDetail .order-loading .img-loading p {
                text-indent: 25px
            }

    #courseDetail .banner {
        background: url(../images/course-detail-banner.png) no-repeat center;
        background-size: 100% 100%
    }

    #courseDetail .info {
        height: 262px
    }

        #courseDetail .info .picture {
            width: 400px;
            height: 262px
        }

            #courseDetail .info .picture .img {
                width: 400px;
                height: 262px;
                position: relative
            }

                #courseDetail .info .picture .img img {
                    width: 400px;
                    height: 262px
                }

                #courseDetail .info .picture .img .surplus-time {
                    width: 400px;
                    height: 52px;
                    position: absolute;
                    bottom: 0;
                    background: url(../images/surplus-time-bg.png) 400px 52px;
                    display: flex
                }

                    #courseDetail .info .picture .img .surplus-time .title {
                        width: 130px;
                        height: 100%;
                        line-height: 52px;
                        text-align: center;
                        color: #333;
                        font-weight: 700
                    }

                    #courseDetail .info .picture .img .surplus-time .time {
                        width: 270px;
                        height: 100%;
                        line-height: 52px;
                        text-align: center
                    }

                        #courseDetail .info .picture .img .surplus-time .time p {
                            font-size: 16px;
                            color: #fff;
                            font-weight: 600
                        }

                            #courseDetail .info .picture .img .surplus-time .time p span {
                                color: #fcff00
                            }

        #courseDetail .info .content {
            margin-left: 40px;
            height: 100%
        }

            #courseDetail .info .content .title {
                max-width: 580px;
                color: #333;
                line-height: 1.5em;
                padding-top: 10px
            }

            #courseDetail .info .content .apply {
                height: 100px;
                display: flex;
                flex-direction: column;
                justify-content: space-between
            }

                #courseDetail .info .content .apply .price-box .origin-price {
                    color: #999;
                    margin-right: 20px
                }

                #courseDetail .info .content .apply .price-box .real-price {
                    color: #d10000
                }

                #courseDetail .info .content .apply .session {
                    max-width: 230px;
                    height: 36px;
                    background-color: #65a6fe;
                    border-radius: 6px;
                    line-height: 36px;
                    color: #fff;
                    text-align: center;
                    cursor: pointer
                }

                #courseDetail .info .content .apply .price {
                    color: #d10000
                }

                #courseDetail .info .content .apply .learn-btn {
                    width: 350px;
                    display: flex
                }

                    #courseDetail .info .content .apply .learn-btn button {
                        margin-right: 15px
                    }

                    #courseDetail .info .content .apply .learn-btn .full {
                        background-color: #999
                    }

                    #courseDetail .info .content .apply .learn-btn .consult {
                        color: #65a6fe;
                        background-color: #fff;
                        border: 1px solid #65a6fe
                    }

                    #courseDetail .info .content .apply .learn-btn .pay-now {
                        overflow: hidden;
                        text-align: right;
                        position: relative;
                        border: 1px solid #65a6fe
                    }

                        #courseDetail .info .content .apply .learn-btn .pay-now .surplus {
                            text-align: center;
                            height: 48px;
                            width: 60px;
                            position: absolute;
                            top: 0;
                            color: #d10000;
                            z-index: 1;
                            display: flex;
                            flex-direction: column;
                            justify-content: center
                        }

                            #courseDetail .info .content .apply .learn-btn .pay-now .surplus .f14 {
                                line-height: 18px
                            }

                        #courseDetail .info .content .apply .learn-btn .pay-now > span {
                            position: relative;
                            line-height: 48px;
                            right: -32px;
                            display: block;
                            width: 150px;
                            height: 48px;
                            color: #fff;
                            background-color: #65a6fe
                        }

                            #courseDetail .info .content .apply .learn-btn .pay-now > span .orderLoading {
                                display: inline-block
                            }

                                #courseDetail .info .content .apply .learn-btn .pay-now > span .orderLoading img {
                                    height: 26px;
                                    width: 26px
                                }

                        #courseDetail .info .content .apply .learn-btn .pay-now:after {
                            content: "";
                            position: absolute;
                            left: 95px;
                            top: -25px;
                            height: 200%;
                            width: 100%;
                            background: #fff;
                            -webkit-transform: translateX(-98%) translateY(-25%) rotate(110deg);
                            transform: translateX(-98%) translateY(-25%) rotate(110deg)
                        }

    #courseDetail .learn {
        width: 150px;
        height: 48px;
        color: #fff;
        background-color: #65a6fe;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 0
    }

        #courseDetail .learn .orderLoading {
            display: inline-block
        }

            #courseDetail .learn .orderLoading img {
                height: 26px;
                width: 26px
            }

    #courseDetail .full {
        background-color: #999 !important
    }

    #courseDetail .introduce .tab {
        position: relative;
        z-index: 10;
        width: 100%;
        height: 72px;
        background-color: #fff;
        box-shadow: 0px 0 10px 0px rgba(152,186,255,0.24);
        top: 0;
        display: flex;
        justify-content: space-between
    }

        #courseDetail .introduce .tab .list {
            display: flex;
            justify-content: space-between
        }

            #courseDetail .introduce .tab .list .list-box {
                width: 250px;
                height: 100%;
                line-height: 72px;
                align-items: flex-start;
                display: flex;
                justify-content: space-between;
                align-content: center;
                margin-right: auto
            }

                #courseDetail .introduce .tab .list .list-box .intr {
                    margin-right: 15px
                }

                #courseDetail .introduce .tab .list .list-box a {
                    display: block;
                    position: relative;
                    color: #3e89f8;
                    font-weight: bold
                }

                    #courseDetail .introduce .tab .list .list-box a span {
                        display: block;
                        width: 32px;
                        height: 4px;
                        background-color: transparent;
                        border-radius: 2px;
                        position: absolute;
                        bottom: 0;
                        left: 50%;
                        transform: translateX(-50%)
                    }

                #courseDetail .introduce .tab .list .list-box .outline {
                    color: #3e89f8;
                    position: relative
                }

                    #courseDetail .introduce .tab .list .list-box .outline .try-see {
                        width: 44px;
                        height: 24px;
                        text-align: center;
                        font-size: 14px;
                        line-height: 24px;
                        background-color: #ffffff;
                        border-radius: 6px;
                        border: solid 1px #65a6fe;
                        position: absolute;
                        top: 15px;
                        right: -46px
                    }

            #courseDetail .introduce .tab .list .tab-btn {
                width: 400px;
                height: 100%;
                display: flex;
                align-items: center;
                justify-content: space-around
            }

                #courseDetail .introduce .tab .list .tab-btn .real-price {
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    color: #d10000;
                    text-align: center
                }

            #courseDetail .introduce .tab .list .tab-title span {
                display: inline-block;
                max-width: 200px;
                line-height: 72px;
                text-align: left
            }

    #courseDetail .introduce .intr-content {
        width: 100%;
        padding-bottom: 50px
    }

        #courseDetail .introduce .intr-content .outline-title, #courseDetail .introduce .intr-content .intr-title {
            width: 200px;
            height: 48px;
            margin: 64px auto;
            position: relative
        }

            #courseDetail .introduce .intr-content .outline-title p, #courseDetail .introduce .intr-content .intr-title p {
                position: relative;
                z-index: 1
            }

            #courseDetail .introduce .intr-content .outline-title:after, #courseDetail .introduce .intr-content .intr-title:after {
                content: "";
                width: 150px;
                height: 16px;
                position: absolute;
                right: 10px;
                bottom: 15px;
                background-image: linear-gradient(to right,#0063e9 0%,rgba(255,255,255,0.1));
                border-radius: 8px
            }

            #courseDetail .introduce .intr-content .outline-title:before, #courseDetail .introduce .intr-content .intr-title:before {
                content: "";
                height: 36px;
                width: 36px;
                position: absolute;
                right: 25px;
                background-image: linear-gradient(to left,rgba(103,160,240,0.4),rgba(0,99,233,0));
                border-radius: 50%
            }

        #courseDetail .introduce .intr-content #intr {
            width: 100%;
            scroll-behavior: auto;
            padding-top: 70px
        }

            #courseDetail .introduce .intr-content #intr .intr-content {
                display: inline-block;
                padding: 0 auto;
                text-align: center
            }

                #courseDetail .introduce .intr-content #intr .intr-content img {
                    max-width: 100%
                }

        #courseDetail .introduce .intr-content #outline {
            width: 100%;
            scroll-behavior: auto;
            padding-bottom: 200px
        }

    #courseDetail .courseService {
        position: fixed;
        top: 40%;
        right: 15px;
        z-index: 99;
        box-shadow: 0px 0px 8px 0px rgba(176,195,234,0.24)
    }

        #courseDetail .courseService li {
            height: 80px;
            width: 80px;
            display: flex;
            flex-direction: column;
            text-align: center;
            cursor: pointer
        }

            #courseDetail .courseService li:nth-child(1) {
                background-color: #fff;
                color: #f65a4e
            }

                #courseDetail .courseService li:nth-child(1) span {
                    line-height: 12px
                }

            #courseDetail .courseService li:nth-child(2) {
                background-color: #f65a4e;
                color: #fff
            }

                #courseDetail .courseService li:nth-child(2) i {
                    font-size: 35px;
                    color: #fff
                }

                #courseDetail .courseService li:nth-child(2) span {
                    line-height: 12px
                }

            #courseDetail .courseService li i {
                font-size: 40px;
                line-height: 58px;
                color: #f65a4e
            }

            #courseDetail .courseService li .phone {
                display: flex;
                flex-direction: column;
                justify-content: center
            }

            #courseDetail .courseService li .helpline {
                width: 150px;
                height: 66px;
                background-color: transparent;
                background-image: url(../images/helpline-bg.png);
                background-size: contain;
                position: absolute;
                top: 16px;
                left: -165px;
                display: none;
                color: #fff;
                box-sizing: border-box;
                padding: 10px 0
            }

                #courseDetail .courseService li .helpline em {
                    font-style: italic;
                    margin-left: -15px
                }

                #courseDetail .courseService li .helpline p {
                    text-indent: -10px
                }

        #courseDetail .courseService .callme:hover .helpline {
            display: block
        }

    #courseDetail .courseplan-teacher-pic .t-pic {
        height: 37px;
        width: 37px;
        overflow: hidden;
        margin-right: 5px;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        -o-border-radius: 50%
    }

    #courseDetail .courseplan-flex {
        display: flex;
        flex-direction: column;
        justify-content: space-between
    }

.outline-conten {
    margin: auto;
    box-shadow: 0px 4px 18px 0px rgba(152,186,255,0.24)
}

    .outline-conten dl {
        margin-bottom: 0 !important;
        box-sizing: border-box
    }

        .outline-conten dl dt {
            height: 56px;
            line-height: 56px;
            background-color: #f8fafb;
            box-sizing: border-box;
            padding: 0 40px 0 52px;
            position: relative
        }

            .outline-conten dl dt::before {
                content: '';
                width: 4px;
                height: 16px;
                background-color: #0063e9;
                position: absolute;
                left: 32px;
                top: 20px
            }

        .outline-conten dl dd {
            height: 63px;
            line-height: 63px;
            margin: 0 40px 0 42px;
            box-sizing: border-box;
            padding: 0 0 0 20px;
            border-bottom: 1px solid #e4e4e4;
            position: relative
        }

            .outline-conten dl dd:nth-last-child(1) {
                border-bottom: none
            }

            .outline-conten dl dd .label {
                width: 74px;
                height: 26px;
                line-height: 20px;
                margin-top: 18px;
                margin-left: -10px;
                margin-right: 40px;
                color: #448aca;
                border-radius: 0px 16px 0px 16px;
                border: solid 1px #448aca
            }

    .outline-conten .try-see {
        width: 60px;
        height: 26px;
        line-height: 26px;
        cursor: pointer;
        text-align: center;
        color: #65a6fe;
        background-color: #ffffff;
        border-radius: 4px;
        border: solid 1px #65a6fe;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%)
    }

    .outline-conten .live-time {
        color: #d10000;
        position: absolute;
        right: 0
    }

.selectedBackgroundColor {
    background-color: #0063e9 !important;
    color: #0063e9 !important
}

.displayNone {
    display: none !important
}

.order-detail {
    padding-top: 40px;
    padding-bottom: 60px
}

    .order-detail .detail-contents {
        background-color: #fff;
        padding: 40px
    }

        .order-detail .detail-contents .order {
            display: flex;
            align-content: center
        }

            .order-detail .detail-contents .order .icon {
                display: inline-block;
                width: 4px;
                height: 18px;
                background-color: #65a6fe;
                margin-right: 8px
            }

            .order-detail .detail-contents .order .number {
                line-height: 18px;
                color: #454545
            }

        .order-detail .detail-contents .goods {
            margin-top: 40px;
            padding: 28px;
            background-color: #f8fafb
        }

            .order-detail .detail-contents .goods .img {
                width: 200px;
                height: 120px
            }

            .order-detail .detail-contents .goods .content {
                height: 120px;
                margin-left: 25px;
                display: flex;
                flex-direction: column;
                justify-content: space-around
            }

                .order-detail .detail-contents .goods .content .title {
                    max-width: 500px
                }

            .order-detail .detail-contents .goods .price {
                height: 120px;
                line-height: 120px
            }

                .order-detail .detail-contents .goods .price span {
                    color: #d10000;
                    font-weight: 600
                }

                    .order-detail .detail-contents .goods .price span em {
                        font-size: 14px
                    }

    .order-detail .pay .payment {
        margin-top: 47px
    }

    .order-detail .pay .methods {
        margin-top: 32px;
        display: flex
    }

        .order-detail .pay .methods .mode {
            width: 180px;
            height: 80px;
            background-color: #f1efef;
            border-radius: 10px;
            cursor: pointer;
            position: relative
        }

            .order-detail .pay .methods .mode:nth-child(1) {
                margin-right: 24px
            }

            .order-detail .pay .methods .mode .bgc-checked {
                width: 180px;
                height: 80px;
                position: absolute;
                top: 0;
                left: 0;
                border: 2px solid #ff0000;
                border-radius: 10px;
                background: url(../images/pay-checked.png) no-repeat 100%;
                background-position: 100% 100%
            }

        .order-detail .pay .methods .alipay {
            width: 180px;
            height: 80px;
            background: url(../images/alipay.png) no-repeat center;
            background-size: 70%
        }

        .order-detail .pay .methods .wechat {
            width: 180px;
            height: 80px;
            background: url(../images/wechat.png) no-repeat center;
            background-size: 80%
        }

    .order-detail .total-price {
        margin-top: 23px;
        margin-right: 28px
    }

        .order-detail .total-price p span {
            color: #d10000
        }

    .order-detail .pay-now {
        padding: 32px 28px 8px 0
    }

        .order-detail .pay-now button {
            width: 120px;
            height: 42px;
            background-color: #65a6fe;
            border-radius: 8px;
            color: #fff
        }

            .order-detail .pay-now button .orderLoading {
                display: inline-block
            }

                .order-detail .pay-now button .orderLoading img {
                    height: 26px;
                    width: 26px
                }

    .order-detail .popup-code {
        width: 450px;
        height: 420px;
        background-color: #fff;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        display: none
    }

        .order-detail .popup-code .mask {
            background-color: rgba(0,0,0,0.5);
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            margin: auto
        }

        .order-detail .popup-code .popup-content {
            position: absolute;
            z-index: 1000;
            width: 450px;
            height: 420px;
            background-color: #fff;
            text-align: center
        }

            .order-detail .popup-code .popup-content .title {
                padding: 32px 0
            }

            .order-detail .popup-code .popup-content .qrcode {
                width: 180px;
                height: 180px;
                margin: auto
            }

                .order-detail .popup-code .popup-content .qrcode img {
                    height: 180px;
                    width: 180px
                }

            .order-detail .popup-code .popup-content .tips {
                padding: 15px 0 20px
            }

            .order-detail .popup-code .popup-content .cancelPay {
                width: 60px;
                padding: 10px 0 10px;
                margin: auto;
                cursor: pointer
            }

            .order-detail .popup-code .popup-content .prompt {
                font-size: 14px;
                color: #ff0000;
                background-color: #fff
            }

.order-list {
    padding: 27px 24px
}

    .order-list .order {
        overflow: hidden;
        border-radius: 10px;
        border: solid 1px #dddddd;
        margin-bottom: 15px
    }

        .order-list .order:nth-last-child(1) {
            margin-bottom: 0
        }

        .order-list .order .order-header {
            padding: 0 25px;
            width: 100%;
            height: 42px;
            line-height: 42px;
            background-color: rgba(1,102,233,0.11);
            display: inline-flex;
            justify-content: space-between;
            border-bottom: 1px solid #e4e4e4
        }

            .order-list .order .order-header .number {
                color: #454545;
                margin-left: 7px
            }

            .order-list .order .order-header .reference {
                display: flex
            }

        .order-list .order .order-goods {
            padding: 20px 25px
        }

            .order-list .order .order-goods .img {
                width: 210px;
                height: 114px;
                background-color: #d7d7d7
            }

                .order-list .order .order-goods .img img {
                    width: 210px;
                    height: 114px
                }

            .order-list .order .order-goods .title {
                height: 114px;
                display: flex;
                flex-direction: column;
                justify-content: space-around;
                margin-left: 24px
            }

                .order-list .order .order-goods .title .name {
                    width: 350px
                }

                .order-list .order .order-goods .title .price {
                    color: #d10000
                }

            .order-list .order .order-goods .pay-btn {
                width: 122px;
                height: 114px;
                padding: 20px 0
            }

                .order-list .order .order-goods .pay-btn button {
                    width: 122px;
                    height: 36px;
                    line-height: 36px;
                    color: #fff;
                    font-size: 16px;
                    background-color: #65a6fe;
                    border-radius: 4px;
                    margin-bottom: 15px
                }

                .order-list .order .order-goods .pay-btn .cancel {
                    color: #666;
                    text-decoration: underline;
                    cursor: pointer
                }

                .order-list .order .order-goods .pay-btn .countdown {
                    color: #d10000;
                    font-size: 14px
                }

                .order-list .order .order-goods .pay-btn .paid {
                    height: 100%;
                    margin: auto 0;
                    line-height: 74px;
                    color: #666
                }

.order-popup {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.3)
}

    .order-popup .popup-box {
        width: 400px;
        padding: 20px 0;
        border-radius: 5px;
        box-shadow: 0 0 10px #5e5e5e;
        background-color: #fff;
        position: fixed;
        top: 30%;
        left: 50%;
        transform: translateX(-50%);
        text-align: center
    }

        .order-popup .popup-box .title {
            font-size: 18px;
            color: #333
        }

        .order-popup .popup-box .box-content {
            font-size: 16px;
            padding: 20px 0
        }

        .order-popup .popup-box .box-btn {
            padding: 10px 0
        }

            .order-popup .popup-box .box-btn button {
                width: 80px;
                height: 30px;
                background-color: #fff;
                margin: 0 10px;
                box-sizing: border-box;
                border-radius: 5px
            }

                .order-popup .popup-box .box-btn button:nth-child(1) {
                    background-color: #65a6fe;
                    color: #fff
                }

                .order-popup .popup-box .box-btn button:nth-child(2) {
                    border: 1px solid #ccc
                }

.video-content .class-video .gary-btn {
    border: solid 1px #999;
    color: #999;
    cursor: no-drop
}

.video-content .class-video p {
    margin: auto;
    width: 72px;
    height: 32px;
    text-align: center;
    line-height: 32px;
    font-size: 14px;
    border-radius: 6px;
    border: solid 1px #65a6fe;
    color: #65a6fe;
    cursor: pointer
}

.video-content .title span {
    display: inline-block;
    max-width: 500px;
    font-size: 14px;
    color: #333;
    line-height: 48px;
    vertical-align: middle
}

.video-content .title .iconfont {
    font-size: 20px;
    color: #65a6fe;
    margin-right: 10px;
    vertical-align: middle
}

#video-title {
    max-width: 600px
}

.gary-btn {
    border: solid 1px #999 !important;
    color: #999 !important
}

    .gary-btn:hover {
        background: transparent !important
    }

.course-intr {
    width: 100%;
    padding: 34px 26px 58px
}

    .course-intr img {
        max-width: 100%
    }

.mock-exam .mock-list {
    padding: 10px 32px 20px 47px;
    max-height: 438px;
    overflow-y: auto
}

    .mock-exam .mock-list .mock-item {
        border-bottom: solid 1px #e4e4e4
    }

        .mock-exam .mock-list .mock-item:nth-last-child(1) {
            border-bottom: none
        }

        .mock-exam .mock-list .mock-item p {
            height: 56px;
            display: flex;
            align-content: center
        }

            .mock-exam .mock-list .mock-item p i {
                line-height: 56px;
                font-size: 22px;
                color: #65a6fe
            }

        .mock-exam .mock-list .mock-item .mock-title {
            display: inline-block;
            font-size: 16px;
            color: #65a6fe;
            line-height: 56px;
            height: 56px;
            max-width: 600px
        }

        .mock-exam .mock-list .mock-item .mock-detail {
            padding-left: 25px;
            padding-bottom: 20px;
            display: flex;
            justify-content: space-between;
            align-content: center
        }

            .mock-exam .mock-list .mock-item .mock-detail > div {
                width: 120px
            }

            .mock-exam .mock-list .mock-item .mock-detail .time {
                font-size: 18px;
                line-height: 56px;
                color: #333333;
                font-weight: bold
            }

            .mock-exam .mock-list .mock-item .mock-detail .end-time {
                line-height: 56px
            }

                .mock-exam .mock-list .mock-item .mock-detail .end-time .hint {
                    font-size: 14px;
                    color: #666
                }

                .mock-exam .mock-list .mock-item .mock-detail .end-time .queue-time {
                    font-size: 14px;
                    color: #666
                }

                    .mock-exam .mock-list .mock-item .mock-detail .end-time .queue-time em {
                        color: #666
                    }

                    .mock-exam .mock-list .mock-item .mock-detail .end-time .queue-time .time-color {
                        display: inline-block;
                        height: 28px;
                        line-height: 28px;
                        padding: 0 8px;
                        border-radius: 4px;
                        background-color: #ef474d;
                        color: #fff
                    }

            .mock-exam .mock-list .mock-item .mock-detail .join {
                height: 100%;
                width: 120px
            }

                .mock-exam .mock-list .mock-item .mock-detail .join .immediately {
                    width: 100px;
                    height: 36px;
                    margin-top: 8px;
                    margin-bottom: 8px;
                    font-size: 14px;
                    line-height: 36px;
                    color: #fff;
                    border-radius: 6px;
                    background-color: #65a6fe
                }

                .mock-exam .mock-list .mock-item .mock-detail .join .full {
                    background-color: #999 !important
                }

#question-bank {
    padding-top: 73px;
    background-image: url("../images/question_top_bg.png");
    background-repeat: no-repeat;
    background-position: 0 0;
    position: relative
}

    #question-bank .question-bank-bg2 {
        height: 395px;
        background-color: transparent;
        position: absolute;
        width: 100%;
        bottom: 0;
        right: 0;
        background-image: url("../images/question_bottom_bg.png");
        background-repeat: no-repeat;
        background-position: 736px 0;
        z-index: 0
    }

    #question-bank .question-list {
        position: relative;
        z-index: 10;
        padding-bottom: 120px
    }

        #question-bank .question-list .question-list-item {
            float: left;
            box-sizing: border-box;
            width: 367px;
            height: 286px;
            padding: 13px 15px 16px 16px;
            background-color: #fff;
            box-shadow: 0px 5px 18px 0px rgba(30,32,115,0.15);
            border-radius: 10px;
            margin-right: 39px;
            margin-bottom: 59px;
            cursor: pointer;
            overflow: hidden;
            transition: transform .8s
        }

            #question-bank .question-list .question-list-item:nth-child(3n) {
                margin-right: 0px
            }

            #question-bank .question-list .question-list-item:hover {
                transform: translateY(-12px);
                box-shadow: 0 15px 30px rgba(30,32,115,0.15)
            }

            #question-bank .question-list .question-list-item .img-box {
                width: 336px;
                height: 202px;
                background-color: #e5e5e5;
                position: relative
            }

                #question-bank .question-list .question-list-item .img-box > img {
                    width: 336px;
                    height: 202px
                }

                #question-bank .question-list .question-list-item .img-box .play-icon {
                    width: 54px;
                    height: 54px;
                    background-color: #fff;
                    box-shadow: 0px 3px 9px 0px rgba(34,105,202,0.14);
                    border-radius: 50%;
                    position: absolute;
                    z-index: 5;
                    bottom: -27px;
                    right: 24px;
                    line-height: 54px;
                    text-align: center;
                    box-sizing: border-box
                }

                    #question-bank .question-list .question-list-item .img-box .play-icon .icon-triangle {
                        padding-left: 6px
                    }

            #question-bank .question-list .question-list-item .question-title > p {
                width: 80%;
                font-size: 20px;
                letter-spacing: 1px;
                color: #333333;
                font-weight: bold;
                margin-top: 5px
            }

            #question-bank .question-list .question-list-item .last-record {
                display: flex;
                justify-content: space-between;
                margin-top: 5px
            }

                #question-bank .question-list .question-list-item .last-record .record-text {
                    width: 60%;
                    color: #666
                }

                #question-bank .question-list .question-list-item .last-record .icon-text {
                    color: #63a5fe;
                    font-size: 14px;
                    line-height: 26px;
                    width: 66px
                }

    #question-bank .question-subjects .question-crumbs {
        height: 60px;
        margin-top: -73px;
        background-color: transparent
    }

        #question-bank .question-subjects .question-crumbs > .w1180 .crumb-item .crumbs-next {
            padding: 0 3px;
            color: #999999
        }

        #question-bank .question-subjects .question-crumbs > .w1180 .crumb-item > .crumbs-tit {
            line-height: 60px;
            font-size: 16px;
            color: #666;
            cursor: pointer
        }

        #question-bank .question-subjects .question-crumbs > .w1180 .crumb-item > .current-crumbs {
            color: #3e89f8
        }

    #question-bank .subjects-title {
        display: flex;
        height: 55px;
        justify-content: space-between
    }

        #question-bank .subjects-title .subjects-items {
            width: 65%;
            display: flex;
            justify-content: space-between
        }

            #question-bank .subjects-title .subjects-items .sub-title {
                max-width: 110px;
                padding-top: 15px;
                line-height: 48px;
                font-size: 18px;
                color: #333333;
                font-weight: bold
            }

            #question-bank .subjects-title .subjects-items .sub-list, #question-bank .subjects-title .subjects-items .sec-list {
                line-height: 22px;
                padding-top: 12px;
                text-align: center
            }

                #question-bank .subjects-title .subjects-items .sub-list .count, #question-bank .subjects-title .subjects-items .sec-list .count {
                    font-weight: bold;
                    font-size: 16px
                }

                #question-bank .subjects-title .subjects-items .sub-list .sub-text, #question-bank .subjects-title .subjects-items .sec-list .sub-text {
                    color: #999999;
                    font-size: 14px
                }

        #question-bank .subjects-title .subjects-text {
            padding-top: 35px;
            width: 30%;
            text-align: center;
            color: #63a5fe;
            font-size: 14px
        }

    #question-bank .subjects-or-sections-content {
        min-height: 730px
    }

        #question-bank .subjects-or-sections-content .sections-cont {
            padding-bottom: 250px;
            position: relative;
            z-index: 10
        }

            #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content {
                display: flex;
                justify-content: space-between
            }

                #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-left {
                    width: 406px;
                    height: 603px;
                    background-color: #ffffff;
                    box-shadow: 1px 3px 18px 0px rgba(20,20,20,0.15);
                    border-radius: 10px;
                    overflow-y: auto;
                    cursor: pointer
                }

                    #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-left::-webkit-scrollbar {
                        width: 3px;
                        height: 10px
                    }

                    #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-left::-webkit-scrollbar-thumb {
                        background: #ccc;
                        border-radius: 3px
                    }

                    #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-left .sl-list .sl-list-item .item-boxs {
                        margin: 0 15px;
                        height: 68px;
                        line-height: 68px;
                        box-sizing: border-box;
                        border-bottom: 1px solid #eeeeee;
                        display: flex;
                        align-items: center
                    }

                        #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-left .sl-list .sl-list-item .item-boxs .dot {
                            width: 20px;
                            height: 20px;
                            background-color: #ffffff;
                            border: solid 1px #bfbfbf;
                            border-radius: 50%;
                            padding: 3px;
                            margin-right: 10px
                        }

                            #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-left .sl-list .sl-list-item .item-boxs .dot .filled-dot {
                                height: 12px;
                                width: 12px;
                                background-color: #d2d2d2;
                                border-radius: 50%;
                                overflow: hidden
                            }

                            #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-left .sl-list .sl-list-item .item-boxs .dot .filledDotBlue {
                                background-color: #63a5fe;
                                color: #63a5fe !important
                            }

                        #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-left .sl-list .sl-list-item .item-boxs .blueText {
                            color: #63a5fe !important
                        }

                    #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-left .sl-list .blueBgColor {
                        background-color: #eaf3ff
                    }

                #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-right {
                    width: 744px;
                    min-height: 603px;
                    background-color: #ffffff;
                    box-shadow: 1px 3px 18px 0px rgba(20,20,20,0.15);
                    border-radius: 10px;
                    padding: 50px;
                    padding-top: 40px
                }

                    #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-right .subject-title {
                        font-size: 20px;
                        font-weight: bold;
                        margin-bottom: 45px
                    }

                    #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-right .section-cont {
                        background-color: #ffffff;
                        border-radius: 10px;
                        border: solid 1px #e5e5e5
                    }

                        #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-right .section-cont .sc-main .scm-first-title, #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-right .section-cont .sc-main .scm-second-title {
                            height: 48px;
                            border-bottom: 1px solid #dcdcdc;
                            line-height: 48px;
                            padding: 0 23px;
                            font-size: 14px
                        }

                        #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-right .section-cont .sc-main .scm-second-title {
                            background-color: #eaf3ff;
                            display: flex;
                            justify-content: space-between
                        }

                            #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-right .section-cont .sc-main .scm-second-title .title-box {
                                max-width: 60%;
                                display: flex
                            }

                                #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-right .section-cont .sc-main .scm-second-title .title-box > p {
                                    text-indent: 25px
                                }

                            #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-right .section-cont .sc-main .scm-second-title > p {
                                max-width: 70%;
                                text-indent: 25px;
                                font-size: 14px;
                                color: #666666;
                                font-family: MicrosoftYaHei
                            }

                            #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-right .section-cont .sc-main .scm-second-title .scm-second-btn {
                                display: flex;
                                align-items: center
                            }

                                #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-right .section-cont .sc-main .scm-second-title .scm-second-btn .scm-blue-btn {
                                    display: inline-block;
                                    width: 80px;
                                    height: 26px;
                                    line-height: 26px;
                                    text-align: center;
                                    background-color: #63a5fe;
                                    border-radius: 13px;
                                    color: #fff;
                                    font-size: 14px;
                                    margin: 0 2.5px;
                                    cursor: pointer
                                }

                                #question-bank .subjects-or-sections-content .sections-cont .sectiongs-content .sections-right .section-cont .sc-main .scm-second-title .scm-second-btn .scm-blue-btn-lock {
                                    background-image: url("../images/question/question_lock.png");
                                    background-size: 80px 26px
                                }

    #question-bank .three-level {
        min-height: none !important
    }

#vocabulary {
    min-height: 648px
}

    #vocabulary .vocabulary-main {
        padding-top: 50px;
        height: 748px;
        background: url("../images/vocabulary/vocabulary_bg.png") no-repeat;
        background-size: 466px 530px;
        background-position: 90% 50px
    }

        #vocabulary .vocabulary-main .vocabulary-box {
            margin-top: 94px
        }

            #vocabulary .vocabulary-main .vocabulary-box .v-title {
                color: #3e89f8;
                font-size: 38px;
                line-height: 38px;
                font-weight: bold
            }

            #vocabulary .vocabulary-main .vocabulary-box .describe {
                margin-top: 75px
            }

                #vocabulary .vocabulary-main .vocabulary-box .describe > ul > li .roundness {
                    display: inline-block;
                    width: 12px;
                    height: 12px;
                    background-color: #65a6fe;
                    border-radius: 50%;
                    margin-right: 10px
                }

                #vocabulary .vocabulary-main .vocabulary-box .describe > ul > li .des-text {
                    font-size: 20px;
                    color: #333;
                    line-height: 40px
                }

            #vocabulary .vocabulary-main .vocabulary-box .v-btn {
                margin-top: 50px
            }

                #vocabulary .vocabulary-main .vocabulary-box .v-btn .v-touch {
                    width: 169px;
                    height: 46px;
                    background-color: #65a6fe;
                    border-radius: 6px;
                    font-size: 16px;
                    color: #fff;
                    line-height: 46px
                }

                #vocabulary .vocabulary-main .vocabulary-box .v-btn .start-test {
                    margin-bottom: 30px
                }

                #vocabulary .vocabulary-main .vocabulary-box .v-btn .afresh-test {
                    margin-right: 20px
                }

                #vocabulary .vocabulary-main .vocabulary-box .v-btn .tested {
                    display: flex
                }

                    #vocabulary .vocabulary-main .vocabulary-box .v-btn .tested .test-res {
                        position: relative
                    }

                        #vocabulary .vocabulary-main .vocabulary-box .v-btn .tested .test-res .triangle {
                            position: absolute;
                            right: 20px;
                            top: 50%;
                            transform: translateY(-50%);
                            display: inline-block;
                            width: 14px;
                            height: 14px;
                            background-image: url("../images/vocabulary/triangle.png");
                            background-size: 14px 14px
                        }

                    #vocabulary .vocabulary-main .vocabulary-box .v-btn .tested .select-box .test-res-list {
                        border: 1px solid #65a6fe;
                        margin-top: -3px;
                        max-height: 186px;
                        overflow-y: auto
                    }

                        #vocabulary .vocabulary-main .vocabulary-box .v-btn .tested .select-box .test-res-list > li {
                            height: 46px;
                            line-height: 46px;
                            text-align: center;
                            border-bottom: 1px solid #65a6fe;
                            cursor: pointer
                        }

                            #vocabulary .vocabulary-main .vocabulary-box .v-btn .tested .select-box .test-res-list > li:nth-last-child(1) {
                                border-bottom: none
                            }

                            #vocabulary .vocabulary-main .vocabulary-box .v-btn .tested .select-box .test-res-list > li:hover {
                                background-color: #65a6fe;
                                color: #fff
                            }

.c-subject-name {
    font-size: 24px;
    color: #2a2a2a;
    font-weight: bold;
    margin-right: 40px;
    line-height: 60px;
    transform: translateY(3px);
    display: inline-block
}

.subnav-V2 .active_new {
    color: #ffffff !important;
    display: inline-block;
    padding: 0 20px;
    height: 30px;
    line-height: 32px;
    margin: 13px 15px;
    background-color: #d21112;
    border-radius: 17px;
    font-weight: 600
}

.subnav-V2 .active, .subnav-V2 a:hover {
    font-weight: 600
}

.c-subject-items > a {
    padding: 0 20px;
    height: 30px !important;
    line-height: 32px !important;
    margin: 13px 10px !important;
    background-color: #fff;
    border-radius: 17px
}

.new-input-search {
    width: 300px;
    height: 41px;
    background-color: #ffffff;
    border-radius: 20px
}

    .new-input-search > .new-search-input {
        width: 300px;
        height: 41px;
        line-height: 41px;
        border: solid 1px #e4e4e4;
        border-radius: 20px
    }

.read-type-search i {
    top: 10px
}

.read-type-search ul.read-search-result {
    top: 51px;
    width: 300px
}

.read-type-main-v2-new a {
    min-width: 100px
}

.read-type-main-v2 .active, .read-type-detail-v2 .active {
    color: #d21112
}

.read-type-main-v2 a:hover, .read-type-detail-v2 a:hover {
    color: #d21112
}

.read-type-detail-v2 {
    padding-left: 122px
}

.eye-protect-mask {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none;
    background-color: #eee3bf;
    opacity: .1;
    z-index: 999999
}

.pubTop-active i, .pubTop-active a {
    color: #3e89f8 !important
}
