ul, li {
    list-style: none;
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
}

body {
    font-size: 14px;
}

.clearFix {
    &:before, &:after {
        content: "";
        display: table;
    }
    &:after {
        clear: both;
    }
    /* If supporting IE 6/7 */
    *zoom: 1;
}

.table {
    width: 100%;

    border-spacing: 0;

    border-collapse: collapse;

    th {
        font-weight: normal;
    }

    th, td {
        // padding: 0 10px;
    }

    .table-emptyData {
        display: none;

        text-align: center;
    }
}

.header {
    width: 100%;
    height: 90px;
    /*background: #4b2c2c;*/
}

.header .header-container {
    width: 1140px;
    margin: auto;
    height: 100%;
}

.header .header-container .logo {
    float: left;
}

.header .header-container p {
    display: inline-block;
    margin: 0;
    padding: 0;
    color: #87a1d0;
}

.header .header-container .title {
    font-size: 30px;
    margin-left: 40px;
    line-height: 90px;
    height: 90px;
    color: #7582a0;
}

.header .header-container .phone-number {
    height: 90px;
    line-height: 90px;
    float: right;
    font-size: 16px;
}

.header .header-container .icon-phone {
    vertical-align: middle;
    margin: 15px;
    margin-top: 10px;
}

.nav {
    width: 100%;
    height: 59px;
    background-image: url(../images/bg-1.png?v=1.1.7);
}

.nav .nav-container {
    width: 1140px;
    margin: auto;
    height: 100%;
}

.nav .nav-container a {
    width: 179px;
    height: 59px;
    float: left;
    display: block;
}

.nav .nav-container .nav-1 {
    background-image: url(../images/nav-button-1.png?v=1.1.7);
    width: 165px;
}

.nav .nav-container .nav-1:hover {
    background-image: url(../images/nav-button-1-hover.png?v=1.1.7);
    width: 165px;
}

.nav .nav-container .nav-6 {
    background-image: url(../images/nav-button-6.png?v=1.1.7);
    width: 179px;
}

.nav .nav-container .nav-6:hover {
    background-image: url(../images/nav-button-6-hover.png?v=1.1.7);
    width: 179px;
}

.nav .nav-container .nav-7 {
    background-image: url(../images/nav-button-7.png?v=1.1.7);
    width: 179px;
}

.nav .nav-container .nav-7:hover {
    background-image: url(../images/nav-button-7-hover.png?v=1.1.7);
    width: 179px;
}

.nav .nav-container .nav-2 {
    background-image: url(../images/nav-button-2.png?v=1.1.7);
}

.nav .nav-container .nav-2:hover {
    background-image: url(../images/nav-button-2-hover.png?v=1.1.7);
}

.nav .nav-container .nav-3 {
    background-image: url(../images/nav-button-3.png?v=1.1.7);
}

.nav .nav-container .nav-3:hover {
    background-image: url(../images/nav-button-3-hover.png?v=1.1.7);
}

.nav .nav-container .nav-4 {
    background-image: url(../images/nav-button-4.png?v=1.1.7);
    width: 174px;
}

.nav .nav-container .nav-4:hover {
    background-image: url(../images/nav-button-4-hover.png?v=1.1.7);
    width: 174px;
}

.nav .nav-container .nav-5 {
    background-image: url(../images/nav-button-5.png?v=1.1.7);
    width: 174px;
}

.nav .nav-container .nav-5:hover {
    background-image: url(../images/nav-button-5-hover.png?v=1.1.7);
    width: 174px;
}

.block-0 {
    width: 100%;
    height: 380px;
    background: #eaeff9;
}

.block-0 .block-0-container {
    width: 1140px;
    height: 100%;
    margin: auto;
    position: relative;
}

.block-0 .block-0-container .pay-btn {
    position: absolute;
    bottom: 40px;
    left: 0;
    cursor: pointer;
}

.block-1 {
    background-image: url(../images/block-1.jpg?v=1.1.7);
    width: 1140px;
    height: 319px;
    margin: auto;
    margin-top: 23px;
    position: relative;
}

.block-1 a {
    position: absolute;
    right: 36px;
    top: 12px;
    color: #274378;
}

.block-2 {
    background-image: url(../images/block-2.jpg?v=1.1.7);
    width: 1140px;
    height: 252px;
    margin: auto;
    margin-top: 23px;
}

.block-2 ul {
    padding: 70px 0px;
    margin-left: 24px;
}

.block-2 li {
    width: 206px;
    height: 130px;
    position: relative;
    float: left;
    margin: 0 6px;
}

.block-2 li .icon {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -23.5px;
    margin-top: -23.5px;
}

.block-2 li p {
    margin: 0;
    padding: 0;
    font-size: 14px;
    text-align: center;
    color: #666666;
}

.course-block {
    width: 1138px;
    margin: auto;
    margin-top: 23px;
    border: 1px solid #dddddd;
    background: #f4f4f4;
    border-radius: 5px;
    margin-bottom: 30px;
}

.course-block.top {
    margin-top: 130px;
}

/*.course-detail .course-detail--1 {
    height: 1300px;
}*/

.course-detail .course-detail--2,
.course-detail .course-detail--3 {
    display: none;
}

.course-detail .course-detail--3 {
    overflow: hidden;
}
.course-detail .course-detail--3 table {
    width: 315px;
    display: inline-block;
    margin: 30px;

    float: left;
}

.course-detail .title {
    /*background-image: url(../images/block-3-title.jpg);*/
    width: 1132px;
    height: 41px;
    margin: 0 auto;
    padding: 0;

    text-align: center;
    line-height: 40px;
    font-size: 18px;
    background: #326cbe;
    color: #ffffff;
    width: 100%;
    font-weight: bold;
}

.course-detail table {
    width: 1080px;
    margin: 25px auto;
    font-size: 12px;
}

.course-detail table thead td {
    background: #316cbe;
    color: #ffffff;
    height: 33px;
    text-align: center;
    padding: 0;
    margin: 0;
    border-bottom: 6px solid #f4f4f4;
    font-weight: bold;
}

.course-detail table .table-item {

    height: 34px;
    color: #316cbe;
    text-align: center;
}

.course-detail table .odd {
    background: #e3edfa;
}
.course-detail table .even {
    background: #d8e5f6;
}

.course-detail table .table-item a {
    color: #316cbe;
}

.course-detail table .table-item .item-1 {
    background: #6796d8;
}

.course-detail table .table-item .item-7 {
    background: #d8e5f6;
}

.course-detail table .table-item .item-7 span {
    background-image: url(../images/pay.png?v=1.1.7);
    background-repeat: no-repeat;
    width: 97px;
    height: 101px;
    display: block;
    margin: auto;

    /*display: block;
    width: 36px;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    margin: auto;
    padding: 27px 31px;
    background: #316cbe;
    color: #ffffff;
    border-radius: 10px;
    cursor: pointer;*/
}

.course-detail table .table-item .item-4 {
    color: #333333;
}

.course-detail table .table-item .item-2 {
    text-align: left;
    text-indent: 58px;
}

.course-detail table .table-empty {
    height: 14px;
    background: #f4f4f4;
}

.block-4 {
    width: 1140px;
    margin: auto;
    margin-top: 23px;
    overflow: hidden;
    margin-bottom: 20px;
}

.block-4 a {
    color: #666666;
}

.block-4 div {
    margin-bottom: 11px;
    float: left;
    margin-right: 12px;
}

.block-4 ul {
    margin-top: 58px;
    font-size: 14px;
    padding: 0 15px;
}

.block-4 ul li {
    list-style-type: disc;
    text-indent: -5px;
    margin-left: 20px;
    color: #666666;
    margin-bottom: 12px;
}

.block-4 .b-1 {
    background-image: url(../images/1.jpg?v=1.1.7);
    width: 356px;
    height: 252px;
}
.block-4 .b-2 {
    background-image: url(../images/2.jpg?v=1.1.7);
    width: 356px;
    height: 252px;
}

.block-4 .b-2 p {
    width: 313px;
    height: 165px;
    margin: auto;
    position: relative;
    margin-top: 67px;
}

.block-4 .b-2 p .icon-play {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -23.5px;
    margin-top: -23.5px;
}

.block-4 .b-3 {
    background-image: url(../images/3.jpg?v=1.1.7);
    width: 356px;
    height: 252px;
}
.block-4 .b-4 {
    background-image: url(../images/4.jpg?v=1.1.7);
    width: 356px;
    height: 252px;
}

.block-4 .b-4 table {
    text-align: center;
    font-size: 14px;
    width: 100%;
    margin-top: 42px;
    color: #666666;
}

.block-4 .b-4 table thead {
    font-weight: bold;
    line-height: 45px;
}

.block-4 .b-4 table tbody tr {
    height: 27px;
}

.block-4 .b-5 {
    background-image: url(../images/5.jpg?v=1.1.7);
    width: 401px;
    height: 465px;
    float: right;
    margin-right: 0;
    padding-top: 50px;
}

.block-4 .b-5 .contarent {
    font-size: 14px;
    margin: 30px;
    margin-top: 0;
    line-height: 25px;
    text-indent: 26px;
}

.b-5--container {
    margin: 0;
    height: 450px;
    overflow: hidden;
    overflow-y: auto;
    width: 103%;
}

.block-4 .b-5 table {
    text-align: center;
    font-size: 14px;
    width: 380px;
    color: #666666;
    margin: 10px;
    color: #666666;
}

.block-4 .b-5 table thead {
    font-weight: bold;
    line-height: 30px;
    background: #6796d8;
    color: #ffffff;
}

.block-4 .b-5 table tbody tr {
    height: 27px;
}

.block-4 .b-5 table tbody .item {
    background: #d8e5f6;
}

.login-block, .user-info-block {
    position: absolute;
    right: 0;
    top: 43px;
    background-image: url(../images/login-block.png?v=1.1.7);
    width: 348px;
    height: 307px;
}

.user-info-block .alert {
    text-align: center;
    padding: 0;
    margin: 0;
    font-size: 20px;
    font-weight: bold;
    color: #ff6f38;
    margin-top: 84px;
}

.user-info-block .to-center {
    background-image: url(../images/center.png?v=1.1.7);
    width: 286px;
    height: 42px;
    display: block;
    margin: auto;
    margin-top: 70px;
}

.user-info-block .user-info {
    font-size: 14px;
    text-align: center;
}

.user-info-block .exit {
    font-size: 12px;
    position: absolute;
    right: 27px;
    top: 18px;
    color: #ffffff;
}

.icon-exit {
    vertical-align: middle;
    position: relative;
    top: -2px;
    margin-right: 5px;
}

.user-info-block {
    display: none;
}

.login-block form {
    margin: 30px;
    margin-top: 98px;
}

.login-block form .form-group {
        margin-bottom: 20px;
}

.login-block form label {
    font-size: 14px;
    width: 70px;
    display: inline-block;
}

.login-block form input {
    width: 197px;
    height: 35px;
    border: 1px solid #8290ae;
    border-radius: 5px;
    padding: 0 5px;
}

.login-block form .checkcode {
    width: 90px;
}

.login-block form .valiimg {
    height: 36px;
    width: 73px;
    vertical-align: middle;
    position: relative;
    top: -1px;
    border: 1px solid #dddddd;
    border-radius: 5px;
    margin-left: 26px;
    cursor: pointer;
    display: inline-block;
}

.login-block form .error {
    position: absolute;
    color: red;
    display: none;
    padding: 0;
    margin: 0;
    font-size: 12px;
}

.login-block .login-button {
    width: 286px;
    display: block;
    height: 38px;
    border: 1px solid #7595ce;
    text-align: center;
    line-height: 38px;
    color: #ffffff;
    background: #7595ce;
    font-weight: bold;
    margin-top: 30px;
    border-radius: 5px;
}

.video-wrap, .login-dialog, .recommend-dialog {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(18, 18, 18, 0.75);
    display: none;
}

.video-wrap .video {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -350px;
    margin-top: -200px;
    width: 700px;
    height: 400px;
}

.video-wrap .video .clear {
    position: absolute;
    top: -21px;
    left: 100%;
    color: #ffffff;
    display: inline-block;
    float: right;
    cursor: pointer;
}

.plan-header {
    overflow: hidden;
    background: #3d3d3d;
    color: #ffffff;
    padding-left: 20px;
    padding-bottom: 20px;
    border-bottom: 3px solid #f39f53;
}

.plan-header img {
    width: 80px;
    margin-left: 5px;
    vertical-align: middle;
}

.plan-header h1 {
    font-size: 32px;
}

.plan-header h3 {
    margin-top: 5px;
    display: inline-block;
    font-size: 16px;
    float: right;
    margin-right: 20px;
    display: none;
    margin-bottom: 0;
}

.plan-header h3 span {
    color: #d2666d;
}

.login-dialog .plan-header {
    display: none;
}

.login-dialog .login-block {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -174px;
    margin-top: -153.5px;
}

.login-dialog .login-block .clear {
    position: absolute;
    top: -21px;
    left: 100%;
    color: #ffffff;
    display: inline-block;
    float: right;
    cursor: pointer;
}

.recommend-dialog .recommend-block {
    width: 400px;
    height: auto;
    /*background: #ffffff;*/
    padding: 20px;
    position: absolute;
    margin-left: -200px;
    margin-top: -180px;
    left: 50%;
    top: 50%;

    background: #316cbe;
    color: #ffffff;
    border: 3px solid #689ee1;
    border-radius: 10px;
}

.recommend-dialog .recommend-block .clear {
    position: absolute;
    color: #ffffff;
    display: inline-block;
    float: right;
    cursor: pointer;

    height: 30px;
    width: 30px;
    text-align: center;
    line-height: 30px;
    border: 3px solid #689ee1;
    border-radius: 50%;
    background: #316cbe;
    top: -15px;
    right: -15px;
    left: auto;
}

.recommend-dialog .recommend-block .title {
    padding: 0;
    margin: 0;
    font-size: 22px;
    text-align: center;
}

.recommend-dialog .recommend-block p {
    text-indent: 28px;
    font-size: 14px;
    line-height: 26px;
}

/*.user-info {
    display: none;
    position: absolute;
    right: 0;
    top: 43px;
    font-size: 24px;
    color: #374d81;
}*/

.icon-upload {
    vertical-align: middle;
}

.upload {
    margin: 0;
    padding: 0;
    font-size: 12px;
    text-align: right;
    margin-top: -14px;
    margin-right: 6px;
    color: #526290;
    cursor: pointer;
}

.footer p {
    margin: 0;
    padding: 0;
}

.video-link {
    cursor: pointer;
}

.block-ad-1 {
    background-image: url(../images/1140100.jpg?v=1.1.7);
    background-repeat: no-repeat;
    height: 100px;
    width: 1140px;
    margin: auto;
    margin-top: 20px;
    cursor: pointer;
}

.fixed-right {
    position: fixed;
    top: 50%;
    left: 50%;
    margin-left: 580px;
    margin-top: -50px;
    cursor: pointer;
}

.fixed-left {
    position: fixed;
    bottom: -280px;
    left: 0;
    /*margin-left: 580px;*/
    /*margin-bottom: 0;*/
    cursor: pointer;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.fixed-left.active {
    bottom: 0;
}

.fixed-left span {
    position: absolute;
    right: 0;
    display: block;
    width: 20px;
    height: 20px;
    line-height: 19px;
    text-align: center;
    border: 1px solid #a6a6a6;
    color: #a6a6a6;
    border-radius: 50%;
    background: #fffbf4;
}

/*.fixed-right span {
    background-image: url(../images/pay.png?v=1.1.7);
    background-repeat: no-repeat;
    width: 97px;
    height: 101px;
    display: block;
    margin: auto;
}*/


.course-nav {
    width: 1138px;
    margin: auto;
    clear: both;
    height: 70px;
    margin-top: 30px;
    background: #f4f4f4;

    border: 1px solid #dddddd;
    /*border-bottom: 3px solid #326cbe;*/

    /*transition: all .5s;*/
}

.course-nav.fixed {
    position: fixed;
    top: 0;
    margin: 0;
    left: 50%;
    margin-left: -570px;

    /*padding-bottom: 20px;*/
    /*border: 0;*/
}

.course-nav li {
    float: left;
    height: 70px;
    line-height: 70px;
    text-align: center;
    color: #326cbe;
    background: #f4f4f4;
    width: 150px;
    /*border-bottom: 3px solid #326cbe;*/
    cursor: pointer;

    /*font-weight: bold;*/
    font-size: 16px;
}

.course-nav li.active {
    /*border-bottom: 3px solid #011c42;*/
    font-weight: bold;
    background: #e3edfb;
}

.recommend-0-block {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -277px;
    margin-left: -375px;
}

.recommend-0-block .clear {
    background: url(../images/close.png?v=1.1.7);
    width: 29px;
    height: 29px;
    z-index: 99999;
    position: absolute;
    right: -5px;
    top: -7px;
}

.course-nav .buy-button {
    background: #df6547;
    color: #ffffff;
    border: 1px solid #df6547;
    float: right;
    margin-top: -1px;
    margin-right: -1px;
}

@media screen and (max-width: 900px) {
    html {
        position: relative;
        overflow: hidden;
        width: 100vw;
        height: 100vh;
    }
    body {
        overflow: hidden;
        width: 100vw;
        height: 100vh;
        position: relative;
    }

    .login-dialog {
        display: block;
        /*background: #7e7e7e;*/
        background: #ebeff9;
        background-image: url(../images/mbg.png?v=1.1.7);
        background-position: 0px -25px;
        -webkit-background-size: cover;
        background-size: cover;
        position: absolute;
    }

    .login-dialog .plan-header {
        display: block !important;
    }

    .login-dialog .login-block .clear {
        display: none;
    }

    .fixed-order {
        display: none;
    }
}