.course-item-nav {
    background-color: #fff;
    padding-bottom: 20px
}

.course-item-nav .nav-wrapper {
    margin-left: -5px;
    margin-right: -5px
}

.course-item-nav .nav-wrapper+.nav-wrapper {
    border-top: 1px solid #e5e5e5;
    margin-top: 12px
}

.course-item-nav a {
    display: block;
    float: left;
    height: 30px;
    line-height: 30px;
    margin-top: 12px;
    margin-left: 5px;
    margin-right: 5px;
    padding-left: 10px;
    padding-right: 10px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #4d4d4d
}
.g-breadcrumb{padding-top:2em !important;}

.course-item-nav a.active,
.course-item-nav a:hover {
    color: #0f6af3
}

.course-item-nav a.active {
    background-color: #0f6af3;
    color: #fff
}

.course-item-nav .active1 {
    color: #0f6af3;
    font-weight: 700
}

.course-item-nav .active1:hover {
    color: #0f6af3;
    background-color: none
}

.course-item-nav .yards-info-wrapper {
    width: 100%;
    padding: 20px;
    height: 120px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    margin-bottom: 15px;
    margin-top: 30px;
    background-color: #f7f8fa
}

.course-item-nav .yards-info-wrapper .img {
    width: 80px;
    height: 80px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color: #fff;
    margin-right: 20px;
    float: left
}

.course-item-nav .yards-info-wrapper .info-item {
    float: left;
    line-height: 80px
}

.course-item-nav .yards-info-wrapper .info-item .info-title-wrapper {
    float: left;
    margin-right: 30px
}

.course-item-nav .yards-info-wrapper .info-item .info-title-wrapper .info-title {
    font-size: 22px;
    margin-right: 15px;
    color: #3e454d
}

.course-item-nav .yards-info-wrapper .info-item .info-title-wrapper .course-num {
    padding-left: 15px;
    font-size: 16px;
    color: #9399a5;
    border-left: 1px solid #9399a5;
    vertical-align: top
}

.course-item-nav .yards-info-wrapper .info-item .desc-wrapper {
    float: left;
    color: #9399a5;
    font-size: 16px;
    max-width: 800px
}

.course-item-nav .yards-info-wrapper .info-item .desc-wrapper p {
    margin-bottom: 0
}

@media (max-width:1200px) {
    .course-item-nav .yards-info-wrapper {
        padding-left: 10px;
        padding-right: 10px
    }

    .course-item-nav .yards-info-wrapper .info-item {
        line-height: 35px;
        padding-top: 5px;
        width: 85%
    }

    .course-item-nav .yards-info-wrapper .info-item .info-title-wrapper {
        float: none
    }

    .course-item-nav .yards-info-wrapper .info-item .desc-wrapper {
        float: none;
        max-width: none
    }

    .course-item-nav .yards-info-wrapper .info-item.only-title {
        line-height: 80px
    }
}

@media (max-width:1199px) and (min-width:768px) {
    .course-item-nav {
        padding-bottom: 15px
    }

    .course-item-nav .nav-wrapper {
        margin-left: -10px;
        margin-right: -10px
    }

    .course-item-nav .nav-wrapper+.nav-wrapper {
        margin-top: 15px
    }

    .course-item-nav a {
        height: 28px;
        line-height: 28px;
        margin-top: 10px;
        margin-left: 10px;
        margin-right: 10px
    }
}

@media (max-width:767px) {
    .course-item-nav {
        padding-bottom: 10px
    }

    .course-item-nav .nav-wrapper {
        margin-left: 0;
        margin-right: 0
    }

    .course-item-nav .nav-wrapper+.nav-wrapper {
        margin-top: 10px
    }

    .course-item-nav a {
        height: 24px;
        line-height: 24px;
        margin-top: 10px;
        margin-left: 0;
        margin-right: 0
    }






}

@media (max-width:740px) {
    .course-item-nav .yards-info-wrapper {
        margin-top: 10px
    }

    .course-item-nav .yards-info-wrapper .info-item {
        width: 80%
    }
}

@media (max-width:570px) {
    .course-item-nav .yards-info-wrapper {
        height: 100px
    }

    .course-item-nav .yards-info-wrapper .img {
        width: 60px;
        height: 60px;
        margin-right: 10px
    }

    .course-item-nav .yards-info-wrapper .info-item {
        line-height: 25px
    }

    .course-item-nav .yards-info-wrapper .info-item .info-title-wrapper .info-title {
        font-size: 18px;
        margin-right: 15px
    }

    .course-item-nav .yards-info-wrapper .info-item .desc-wrapper,
    .course-item-nav .yards-info-wrapper .info-item .info-title-wrapper .course-num {
        font-size: 14px
    }

    .course-item-nav .yards-info-wrapper .info-item.only-title {
        line-height: 55px
    }
}

@media (max-width:410px) {
    .course-item-nav .yards-info-wrapper .info-item {
        width: 75%
    }
}

.course-item-grid {
    margin-left: -18px;
    margin-right: -18px;
    margin-top: -36px
}

.course-item-grid [class*=col-] {
    padding-left: 18px;
    padding-right: 18px
}

.course-item-grid .item {
    display: block;
    margin-top: 36px;
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 96.336996337%;
    background-color: #fff
}

.course-item-grid .item .img {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 58.174904943%;
    overflow: hidden;
    -webkit-border-top-left-radius: 6px;
    -moz-border-radius-topleft: 6px;
    border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -moz-border-radius-topright: 6px;
    border-top-right-radius: 6px
}

.course-item-grid .item .img>img {
    width: 100%;
    -webkit-transition: all, .3s;
    -o-transition: all, .3s;
    -moz-transition: all, .3s;
    transition: all, .3s;
    -webkit-border-top-right-radius: 6px;
    -moz-border-radius-topright: 6px;
    border-top-right-radius: 6px
}

.course-item-grid .item .info {
    position: absolute;
    left: 0;
    right: 0;
    top: 58.174904943%;
    padding-top: 6.0836501901%;
    padding-left: 4.5627376426%;
    padding-right: 4.5627376426%;
    height: 41.825095057%
}

.course-item-grid .item .info .title {
    font-size: 16px
}

.course-item-grid .item .info .attr {
    position: absolute;
    width: 100%;
    left: 0;
    right: 0;
    bottom: 11.4068441065%;
    padding-left: 4.5627376426%;
    padding-right: 4.5627376426%
}

.course-item-grid .item .info .attr>* {
    float: left;
    line-height: 1;
    color: #9399a5
}

.course-item-grid .item .info .attr>* .iconfont {
    font-size: 14px;
    width: 20px;
    display: inline-block
}

.course-item-grid .item .info .attr-section {
    width: 84px
}

.course-item-grid .item .info .attr-price {
    float: right
}

.course-item-grid .item .info .attr-member {
    max-width: -webkit-calc(100% - 100px);
    max-width: -moz-calc(100% - 100px);
    max-width: calc(100% - 100px);
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.course-item-grid .item:hover .img>img {
    -webkit-transform: scale(1.08);
    -moz-transform: scale(1.08);
    -ms-transform: scale(1.08);
    -o-transform: scale(1.08);
    transform: scale(1.08)
}

.course-item-grid .item .updating {
    position: absolute;
    left: 0;
    top: 0;
    background: -webkit-gradient(linear, left top, right top, from(#ff6b00), to(#ff2e00));
    background: -webkit-linear-gradient(left, #ff6b00, #ff2e00);
    background: -moz-linear-gradient(left, #ff6b00, #ff2e00);
    background: -o-linear-gradient(left, #ff6b00, #ff2e00);
    background: linear-gradient(90deg, #ff6b00, #ff2e00);
    -webkit-border-top-left-radius: 6px;
    -moz-border-radius-topleft: 6px;
    border-top-left-radius: 6px;
    -webkit-border-bottom-right-radius: 6px;
    -moz-border-radius-bottomright: 6px;
    border-bottom-right-radius: 6px;
    z-index: 9;
    font-size: 12px;
    height: 22px;
    line-height: 22px;
    font-weight: 600;
    padding-left: 4px;
    padding-right: 4px;
    color: #fff
}

@media (max-width:1199px) {
    .course-item-grid {
        margin-left: -8px;
        margin-right: -8px;
        margin-top: -16px
    }

    .course-item-grid [class*=col-] {
        padding-left: 8px;
        padding-right: 8px
    }

    .course-item-grid .item {
        margin-top: 16px
    }
}

@media (max-width:1199px) and (min-width:768px) {
    .course-item-grid .item .info {
        padding-top: 3.0418250951%
    }

    .course-item-grid .item .info .attr-member em {
        display: none
    }
}

@media (max-width:767px) {
    .course-item-grid .item .info .attr-section {
        width: auto;
        padding-right: 8px
    }
}

@media (max-width:540px) {
    .course-item-grid .item {
        padding-bottom: 100%
    }

    .course-item-grid .item .info {
        padding-top: 3.0418250951%
    }

    .course-item-grid .item .info .title {
        font-size: 14px
    }

    .course-item-grid .item .info .attr>*,
    .course-item-grid .item .info .attr>* .iconfont {
        font-size: 12px
    }

    .course-item-grid .item .info .attr>* .iconfont {
        width: 16px
    }

    .course-item-grid .item .info .attr-price .price {
        margin-top: -3px
    }
}

@media (max-width:440px) {
    .course-item-grid .item .info .attr-member em {
        display: none
    }
}

@media (max-width:375px) {
    .course-item-grid {
        margin-left: -5px;
        margin-right: -5px;
        margin-top: -10px
    }

    .course-item-grid [class*=col-] {
        padding-left: 5px;
        padding-right: 5px
    }

    .course-item-grid .item {
        margin-top: 10px
    }

    .course-item-grid .item .info .title {
        font-size: 13px
    }

    .course-item-grid .item .info .attr-section {
        padding-right: 4px
    }

    .course-item-grid .item .info .progress--label {
        width: 100%
    }
}

.progress--label {
    position: relative;
    width: 140px;
    min-height: 1px;
    overflow: hidden
}

.progress--label .progress--bar {
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -3px;
    width: 80px;
    min-height: 1px
}

.progress--label .progress--bar .progress,
.progress--label .progress--bar .progress-bar {
    line-height: 0;
    font-size: 0;
    height: 6px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.progress--label .progress--bar .progress {
    margin-bottom: 0;
    background-color: rgba(15, 106, 243, .1)
}

.progress--label .progress--bar .progress-bar {
    background-color: #0f6af3
}

.progress--label .progress--text {
    float: right !important;
    color: #676c73
}

@media (max-width:767px) {
    .progress--label {
        width: 128px
    }

    .progress--label .progress--text {
        font-size: 12px
    }
}

.item--attr>p {
    line-height: 1;
    margin-bottom: 0
}

.item--attr>p+p {
    margin-top: 18px
}

.item--attr>p .iconfont {
    color: #9399a5;
    width: 20px;
    font-size: 14px;
    display: inline-block
}

.item--attr>p .count-down,
.item--attr>p .text {
    color: #555
}

.item--attr>p .text .divider {
    color: #ccc;
    padding-left: 6px;
    padding-right: 6px
}

.item--attr>p.living .img-living {
    width: 14px;
    margin-top: -6px;
    margin-right: 6px
}

.item--attr>p.living>.text {
    color: #ff7a45 !important
}

.item--attr>p .count-down .text {
    color: #ff7a45;
    margin: 0 2px
}

@media (max-width:991px) {
    .item--attr>p+p {
        margin-top: 12px
    }
}

@media (max-width:767px) {
    .item--attr>p+p {
        margin-top: 8px
    }
}

@media (max-width:540px) {
    .item--attr>p .iconfont {
        font-size: 12px;
        width: 18px
    }

    .item--attr>p .text {
        font-size: 12px !important
    }

    .item--attr>p.living .img-living {
        width: 12px;
        margin-top: -4px
    }

    .item--attr>p .count-down {
        font-size: 12px !important
    }
}

@media (max-width:480px) {
    .item--attr>p+p {
        margin-top: 4px
    }
}

@media (max-width:375px) {
    .item--attr>p .count-down .text {
        margin: 0
    }
}

.redirect {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, .8);
    z-index: 9999
}

.redirect .manyo {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 19999;
    margin-top: -243px;
    margin-left: -172px;
    max-height: 503px;
    overflow: auto;
    background-image: url(/assets/images/redpack/manyo.png);
    background-repeat: no-repeat;
    -moz-background-size: auto;
    background-size: auto;
    padding: 20px
}

.redirect .manyo .manyo-top p {
    position: absolute;
    top: 0;
    left: 30%;
    text-align: center;
    font-size: 28px;
    color: #ccc
}

.redirect .manyo .manyo-word {
    height: 100px;
    margin-top: 15px;
    background-image: url(/assets/images/redpack/content.png);
    background-repeat: no-repeat
}

.redirect .manyo .manyo-word .coupon .left {
    float: left;
    color: #fd4b4a;
    margin-left: 14px;
    margin-top: 26px
}

.redirect .manyo .manyo-word .coupon .left .price-num {
    font-size: 30px;
    font-weight: 600
}

.redirect .manyo .manyo-word .coupon .right {
    float: right;
    margin-right: 24px
}

.redirect .manyo .manyo-word .coupon .right .title {
    margin-top: 8px;
    font-size: 16px;
    font-weight: 700
}

.redirect .manyo .manyo-word .coupon .right .time {
    font-size: 12px;
    margin-top: 8px
}

.redirect .manyo .manyo-word .coupon .right .info {
    font-size: 12px;
    margin-top: 20px;
    color: #9399a5
}

.redirect .manyo .base-bottom {
    z-index: 100
}

.redirect .manyo .base-bottom,
.redirect .manyo .manyback {
    position: absolute;
    bottom: 0;
    left: -1%
}

.redirect .manyo .togetmore {
    margin-top: 10px
}

.redirect .manyo .togetmore p {
    color: #fff;
    text-align: center
}

.redirect .one {
    position: absolute;
    bottom: 0
}

.hidden-2 {
    display: none
}

.course-list-wrapper {
    overflow: hidden
}

.course-list-wrapper .section {
    padding-top: 10px
}

.course-list-wrapper .section+.section {
    padding-top: 30px
}

.course-list-wrapper .section .mod-title {
    position: relative;
    z-index: 1;
    color: #111;
    font-size: 24px;
    line-height: 1;
    padding-bottom: 20px
}

.course-list-wrapper .section .mod-title .right {
    position: absolute;
    bottom: 22px;
    right: 0
}

.course-list-wrapper .section .mod-title .right .more {
    font-size: 16px
}

.course-list-wrapper .section .mod-content .item {
    display: block
}

.course-list-wrapper .vip-free {
    position: absolute;
    z-index: 10;
    right: 0;
    top: 0;
    text-align: center;
    background-color: #ff7a45;
    background: -webkit-gradient(linear, left top, right top, from(#f6dbaa), to(#edc276));
    background: -webkit-linear-gradient(left, #f6dbaa, #edc276);
    background: -moz-linear-gradient(left, #f6dbaa, #edc276);
    background: -o-linear-gradient(left, #f6dbaa, #edc276);
    background: linear-gradient(90deg, #f6dbaa, #edc276);
    color: #8f5502;
    font-size: 12px;
    height: 22px;
    line-height: 22px;
    font-weight: 600;
    padding-left: 4px;
    padding-right: 4px;
    -webkit-border-top-right-radius: 6px;
    -moz-border-radius-topright: 6px;
    border-top-right-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -moz-border-radius-bottomleft: 6px;
    border-bottom-left-radius: 6px
}

@media (max-width:767px) {
    .course-list-wrapper .section .mod-title {
        font-size: 20px;
        padding-bottom: 15px
    }

    .course-list-wrapper .section .mod-title .right {
        bottom: 16px
    }
}


.__attr {
    padding-left: 20px
}

.__attr>div {
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    height: 30px;
    line-height: 20px;
    display: inline-block;
    vertical-align: top
}

.__attr>div ._attr-popup {
    display: none
}

.__attr .favor.favored>i {
    color: #ff7a45
}

.__attr .spread>span {
    display: none
}

.__attr .spread ._attr-title.img {
    font-size: 0
}

.__attr .spread ._attr-title.img>img {
    height: 16px
}

.__attr .spread ._attr-title.img>img.expression {
    animation: expression 1s ease infinite alternate-reverse
}

@-webkit-keyframes expression {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    to {
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }
}

@-moz-keyframes expression {
    0% {
        -moz-transform: scale(1);
        transform: scale(1)
    }

    to {
        -moz-transform: scale(1.2);
        transform: scale(1.2)
    }
}

@-o-keyframes expression {
    0% {
        -o-transform: scale(1);
        transform: scale(1)
    }

    to {
        -o-transform: scale(1.2);
        transform: scale(1.2)
    }
}

@keyframes expression {
    0% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1)
    }

    to {
        -webkit-transform: scale(1.2);
        -moz-transform: scale(1.2);
        -o-transform: scale(1.2);
        transform: scale(1.2)
    }
}

.__attr .spread.sendcourse ._attr-popup {
    right: -32px
}

.__attr .spread.sendcourse .sendcourse-intro {
    padding-top: 26px
}

.__attr .spread.sendcourse .sendcourse-intro .p1 {
    color: #676c73
}

.__attr .spread.sendcourse .sendcourse-intro .p2 {
    color: #9399a5
}

.__attr .spread.sendcourse .sendcourse-intro .p2 .Invite-users {
    width: 40px;
    height: 40px;
    margin-left: 4px
}

.__attr .spread.sendcourse .sendcourse-intro .receivecourse {
    text-align: center;
    margin-top: 16px
}

.__attr .spread.sendcourse .sendcourse-intro .receivecourse a {
    display: inline-block;
    background-color: #ff7a45;
    width: 166px;
    height: 36px;
    line-height: 36px;
    color: #fff;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    font-size: 14px
}

.__attr .invite {
    margin-left: 5px
}

.__attr .newuser {
    position: absolute;
    left: 49%;
    top: 22%;
    background-color: #f0f0f0;
    border: 1px solid #f0f0f0;
    text-align: center;
    height: 30px;
    line-height: 30px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    padding-left: 12px;
    padding-right: 12px
}

.__attr .newuser .icon-jiangpinpeizhi {
    color: #ff7a45
}

.__attr .newuser .user-lesson {
    margin-left: 10px;
    color: #676c73
}

.__attr .newuser .user-new {
    margin-left: 10px;
    color: #9399a5;
    font-size: 12px
}

.__attr .newuser-special {
    right: 10px;
    left: 62%
}

.__attr .newuser:after {
    content: " ";
    border-bottom: 8px solid #f0f0f0;
    border-left: 8px solid rgba(0, 0, 0, 0);
    border-right: 8px solid rgba(0, 0, 0, 0);
    position: absolute;
    top: -8px;
    right: 20px
}

.__attr .newuser_wap {
    position: absolute;
    display: none;
    left: -134%;
    top: 135%;
    background-color: #ff7a45;
    border: 1px solid #ff7a45;
    text-align: center;
    height: auto;
    width: 300px;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border-radius: 16px
}

.__attr .newuser_wap .user-lesson_wap {
    color: #fff
}

.__attr .newuser_wap_newuser_special {
    left: -204%
}

.__attr .newuser_wap:after {
    content: " ";
    border-bottom: 8px solid #ff7a45;
    border-left: 19px solid rgba(0, 0, 0, 0);
    border-right: 8px solid rgba(0, 0, 0, 0);
    position: absolute;
    top: -2px;
    right: 20px;
    -webkit-transform: rotate(-208deg);
    -moz-transform: rotate(-208deg);
    -ms-transform: rotate(-208deg);
    -o-transform: rotate(-208deg);
    transform: rotate(-208deg)
}

@media (min-width:1200px) {
    .__attr>div {
        cursor: pointer
    }

    .__attr>div+div {
        margin-left: 16px
    }

    .__attr .spread>i {
        display: none
    }

    .__attr .spread>span {
        display: block;
        height: 20px;
        line-height: 20px;
        padding-left: 10px;
        padding-right: 28px;
        color: #fff;
        background-color: #ff7a45;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;
        position: relative
    }

    .__attr .spread>span>img {
        position: absolute;
        right: -7px;
        bottom: 0;
        width: 27px
    }

    .__attr .spread ._attr-popup {
        right: 0
    }
}

@media (min-width:768px) {
    .__attr>div ._attr-popup {
        position: absolute;
        right: -32px;
        top: 30px;
        z-index: 10;
        background-color: #fff;
        border: 1px solid #d5d5d5;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        cursor: default
    }

    .__attr>div ._attr-popup:after,
    .__attr>div ._attr-popup:before {
        content: " ";
        border-bottom: 8px solid #d5d5d5;
        border-left: 8px solid rgba(0, 0, 0, 0);
        border-right: 8px solid rgba(0, 0, 0, 0);
        position: absolute;
        top: -8px;
        right: 30px
    }

    .__attr>div ._attr-popup:after {
        border-bottom: 8px solid #fff;
        top: -6px
    }

    .__attr>div ._attr-popup .popup-body .qrcode {
        width: 100px;
        height: 100px;
        margin-left: auto;
        margin-right: auto;
        overflow: hidden
    }

    .__attr>div ._attr-popup .popup-body .qrcode>img {
        height: 100%
    }

    .__attr>div:hover ._attr-popup {
        display: block !important
    }

    .__attr .share ._attr-popup {
        width: 160px;
        text-align: center
    }

    .__attr .share ._attr-popup .popup-head {
        line-height: 38px
    }

    .__attr .share ._attr-popup .popup-body {
        line-height: 0
    }

    .__attr .share ._attr-popup .popup-foot {
        min-height: 15px
    }

    .__attr .share ._attr-popup .popup-foot .btn {
        margin-bottom: 5px;
        color: #3e454d
    }

    .__attr .share ._attr-popup .popup-foot .btn:hover {
        color: #0f6af3
    }

    .__attr .spread ._attr-popup {
        width: 386px;
        padding: 0 20px 20px
    }

    .__attr .spread ._attr-popup .popup-head {
        text-align: center;
        line-height: 46px;
        color: #ff7f29;
        border-bottom: 1px solid #e5e5e5
    }

    .__attr .spread ._attr-popup .popup-head .iconfont {
        display: inline-block;
        vertical-align: middle
    }

    .__attr .spread ._attr-popup .popup-body .title {
        line-height: 54px;
        font-size: 14px
    }

    .__attr .spread ._attr-popup .popup-body .title .icon {
        display: inline-block;
        vertical-align: middle;
        width: 16px;
        height: 16px;
        line-height: 16px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border-radius: 50%;
        background-color: #0f6af3;
        color: #fff;
        font-size: 12px;
        text-align: center;
        margin-right: 6px
    }

    .__attr .spread ._attr-popup .popup-body .copy-wrapper {
        position: relative;
        overflow: hidden;
        width: 320px;
        margin-left: 20px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px
    }

    .__attr .spread ._attr-popup .popup-body .copy-wrapper .form-control {
        width: 100%;
        padding-right: 75px;
        border: none;
        font-size: 12px;
        color: #888;
        background-color: #f7f8fa
    }

    .__attr .spread ._attr-popup .popup-body .copy-wrapper .btn {
        position: absolute;
        top: 0;
        right: 0;
        -webkit-border-top-left-radius: 0;
        -moz-border-radius-topleft: 0;
        border-top-left-radius: 0;
        -webkit-border-bottom-left-radius: 0;
        -moz-border-radius-bottomleft: 0;
        border-bottom-left-radius: 0
    }

    .__attr .spread ._attr-popup .popup-body .spread-agreement {
        margin-top: 30px
    }

    .__attr .spread ._attr-popup .popup-body .spread-agreement label {
        color: #9399a5
    }

    .__attr .miniapp .iconfont {
        font-size: 18px
    }

    .__attr .miniapp ._attr-popup {
        width: 180px
    }

    .__attr .miniapp ._attr-popup .popup-body .qrcode {
        width: 120px;
        height: 120px
    }
}

@media (max-width:1199px) {
    .__attr>div {
        display: block
    }

    .__attr .invite {
        margin-left: 0
    }

    .__attr .newuser {
        left: 34%
    }
}

@media (max-width:1199px) and (max-width:991px) {
    .__attr .newuser {
        left: 21%
    }
}

@media (max-width:1199px) {
    .__attr .newuser-special {
        left: 35%;
        right: 12%
    }
}

@media (max-width:1199px) and (max-width:991px) {
    .__attr .newuser-special {
        left: 21%
    }
}

@media (max-width:1199px) {
    .__attr .newuser:after {
        content: " ";
        border-left: 8px solid #f0f0f0;
        border-top: 8px solid rgba(0, 0, 0, 0);
        border-bottom: 8px solid rgba(0, 0, 0, 0);
        position: absolute;
        top: 7px;
        right: -16px
    }
}

@media (max-width:767px) {
    .__attr>div ._attr-popup {
        display: none
    }

    .__attr .invite {
        margin-left: 5px;
        color: #fff
    }

    .__attr .newuser {
        display: none
    }

    .__attr .newuser_wap {
        display: block
    }
}

@media (max-width:767px) and (max-width:540px) {
    .__attr .newuser_wap {
        left: -138%
    }
}

@media (max-width:767px) and (max-width:540px) and (min-width:375px) {
    .__attr .newuser_wap {
        left: -145%
    }
}

@media (max-width:767px) and (max-width:540px) {
    .__attr .newuser_wap_newuser_special {
        left: 204%
    }
}

@media (max-width:767px) and (max-width:540px) and (min-width:375px) {
    .__attr .newuser_wap_newuser_special {
        left: -217%
    }
}

@media (max-width:767px) {
    .__attr {
        position: absolute;
        top: 20px;
        right: 20px;
        z-index:1
    }

    .__attr>div {
        display: inline-block;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border-radius: 50%;
        width: 30px;
        height: 30px;
        line-height: 30px;
        text-align: center;
        color: #fff;
        background: rgba(0, 0, 0, .5)
    }

    .__attr>div+div {
        margin-left: 20px
    }

    .__attr>div>i {
        margin-right: 0
    }

    .__attr .favor .iconfont {
        font-size: 15px
    }

    .__attr .share .iconfont {
        font-size: 14px
    }
}

@media (max-width:540px) {
    .__attr {
        top: 14px;
        right: 14px
    }

    .__attr>div+div {
        margin-left: 14px
    }
}

.back-header-content {
    margin-top: 0
}

.back-header-content .back-header-img {
    padding-top: 24px;
    position: relative
}

@media (max-width:767px) {
    .back-header-content .back-header-img {
        padding-top: 0
    }
}

.back-header-content .back-header-img .back-picture {
    -webkit-filter: blur(100px);
    filter: blur(100px);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #f7f9fa;
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    background-size: 100%;
    z-index: -1;
    background-position: 50%
}

.back-header-content .back-header-img .back-picture .surname {
    width: 100%;
    height: 100%;
    background-color: #f7f9fa;
    opacity: .09
}

.back-header-content .back-header-img .back-picture:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background-image: -webkit-gradient(linear, left top, left bottom, from(hsla(0, 0%, 100%, .4)), to(#f7f8fa));
    background-image: -webkit-linear-gradient(top, hsla(0, 0%, 100%, .4), #f7f8fa);
    background-image: -moz-linear-gradient(top, hsla(0, 0%, 100%, .4) 0, #f7f8fa 100%);
    background-image: -o-linear-gradient(top, hsla(0, 0%, 100%, .4) 0, #f7f8fa 100%);
    background-image: linear-gradient(180deg, hsla(0, 0%, 100%, .4), #f7f8fa)
}

.detail-body,
.detail-header {
    background-color: #fff
}

.fixed-right-nav .spreadclass {
    display: block
}

.detail-header .dl-horizontal {
    margin-bottom: 0
}

.detail-header .dl-horizontal dt {
    width: 460px;
    height: 285px
}

.detail-header .dl-horizontal dd {
    margin-left: 460px
}

.detail-header .detail-header-cover,
.detail-header .detail-header-info {
    padding: 30px
}

.detail-header .detail-header-cover {
    width: 100%;
    height: 100%
}

.detail-header .detail-header-cover img {
    width: 100%
}

.detail-header .detail-header-cover .cover-img {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative
}

.detail-header .detail-header-cover .cover-course .cover-play {
    font-size: 18px;
    line-height: 1.4285714286
}

.detail-header .detail-header-cover .cover-course .cover-play .iconfont {
    font-size: 50px
}

.detail-header .detail-header-info {
    position: relative;
    min-height: 285px;
    padding-left: 0;
    display: table;
    width: 100%
}

.detail-header .detail-header-info .header-info-tr {
    display: table-row
}

.detail-header .detail-header-info .header-info-td {
    display: table-cell
}

.detail-header .detail-header-info .header-info-td.td2 {
    vertical-align: bottom;
    position: relative;
    padding-top: 15px
}

.detail-header .detail-header-info .info-title {
    font-size: 20px;
    line-height: 1.4285714286;
    margin-top: 0;
    margin-bottom: 20px
}

.detail-header .detail-header-info .item--attr .price-wrapper .price .price-num,
.detail-header .detail-header-info .item--attr .price-wrapper .price .price-symbol {
    font-size: 24px
}

.detail-header .detail-header-info .item--attr .price-wrapper .price .personnel {
    font-size: 14px
}

.detail-header .detail-header-info .item--attr .price-wrapper .price+.ori-price {
    margin-left: 0
}

.detail-header .detail-header-info .info-attr_content,
.detail-header .detail-header-info .info-attr_title {
    padding-top: 13px;
    padding-bottom: 13px
}

.detail-header .detail-header-info .info-attr_content .text,
.detail-header .detail-header-info .info-attr_title .text {
    line-height: 26px
}

.detail-header .detail-header-info .info-attr_title {
    width: 20px;
    white-space: nowrap;
    color: #9399a5
}

.detail-header .detail-header-info .info-attr_content {
    padding-left: 10px
}

.detail-header .detail-header-info .info-attr .choose-wrap .choose-item {
    display: inline-block;
    font-size: 12px;
    line-height: 24px;
    padding-left: 14px;
    padding-right: 14px;
    color: #555;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    border: 1px solid #ccc;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.detail-header .detail-header-info .info-attr .choose-wrap .choose-item+.choose-item {
    margin-left: 12px
}

.detail-header .detail-header-info .info-attr .choose-wrap .choose-item.active,
.detail-header .detail-header-info .info-attr .choose-wrap .choose-item:hover {
    color: #0f6af3;
    border-color: #0f6af3
}

@media (max-width:1199px) {

    .detail-header .detail-header-info .info-attr_content,
    .detail-header .detail-header-info .info-attr_title {
        padding-top: 5px;
        padding-bottom: 5px
    }
}

.detail-header .detail-header-info .info-study {
    width: 100%
}

.detail-header .detail-header-info .info-study .last-progress {
    display: inline-block;
    margin-left: 25px;
    color: #777
}

.detail-header .detail-header-info .info-study .last-progress .iconfont {
    color: #bbb;
    font-size: 14px;
    margin-right: 3px
}

.detail-header .detail-header-info .info-study .free-blue {
    background: rgba(0, 0, 0, 0);
    color: #0f6af3;
    background: hsla(0, 0%, 100%, .5);
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
    border-radius: 24px;
    margin-right: 14px;
    font-size: 18px
}

@media (max-width:991px) {
    .detail-header .detail-header-info .info-study .free-blue {
        font-size: 16px
    }
}

@media (max-width:991px) and (max-width:768px) {
    .detail-header .detail-header-info .info-study .free-blue {
        margin-right: 10px
    }
}

.detail-header .detail-header-info .info-study .commandbutton {
    min-width: 140px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
    border-radius: 24px;
    font-size: 18px
}

@media (max-width:991px) {
    .detail-header .detail-header-info .info-study .commandbutton {
        min-width: auto
    }
}

@media (max-width:991px) and (max-width:768px) {
    .detail-header .detail-header-info .info-study .commandbutton {
        font-size: 16px
    }
}

.detail-header .detail-header-info .info-study .free-orange {
    background: rgba(0, 0, 0, 0);
    color: #ff7a45;
    border: 1px solid #e5e5e5;
    margin-left: 20px
}

.detail-header .detail-header-info .info-study .free-orange:hover {
    border: 1px solid #ff7a45
}

@media (min-width:768px) {
    .detail-header .detail-header-info .item--attr>p+p {
        margin-top: 8px
    }
}

@media (min-width:992px) {
    .detail-header .detail-header-info .item--attr>p+p {
        margin-top: 10px
    }
}

@media (max-width:991px) {
    .detail-header .dl-horizontal dt {
        width: 344px;
        height: 211px
    }

    .detail-header .dl-horizontal dd {
        margin-left: 344px
    }

    .detail-header .detail-header-cover,
    .detail-header .detail-header-info {
        padding: 20px
    }

    .detail-header .detail-header-info {
        min-height: 211px;
        padding-left: 0
    }

    .detail-header .detail-header-info .info-title {
        font-size: 16px;
        margin-bottom: 10px
    }

    .detail-header .detail-header-info .info-study .last-progress {
        margin-left: 15px
    }
}

@media (max-width:767px) {
    .detail-header {
        position: relative;
        margin-left: -15px;
        margin-right: -15px
    }

    .detail-header .dl-horizontal dt {
        width: auto;
        height: 0;
        padding-bottom: 56.2666666667%;
        float: none;
        position: relative
    }

    .detail-header .dl-horizontal dd {
        margin-left: 0
    }

    .detail-header .detail-header-cover,
    .detail-header .detail-header-info {
        padding: 0
    }

    .detail-header .detail-header-cover {
        position: absolute;
        top: 0;
        left: 0;z-index: 1;
    }

    .detail-header .detail-header-info {
        position: static;
        min-height: auto;
        padding: 15px
    }
}

.new-detail-header {
    background-color: rgba(0, 0, 0, 0)
}

.new-detail-header .dl-horizontal dt {
    width: 430px;
    height: 255px
}

.new-detail-header .dl-horizontal dd {
    margin-left: 430px
}

@media (max-width:991px) {
    .new-detail-header .dl-horizontal dt {
        width: 324px;
        height: 191px
    }

    .new-detail-header .dl-horizontal dd {
        margin-left: 324px
    }
}

@media (max-width:991px) and (max-width:767px) {
    .new-detail-header .dl-horizontal dt {
        width: auto;
        height: 0;
        padding-bottom: 56.2666666667%;
        float: none;
        position: relative
    }

    .new-detail-header .dl-horizontal dd {
        margin-left: 0
    }

    .new-detail-header .dl-horizontal dd .detail-header-info {
        padding-top: 15px
    }
}

.new-detail-header .dl-horizontal .new-detail-header-cover {
    padding-top: 0;
    padding-left: 0
}

.new-detail-header .dl-horizontal .new-detail-header-cover .cover-img {
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
    z-index:-1000;
}

@media (max-width:767px) {
    .new-detail-header .dl-horizontal .new-detail-header-cover .cover-img {
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0
    }
}

.new-detail-header .dl-horizontal .new-detail-header-info {
    padding-top: 0;
    min-height: 255px
}

@media (max-width:991px) {
    .new-detail-header .dl-horizontal .new-detail-header-info {
        min-height: 191px
    }
}

.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-title {
    font-size: 24px;
    color: #1f2329
}
.item--attr {
    margin-bottom:10px;
}
.new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .filleted {
    -webkit-border-radius: 22px;
    -moz-border-radius: 22px;
    border-radius: 22px
}

@media (max-width:1199px) {
    .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .filleted {
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        border-radius: 20px
    }
}

@media (max-width:1199px) and (max-width:991px) {
    .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .filleted {
        -webkit-border-radius: 18px;
        -moz-border-radius: 18px;
        border-radius: 18px
    }
}

@media (max-width:1199px) and (max-width:991px) and (max-width:767px) {
    .new-detail-header .dl-horizontal .new-detail-header-info .header-info-tr .header-info-td .info-study .filleted {
        -webkit-border-radius: 16px;
        -moz-border-radius: 16px;
        border-radius: 16px
    }
}

.item--attr .text {
    font-size: 16px;
    color: #676c73
}

.item--attr .progressive {
    padding-right: 22px;
    margin-right: 4px;
    font-size: 16px;
    position: relative
}

.item--attr .progressive.progressive:before {
    content: "";
    display: inline-block;
    position: absolute;
    right: 8px;
    top: 3px;
    width: 1px;
    height: 10px;
    background-color: #9399a5
}

.item--attr .pitch-number {
    margin-right: 10px
}
.el-link--primary a{
    color: #409eff;
}

.item--attr .cousult-span {
    border-left: none;
    padding-right: 10px;
    padding-left: 16px
}

.item--attr .popover-toggle {
    padding-right: 8px
}

.item--attr .popover-toggle .icon-yiwen {
    vertical-align: text-top
}

.item--attr .cousult-after {
    position: relative;
    display: inline-block
}

.item--attr .cousult-after:after {
    content: "";
    display: inline-block;
    position: absolute;
    left: 0;
    top: 2px;
    width: 1px;
    height: 10px;
    background-color: #9399a5
}

.item--attr .new-learning-user-wrapper {
    margin-top: 20px
}

.item--attr .new-learning-user-wrapper .learning-count {
    font-size: 16px;
    color: #676c73
}

.detail-header-builder {
    margin-top: 30px
}

@media (max-width:767px) {
    .detail-header-builder {
        margin-top: 20px
    }
}

.detail-header-builder img {
    width: 100%
}

@media (min-width:768px) {
    .course-module-nav {
        padding-top: 6px
    }

    .course-module-nav>li+li {
        margin-left: 60px
    }
}

@media (max-width:767px) {
    .course-module-nav {
        padding-top: 3px;
        padding-left: 15px;
        padding-right: 15px;
        margin-left: -15px;
        margin-right: -15px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .course-module-nav:after,
    .course-module-nav:before {
        content: none
    }

    .course-module-nav>li+li {
        margin-left: 0
    }

    .course-module-nav>li>a {
        font-size: 18px
    }

    .course-module-nav>li .has-audition {
        left: 98%;
        margin-top: -26px;
        -webkit-transform: scale(.8);
        -moz-transform: scale(.8);
        -ms-transform: scale(.8);
        -o-transform: scale(.8);
        transform: scale(.8)
    }

    .course-module-nav>li .has-audition1 {
        left: 82%;
        -webkit-transform: scale(.8);
        -moz-transform: scale(.8);
        -ms-transform: scale(.8);
        -o-transform: scale(.8);
        transform: scale(.8)
    }
}

@media (max-width:540px) {
    .course-module-nav>li>a {
        font-size: 16px
    }

    .course-module-nav>li>a>span {
        font-size: 13px
    }
}

.course-module-nav-extra.position {
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -10px
}

.course-module-nav-extra .label {
    margin-left: 0;
    height: 20px;
    line-height: 20px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    color: #ff7a45;
    font-size: 16px;
    font-weight: 400;
    padding: 0
}

.course-module-nav-extra .label+.label {
    margin-left: 20px
}

.course-module-nav-extra .label .iconfont {
    font-size: 16px;
    margin-right: 5px
}

.course-module-nav-extra .label:hover {
    color: #ff7a45
}

.course-module-nav-extra .label-audition-mode,
.course-module-nav-extra .label-audition-mode:hover,
.course-module-nav-extra .label-audition-mode:hover i,
.course-module-nav-extra .label-audition-mode i {
    color: #9399a5;
    cursor: default
}

@media (max-width:991px) {
    .course-module-nav-extra.position {
        display: none
    }
}

.detail-body {
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 30px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;    padding-top: 15px;
    border-radius: 8px
}

.detail-body .detail-intro-container {
    overflow: hidden;
    padding-top: 8px
}

.detail-body .detail-intro-container.pt30 {
    padding-top: 30px
}

.detail-body .detail-intro-container+.detail-intro-container {
    padding-top: 32px
}

.detail-body .detail-intro-container .intro-note {
    background-color: #fbfdfc;
    padding: 8px 30px 30px
}

.detail-body .detail-intro-container h4 {
    margin-top: 22px;
    margin-bottom: 14px
}

.detail-body .detail-intro-container p {
    line-height: 28px;
    color: #676c73;
    margin-bottom: 0
}

.detail-body .detail-intro-container img {
    max-width: 100%;
    display: block
}

.detail-attributes-container {
    padding-top: 5px
}

.detail-attributes-container + .detail-intro-container, .detail-attributes-container .detail-attribute {
    padding-top: 25px
}

 .detail-attributes-container .attribute-title {
    padding-bottom: 13px
}

.detail-attributes-container .title, .detail-attributes-container .title-icon {
    display: inline-block
}

.detail-attributes-container .title-icon {
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 100% 100%;
    margin-right: 8px;
    vertical-align: bottom
}

   .detail-attributes-container .title-icon.title-icon-1 {
        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAAq1BMVEUAAAD+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub+7ub/ikj/h0L/hT7/jk//wqH/y7D/oW3/p3j/ya3/xKT+59v/v53/m2X/vZr/kVT/o3L/vZj/zbP/x6r/nmn/pHT/k1f+6+H+6d7/qXz+3s3+2cX+49X+0bn+1sD/uZP/s4r+yKv/r4P/rX//mGD+vJj+x6j+vZg5fGZdAAAAEXRSTlMA+T7o3MvEYvOLiUko60YnIdBXZVsAAAGASURBVEjHldbZdoIwEIDhAZS669i6UJCqqEVZBKS27/9kVaDBhJgm3zX/ISdwMgFC75mGhhyaYXZ1YL20UKj1Ao8mbfxXewKEPkQJQ7KukYZStBEUxh2U1BkXQRultYv9QQX3vWqhghaAjkp06KGSHpj4RODdBUgzwUBG5M3t2MFgUQqRYoCGFN8+FTxvUTnSHw+QtrUqyV/ALIoJYouw30uhMEgPRCoT+JvaqQoiUeAsa9auEKMowE0d5OXzvjhI9kQWneNzgCgOgr1b2RwLnIDmuaX93C4tQl8YYGh93Vhbm9hFTMC6rX1OsR1BEGar6zW3TpfkocieBpn7Sbjpioj4gXNYUzYkCLmBv5wxlh+VMzdIZg25KHBm04b1thTwAm/Kcdne/HjIC668IBH8Gukrx6UZaMIgR4ZWHzPfbxweMoz6IPPd5vPNFZnQRcJ3aEcfG3rKh7Hyca8+UNRHFgzkh+IACn3ZsduHSl/qHZ0+EAOZq8NA9XLC0rtS159f5Val43Go2QsAAAAASUVORK5CYII=)
    }

    .detail-attributes-container .title-icon.title-icon-2 {
        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAArlBMVEUAAADn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9Obn9OZHuRpRvSRMuyBixjVYwCtVvyni899wzUR901Gy45xqyT1nxzpewzFbwi6x45uv4ph1zknU7st60U530EttykC05J6s4JaP1XPl8+PS7cng8tzb8dbN7MLI6ruF0GjE6bWK0m7W78665qa45aV5zlK75qek3YyS1HnVNfH7AAAAEXRSTlMA+ek+3Ipi88PMykkoxUYnIXPyxY0AAAFTSURBVEjHrdbZcoIwFIDhkwCKgMtpa6u1i0pbFBFKq13e/8UqAUkqCSYzftf5M2dykQRqluNSghKEuo4Fpzo2trI7IBp5eJY3EqahqIHWcw0IaiEDYIZd1NQdssBDbR47HzRQnJWNBmwAC41Y4KARB1wUxbtPbOUCRVEafcfYhgJBQRJFUYptCAirw2wXHeTpNsbCNjwS5hSCGZex9fdcLAuy+dF+ggehEExkAebzUpRgYfPCyYN4tmBCLINXTh7gorSpgiUnDyarUloFU04ebFfzLNnsV7luEJfnn2Qz5ueNkwXc10PDmeCxoT1YjhsuHEyfGuRBui6NnxvkwfpWSR583CkpgmulCwXvN0pCQMwCAlQIrpTqgIJrFrjiVfmrETjGl7H5dW/+oEAPtfWgEOg/igEwvu6z60PF72rt70Mt6GnMH5h/Tv6znL7q+9MXvj9/ITukR+dRI78AAAAASUVORK5CYII=)
    }

     .detail-attributes-container .title-icon.title-icon-3 {
        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAA2FBMVEUAAADm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fvm9fuIsf1ppP9kof9tqP9gnf9xq/+Ruf2Otv2Frv10r/+MtP2Ks/1bmf/k9PtXlf93sv96tP9SkP/c7vt+t//B3P2+2fy71/zg8ftuov7T6Pyhxv2Zvv3P5PzG4Pyx0PyHuf9NjP+VvP3K4vze8PtDhP9+rv6kyv2awv3Z7ftln/9OjP+Vxf6OwP51qP652v2y1f2r0f2Uv/2oyfyMs/230/yfwvyBmpy3AAAAEXRSTlMA+ek+y8Ri89tIJ4nci4ohQOIH8zQAAAGiSURBVEjHldZpc4IwEAbgRcSzrd0enm1jFVEEAa9637b9//+oBUZFkiB5PsGQF0gysxs4k/NKQkIGKaE8yBCWymCkTAqCCkm8KVmAs8cExpA4/1dWwlikLHhyaYwpnQNXEmNLeuuDAty1yqCADICMQmTIo5A8KMhir1orGxkUYOwZ0dYt11oj9O6BRA3f9hsn/W04IgFe03etz6DWTscr1wF136iFNfZjXmA+rZVYatM5M0BKrzwlwgqoz3xjVkB/4dOZc7D7Rba+zVsl41D8CCsejNEsPIcL1VzUgxamijip03O4IE63edJ1vFdvmiovMPYGaJPlYDBYTjR06bgZcAParOM9syrdiuV9bzTVsPvFDbSHw55z2Vdim8NhOzJQdh0Nf7g2c+9uBHzmiOjtnn/dRqvHXdZOhdbBCzrwRosOvNMiA9oTLTKg/9IBA4OoImA4lWrA99HCIIlRZsjIrPrKjkWoMqMgw/8eVHs/BrOQPaCQvHAxFi33wg1FtGWJN0Xxtusn0rHen4WzXJyjQw6CUncY6S4FYfI9//hzL8PJH/iBqNadWddDAAAAAElFTkSuQmCC)
    }

.detail-attributes-container .title {
    font-size: 18px;
    line-height: 28px
}

.detail-attributes-container .attribute-content {
    line-height: 24px;
    color: #676c73;
    font-size:16px;
}

    .detail-attributes-container .attribute-content + .attribute-content {
        margin-top: 6px
    }

@media (max-width: 767px) {
    .detail-attributes-container {
        padding-top: 0
    }

       .detail-attributes-container + .detail-intro-container,  .detail-attributes-container .detail-attribute {
            padding-top: 20px
        }

         .detail-attributes-container .title-icon {
            width: 24px;
            height: 24px;
            margin-right: 5px
        }

        .detail-attributes-container .title {
            font-size: 16px;
            line-height: 24px
        }

        .detail-attributes-container .attribute-content {
            line-height: 20px;
            font-size: 12px
        }

             .detail-attributes-container .attribute-content + .attribute-content {
                margin-top: 4px
            }
}

 .detail-list-intro {
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 15px solid #f7f8fa
}

.detail-body .detail-list-container {
    padding-top: 20px
}

.detail-body .detail-list-panel {
    margin-top: 10px;
    margin-bottom: 0;
    border: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0
}

.detail-body .detail-list-panel+.detail-list-panel {
    margin-top: 20px;
    padding-top: 30px;
    border-top: 1px solid #e5e5e5
}

.detail-body .detail-list-panel .panel-heading {
    color: #1a1a1a;
    font-size: 18px;
    line-height: 1;
    padding: 0 10px;
    border-bottom: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    border-left: 3px solid #0f6af3
}

.detail-body .detail-list-panel .panel-heading+.panel-body {
    margin-top: 20px
}

.detail-body .detail-list-panel .panel-body {
    padding: 0
}

.detail-body .detail-list-item {
    position: relative;
    padding: 14px 20px;
    line-height: 20px
}

.detail-body .detail-list-item .left {
    position: relative;
    padding-left: 30px;
    padding-right: 180px
}

.detail-body .detail-list-item .right {
    position: absolute;
    right: 20px;
    top: 14px
}

.detail-body .detail-list-item .detail-list-title {
    display: inline;
    font-size: 16px
}

.detail-body .detail-list-item .detail-list-title .iconfont {
    position: absolute;
    left: 0;
    top: 0;
    font-size: 20px;
    vertical-align: middle;
    color: #ccc
}

.detail-body .detail-list-item .detail-list-title a {
    color: #555
}

.detail-body .detail-list-item .detail-list-extra {
    display: inline
}

.detail-body .detail-list-item .detail-list-label {
    overflow: hidden;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border: 1px solid #ff7a45;
    color: #ff7a45;
    font-size: 12px;
    padding: 2px 8px;
    margin-left: 10px;
    font-weight: 400
}

.detail-body .detail-list-item .detail-list-label .iconfont {
    font-size: 12px;
    margin-right: 4px
}

.detail-body .detail-list-item .detail-list-audition {
    min-height: 1px
}

.detail-body .detail-list-item .detail-list-audition .label {
    margin-left: 0;
    color: #fff;
    cursor: pointer
}

.detail-body .detail-list-item .detail-list-audition .label.has-audition,
.detail-body .detail-list-item .detail-list-audition .label.no-audition {
    border-color: #ff7a45;
    background-color: #ff7a45
}

.detail-body .detail-list-item .detail-list-audition+.progress--label {
    margin-left: 20px
}

.detail-body .detail-list-item .item--attr {
    margin-top: 3px
}

.detail-body .detail-list-item .item--attr>p.done {
    color: #9399a5
}

.detail-body .detail-list-item .item--attr>p.audition-done {
    font-size: 12px
}

.detail-body .detail-list-item .item--attr>p.audition-done a {
    display: inline-block;
    width: 100%;
    height: 100%;
    padding: 8px 12px;
    -webkit-border-radius: 14px;
    -moz-border-radius: 14px;
    border-radius: 14px;
    color: #fff;
    background-color: #ff7a45
}

.detail-body .detail-list-item .item--attr>p.done-float {
    float: right;
    margin-top: 10px
}

.detail-body .detail-list-item .item--attr>p .count-down .text {
    font-size: 14px
}

.detail-body .detail-list-item:hover {
    background-color: #f7f8fa;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.detail-body .detail-list-item:hover .detail-list-title .iconfont,
.detail-body .detail-list-item:hover .detail-list-title a {
    color: #0f6af3
}

.detail-body .detail-list-panel-offline .detail-list-item .detail-list-title .iconfont {
    color: #ccc
}

.detail-body .detail-list-panel-offline .detail-list-item .detail-list-title,
.detail-body .detail-list-panel-offline .detail-list-item .detail-list-title a {
    cursor: default
}

.detail-body .detail-list-panel-offline .detail-list-item .detail-list-title,
.detail-body .detail-list-panel-offline .detail-list-item .detail-list-title:hover,
.detail-body .detail-list-panel-offline .detail-list-item .detail-list-title a,
.detail-body .detail-list-panel-offline .detail-list-item .detail-list-title a:hover {
    color: #9399a5
}

.detail-body .detail-list-panel-offline .detail-list-item .detail-list-label {
    border-color: #ccc;
    color: #9399a5;
    cursor: default
}

.detail-body .detail-list-panel-offline .detail-list-item .detail-list-label.detail-list-audition {
    border-color: #ccc;
    background: #fff
}

.detail-body .detail-list-panel-offline .detail-list-item .progress--text {
    color: #9399a5
}

.detail-body .detail-list-panel-offline .detail-list-item:hover {
    background-color: #fff
}

.detail-body .detail-list-item-audition-btn .left {
    padding-right: 240px
}

.detail-body .detail-list-item-no-audition .detail-list-label {
    border-color: #ccc;
    color: #9399a5;
    cursor: default
}

@media (max-width:767px) {
    .detail-body {
        margin-top: 20px;
        margin-left: -15px;
        margin-right: -15px;
        padding-left: 15px;
        padding-right: 15px
    }

    .detail-body .detail-intro-container.pt30 {
        padding-top: 10px !important
    }

    .detail-body .detail-intro-container .intro-note {
        padding: 10px
    }

    .detail-body .detail-list-intro {
        border-bottom-width: 10px
    }

    .detail-body .detail-list-intro-audition {
        margin-top: 0;
        margin-left: -15px;
        margin-right: -15px;
        padding-left: 15px;
        padding-right: 15px
    }

    .detail-body .detail-list-course-extra .label,
    .detail-body .detail-list-course-extra .label .iconfont {
        font-size: 18px
    }

    .detail-body .detail-list-panel+.detail-list-panel {
        margin-top: 12px;
        padding-top: 18px
    }

    .detail-body .detail-list-panel .panel-heading+.panel-body {
        margin-top: 18px
    }

    .detail-body .detail-list-item {
        padding: 8px 10px
    }

    .detail-body .detail-list-item._pb30 {
        padding-bottom: 30px
    }

    .detail-body .detail-list-item .left {
        padding-left: 30px;
        padding-right: 0
    }

    .detail-body .detail-list-item .right {
        right: 10px;
        top: 8px
    }

    .detail-body .detail-list-item .detail-list-audition {
        width: auto
    }

    .detail-body .detail-list-item .detail-list-audition .label {
        margin-right: 0
    }

    .detail-body .detail-list-item .detail-list-file,
    .detail-body .detail-list-item .progress--label {
        display: none
    }

    .detail-body .detail-list-item-audition-btn .left {
        padding-right: 72px
    }
}

@media (min-width:992px) {
    .detail-body .detail-list-course-extra {
        display: none
    }
}

@media (max-width:540px) {
    .detail-body .detail-list-item .item--attr {
        margin-top: 3px
    }

    .detail-body .detail-list-item .item--attr>p.audition-done a {
        padding: 6px 10px
    }

    .detail-body .detail-list-item .item--attr>p .iconfont {
        font-size: 14px;
        width: 20px
    }

    .detail-body .detail-list-item .item--attr>p .text {
        font-size: 14px !important
    }

    .detail-body .detail-list-item .item--attr>p .img-living {
        width: 14px;
        margin-top: -6px
    }

    .detail-body .detail-list-item .item--attr>p .count-down {
        font-size: 14px !important
    }
}

@media (min-width:768px) {
    .detail-body {
        margin-top: 20px;
        padding-left: 20px;
        padding-right: 20px
    }
}

@media (min-width:992px) {
    .detail-body {
        margin-top: 30px;
        padding-left: 30px;
        padding-right: 30px
    }
}

.lesson-title {
    padding-bottom: 18px
}

.lesson-title .iconfont {
    color: #9399a5;
    font-size: 12px;
    padding-left: 10px;
    padding-right: 10px
}

.lesson-title .chapter-title {
    color: #676c73
}

@media (max-width:375px) {
    .lesson-intro .intro-section.summary .content {
        padding: 10px 0
    }
}

.signupBox {
    text-align: center;
    font-size: 14px;
    color: #000
}

.signupBox .tips {
    margin-top: 20px
}

.signupBox>img {
    width: 41px;
    height: 39px
}

@media (max-width:411px) {
    .comment-list .comment-time {
        margin-top: -10px
    }
}

.yardsBody .course-item-grid .item {
    text-align: center;
    padding-bottom: 102.8070175439%
}

.yardsBody .course-item-grid .item .yards-bottom,
.yardsBody .course-item-grid .item .yards-top {
    position: absolute;
    left: 0;
    right: 0;
    overflow: hidden;
    padding-left: 8.7719298246%;
    padding-right: 8.7719298246%;
    width: 100%
}

.yardsBody .course-item-grid .item .yards-top {
    top: 0;
    height: 78.4982935154%
}

.yardsBody .course-item-grid .item .yards-top .top-info {
    border-bottom: 1px solid #e5e5e5;
    width: 100%;
    height: 100%
}

.yardsBody .course-item-grid .item .yards-top .top-info .yards-avator {
    width: 43.8596491228%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    margin-top: 10.5263157895%;
    margin-bottom: 10.5263157895%
}

.yardsBody .course-item-grid .item .yards-top .top-info .yards-title {
    font-size: 18px
}

.yardsBody .course-item-grid .item .yards-top .top-info .yards-desc {
    color: #676c73;
    font-size: 14px;
    margin-bottom: 0
}

.yardsBody .course-item-grid .item .yards-bottom {
    bottom: 0;
    height: 21.1604095563%;
    padding-top: 7.8498293515%
}

.yardsBody .course-item-grid .item .yards-bottom .msg {
    line-height: 1;
    margin-bottom: 0;
    color: #0f6af3
}

@media (max-width:475px) {
    .yardsBody .course-item-grid .item .yards-top .top-info .yards-title {
        font-size: 14px;
        margin-bottom: 5px
    }

    .yardsBody .course-item-grid .item .yards-bottom .msg,
    .yardsBody .course-item-grid .item .yards-top .top-info .yards-desc {
        font-size: 12px
    }
}

.modal-refer-container .modal-dialog {
    width: 422px
}

.modal-refer-container .modal-dialog .modal-content .modal-body .icon-close-wrapper {
    top: 10px;
    right: 12px
}

@media (max-width:767px) {
    .modal-refer-container .modal-dialog .modal-content .modal-body .icon-close-wrapper {
        left: 92%
    }
}

.modal-refer-container .modal-dialog .modal-content .modal-body .icon-close-wrapper i {
    font-size: 28px
}

.modal-refer-container .modal-dialog .back-img {
    height: 539px;
    background-image: url(/assets/images/home/back-pop.png);
    padding-top: 36px;
    padding-left: 30px;
    padding-right: 30px;
    overflow: hidden
}

.modal-refer-container .modal-dialog .back-img .title {
    color: #2d3735;
    font-size: 24px;
    text-align: center
}

.modal-refer-container .modal-dialog .back-img .refer-content {
    margin-top: 30px;
    max-height: 347px;
    overflow: hidden
}

.modal-refer-container .modal-dialog .back-img .refer-content .inner {
    max-height: 330px;
    overflow-x: hidden;
    overflow-y: scroll;
    width: 104%
}

.modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input {
    padding-top: 4px;
    margin-top: 20px;
    width: 96%;
    height: 48px;
    line-height: 48px;
    background-color: #fff;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    border: 1px solid #e5e5e5
}

.modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input .checkbox-dot input[type=checkbox]+label:before,
.modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input .checkbox input[type=checkbox]+label:after,
.modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input .radio input[type=radio]+label:after,
.modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input .radio input[type=radio]+label:before {
    display: inline-block;
    position: absolute;
    left: 316px;
    width: 16px;
    height: 16px;
    line-height: 16px;
    margin-left: -16px
}

.modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input p {
    display: inline-block;
    font-size: 14px;
    color: #3e454d;
    margin-left: 14px
}

.modal-refer-container .modal-dialog .back-img .refer-content .inner .first-refer-input {
    margin-top: 0
}

.modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input-checked {
    border: 1px solid #0f6af3;
    background-color: rgba(15, 106, 243, .1)
}

.modal-refer-container .modal-dialog .back-img .submit {
    margin-top: 40px;
    width: 100%;
    height: 48px;
    line-height: 48px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
    border-radius: 24px;
    background-color: #0f6af3;
    text-align: center
}

.modal-refer-container .modal-dialog .back-img .submit p {
    display: inline-block;
    font-size: 20px;
    color: #fff
}

@media (max-width:620px) {
    .modal-refer-container .modal-dialog {
        width: 400px
    }
}

@media (max-width:560px) {
    .modal-refer-container .modal-dialog {
        width: 340px
    }

    .modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input .checkbox-dot input[type=checkbox]+label:before,
    .modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input .checkbox input[type=checkbox]+label:after,
    .modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input .radio input[type=radio]+label:after,
    .modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input .radio input[type=radio]+label:before {
        display: inline-block;
        position: absolute;
        left: 246px;
        width: 16px;
        height: 16px;
        line-height: 16px;
        margin-left: -16px
    }
}

@media (max-width:500px) {
    .modal-refer-container .modal-dialog {
        width: 300px
    }

    .modal-refer-container .modal-dialog .back-img .title {
        font-size: 20px
    }

    .modal-refer-container .modal-dialog .back-img .refer-content {
        margin-top: 0
    }

    .modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input .checkbox-dot input[type=checkbox]+label:before,
    .modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input .checkbox input[type=checkbox]+label:after,
    .modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input .radio input[type=radio]+label:after,
    .modal-refer-container .modal-dialog .back-img .refer-content .inner .refer-input .radio input[type=radio]+label:before {
        display: inline-block;
        position: absolute;
        left: 212px;
        width: 16px;
        height: 16px;
        line-height: 16px;
        margin-left: -16px
    }
}

.modal-course-window .modal-dialog {
    max-width: 456px;
    height: 210px;
    margin: 0 auto
}

.modal-course-window .modal-dialog .modal-content,
.modal-course-window .modal-dialog .modal-content .modal-header {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.modal-course-window .modal-dialog .modal-content .modal-header {
    background-color: #fff;
    color: #fff;
    padding-top: 8px;
    padding-bottom: 0;
    border-bottom: none
}

.modal-course-window .modal-dialog .modal-content .modal-body {
    padding-top: 0
}

.modal-course-window .modal-dialog .modal-content .modal-body .title {
    text-align: center;
    color: #3e454d;
    font-size: 20px;
    padding-top: 10px
}

.modal-course-window .modal-dialog .modal-content .modal-body .input-wrapper-img {
    text-align: center;
    color: #3e454d;
    font-size: 14px;
    margin-top: 16px
}

.modal-course-window .modal-dialog .modal-content .modal-footer {
    padding-top: 0
}

.bottomColumn {
    position: fixed;
    height: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff;
    padding: 0 20px;
    border-top: 1px solid #e5e5e5
}

.bottomColumn.no-show {
    display: none
}

.bottomColumn .leftContent {
    font-size: 16px;
    color: #ff7a45
}

.bottomColumn .btn {
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    font-size: 14px;
    padding: 4px 22px
}

.bottomColumn .btn-plain {
    background-color: #fff;
    color: #ff7a45
}

.bottomColumn .btn+.btn {
    margin-left: 6px
}


* {
    outline: 0
}

body {
    background-color: #f7f8fa;
    word-break: break-all
}

a {
    color: #3e454d
}

a:hover {
    color: #0f6af3;
    text-decoration: none
}

a.disabled {
    cursor: not-allowed;
    color: #9399a5
}

a.link,span.link {
    cursor: pointer;
    color: #0f6af3
}

a.link:hover,span.link:hover {
    color: #0f6af3;
    text-decoration: underline
}

a.link-disable,span.link-disable {
    color: #0f6af3;
    cursor: not-allowed;
    opacity: .5
}

a.link-disable:hover,span.link-disable:hover {
    color: #0f6af3;
    text-decoration: underline
}

.no-event {
    pointer-events: none
}

iframe {
    border: none
}

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

em,i {
    font-style: normal
}

.cursor-disable {
    cursor: not-allowed!important
}

.cursor-default {
    cursor: default!important
}

.cursor-pointer {
    cursor: pointer
}

.text-alignR {
    text-align: right!important
}

.text-red {
    color: #f34235!important
}

.text-black {
    color: #000!important
}

.font20 {
    font-size: 20px
}

.font18 {
    font-size: 18px
}

.font16 {
    font-size: 16px
}

.font14 {
    font-size: 14px!important
}

.font12 {
    font-size: 12px!important
}

.text-color333 {
    color: #3e454d!important
}

.text-color666 {
    color: #676c73!important
}

.text-color999 {
    color: #9399a5!important
}

.text-blue {
    color: #0f6af3!important
}

.text-orange {
    color: #ff7a45!important
}

.text-green {
    color: #0f6af3
}

.text-yellow {
    color: #ffb327!important
}

.border-underline {
    border-bottom: 1px solid #0f6af3
}

.bgc-white {
    background-color: #fff
}

.border-yellow {
    border: 1px solid #ffe58f!important
}

.border-blue {
    border: 1px solid #0f6af3!important
}

.c-disabled {
    color: #9399a5!important
}

.badge-red {
    background-color: #f34235
}

.color-orange {
    color: #ff6700
}

.orangeColor {
    color: #ff7a45
}

.orangeColor:focus,.orangeColor:hover {
    color: #ff7a45
}

.op07 {
    filter: alpha(opacity=70)!important;
    opacity: .7!important
}

.link-btn-dropdown {
    position: relative
}

.link-btn-dropdown:hover .link-btn-dropdown-layer {
    display: block
}

.link-btn-dropdown.button-dropdown .link-btn-dropdown-layer {
    top: 100%;
    left: 0;
    right: auto;
    padding-top: 6px;
    min-width: 100%
}

.link-btn-dropdown.component-switch {
    display: inline-block
}

.link-btn-dropdown.component-switch .cs-text {
    cursor: pointer
}

.link-btn-dropdown.component-switch .cs-text .text {
    position: relative;
    color: #676c73;
    padding-left: 12px
}

.link-btn-dropdown.component-switch .cs-text .text:before {
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -3px;
    width: 6px;
    height: 6px;
    font-size: 0;
    background-color: #52c41a;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    content: ""
}

.link-btn-dropdown.component-switch .cs-text .text.off:before {
    background-color: #eb4d3d
}

.link-btn-dropdown.component-switch .cs-text .iconfont {
    font-size: 12px;
    margin-left: 10px;
    color: #bfbfbf;
    display: inline-block;
    -webkit-transition: .15s ease-in;
    -o-transition: ease-in .15s;
    -moz-transition: ease-in .15s;
    transition: .15s ease-in
}

.link-btn-dropdown.component-switch:hover .cs-text .iconfont {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg)
}

.link-btn-dropdown.component-switch .link-btn-dropdown-layer {
    top: 100%;
    left: 0;
    right: auto;
    padding-top: 10px;
    min-width: 100%
}

.link-btn-dropdown-layer {
    position: absolute;
    top: 50%;
    right: 0;
    z-index: 2;
    display: none;
    cursor: default;
    padding-top: 20px
}

.link-btn-dropdown-layer .layer-inner {
    width: 100%;
    height: 100%;
    white-space: nowrap;
    background-color: #fff;
    -webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,.1);
    -moz-box-shadow: 0 0 5px 0 rgba(0,0,0,.1);
    box-shadow: 0 0 5px 0 rgba(0,0,0,.1)
}

.link-btn-dropdown-layer .layer-inner>* {
    display: block;
    padding-left: 18px;
    padding-right: 18px;
    text-align: center;
    line-height: 38px;
    margin-bottom: 0;
    font-weight: 400;
    max-width: none
}

.link-btn-dropdown-layer .layer-inner>:hover {
    text-decoration: none;
    background-color: #fafafa;
    color: #0f6af3
}

.ellipsis {
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.ellipsis-multiple,.ellipsis-multiple-l2,.ellipsis-multiple-l3,.ellipsis-multiple-l4 {
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-box-orient: vertical;
    display: -webkit-box
}

.ellipsis-multiple-l2 {
    -webkit-line-clamp: 2
}

.ellipsis-multiple-l3 {
    -webkit-line-clamp: 3
}

.ellipsis-multiple-l4 {
    -webkit-line-clamp: 4
}

.rounddot {
    position: relative;
    line-height: 1;
    z-index: 1
}

.rounddot:after {
    content: "";
    position: absolute;
    top: -4px;
    right: -6px;
    padding: 3px;
    z-index: 9999999;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    font-size: 0;
    line-height: 0;
    border-width: 1px;
    border-style: solid
}

.rounddot.rounddot-red:after {
    background-color: #f34235;
    border-color: #f34235
}

video::-webkit-media-controls,video::-webkit-media-controls-start-playback-button {
    display: none!important
}

.table-layout-fixed {
    table-layout: fixed
}

.label-table {
    display: table;
    width: 100%
}

.label-table .label-tr {
    display: table-row
}

.label-table .label-td {
    display: table-cell;
    vertical-align: middle
}

.label-table .label-td.top {
    vertical-align: top
}

.label-table .label-td.bottom {
    vertical-align: bottom
}

.div-thead {
    overflow: hidden;
    background-color: #f6f8fa;
    font-weight: 700;
    line-height: 42px
}

.div-thead [class*=col-] {
    float: left;
    padding-left: 20px;
    padding-right: 20px
}

@media (min-width: 1230px) {
    .container {
        width:1230px
    }
}

@media (min-width: 1200px) {
    .container {
        width:1230px
    }
}

@media (min-width: 992px) {
    .col-five-1,.col-five-2,.col-five-3,.col-five-4,.col-five-5 {
        position:relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
        float: left
    }

    .col-five-1 {
        width: 20%
    }

    .col-five-2 {
        width: 40%
    }

    .col-five-3 {
        width: 60%
    }

    .col-five-4 {
        width: 80%
    }

    .col-five-5 {
        width: 100%
    }
}

@font-face {
    font-family: iconfont;
    src: url(/iconfont/iconfont.eot?t=1676341547067);
    src: url(/iconfont/iconfont.eot?t=1676341547067#iefix) format("embedded-opentype"),url(/iconfont/iconfont.woff2?t=1676341547067) format("woff2"),url(/iconfont/iconfont.woff?t=1676341547067) format("woff"),url(/iconfont/iconfont.ttf?t=1676341547067) format("truetype"),url(/iconfont/iconfont.svg?t=1676341547067#iconfont) format("svg")
}

.iconfont {
    font-family: iconfont!important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.icon-daochu:before {
    content: "\E6CC"
}

.icon-tuichu:before {
    content: "\E6C8"
}

.icon-xiayijie:before {
    content: "\E6C9"
}

.icon-shangyijie:before {
    content: "\E6CA"
}

.icon-erji-mian:before {
    content: "\E6C6"
}

.icon-yinpin:before {
    content: "\E6C7"
}

.icon-qiehuan1:before {
    content: "\E789"
}

.icon-remen:before {
    content: "\E6C2"
}

.icon-loading:before {
    content: "\E8FD"
}

.icon-qiehuan:before {
    content: "\E6C5"
}

.icon-xiaoxi:before {
    content: "\E6C3"
}

.icon-icon_qingtian:before {
    content: "\E6C4"
}

.icon-shouye-zhibo:before {
    content: "\E6C1"
}

.icon-renzheng:before {
    content: "\E6C0"
}

.icon-dayinji2:before {
    content: "\E6BF"
}

.icon-xiaoshi:before {
    content: "\E6BE"
}

.icon-duxue:before {
    content: "\E6BD"
}

.icon-liebiao:before {
    content: "\E818"
}

.icon-bili:before {
    content: "\E6BC"
}

.icon-flag:before {
    content: "\E6BB"
}

.icon-detail:before {
    content: "\E6B9"
}

.icon-shengli:before {
    content: "\E6BA"
}

.icon-people:before {
    content: "\E6B8"
}

.icon-attache-case:before {
    content: "\E6B7"
}

.icon-tuandui:before {
    content: "\E6B5"
}

.icon-pinglun:before {
    content: "\E6B6"
}

.icon-dengdai:before {
    content: "\E6B4"
}

.icon-shoujihao:before {
    content: "\E6B3"
}

.icon-tixing:before {
    content: "\E6B2"
}

.icon-daijiao:before {
    content: "\E6B0"
}

.icon-yaoqingyouli:before {
    content: "\E6AE"
}

.icon-xuexiditu:before {
    content: "\E6AC"
}

.icon-zuzhijiagou:before {
    content: "\E6AB"
}

.icon-xiazai:before {
    content: "\E6AA"
}

.icon-dianji-shouzhi:before {
    content: "\E6A9"
}

.icon-weixiao:before {
    content: "\E6A8"
}

.icon-home:before {
    content: "\E7AC"
}

.icon-caigou:before {
    content: "\E6A7"
}

.icon-baoming:before {
    content: "\E6A6"
}

.icon-xiuxi:before {
    content: "\E7BA"
}

.icon-jietu:before {
    content: "\E6A4"
}

.icon-kedan:before {
    content: "\E69F"
}

.icon-zuigaofen:before {
    content: "\E6A0"
}

.icon-zongfen:before {
    content: "\E6A1"
}

.icon-yaoqing:before {
    content: "\E6EA"
}

.icon-taolun:before {
    content: "\E6CB"
}

.icon-eye-close:before {
    content: "\E69B"
}

.icon-sudian:before {
    content: "\E69D"
}

.icon-mulu:before {
    content: "\E699"
}

.icon-biji:before {
    content: "\E69A"
}

.icon-integral:before {
    content: "\E9AE"
}

.icon-wodemingpian:before {
    content: "\E698"
}

.icon-wodetiwen:before {
    content: "\E697"
}

.icon-fabu:before {
    content: "\E696"
}

.icon-exam:before {
    content: "\E695"
}

.icon-chapter:before {
    content: "\E6EE"
}

.icon-wodeketang:before {
    content: "\E694"
}

.icon-shijianjindu:before {
    content: "\E693"
}

.icon-jiangpinpeizhi:before {
    content: "\E711"
}

.icon-zanwu-hui:before {
    content: "\E69C"
}

.icon-weizhongjiangx:before {
    content: "\E691"
}

.icon-wj-fill:before {
    content: "\E690"
}

.icon-lock-fill:before {
    content: "\E68F"
}

.icon-guanbi:before {
    content: "\E7B7"
}

.icon-youhuiquan:before {
    content: "\E68E"
}

.icon-yiguoqi:before {
    content: "\E68B"
}

.icon-yishiyong:before {
    content: "\E68C"
}

.icon-yilingqu:before {
    content: "\E68D"
}

.icon-paixu-shang:before {
    content: "\E688"
}

.icon-paixu-xia:before {
    content: "\F062"
}

.icon-red-packet:before {
    content: "\E687"
}

.icon-xunlianying:before {
    content: "\E692"
}

.icon-bianji:before {
    content: "\E686"
}

.icon-gengduo:before {
    content: "\E924"
}

.icon-zuoye:before {
    content: "\E685"
}

.icon-wenjianjia:before {
    content: "\E6A5"
}

.icon-fujian:before {
    content: "\E6E0"
}

.icon-xiala1:before {
    content: "\E684"
}

.icon-down-pop:before {
    content: "\F061"
}

.icon-upload:before {
    content: "\E67E"
}

.icon-xuexi:before {
    content: "\E682"
}

.icon-xingzhuang7292kaobei2:before {
    content: "\E681"
}

.icon-yiwen:before {
    content: "\E680"
}

.icon-hege:before {
    content: "\E67F"
}

.icon-fankui:before {
    content: "\E64B"
}

.icon-siweidaotu:before {
    content: "\E67D"
}

.icon-msg:before {
    content: "\E67B"
}

.icon-gonggao1:before {
    content: "\E8D5"
}

.icon-qiye:before {
    content: "\E67A"
}

.icon-address2:before {
    content: "\E679"
}

.icon-time:before {
    content: "\E671"
}

.icon-address1:before {
    content: "\E670"
}

.icon-paixingbang:before {
    content: "\E6AD"
}

.icon-minus:before {
    content: "\E66E"
}

.icon-jichuxinxi:before {
    content: "\E815"
}

.icon-xuexibaogao1:before {
    content: "\E678"
}

.icon-weixin:before {
    content: "\E61F"
}

.icon-chenggong:before {
    content: "\E677"
}

.icon-image:before {
    content: "\E676"
}

.icon-bangdingweixin:before {
    content: "\E675"
}

.icon-xuexirenwu-hover:before {
    content: "\E674"
}

.icon-jindu:before {
    content: "\E6FE"
}

.icon-xitongguanli:before {
    content: "\E66B"
}

.icon-renwuguanli:before {
    content: "\E66C"
}

.icon-ziyuanguanli:before {
    content: "\E6A3"
}

.icon-gonggao:before {
    content: "\ED51"
}

.icon-fuzhu_youyong:before {
    content: "\E667"
}

.icon-dianzan-2:before {
    content: "\E66A"
}

.icon-guaduan:before {
    content: "\E666"
}

.icon-tonghuao:before {
    content: "\E725"
}

.icon-danmukai:before {
    content: "\E665"
}

.icon-gengduocaozuo:before {
    content: "\E663"
}

.icon-danmuguanbi:before {
    content: "\E664"
}

.icon-shipin:before {
    content: "\E65F"
}

.icon-xianluqiehuan:before {
    content: "\E661"
}

.icon-liaotian:before {
    content: "\E662"
}

.icon-yidong:before {
    content: "\E6D8"
}

.icon-fuzhi:before {
    content: "\E66F"
}

.icon-ziliao1:before {
    content: "\E65E"
}

.icon-zhankai:before {
    content: "\E65C"
}

.icon-shouqi:before {
    content: "\E65D"
}

.icon-duigou:before {
    content: "\E65A"
}

.icon-cuo:before {
    content: "\E65B"
}

.icon-fanhuidingbu3:before {
    content: "\E659"
}

.icon-ziliao:before {
    content: "\E658"
}

.icon-kecheng:before {
    content: "\E654"
}

.icon-kefu:before {
    content: "\E6D0"
}

.icon-huiyuan:before {
    content: "\E655"
}

.icon-team:before {
    content: "\E656"
}

.icon-kefu-2:before {
    content: "\EAA1"
}

.icon-arrow-down:before {
    content: "\E69E"
}

.icon-close-2:before {
    content: "\E669"
}

.icon-paixu:before {
    content: "\E64A"
}

.icon-yanzhengma:before {
    content: "\E619"
}

.icon-zhanghao:before {
    content: "\E760"
}

.icon-xuexibaogao:before {
    content: "\E649"
}

.icon-wodekecheng:before {
    content: "\E64C"
}

.icon-xuexijilu:before {
    content: "\E64D"
}

.icon-wodedingdan:before {
    content: "\E650"
}

.icon-wj:before {
    content: "\E657"
}

.icon-live:before {
    content: "\E648"
}

.icon-warning-2:before {
    content: "\E647"
}

.icon-offline:before {
    content: "\E744"
}

.icon-image-2:before {
    content: "\E77B"
}

.icon-face:before {
    content: "\E63B"
}

.icon-money:before {
    content: "\E63F"
}

.icon-tuiguang:before {
    content: "\E63D"
}

.icon-doctor-hat:before {
    content: "\E6B1"
}

.icon-address:before {
    content: "\E6D4"
}

.icon-video-fill:before {
    content: "\E646"
}

.icon-user-fill-2:before {
    content: "\E639"
}

.icon-book-fill-2:before {
    content: "\E660"
}

.icon-book-fill:before {
    content: "\E63A"
}

.icon-clock-2:before {
    content: "\E653"
}

.icon-video-2:before {
    content: "\E6A2"
}

.icon-live-2:before {
    content: "\E638"
}

.icon-experience:before {
    content: "\E64F"
}

.icon-certificate:before {
    content: "\E637"
}

.icon-add-2:before {
    content: "\E636"
}

.icon-ok-2:before {
    content: "\E6AF"
}

.icon-read:before {
    content: "\E6F1"
}

.icon-remove-fill:before {
    content: "\E633"
}

.icon-right:before {
    content: "\E652"
}

.icon-doubt-fill:before {
    content: "\E616"
}

.icon-player-pause:before {
    content: "\E628"
}

.icon-player-fullscreen-shrink:before {
    content: "\E629"
}

.icon-player-volume:before {
    content: "\E62A"
}

.icon-player-play:before {
    content: "\E62D"
}

.icon-player-fullscreen-expand:before {
    content: "\E62F"
}

.icon-player-volume-mute:before {
    content: "\E632"
}

.icon-pdf:before {
    content: "\E627"
}

.icon-play-2:before {
    content: "\E626"
}

.icon-horn-circle-fill:before {
    content: "\E6F7"
}

.icon-statistics:before {
    content: "\E615"
}

.icon-notice:before {
    content: "\E716"
}

.icon-phone:before {
    content: "\E645"
}

.icon-phone-fill:before {
    content: "\E66D"
}

.icon-fullscreen-shrink:before {
    content: "\E611"
}

.icon-zoom-out:before {
    content: "\E613"
}

.icon-fullscreen-expand:before {
    content: "\E6DD"
}

.icon-zoom-in:before {
    content: "\E620"
}

.icon-wechat-pay:before {
    content: "\E631"
}

.icon-doc:before {
    content: "\E624"
}

.icon-video:before {
    content: "\E8AD"
}

.icon-bought:before {
    content: "\E6E6"
}

.icon-refresh:before {
    content: "\E63C"
}

.icon-play-1:before {
    content: "\E62E"
}

.icon-add:before {
    content: "\E630"
}

.icon-wechat:before {
    content: "\E621"
}

.icon-delete:before {
    content: "\E623"
}

.icon-remove-circle:before {
    content: "\E61D"
}

.icon-add-circle:before {
    content: "\E651"
}

.icon-password-circle:before {
    content: "\E61C"
}

.icon-position-fill:before {
    content: "\E642"
}

.icon-calendar:before {
    content: "\E610"
}

.icon-windows:before {
    content: "\E668"
}

.icon-apple:before {
    content: "\E60D"
}

.icon-search:before {
    content: "\E60C"
}

.icon-users-fill:before {
    content: "\E641"
}

.icon-exam-fill:before {
    content: "\E609"
}

.icon-clock-fill:before {
    content: "\E607"
}

.icon-book-2:before {
    content: "\E618"
}

.icon-count-down-fill:before {
    content: "\E758"
}

.icon-user-fill:before {
    content: "\E60B"
}

.icon-play:before {
    content: "\E61B"
}

.icon-paper:before {
    content: "\E617"
}

.icon-bell:before {
    content: "\E643"
}

.icon-arrow-down-fill:before {
    content: "\E63E"
}

.icon-arrow-right-fill:before {
    content: "\E603"
}

.icon-folder-fill:before {
    content: "\E673"
}

.icon-prev-circle-2:before {
    content: "\F05F"
}

.icon-next-circle:before {
    content: "\F060"
}

.icon-prev-circle:before {
    content: "\E612"
}

.icon-next-circle-2:before {
    content: "\E614"
}

.icon-warning-fill:before {
    content: "\E625"
}

.icon-star:before {
    content: "\E60F"
}

.icon-star-empty:before {
    content: "\E60E"
}

.icon-ok:before {
    content: "\E62C"
}

.icon-photo:before {
    content: "\E61E"
}

.icon-required:before {
    content: "\E634"
}

.icon-close:before {
    content: "\E601"
}

.icon-ask:before {
    content: "\E67C"
}

.icon-count-down:before {
    content: "\E672"
}

.icon-done:before {
    content: "\E644"
}

.icon-user:before {
    content: "\E635"
}

.icon-clock:before {
    content: "\E606"
}

.icon-show-pwd:before {
    content: "\E622"
}

.icon-hide-pwd:before {
    content: "\E64E"
}

.icon-excel:before {
    content: "\E640"
}

.icon-share:before {
    content: "\E62B"
}

.icon-round-dot:before {
    content: "\E61A"
}

.icon-doubt:before {
    content: "\E60A"
}

.icon-warning:before {
    content: "\E608"
}

.icon-fail:before {
    content: "\E604"
}

.icon-success:before {
    content: "\E605"
}

.icon-progress:before {
    content: "\E683"
}

.icon-article:before {
    content: "\F05B"
}

.icon-file:before {
    content: "\E68A"
}

.icon-next:before {
    content: "\E600"
}

.icon-prev:before {
    content: "\F05C"
}

.icon-down:before {
    content: "\F05D"
}

.icon-up:before {
    content: "\F05E"
}

.icon-quotation:before {
    content: "\E602"
}

.icon-quotation-reverse:before {
    content: "\E729"
}

.icon-book:before {
    content: "\E689"
}

.icon {
    display: inline-block;
    vertical-align: top;
    position: relative
}

.icon:after {
    position: absolute;
    font-family: iconfont!important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.icon--calendar {
    background-color: #fff
}

.icon--calendar .form-control {
    position: relative;
    z-index: 2;
    background-color: rgba(0,0,0,0)!important
}

.icon--calendar.time:after {
    content: "\E671"
}

.icon--calendar:after {
    top: 50%;
    right: 8px;
    z-index: 1;
    margin-top: -6px;
    line-height: 1;
    color: #676c73;
    font-size: 12px;
    content: "\E610"
}

.label-icon {
    font-weight: 400;
    display: inline-block;
    padding: .3em .5em
}

.label-icon.label-icon-blue {
    background-color: #eef4fe;
    color: #0f6af3
}

.label-icon.label-icon-green {
    background-color: #f0f9f7;
    color: #01b287
}

.label-icon.label-icon-red {
    background-color: #fef1f0;
    color: #f34235
}

.label-icon.label-icon-yellow {
    background-color: #fff5ef;
    color: #ff701d
}

.label-icon.label-icon-skyblue {
    background-color: rgba(30,186,219,.07);
    color: #1ebadb
}

.label-title-status {
    font-weight: 400;
    display: inline-block;
    padding: .25em .4em;
    margin-top: .2em;
    vertical-align: top;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    color: #fff
}

.label-title-status.label-title-status-01 {
    background-color: #5897f7
}

.label-title-status.label-title-status-02 {
    background-color: #ff6700;
    background-image: -moz-linear-gradient(left,#ff6700 0,#f3390e 100%);
    background-image: -webkit-linear-gradient(left,#ff6700,#f3390e);
    background-image: -o-linear-gradient(left,#ff6700 0,#f3390e 100%);
    background-image: -webkit-gradient(linear,left top,right top,from(#ff6700),to(#f3390e));
    background-image: linear-gradient(90deg,#ff6700 0,#f3390e);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFFF6700",endColorstr="#FFF3390E",GradientType="1")
}

.label-title-status.label-title-status-02>img {
    width: 14px;
    vertical-align: baseline;
    margin-right: 4px
}

.label-title-status.label-title-status-03 {
    background-color: #ccc
}

.label-title-status.label-title-status-04 {
    color: #ff7a45;
    background-color: #ffe3cd
}

.label-title-status.label-title-status-05 {
    color: #0f6af3;
    background-color: #e5eeff
}

.label-title-status.label-title-status-06 {
    color: #9399a5;
    background-color: #efefef
}

.label-title-status.label-title-status-07 {
    background-color: #f30e0e
}

.label-title-status.label-title-status-08 {
    background-color: #f30e0e;
    display: inline-block!important
}

.label-title-status.label-title-status-09 {
    background-color: #ff7a45
}

.label-title-status.label-title-status-10 {
    background-color: #0f6af3
}

.label-title-status.label-title-status-11 {
    background-color: #8f7bf7
}

@media (max-width: 540px) {
    .label-title-status.label-title-status-02>img {
        width:12px
    }
}

.__icons {
    background-image: url(../images/icon/icons.png?v=0.3);
    background-repeat: no-repeat;
    -moz-background-size: 112px auto;
    background-size: 112px auto
}

body * {
    scrollbar-arrow-color:#e0e0e0;scrollbar-face-color:#e6e6e6;scrollbar-highlight-color:#e6e6e6;scrollbar-shadow-color:#e6e6e6;scrollbar-track-color:#f7f7f7;scrollbar-3dlight-color: #e6e6e6;
    scrollbar-darkshadow-color: #e6e6e6;
    scrollbar-base-color:#e6e6e6}

body ::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    overflow: auto
}

body ::-webkit-scrollbar-thumb {
    background-color: #dee0e2;
    min-height: 25px;
    width: 6px;
    -webkit-border-radius: 3px;
    border-radius: 3px
}

body ::-webkit-scrollbar-track {
    background-color: #fff
}

body ::-webkit-scrollbar-button {
    height: 0
}

.checkbox,.radio {
    padding-left: 16px;
    height: 16px;
    line-height: 16px
}

.checkbox label,.radio label {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    padding-left: 5px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.checkbox.input-right,.radio.input-right {
    padding-left: 0;
    padding-right: 16px
}

.checkbox.input-right label,.radio.input-right label {
    padding-left: 0;
    padding-right: 5px
}

.checkbox.input-right label:after,.checkbox.input-right label:before,.radio.input-right label:after,.radio.input-right label:before {
    left: auto!important;
    margin-right: -16px!important;
    right: 0
}

.checkbox.hide-label>label,.radio.hide-label>label {
    padding-left: 0
}

.checkbox.only-label>label:after,.checkbox.only-label>label:before,.radio.only-label>label:after,.radio.only-label>label:before {
    display: none!important
}

.checkbox label:before,.radio.radio-square label:before {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px
}

.checkbox.checkbox-circle label:before,.radio label:before {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%
}

.checkbox input[type=checkbox],.radio input[type=radio] {
    opacity: 0;
    z-index: -1
}

.checkbox input[type=checkbox]+label:after,.checkbox input[type=checkbox]+label:before,.radio input[type=radio]+label:after,.radio input[type=radio]+label:before {
    display: inline-block;
    position: absolute;
    left: 0;
    width: 16px;
    height: 16px;
    line-height: 16px;
    margin-left: -16px
}

.checkbox input[type=checkbox]+label:before,.radio input[type=radio]+label:before {
    top: 0;
    content: "";
    border: 1px solid #ccc;
    background-color: #fff
}

.checkbox input[type=checkbox]+label:after,.radio input[type=radio]+label:after {
    top: 1px;
    text-align: center;
    color: #fff;
    font-family: iconfont!important;
    font-size: 12px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.checkbox input[type=checkbox].checked+label:before,.checkbox input[type=checkbox]:checked+label:before,.radio input[type=radio].checked+label:before,.radio input[type=radio]:checked+label:before {
    border-width: 0;
    background-color: #0f6af3
}

.checkbox input[type=checkbox].checked+label:after,.checkbox input[type=checkbox]:checked+label:after,.radio input[type=radio].checked+label:after,.radio input[type=radio]:checked+label:after {
    content: "\E62C"
}

.checkbox input[type=checkbox].disabled,.checkbox input[type=checkbox].disabled-2,.checkbox input[type=checkbox]:disabled,.radio input[type=radio].disabled,.radio input[type=radio].disabled-2,.radio input[type=radio]:disabled {
    cursor: default
}

.checkbox input[type=checkbox].disabled+label,.checkbox input[type=checkbox].disabled-2+label,.checkbox input[type=checkbox]:disabled+label,.radio input[type=radio].disabled+label,.radio input[type=radio].disabled-2+label,.radio input[type=radio]:disabled+label {
    opacity: .65
}

.checkbox input[type=checkbox].disabled+label,.checkbox input[type=checkbox].disabled+label:after,.checkbox input[type=checkbox].disabled+label:before,.checkbox input[type=checkbox].disabled-2+label,.checkbox input[type=checkbox].disabled-2+label:after,.checkbox input[type=checkbox].disabled-2+label:before,.checkbox input[type=checkbox]:disabled+label,.checkbox input[type=checkbox]:disabled+label:after,.checkbox input[type=checkbox]:disabled+label:before,.radio input[type=radio].disabled+label,.radio input[type=radio].disabled+label:after,.radio input[type=radio].disabled+label:before,.radio input[type=radio].disabled-2+label,.radio input[type=radio].disabled-2+label:after,.radio input[type=radio].disabled-2+label:before,.radio input[type=radio]:disabled+label,.radio input[type=radio]:disabled+label:after,.radio input[type=radio]:disabled+label:before {
    cursor: default
}

.checkbox input[type=checkbox].disabled+label,.checkbox input[type=checkbox]:disabled+label,.radio input[type=radio].disabled+label,.radio input[type=radio]:disabled+label {
    opacity: .65
}

.checkbox input[type=checkbox].disabled-2+label,.radio input[type=radio].disabled-2+label {
    opacity: 1
}

.checkbox input[type=checkbox].disabled-2+label:before,.radio input[type=radio].disabled-2+label:before {
    border-width: 1px;
    border-color: #ccc;
    background-color: #f2f2f2
}

.checkbox input[type=checkbox].disabled-2+label:after,.radio input[type=radio].disabled-2+label:after {
    color: #ccc
}

.radio.radio-dot input[type=radio].checked+label:before,.radio.radio-dot input[type=radio]:checked+label:before {
    border-width: 1px;
    border-color: #0f6af3;
    background-color: #fff
}

.radio.radio-dot input[type=radio].checked+label:after,.radio.radio-dot input[type=radio]:checked+label:after {
    left: 3px;
    top: 3px;
    content: "";
    width: 10px;
    height: 10px;
    background-color: #0f6af3;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%
}

.radio.radio-dot input[type=radio].disabled-2+label {
    opacity: 1
}

.radio.radio-dot input[type=radio].disabled-2+label:before {
    border-color: #ccc
}

.radio.radio-dot input[type=radio].disabled-2+label:after {
    content: ""
}

.radio.radio-dot input[type=radio].disabled-2:checked+label:after {
    background-color: #ccc
}

.checkbox-container>div {
    display: inline-block
}

.checkbox-container>div+div {
    margin-left: 20px
}

.checkbox-switch {
    display: inline-block;
    vertical-align: text-bottom;
    width: 32px;
    height: 16px;
    line-height: 16px
}

.checkbox-switch input[type=checkbox] {
    opacity: 0;
    z-index: 1;
    display: none
}

.checkbox-switch input[type=checkbox]:checked+label {
    color: #0f6af3
}

.checkbox-switch input[type=checkbox]:checked+label:before {
    margin-left: 16px
}

.checkbox-switch input[type=checkbox]:disabled+label {
    opacity: .5;
    cursor: not-allowed
}

.checkbox-switch input[type=checkbox]+label {
    display: inline-block;
    width: 32px;
    height: 16px;
    border: 1px solid rgba(0,0,0,0);
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    background-color: currentColor;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: #dcdfe6;
    -webkit-transition: all .2s;
    -o-transition: all .2s;
    -moz-transition: all .2s;
    transition: all .2s;
    cursor: pointer;
    margin-bottom: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.checkbox-switch input[type=checkbox]+label:before {
    content: "";
    width: 14px;
    height: 14px;
    display: inline-block;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color: #fff;
    -webkit-transition: margin-left .2s;
    -o-transition: margin-left .2s;
    -moz-transition: margin-left .2s;
    transition: margin-left .2s
}

.btn-blue {
    color: #fff;
    background-color: #0f6af3;
    border-color: #0f6af3
}

.btn-blue.focus {
    color: #fff;
    background-color: #0b63e6;
    border-color: #0b63e6
}

.btn-blue:hover {
    color: #fff;
    background-color: #0b63e6;
    border-color: #0b63e6
}

.btn-blue.active,.btn-blue:active {
    color: #fff;
    background-color: #0b63e6;
    border-color: #0b63e6;
    background-image: none
}

.btn-blue.active.focus,.btn-blue.active:hover,.btn-blue:active.focus,.btn-blue:active:hover {
    color: #fff;
    background-color: #0b5edb;
    border-color: #0b5edb
}

.btn-blue.disabled.focus,.btn-blue.disabled:hover,.btn-blue[disabled].focus,.btn-blue[disabled]:hover {
    background-color: #0f6af3;
    border-color: #0f6af3
}

.btn-blue .badge {
    color: #0f6af3;
    background-color: #fff
}

.btn-blue.btn-blue-plain,.btn-blue.btn-blue-plain[disabled] {
    background-color: #fff!important;
    color: #0f6af3!important
}

.open>.dropdown-toggle.btn-blue {
    color: #fff;
    background-color: #0b63e6;
    border-color: #0b63e6;
    background-image: none
}

.open>.dropdown-toggle.btn-blue.focus,.open>.dropdown-toggle.btn-blue:hover {
    color: #fff;
    background-color: #0b5edb;
    border-color: #0b5edb
}

fieldset[disabled] .btn-blue.focus,fieldset[disabled] .btn-blue:hover {
    background-color: #0f6af3;
    border-color: #0f6af3
}

.btn-orange {
    color: #fff;
    background-color: #ff7a45;
    border-color: #ff7a45
}

.btn-orange.focus {
    color: #fff;
    background-color: #ff6e34;
    border-color: #ff6e34
}

.btn-orange:hover {
    color: #fff;
    background-color: #ff6e34;
    border-color: #ff6e34
}

.btn-orange.active,.btn-orange:active {
    color: #fff;
    background-color: #ff6e34;
    border-color: #ff6e34;
    background-image: none
}

.btn-orange.active.focus,.btn-orange.active:hover,.btn-orange:active.focus,.btn-orange:active:hover {
    color: #fff;
    background-color: #ff6628;
    border-color: #ff6628
}

.btn-orange.disabled.focus,.btn-orange.disabled:hover,.btn-orange[disabled].focus,.btn-orange[disabled]:hover {
    background-color: #ff7a45;
    border-color: #ff7a45
}

.btn-orange .badge {
    color: #ff7a45;
    background-color: #fff
}

.btn-orange.btn-orange-plain,.btn-orange.btn-orange-plain[disabled] {
    background-color: #fff!important;
    color: #ff7a45!important
}

.open>.dropdown-toggle.btn-orange {
    color: #fff;
    background-color: #ff6e34;
    border-color: #ff6e34;
    background-image: none
}

.open>.dropdown-toggle.btn-orange.focus,.open>.dropdown-toggle.btn-orange:hover {
    color: #fff;
    background-color: #ff6628;
    border-color: #ff6628
}

fieldset[disabled] .btn-orange.focus,fieldset[disabled] .btn-orange:hover {
    background-color: #ff7a45;
    border-color: #ff7a45
}

.btn-orange-01 {
    color: #fff;
    background-color: #ff795a;
    border-color: #ff795a
}

.btn-orange-01.focus {
    color: #fff;
    background-color: #ff6b49;
    border-color: #ff6b49
}

.btn-orange-01:hover {
    color: #fff;
    background-color: #ff6b49;
    border-color: #ff6b49
}

.btn-orange-01.active,.btn-orange-01:active {
    color: #fff;
    background-color: #ff6b49;
    border-color: #ff6b49;
    background-image: none
}

.btn-orange-01.active.focus,.btn-orange-01.active:hover,.btn-orange-01:active.focus,.btn-orange-01:active:hover {
    color: #fff;
    background-color: #ff623d;
    border-color: #ff623d
}

.btn-orange-01.disabled.focus,.btn-orange-01.disabled:hover,.btn-orange-01[disabled].focus,.btn-orange-01[disabled]:hover {
    background-color: #ff795a;
    border-color: #ff795a
}

.btn-orange-01 .badge {
    color: #ff795a;
    background-color: #fff
}

.btn-orange-01.btn-orange-01-plain,.btn-orange-01.btn-orange-01-plain[disabled] {
    background-color: #fff!important;
    color: #ff795a!important
}

.open>.dropdown-toggle.btn-orange-01 {
    color: #fff;
    background-color: #ff6b49;
    border-color: #ff6b49;
    background-image: none
}

.open>.dropdown-toggle.btn-orange-01.focus,.open>.dropdown-toggle.btn-orange-01:hover {
    color: #fff;
    background-color: #ff623d;
    border-color: #ff623d
}

fieldset[disabled] .btn-orange-01.focus,fieldset[disabled] .btn-orange-01:hover {
    background-color: #ff795a;
    border-color: #ff795a
}

.btn-default {
    color: #3e454d;
    background-color: #fff;
    border-color: #ccc
}

.btn-default.focus {
    color: #3e454d;
    background-color: #e6e6e6;
    border-color: #8c8c8c
}

.btn-default:hover {
    color: #0f6af3;
    background-color: #fff;
    border-color: #0f6af3
}

.btn-default.active,.btn-default:active,.open>.dropdown-toggle.btn-default {
    color: #0f6af3;
    background-color: #fff;
    border-color: #0f6af3
}

.btn-default.active.focus,.btn-default.active:hover,.btn-default:active.focus,.btn-default:active:hover,.open>.dropdown-toggle.btn-default.focus,.open>.dropdown-toggle.btn-default:hover {
    color: #0f6af3;
    background-color: #fff;
    border-color: #0f6af3
}

.btn-default.active,.btn-default:active,.open>.dropdown-toggle.btn-default {
    background-image: none
}

.btn-default.disabled.focus,.btn-default.disabled:hover,.btn-default[disabled].focus,.btn-default[disabled]:hover,fieldset[disabled] .btn-default.focus,fieldset[disabled] .btn-default:hover {
    color: #3e454d;
    background-color: #fff;
    border-color: #ccc
}

.btn-disabled {
    cursor: default
}

.btn-disabled,.btn-disabled.active,.btn-disabled.active.focus,.btn-disabled.active:hover,.btn-disabled.focus,.btn-disabled:active,.btn-disabled:active.focus,.btn-disabled:active:hover,.btn-disabled:hover {
    color: #9399a5;
    background-color: #eee;
    border-color: #eee
}

.btn-disabled.active,.btn-disabled:active {
    background-image: none
}

.btn-disabled.disabled.focus,.btn-disabled.disabled:hover,.btn-disabled[disabled].focus,.btn-disabled[disabled]:hover {
    background-color: #eee;
    border-color: #eee
}

.open>.dropdown-toggle.btn-disabled {
    background-image: none
}

.open>.dropdown-toggle.btn-disabled,.open>.dropdown-toggle.btn-disabled.focus,.open>.dropdown-toggle.btn-disabled:hover {
    color: #9399a5;
    background-color: #eee;
    border-color: #eee
}

fieldset[disabled] .btn-disabled.focus,fieldset[disabled] .btn-disabled:hover {
    background-color: #eee;
    border-color: #eee
}

.btn-disabled .badge {
    color: #eee;
    background-color: #9399a5
}

.btn {
    padding: 7px 18px;
    min-width: 94px
}

.btn.mwa {
    min-width: auto
}

.btn.btn-lg {
    min-width: 160px;
    line-height: 1.4285714286;
    font-size: 22px;
    padding: 8px 35px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

@media (max-width: 1199px) {
    .btn.btn-lg {
        min-width:auto;
        font-size: 18px;
        padding: 7px 24px
    }
}

@media (max-width: 991px) {
    .btn.btn-lg {
        font-size:16px;
        padding: 6px 21px
    }
}

@media (max-width: 767px) {
    .btn.btn-lg {
        padding:6px 16px
    }
}

@media (min-width: 992px) {
    .btn-list {
        font-size:16px;
        padding: 8px 17px
    }
}

.btn-wrapper {
    padding-top: 50px;
    text-align: center
}

.btn-wrapper .btn+.btn {
    margin-left: 80px
}

@media (max-width: 767px) {
    .btn-wrapper .btn+.btn {
        margin-left:50px
    }
}

@media (max-width: 375px) {
    .btn-wrapper .btn+.btn {
        margin-left:20px
    }
}

.form-control {
    display: inline-block;
    width: 300px;
    height: 36px;
    padding: 7px 9px;
    vertical-align: top;
    border-color: #ccc
}

.form-control.smaller {
    height: 22px;
    padding: 0 3px;
    width: 40px;
    font-size: 12px;
    text-align: center
}

.form-switch-wrapper {
    display: inline-block;
    vertical-align: middle;
    font-size: 0;
    overflow: hidden
}

.form-switch-wrapper .form-switch,.form-switch-wrapper .form-switch-input,.form-switch-wrapper .form-switch-text {
    float: left;
    font-size: 14px;
    line-height: 16px;
    height: 16px
}

.form-switch-wrapper .form-switch {
    position: relative;
    width: 32px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    cursor: pointer;
    background-color: #dcdfe6
}

.form-switch-wrapper .form-switch,.form-switch-wrapper .form-switch i {
    -webkit-transition: .1s linear;
    -o-transition: .1s linear;
    -moz-transition: .1s linear;
    transition: .1s linear
}

.form-switch-wrapper .form-switch i {
    position: absolute;
    left: 1px;
    top: 1px;
    width: 14px;
    height: 14px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color: #fff
}

.form-switch-wrapper .form-switch-text {
    margin-left: 10px;
    display: none
}

.form-switch-wrapper .form-switch-input {
    margin-left: 35px
}

.form-switch-wrapper .form-switch-input .form-control {
    height: 20px;
    margin-right: 10px
}

.form-switch-wrapper .form-switch-on {
    background-color: #0f6af3
}

.form-switch-wrapper .form-switch-on i {
    left: 100%;
    margin-left: -14.5px
}

.select-wrapper {
    width: 120px;
    vertical-align: top;
    line-height: 0
}

.select-wrapper .select {
    width: 100%
}

.select-wrapper .select::-moz-placeholder {
    color: #555
}

.select-wrapper .select:-ms-input-placeholder {
    color: #555
}

.select-wrapper .select::-webkit-input-placeholder {
    color: #555
}

.select-wrapper.select-icon-arrow,.select-wrapper.select-icon-remove {
    position: relative
}

.select-wrapper.select-icon-arrow>input,.select-wrapper.select-icon-remove>input {
    padding-right: 22px
}

.select-wrapper.select-icon-arrow:after,.select-wrapper.select-icon-remove:after {
    cursor: pointer;
    position: absolute;
    right: 6px
}

.select-wrapper.select-icon-arrow:after {
    content: "";
    width: 0;
    height: 0;
    border-left: 5px solid rgba(0,0,0,0);
    border-right: 5px solid rgba(0,0,0,0);
    border-top: 5px solid #9399a5;
    top: 0;
    bottom: 0;
    margin: auto
}

.select-wrapper.select-icon-remove:after {
    width: 12px;
    height: 12px;
    top: 50%;
    margin-top: -6px;
    line-height: 12px;
    -webkit-transform: scale(.7);
    -moz-transform: scale(.7);
    -ms-transform: scale(.7);
    -o-transform: scale(.7);
    transform: scale(.7);
    content: "\E601";
    font-family: iconfont!important;
    font-size: 12px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.select-wrapper+.form-control,.select-wrapper+.select-wrapper {
    margin-left: 20px
}

.form-number-wrapper {
    display: inline-block;
    vertical-align: middle;
    overflow: hidden;
    position: relative
}

.form-number-wrapper .form-number__decrease,.form-number-wrapper .form-number__increase {
    position: absolute;
    top: 1px;
    width: 34px;
    line-height: 34px;
    text-align: center;
    cursor: pointer
}

.form-number-wrapper .form-number__decrease.disabled,.form-number-wrapper .form-number__increase.disabled {
    color: #e5e5e5;
    cursor: not-allowed
}

.form-number-wrapper .form-number__decrease .iconfont,.form-number-wrapper .form-number__increase .iconfont {
    font-size: 14px
}

.form-number-wrapper .form-number__decrease {
    left: 1px
}

.form-number-wrapper .form-number__increase {
    right: 1px
}

.form-number-wrapper .form-control {
    padding-left: 34px;
    padding-right: 34px;
    text-align: center;
    width: 130px
}

.form-textarea {
    position: relative;
    background-color: #fff;
    border: 1px solid #ccc;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px
}

.form-textarea .textarea-wrapper {
    padding: 8px 8px 26px
}

.form-textarea .textarea-wrapper,.form-textarea .textarea-wrapper .textarea {
    width: 100%;
    height: 100%
}

.form-textarea .textarea-wrapper .textarea {
    height: 134px;
    min-height: 20px;
    padding: 0;
    resize: none;
    border: none
}

.form-textarea .content-number {
    position: absolute;
    bottom: 6px;
    right: 10px;
    line-height: 1;
    color: #9399a5
}

.price-wrapper .price-symbol {
    padding-right: 3px
}

.price-wrapper>div {
    float: left
}

.price-wrapper .ori-price {
    color: #9399a5
}

.price-wrapper .ori-price.line-through {
    text-decoration: line-through
}

.price-wrapper .ori-price+.price {
    margin-left: 4px
}

.price-wrapper .price {
    color: #f34235;
    margin-top: -6px
}

.price-wrapper .price .price-num {
    font-size: 22px
}

.price-wrapper .price+.ori-price {
    margin-left: 4px
}

.price-wrapper .price-coupon {
    font-size: 12px;
    display: inline-block;
    background-color: #ff7a45;
    padding: 4px 12px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    color: #fff;
    margin-left: 20px;
    vertical-align: text-bottom
}

@media (max-width: 540px) {
    .price-wrapper .price {
        margin-top:-1px
    }

    .price-wrapper .price .price-num {
        font-size: 16px
    }
}

.bootstrap-dialog .modal-body,.bootstrap-dialog .modal-footer {
    padding: 20px
}

.bootstrap-dialog .modal-header {
    padding: 16px 20px
}

.bootstrap-dialog .modal-header .bootstrap-dialog-title {
    font-size: 16px
}

.bootstrap-dialog .modal-header .close {
    font-weight: 400;
    color: #888;
    filter: alpha(opacity=100);
    opacity: 1
}

.bootstrap-dialog .modal-header .close:hover {
    color: #3e454d
}

.bootstrap-dialog .modal-content {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.bootstrap-dialog .modal-footer {
    border-top: none;
    text-align: center
}

.bootstrap-dialog .modal-footer .btn+.btn {
    margin-left: 20px
}

.bootstrap-dialog .bootstrap-dialog-message {
    position: relative
}

.bootstrap-dialog-affirm .modal-content {
    text-align: center
}

.bootstrap-dialog-affirm .modal-content .bootstrap-dialog-message .affirm-icon .iconfont {
    font-size: 54px;
    line-height: 1.5;
    color: #0f6af3
}

.bootstrap-dialog-affirm .modal-content .bootstrap-dialog-message .affirm-msg {
    padding: 25px 0 40px;
    line-height: 28px;
    font-size: 16px
}

.bootstrap-dialog-affirm .modal-content .bootstrap-dialog-message .affirm-msg .input {
    margin-top: 15px
}

.bootstrap-dialog-affirm .modal-content .modal-footer {
    padding: 0;
    border-top: none
}

.bootstrap-dialog-affirm .modal-content .modal-footer .btn {
    width: 50%;
    height: 60px;
    line-height: 60px;
    padding: 0;
    border: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    font-size: 16px;
    float: left
}

.bootstrap-dialog-affirm .modal-content .modal-footer .btn+.btn {
    margin-left: 0
}

.bootstrap-dialog-affirm .modal-content .modal-footer .btn.btn-ok {
    color: #fff;
    background-color: #0f6af3
}

.bootstrap-dialog-affirm .modal-content .modal-footer .btn.btn-cancel {
    background-color: #f7f7f7
}

@media (min-width: 768px) {
    .bootstrap-dialog-affirm .modal-dialog {
        width:400px!important;
        margin-left: auto!important;
        margin-right: auto!important
    }
}

@media (max-width: 767px) {
    .bootstrap-dialog-affirm .modal-dialog {
        margin-left:30px;
        margin-right: 30px
    }

    .bootstrap-dialog-affirm .modal-content .bootstrap-dialog-message .affirm-icon .iconfont {
        font-size: 46px
    }

    .bootstrap-dialog-affirm .modal-content .bootstrap-dialog-message .affirm-msg {
        padding: 15px 0 25px;
        line-height: 28px;
        font-size: 14px
    }

    .bootstrap-dialog-affirm .modal-content .bootstrap-dialog-message .affirm-msg .input>input {
        width: 100%
    }

    .bootstrap-dialog-affirm .modal-content .modal-footer .btn {
        height: 50px;
        line-height: 50px;
        font-size: 16px
    }
}

:root .bootstrap-dialog-toast .modal-content {
    background: rgba(0,0,0,.5)
}

.modal-update-browser .bootstrap-dialog-message {
    text-align: center;
    font-size: 24px;
    padding-top: 30px;
    padding-bottom: 30px
}

.modal-update-browser .bootstrap-dialog-message h1 {
    padding-bottom: 20px;
    color: #f34235
}

@media (min-width: 992px) {
    .modal-update-browser .modal-dialog {
        width:750px
    }
}

@media (min-width: 768px) and (max-width:991px) {
    .modal-update-browser .modal-dialog {
        width:88%
    }
}

@media (max-width: 767px) {
    .modal-update-browser .bootstrap-dialog-message {
        font-size:18px;
        padding-top: 15px;
        padding-bottom: 15px
    }

    .modal-update-browser .bootstrap-dialog-message h1 {
        font-size: 24px;
        padding-bottom: 20px
    }
}

@media (max-width: 540px) {
    .modal-update-browser .bootstrap-dialog-message {
        font-size:14px;
        padding-top: 5px;
        padding-bottom: 5px
    }

    .modal-update-browser .bootstrap-dialog-message h1 {
        font-size: 20px;
        padding-bottom: 10px
    }
}

.modal-irregular-shape .modal-content {
    background: none
}

.modal-irregular-shape .modal-body {
    padding: 0
}

.modal-irregular-shape .bootstrap-dialog-message .icon-close-wrapper {
    position: absolute;
    bottom: -60px;
    left: 50%;
    margin-left: -20px
}

.modal-irregular-shape .bootstrap-dialog-message .icon-close-wrapper>i {
    position: relative;
    z-index: 2;
    color: #fff;
    font-size: 40px;
    line-height: 1
}

.modal-irregular-shape .bootstrap-dialog-message .icon-close-wrapper.top-right {
    top: -20px;
    right: -60px;
    bottom: auto;
    left: auto
}

@media (max-width: 767px) {
    .modal-irregular-shape .bootstrap-dialog-message .icon-close-wrapper.top-right.top-right-flexible {
        top:auto;
        right: auto;
        bottom: -60px;
        left: 50%
    }
}

.modal-irregular-shape.modal-gift .modal-dialog {
    width: 481px;
    height: 606px
}

.modal-irregular-shape.modal-gift .gift-back {
    width: 100%;
    height: 100%
}

.modal-irregular-shape.modal-gift .gift-content-wrapper {
    position: absolute;
    left: 0;
    top: 43.5643564356%;
    right: 0;
    z-index: 1;
    width: 100%;
    padding-left: 18.711018711%;
    padding-right: 14.553014553%
}

.modal-irregular-shape.modal-gift .gift-content {
    width: 100%;
    height: 0;
    overflow: hidden;
    padding-bottom: 26.7022696929%;
    position: relative
}

.modal-irregular-shape.modal-gift .gift-table {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: table
}

.modal-irregular-shape.modal-gift .gift-table .gift-cell {
    vertical-align: middle;
    display: table-cell;
    color: #cd4f3b!important;
    font-size: 20px
}

.modal-irregular-shape.modal-gift .gift-table .gift-cell>span {
    border-bottom: 1px solid #cd4f3b!important
}

.modal-irregular-shape.modal-gift .gift-close {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 10.395010395%;
    z-index: 2;
    width: 100%;
    height: 0;
    padding-bottom: 16.632016632%
}

.modal-irregular-shape.modal-gift .gift-close>a {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.modal-irregular-shape.modal-wj-reward .modal-dialog {
    width: 440px
}

.modal-irregular-shape.modal-wj-reward .modal-content {
    background-color: #fff;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    text-align: center
}

.modal-irregular-shape.modal-wj-reward .bootstrap-dialog-message {
    padding-bottom: 9.0909090909%
}

.modal-irregular-shape.modal-wj-reward .reward-icon {
    margin-top: -20.2352941176%
}

.modal-irregular-shape.modal-wj-reward .reward-icon>img {
    width: 65%
}

.modal-irregular-shape.modal-wj-reward .reward-text {
    font-size: 28px;
    margin-top: 9.8823529412%
}

.modal-irregular-shape.modal-wj-reward .reward-text-small {
    font-size: 22px;
    color: #676c73;
    margin-top: 4.7058823529%
}

.modal-irregular-shape.modal-wj-reward .reward-close-btn {
    width: 75%;
    height: 66px;
    font-size: 30px;
    -webkit-border-radius: 33px;
    -moz-border-radius: 33px;
    border-radius: 33px;
    margin-top: 11.7647058824%
}

.modal-irregular-shape.modal-hb-after .hb-back,.modal-irregular-shape.modal-hb-before .hb-back {
    max-width: 100%
}

.modal-irregular-shape.modal-hb-after .hb-content-wrapper,.modal-irregular-shape.modal-hb-before .hb-content-wrapper {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1
}

.modal-irregular-shape.modal-hb-before .modal-dialog {
    width: 454px;
    height: 502px
}

.modal-irregular-shape.modal-hb-after .modal-dialog {
    width: 390px;
    height: 492px
}

.modal-irregular-shape.modal-hb-after .hb-content {
    margin-top: 20.5128205128%;
    height: 38.4615384615%;
    text-align: center;
    color: #ff0103
}

.modal-irregular-shape.modal-hb-after .hb-content .hb-symbol {
    font-size: 42px
}

.modal-irregular-shape.modal-hb-after .hb-content .hb-num {
    font-size: 70px;
    font-weight: 700
}

.modal-irregular-shape.modal-hb-after .hb-close {
    margin-top: 28.2051282051%;
    height: 0;
    padding-bottom: 20%;
    position: relative
}

.modal-irregular-shape.modal-hb-after .hb-close>a {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.modal-irregular-shape.modal-certificate .modal-dialog {
    width: 476px;
    height: 471px
}

.modal-irregular-shape.modal-certificate .certificate-back {
    width: 100%;
    height: 100%
}

.modal-irregular-shape.modal-certificate .certificate-content {
    position: absolute;
    left: 50%;
    top: 10.1910828025%;
    z-index: 1;
    margin-left: -42.0168067227%;
    width: 84.0336134454%
}

.modal-irregular-shape.modal-certificate .certificate-content.is_vertical {
    top: unset;
    bottom: 0
}

.modal-irregular-shape.modal-certificate .certificate-front {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    width: 100%
}

.modal-irregular-shape.modal-certificate .title {
    position: absolute;
    left: 50%;
    top: 22.9122055675%;
    color: #f0ac2a;
    z-index: 3;
    font-size: 24px;
    margin-left: -27.731092437%;
    width: 55.4621848739%;
    font-weight: 700;
    text-align: center
}

.modal-irregular-shape.modal-certificate .nameinput {
    position: absolute;
    left: 50%;
    z-index: 3;
    top: 38.2165605096%;
    margin-left: -29.4117647059%;
    width: 58.8235294118%
}

.modal-irregular-shape.modal-certificate .nameinput .form-control {
    width: 100%;
    border-color: #f0ac2a;
    padding: 5% 9px;
    height: 9.7664543524%
}

.modal-irregular-shape.modal-certificate .btn-wrapper {
    padding-top: 0
}

.modal-irregular-shape.modal-certificate .btn-wrapper .btn {
    position: absolute;
    left: 50%;
    bottom: 8.4925690021%;
    z-index: 3;
    width: 50.4201680672%;
    margin-left: -25.2100840336%;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
    border-radius: 24px;
    background-color: #f0ac2a;
    color: #fff;
    font-size: 18px;
    padding: 2.5210084034% 18px
}

.modal-irregular-shape.modal-certificate-before .modal-dialog {
    width: 476px;
    height: 471px
}

.modal-irregular-shape.modal-certificate-before .certificate-back {
    width: 100%;
    height: 100%
}

.modal-irregular-shape.modal-certificate-before .certificate-front {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    width: 100%
}

.modal-irregular-shape.modal-certificate-before .title {
    position: absolute;
    left: 50%;
    top: 13.8004246285%;
    color: #f0ac2a;
    z-index: 3;
    font-size: 24px;
    margin-left: -27.731092437%;
    width: 55.4621848739%;
    font-weight: 700;
    text-align: center
}

.modal-irregular-shape.modal-certificate-before .nameinput {
    position: absolute;
    left: 50%;
    z-index: 3;
    top: 25.9023354565%;
    margin-left: -29.4117647059%;
    width: 58.8235294118%
}

.modal-irregular-shape.modal-certificate-before .nameinput .form-control {
    width: 100%;
    border-color: #f0ac2a;
    padding: 2.8571428571% 9px;
    height: 7.6433121019%;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.modal-irregular-shape.modal-certificate-before .nameinput .form-control+.form-control {
    margin-top: 20px
}

.modal-irregular-shape.modal-certificate-before .btn-wrapper {
    padding-top: 0;
    height: 0
}

.modal-irregular-shape.modal-certificate-before .btn-wrapper .btn-confirm {
    position: absolute;
    left: 50%;
    bottom: 10.6157112527%;
    z-index: 3;
    width: 50.4201680672%;
    margin-left: -25.2100840336%;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
    border-radius: 24px;
    background-color: #f0ac2a;
    color: #fff;
    font-size: 18px;
    padding: 2.1008403361% 18px
}

.modal-irregular-shape.modal-certificate-before .btn-wrapper .btn-cancel {
    position: absolute;
    left: 50%;
    bottom: 3.1847133758%;
    z-index: 3;
    margin-left: -18px;
    text-align: center;
    color: #9399a5;
    font-size: 18px
}

.modal-irregular-shape.modal-receive-send-course .modal-dialog {
    width: 312px
}

.modal-irregular-shape.modal-receive-send-course .bootstrap-dialog-message {
    width: 100%;
    height: 357px;
    padding-top: 37px;
    background: url(/assets/images/modal/receive-send-course-bg.png) 50% no-repeat;
    text-align: center
}

.modal-irregular-shape.modal-receive-send-course .tit {
    color: #894b36;
    line-height: 42px
}

.modal-irregular-shape.modal-receive-send-course .tit>span {
    display: inline-block
}

.modal-irregular-shape.modal-receive-send-course .tit1>span {
    font-size: 18px;
    position: relative
}

.modal-irregular-shape.modal-receive-send-course .tit1>span:after,.modal-irregular-shape.modal-receive-send-course .tit1>span:before {
    position: absolute;
    top: 20px;
    width: 18px;
    height: 1px;
    content: ""
}

.modal-irregular-shape.modal-receive-send-course .tit1>span:before {
    left: -30px;
    background-color: #fff;
    background-image: -moz-linear-gradient(left,#fff 0,#894b36 100%);
    background-image: -webkit-linear-gradient(left,#fff,#894b36);
    background-image: -o-linear-gradient(left,#fff 0,#894b36 100%);
    background-image: -webkit-gradient(linear,left top,right top,from(#fff),to(#894b36));
    background-image: linear-gradient(90deg,#fff 0,#894b36);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFFFFFFF",endColorstr="#FF894B36",GradientType="1")
}

.modal-irregular-shape.modal-receive-send-course .tit1>span:after {
    right: -30px;
    background-color: #894b36;
    background-image: -moz-linear-gradient(left,#894b36 0,#fff 100%);
    background-image: -webkit-linear-gradient(left,#894b36,#fff);
    background-image: -o-linear-gradient(left,#894b36 0,#fff 100%);
    background-image: -webkit-gradient(linear,left top,right top,from(#894b36),to(#fff));
    background-image: linear-gradient(90deg,#894b36 0,#fff);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FF894B36",endColorstr="#FFFFFFFF",GradientType="1")
}

.modal-irregular-shape.modal-receive-send-course .tit2 {
    padding-top: 2px
}

.modal-irregular-shape.modal-receive-send-course .tit2>span {
    font-size: 36px;
    letter-spacing: 10px;
    margin-left: 10px
}

.modal-irregular-shape.modal-receive-send-course .tit3 {
    font-size: 30px;
    padding-bottom: 10px
}

.modal-irregular-shape.modal-receive-send-course .ftit {
    padding-top: 3px;
    line-height: 32px
}

.modal-irregular-shape.modal-receive-send-course .ftit>span {
    background-color: #f6caa4;
    padding-left: 25px;
    padding-right: 25px;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border-radius: 16px
}

.modal-irregular-shape.modal-receive-send-course .but {
    padding-top: 90px
}

.modal-irregular-shape.modal-receive-send-course .but .btn {
    width: 180px;
    height: 48px;
    line-height: 48px;
    padding: 0;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    color: #ab4c38;
    font-size: 20px;
    border: none;
    background-color: #f6e3d1;
    background-image: -moz-linear-gradient(top,#f6e3d1 0,#e8ba91 100%);
    background-image: -webkit-linear-gradient(top,#f6e3d1,#e8ba91);
    background-image: -o-linear-gradient(top,#f6e3d1 0,#e8ba91 100%);
    background-image: -webkit-gradient(linear,left top,left bottom,from(#f6e3d1),to(#e8ba91));
    background-image: linear-gradient(180deg,#f6e3d1 0,#e8ba91);
    background-repeat: repeat-y;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFF6E3D1",endColorstr="#FFE8BA91",GradientType="0")
}

.modal-irregular-shape.modal-receive-send-course .bottom {
    padding-top: 15px;
    color: #f4a798
}

.modal-irregular-shape.modal-receive-coupon .modal-dialog {
    width: 372px
}

.modal-irregular-shape.modal-receive-coupon .bootstrap-dialog-message {
    width: 100%;
    height: 324px;
    padding-top: 34px;
    background: url(/assets/images/modal/receive-coupon-back.png?v=0.0.1) 50% no-repeat
}

.modal-irregular-shape.modal-receive-coupon .tit {
    text-align: center
}

.modal-irregular-shape.modal-receive-coupon .coupon-wrapper {
    margin-top: 42px;
    width: 100%;
    height: 96px;
    padding-left: 20px;
    padding-right: 20px
}

.modal-irregular-shape.modal-receive-coupon .coupon {
    background-color: #fff;
    display: table;
    width: 100%;
    height: 100%;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px
}

.modal-irregular-shape.modal-receive-coupon .coupon .left,.modal-irregular-shape.modal-receive-coupon .coupon .right {
    display: table-cell;
    vertical-align: middle;
    height: 100%
}

.modal-irregular-shape.modal-receive-coupon .coupon .left {
    width: 28.125%;
    color: #fd4b4a;
    text-align: center;
    position: relative
}

.modal-irregular-shape.modal-receive-coupon .coupon .left:after,.modal-irregular-shape.modal-receive-coupon .coupon .left:before {
    position: absolute;
    right: -7px;
    width: 11px;
    height: 11px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color: #fd4b4a;
    content: ""
}

.modal-irregular-shape.modal-receive-coupon .coupon .left:before {
    top: -6px
}

.modal-irregular-shape.modal-receive-coupon .coupon .left:after {
    bottom: -6px
}

.modal-irregular-shape.modal-receive-coupon .coupon .left .price-wrapper .price-symbol {
    font-size: 14px;
    margin-right: -3px
}

.modal-irregular-shape.modal-receive-coupon .coupon .left .price-wrapper .price-num {
    font-size: 28px
}

.modal-irregular-shape.modal-receive-coupon .coupon .right {
    width: 71.875%;
    border-left: 3px dotted #fd4b4a;
    padding-left: 15px;
    position: relative;
    z-index: 0
}

.modal-irregular-shape.modal-receive-coupon .coupon .right .title {
    font-size: 16px
}

.modal-irregular-shape.modal-receive-coupon .coupon .right .time {
    padding-top: 5px;
    font-size: 12px;
    color: #676c73
}

.modal-irregular-shape.modal-receive-coupon .coupon .right .info {
    padding-top: 15px;
    font-size: 12px;
    color: #9399a5
}

.modal-irregular-shape.modal-receive-coupon .coupon .right .stamp {
    overflow: hidden;
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: -1;
    font-size: 72px;
    line-height: 1;
    color: #fd4b4a
}

.modal-irregular-shape.modal-receive-coupon .but {
    position: relative;
    z-index: 2;
    padding-top: 28px;
    padding-left: 20px;
    padding-right: 20px
}

.modal-irregular-shape.modal-receive-coupon .but .btn {
    width: 100%;
    height: 42px;
    line-height: 42px;
    padding: 0;
    -webkit-border-radius: 21px;
    -moz-border-radius: 21px;
    border-radius: 21px;
    color: #e74a37;
    font-size: 18px;
    border: none;
    background-color: #ffefbe
}

.modal-irregular-shape.modal-receive-coupon .coupon-front {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 126px;
    background: url(/assets/images/modal/receive-coupon-front.png) 50% no-repeat
}

.modal-irregular-shape .mode-top .modal-dialog .top-right-flexible {
    bottom: -80px
}

.modal-irregular-shape .mode-top .bootstrap-dialog-message {
    height: 230px
}

.modal-irregular-shape.modal-receive-getwidown .modal-dialog {
    width: 372px
}

.modal-irregular-shape.modal-receive-getwidown .bootstrap-dialog-message {
    width: 100%;
    max-height: 520px;
    background: url(/assets/images/modal/heder.png?v=0.0.2) 50% no-repeat
}

.modal-irregular-shape.modal-receive-getwidown .tit {
    text-align: center;
    position: absolute;
    top: -2%;
    left: 0;
    z-index: 10
}

.modal-irregular-shape.modal-receive-getwidown .tit img {
    width: 100%
}

.modal-irregular-shape.modal-receive-getwidown .tit p {
    margin-top: -68px;
    font-size: 28px;
    color: #fff
}

.modal-irregular-shape.modal-receive-getwidown .coupon-wrapper {
    overflow-y: scroll;
    width: 100%;
    max-height: 520px;
    padding: 70px 20px 100px
}

.modal-irregular-shape.modal-receive-getwidown .coupon-wrapper::-webkit-scrollbar {
    display: none
}

.modal-irregular-shape.modal-receive-getwidown .coupon {
    background-color: #fff;
    display: table;
    width: 100%;
    height: 100%;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    margin-top: 20px
}

.modal-irregular-shape.modal-receive-getwidown .coupon .left,.modal-irregular-shape.modal-receive-getwidown .coupon .right {
    display: table-cell;
    vertical-align: middle;
    height: 100%
}

.modal-irregular-shape.modal-receive-getwidown .coupon .left {
    width: 28.125%;
    color: #fd4b4a;
    text-align: center;
    position: relative
}

.modal-irregular-shape.modal-receive-getwidown .coupon .left:after,.modal-irregular-shape.modal-receive-getwidown .coupon .left:before {
    position: absolute;
    right: -7px;
    width: 11px;
    height: 11px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color: #fd4b4a;
    content: ""
}

.modal-irregular-shape.modal-receive-getwidown .coupon .left:before {
    top: -6px
}

.modal-irregular-shape.modal-receive-getwidown .coupon .left:after {
    bottom: -6px
}

.modal-irregular-shape.modal-receive-getwidown .coupon .left .price-wrapper .price-symbol {
    font-size: 14px;
    margin-right: -3px
}

.modal-irregular-shape.modal-receive-getwidown .coupon .left .price-wrapper .price-num {
    font-size: 28px
}

.modal-irregular-shape.modal-receive-getwidown .coupon .right {
    width: 71.875%;
    border-left: 3px dotted #fd4b4a;
    padding-left: 15px;
    position: relative;
    z-index: 0
}

.modal-irregular-shape.modal-receive-getwidown .coupon .right .title {
    font-size: 16px;
    margin-top: 7px
}

.modal-irregular-shape.modal-receive-getwidown .coupon .right .time {
    padding-top: 5px;
    font-size: 12px;
    color: #676c73
}

.modal-irregular-shape.modal-receive-getwidown .coupon .right .info {
    padding-top: 13px;
    font-size: 12px;
    color: #9399a5
}

.modal-irregular-shape.modal-receive-getwidown .coupon .right .stamp {
    overflow: hidden;
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: -1;
    font-size: 72px;
    line-height: 1;
    color: #fd4b4a
}

.modal-irregular-shape.modal-receive-getwidown .but {
    position: relative;
    padding-top: 28px;
    padding-left: 20px;
    padding-right: 20px
}

.modal-irregular-shape.modal-receive-getwidown .but .btn {
    width: 100%;
    height: 42px;
    line-height: 42px;
    padding: 0;
    -webkit-border-radius: 21px;
    -moz-border-radius: 21px;
    border-radius: 21px;
    color: #e74a37;
    font-size: 18px;
    border: none;
    background-color: #ffefbe
}

.modal-irregular-shape.modal-receive-getwidown .coupon-front {
    position: absolute;
    right: 0;
    bottom: -10px;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 126px;
    background: url(/assets/images/modal/receive-coupon-front.png) 50% no-repeat
}

.modal-irregular-shape.modal-receive-getwidown .but {
    position: absolute;
    right: 0;
    bottom: 26px;
    left: 0;
    z-index: 2
}

.modal-task-content-chose .modal-dialog {
    width: 1100px
}

.modal-task-content-chose .modal-body {
    padding-bottom: 0
}

.modal-task-content-chose .modal-footer .bootstrap-dialog-footer-buttons {
    text-align: right
}

.modal-task-content-chose .bootstrap-dialog-message {
    height: 554px
}

.modal-task-content-chose .-msg-left {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 300px;
    height: 100%
}

.modal-task-content-chose .-msg-left .-msg-content {
    padding-left: 8px;
    padding-right: 8px
}

.modal-task-content-chose .-msg-right {
    width: 100%;
    height: 100%;
    padding-left: 320px
}

.modal-task-content-chose .-msg-right .-msg-content {
    padding: 20px 20px 0
}

.modal-task-content-chose .-msg-content {
    position: relative;
    width: 100%;
    height: 100%;
    border: 1px solid #ccc;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.modal-task-content-chose .-msg-moreinfo {
    position: absolute;
    left: 0;
    bottom: -48px
}

.modal-task-content-chose .-msg-moreinfo .checkbox {
    margin: 0
}

.modal-task-content-chose .-msg-has-chose {
    display: inline-block
}

.modal-task-content-chose .-msg-has-chose>span {
    color: #0f6af3
}

.modal-task-content-chose .-msg-table-wrapper {
    position: relative;
    height: 100%
}

.modal-task-content-chose .-msg-table-wrapper.no-search .-msg-search {
    display: none
}

.modal-task-content-chose .-msg-table-wrapper.no-search .-msg-table-box {
    padding-top: 0!important
}

.modal-task-content-chose .-msg-table-wrapper .time {
    font-size: 12px;
    color: #9399a5;
    margin-left: 4px
}

.modal-task-content-chose .-msg-table-wrapper .section-toggle {
    margin-left: 10px;
    color: #676c73;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer
}

.modal-task-content-chose .-msg-table-wrapper .section-toggle,.modal-task-content-chose .-msg-table-wrapper .section-toggle .iconfont {
    font-size: 12px
}

.modal-task-content-chose .-msg-table-wrapper .section-toggle>span {
    padding-left: 4px;
    text-decoration: underline
}

.modal-task-content-chose .-msg-table-wrapper .section-toggle:hover {
    color: #0f6af3
}

.modal-task-content-chose .-msg-table-wrapper .section-wrapper {
    padding-left: 58px!important
}

.modal-task-content-chose .-msg-table-wrapper .section-wrapper>div {
    margin-top: 10px
}

.modal-task-content-chose .-msg-table-wrapper .section-wrapper>div:first-child {
    margin-top: 6px
}

.modal-task-content-chose .-msg-table-wrapper .section-wrapper>div:last-child {
    margin-bottom: 6px
}

.modal-task-content-chose .-msg-table-wrapper .section-wrapper .checkbox,.modal-task-content-chose .-msg-table-wrapper .section-wrapper .radio {
    height: auto
}

.modal-task-content-chose .-msg-loading {
    width: 18px;
    height: 18px;
    display: inline-block;
    line-height: 18px;
    background-image: url(/assets/images/icon/loading.svg);
    background-repeat: no-repeat;
    -moz-background-size: 100% 100%;
    background-size: 100% 100%
}

.modal-task-content-chose .-msg-search {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 20
}

.modal-task-content-chose .-msg-search>input {
    width: 100%;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    padding-right: 43px
}

.modal-task-content-chose .-msg-search .btn-search {
    position: absolute;
    top: 1px;
    right: 1px;
    bottom: 1px;
    width: 34px;
    height: 34px;
    text-align: center;
    line-height: 34px;
    border-left: 1px solid #ccc;
    color: #676c73;
    background-color: #f6f8fa
}

.modal-task-content-chose .-msg-search .btn-search .iconfont {
    font-size: 16px
}

.modal-task-content-chose .-msg-search .btn-search:hover {
    color: #0f6af3
}

.modal-task-content-chose .-msg-search .popup {
    position: absolute;
    top: 36px;
    right: 0;
    left: 0;
    display: none
}

.modal-task-content-chose .-msg-search .popup .section-num,.modal-task-content-chose .-msg-search .popup .section-toggle {
    display: none
}

.modal-task-content-chose .-msg-search .popup-content {
    background: #fff;
    border: 1px solid #ccc;
    border-top: none;
    -webkit-box-shadow: 0 10px 15px 2px rgba(0,0,0,.15);
    -moz-box-shadow: 0 10px 15px 2px rgba(0,0,0,.15);
    box-shadow: 0 10px 15px 2px rgba(0,0,0,.15)
}

.modal-task-content-chose .-msg-search .popup-content .-msg-table {
    max-height: 320px
}

.modal-task-content-chose .-msg-search.active .popup {
    display: block
}

.modal-task-content-chose .-msg-table-box {
    position: relative;
    z-index: 10;
    padding-top: 56px;
    height: 100%
}

.modal-task-content-chose .-msg-table {
    height: 99%;
    overflow-x: hidden;
    overflow-y: scroll
}

.modal-task-content-chose .-msg-table .-msg-table-tr {
    padding: 5px 15px
}

.modal-task-content-chose .-msg-table .-msg-data-entry {
    height: auto;
    margin-top: 0;
    margin-bottom: 0
}

.modal-task-content-chose .-msg-table .-msg-data-entry>label {
    width: 100%
}

.modal-task-content-chose .-msg-table-thead {
    position: relative;
    z-index: 2
}

.modal-task-content-chose .-msg-table-thead .-msg-table-tr {
    background-color: #f6f8fa
}

.modal-task-content-chose .-msg-table-thead .-msg-data-entry>label {
    font-weight: 700
}

.modal-task-content-chose .-msg-table-tbody .-msg-table-tr {
    border-bottom: 1px solid #e5e5e5
}

.modal-task-content-chose .-msg-table-tbody .-msg-table-tr:hover {
    background-color: #fbfbfb
}

.modal-task-content-chose .-msg-data-entry input+label {
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 25px
}

.modal-task-content-chose .-msg-data-entry input+label:before {
    top: 7px
}

.modal-task-content-chose .-msg-data-entry input+label:after {
    top: 8px
}

.modal-task-content-chose .-msg-data-entry label>div {
    float: left;
    line-height: 20px;
    padding-left: 15px;
    padding-right: 15px
}

.modal-task-content-chose .-msg-importuser-wrapper .importuser-errinfo {
    min-height: 60px;
    padding-top: 20px;
    padding-bottom: 20px
}

.modal-task-content-chose .-msg-importuser-wrapper .intro .intro-title {
    line-height: 1;
    font-size: 16px;
    padding-left: 10px;
    border-left: 3px solid #0f6af3
}

.modal-task-content-chose .-msg-importuser-wrapper .intro .intro-content {
    padding-top: 25px;
    padding-left: 13px;
    color: #555
}

.modal-task-content-chose .-msg-importuser-wrapper .intro .intro-content p {
    margin-bottom: 5px
}

.modal-task-content-chose.chose-user-v1 .-msg-left {
    left: auto;
    right: 0
}

.modal-task-content-chose.chose-user-v1 .-msg-left .-msg-content {
    padding: 20px
}

.modal-task-content-chose.chose-user-v1 .-msg-right {
    padding-left: 0;
    padding-right: 320px
}

.modal-task-content-chose.chose-user-v1 .-msg-chose-user {
    padding-top: 18px;
    height: 100%;
    position: relative
}

.modal-task-content-chose.chose-user-v1 .-msg-chose-user_title {
    position: absolute;
    top: 0;
    left: 0;
    line-height: 1
}

.modal-task-content-chose.chose-user-v1 .-msg-chose-user_list {
    width: 274px;
    height: 100%;
    overflow-y: auto;
    margin-left: -16px
}

.modal-task-content-chose.chose-user-v1 .-msg-chose-user_list--item {
    display: inline-block;
    background-color: #f6f8fa;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    line-height: 30px;
    padding-left: 16px;
    padding-right: 8px;
    margin-top: 16px;
    margin-left: 16px
}

.modal-task-content-chose.chose-user-v1 .-msg-chose-user_list--item .iconfont {
    display: inline-block;
    width: 28px;
    text-align: center;
    -webkit-transform: scale(.9);
    -moz-transform: scale(.9);
    -ms-transform: scale(.9);
    -o-transform: scale(.9);
    transform: scale(.9);
    font-size: 12px;
    cursor: pointer;
    color: #9399a5;
    margin-left: 5px
}

@media (max-width: 767px) {
    .modal-irregular-shape .modal-dialog {
        margin:30px auto
    }
}

@media (max-width: 580px) {
    .modal-irregular-shape .bootstrap-dialog-message .icon-close-wrapper {
        bottom:-52px;
        margin-left: -18px
    }

    .modal-irregular-shape .bootstrap-dialog-message .icon-close-wrapper>i {
        font-size: 36px
    }

    .modal-irregular-shape.modal-gift {
        overflow: hidden
    }

    .modal-irregular-shape.modal-gift .modal-dialog {
        width: 80%;
        height: 0;
        padding-bottom: 100.79002079%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%)
    }

    .modal-irregular-shape.modal-gift .gift-table .gift-cell {
        font-size: 3.6vw
    }

    .modal-irregular-shape.modal-wj-reward .modal-dialog {
        width: 72.4137931034%
    }

    .modal-irregular-shape.modal-wj-reward .reward-text {
        font-size: 24px
    }

    .modal-irregular-shape.modal-wj-reward .reward-text-small {
        font-size: 18px
    }

    .modal-irregular-shape.modal-wj-reward .reward-close-btn {
        height: 56px;
        font-size: 24px;
        -webkit-border-radius: 28px;
        -moz-border-radius: 28px;
        border-radius: 28px
    }

    .modal-irregular-shape.modal-hb-after,.modal-irregular-shape.modal-hb-before {
        overflow: hidden
    }

    .modal-irregular-shape.modal-hb-after .modal-dialog,.modal-irregular-shape.modal-hb-before .modal-dialog {
        height: 0;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%)
    }

    .modal-irregular-shape.modal-hb-before .modal-dialog {
        width: 72%;
        padding-bottom: 79.6123348018%
    }

    .modal-irregular-shape.modal-hb-after .modal-dialog {
        width: 66%;
        padding-bottom: 83.2615384615%
    }

    .modal-irregular-shape.modal-certificate-before .modal-dialog,.modal-irregular-shape.modal-certificate .modal-dialog {
        width: 72.4137931034%;
        height: auto
    }

    .modal-irregular-shape.modal-certificate-before .title,.modal-irregular-shape.modal-certificate .title {
        font-size: 18px
    }

    .modal-irregular-shape.modal-certificate-before .title {
        top: 9.5541401274%;
        font-size: 14px
    }

    .modal-irregular-shape.modal-certificate-before .btn-wrapper .btn,.modal-irregular-shape.modal-certificate-before .btn-wrapper .btn-cancel {
        font-size: 14px
    }

    .modal-irregular-shape.modal-certificate-before .btn-wrapper .btn-cancel {
        margin-left: -14px
    }

    .modal-irregular-shape.modal-certificate-before .nameinput {
        top: 21.6560509554%
    }

    .modal-irregular-shape.modal-certificate-before .nameinput .form-control+.form-control {
        margin-top: 10px
    }
}

@media (max-width: 540px) {
    .modal-irregular-shape.modal-hb-after .hb-content .hb-symbol {
        font-size:35.7px
    }

    .modal-irregular-shape.modal-hb-after .hb-content .hb-num {
        font-size: 59.5px
    }
}

@media (max-width: 480px) {
    .modal-irregular-shape .bootstrap-dialog-message .icon-close-wrapper {
        bottom:-44px;
        margin-left: -16px
    }

    .modal-irregular-shape .bootstrap-dialog-message .icon-close-wrapper>i {
        font-size: 32px
    }

    .modal-irregular-shape.modal-hb-after .hb-content .hb-symbol {
        font-size: 31.5px
    }

    .modal-irregular-shape.modal-hb-after .hb-content .hb-num {
        font-size: 52.5px
    }
}

@media (max-width: 440px) {
    .modal-irregular-shape.modal-wj-reward .reward-text {
        font-size:20px
    }

    .modal-irregular-shape.modal-wj-reward .reward-text-small {
        font-size: 16px
    }

    .modal-irregular-shape.modal-wj-reward .reward-close-btn {
        height: 48px;
        font-size: 20px;
        -webkit-border-radius: 24px;
        -moz-border-radius: 24px;
        border-radius: 24px
    }

    .modal-irregular-shape.modal-hb-after .hb-content .hb-symbol {
        font-size: 27.3px
    }

    .modal-irregular-shape.modal-hb-after .hb-content .hb-num {
        font-size: 45.5px
    }
}

@media (max-width: 385px) {
    .modal-irregular-shape.modal-certificate-before .title,.modal-irregular-shape.modal-certificate .title {
        font-size:14px;
        margin-left: -47.8260869565%;
        width: 95.652173913%
    }

    .modal-irregular-shape.modal-certificate-before .nameinput .form-control {
        height: 6.3694267516%;
        padding: 1.0714285714% 9px
    }
}

.modal-info-pop .form-group {
    line-height: 36px;
    margin-bottom: 0
}

.modal-info-pop .form-group+.form-group {
    margin-top: 15px
}

.modal-info-pop label {
    font-weight: 400;
    margin-right: 15px;
    width: 70px;
    text-align: right
}

.modal-info-pop .form-control {
    width: 196px
}

.modal-info-pop .modal-footer .btn+.btn {
    margin-left: 0
}

.modal-info-pop .home-cancel {
    color: #9399a5;
    font-size: 12px;
    position: absolute;
    left: 50%;
    bottom: 2px;
    margin-left: -55px;
    background-color: rgba(0,0,0,0)
}

.modal-info-pop .home-cancel:hover {
    color: #0f6af3
}

.modal-affirm-v2 {
    text-align: center
}

.modal-affirm-v2 .modal-dialog {
    width: 380px;
    margin-left: auto;
    margin-right: auto
}

.modal-affirm-v2 .modal-header {
    height: 0;
    padding: 0;
    position: relative;
    z-index: 100;
    border-bottom: none
}

.modal-affirm-v2 .modal-header .close {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 0
}

.modal-affirm-v2 .modal-body {
    padding-bottom: 0
}

.modal-affirm-v2 .bootstrap-dialog-message {
    padding-top: 20px
}

.modal-affirm-v2 .modal-footer {
    padding-bottom: 40px
}

.modal-affirm-v2 .modal-footer .bootstrap-dialog-footer-buttons .btn.hidden+.btn {
    margin-left: 0
}

.modal-affirm-v2.has_checkbox .modal-footer {
    padding-bottom: 60px
}

.modal-affirm-v2 .\--icon {
    line-height: 1
}

.modal-affirm-v2 .\--icon+.\--title {
    margin-top: 20px
}

.modal-affirm-v2 .\--icon .iconfont {
    font-size: 50px;
    color: #0f6af3
}

.modal-affirm-v2 .\--title {
    font-size: 20px;
    line-height: 1
}

.modal-affirm-v2 .\--msg {
    padding-top: 27px;
    padding-bottom: 7px
}

.modal-affirm-v2 .\--checkbox-wrapper {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -92px
}

.modal-affirm-v2 .\--checkbox-wrapper .checkbox,.modal-affirm-v2 .\--checkbox-wrapper .radio {
    padding-left: 0;
    margin-top: 0;
    margin-bottom: 0
}

.modal-affirm-v2 .\--checkbox-wrapper label {
    color: #676c73
}

@media (max-width: 410px) {
    .modal-affirm-v2 .modal-dialog {
        width:90%
    }
}


.pager-wrapper {
    text-align: center;
    min-height: 1px
}

.table-list {
    margin-bottom: 0!important
}

.table-list tbody>tr>td,.table-list tbody>tr>th,.table-list thead>tr>td,.table-list thead>tr>th {
    padding: 13px 15px;
    vertical-align: middle
}

.table-list tbody>tr>td .checkbox,.table-list tbody>tr>td .radio,.table-list tbody>tr>th .checkbox,.table-list tbody>tr>th .radio,.table-list thead>tr>td .checkbox,.table-list thead>tr>td .radio,.table-list thead>tr>th .checkbox,.table-list thead>tr>th .radio {
    margin-top: 0;
    margin-bottom: 0
}

.table-list thead {
    background: #f6f8fa
}

.table-list thead>tr>td,.table-list thead>tr>th {
    border-bottom-width: 0;
    white-space: nowrap
}

.table-list tbody>tr>td,.table-list tbody>tr>th {
    color: #676c73;
    border-top: none;
    border-bottom: 1px solid #e5e5e5;
    word-break: break-all
}

.table-list tbody>tr:hover {
    background-color: #fbfbfb
}


.empty-wrapper {
    background: #fff;
    overflow: hidden;
    padding-top: 95px;
    padding-bottom: 115px;
    text-align: center
}

.empty-wrapper .empty-icon>img {
    max-width: 162px
}

.empty-wrapper .empty-msg {
    padding-top: 30px;
    color: #676c73
}

@media (max-width: 767px) {
    .empty-wrapper {
        margin-left:-15px;
        margin-right: -15px
    }

    .empty-wrapper .empty-icon>img {
        width: 30%
    }
}


.prism-player {
    overflow: hidden
}

.prism-player .unsupported-browser {
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -20px;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 28px;
    text-align: center;
    color: #fff
}

@media (max-width: 991px) {
    .prism-player .unsupported-browser {
        font-size:24px
    }
}

@media (max-width: 767px) {
    .prism-player .unsupported-browser {
        font-size:18px
    }
}

@media (max-width: 540px) {
    .prism-player .unsupported-browser {
        font-size:14px
    }
}

.img-fit {
    position: relative
}

.img-fit,.no-show {
    display: none
}

.cursor {
    cursor: pointer
}

.inline-block {
    display: inline-block
}

.border-blue {
    border: 1px solid #0f6af3
}

.mt0 {
    margin-top: 0!important
}

.mt10 {
    margin-top: 10px!important
}

.mt12 {
    margin-top: 12px!important
}

.mt15 {
    margin-top: 15px!important
}

.mt20 {
    margin-top: 20px!important
}

.mt30 {
    margin-top: 30px!important
}

.mt60 {
    margin-top: 60px!important
}

.ml0 {
    margin-left: 0!important
}

.ml10 {
    margin-left: 10px!important
}

.ml20 {
    margin-left: 20px!important
}

.mr8 {
    margin-right: 8px!important
}

.ml30 {
    margin-left: 30px!important
}

.mr10 {
    margin-right: 10px!important
}

.mr15 {
    margin-right: 15px!important
}

.mr20 {
    margin-right: 20px!important
}

.w50 {
    width: 50px!important
}

.w80 {
    width: 80px!important
}

.w90 {
    width: 90px!important
}

.w110 {
    width: 110px!important
}

.w120 {
    width: 120px!important
}

.w150 {
    width: 150px!important
}

.w160 {
    width: 160px!important
}

.w170 {
    width: 170px!important
}

.w180 {
    width: 180px!important
}

.w200 {
    width: 200px!important
}

.w260 {
    width: 260px!important
}

.w300 {
    width: 300px!important
}

.w400 {
    width: 400px!important
}

.w420 {
    width: 420px!important
}

.w500 {
    width: 500px!important
}

.w600 {
    width: 600px!important
}

.w-full {
    width: 100%
}

.pt14 {
    padding-top: 14px!important
}

.pt0 {
    padding-top: 0!important
}

.pt5 {
    padding-top: 5px!important
}

.pb0 {
    padding-bottom: 0!important
}

.pt30 {
    padding-top: 30px!important
}

.pt80 {
    padding-top: 80px!important
}

.pb30 {
    padding-bottom: 30px!important
}

.pt20 {
    padding-top: 20px!important
}

.pt10 {
    padding-top: 10px!important
}

.pb10 {
    padding-bottom: 10px!important
}

.pb20 {
    padding-bottom: 20px!important
}

.pl15 {
    padding-left: 15px!important
}

.pr15 {
    padding-right: 15px!important
}

.pr20 {
    padding-right: 20px!important
}

.fontsize-12 {
    font-size: 12px!important
}



.g-breadcrumb {
    line-height: 1;
    color: #676c73;
    padding-bottom: 20px;
    font-size: 14px
}

.g-breadcrumb .iconfont {
    color: #9399a5;
    font-size: .8571428571em;
    padding-left: .5em;
    padding-right: .5em
}

@media (max-width: 767px) {
    .g-breadcrumb {
        display:none
    }
}


.container-body {
    margin-top: 20px;
    padding-bottom: 80px
}

@media (max-width: 991px) {
    .container-body {
        padding-bottom:65px
    }
}

@media (max-width: 375px) {
    .container-body {
        padding-bottom:45px
    }
}

@media (max-width: 767px) {
    .container-no-top {
        margin-top:0!important
    }
}

.cover-wrapper {
    top: 0;
    right: 0;
    bottom: 0
}

.cover-mask,.cover-table,.cover-text,.cover-wrapper {
    position: absolute;
    left: 0
}

.cover-mask {
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 4999;
    font-size: 0;
    line-height: 0;
    background: #000;
    filter: alpha(opacity=50);
    opacity: .5
}

.cover-text {
    top: 50%;
    z-index: 5000;
    width: 100%;
    text-align: center;
    color: #fff;
    font-weight: 400;
    line-height: 40px;
    font-size: 22px;
    margin-top: -20px
}

.cover-table {
    display: table;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 5000;
    width: 100%;
    height: 100%
}

.cover-table .cover-td {
    height: 100%;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    color: #fff;
    font-weight: 400;
    line-height: 40px;
    font-size: 22px
}

.has-no-data {
    background-color: #fff;
    padding-top: 100px!important;
    padding-bottom: 120px!important;
    text-align: center
}

.has-no-data,.has-no-data-1 {
    border-bottom: none!important
}

.has-no-data-1 {
    display: table-cell!important
}

.has-no-data-1 .empty-wrapper {
    background: none
}

.loadingdata {
    width: 30px;
    height: 30px;
    margin: 0 auto 10px;
    background-image: url(/assets/images/icon/loading.svg);
    background: url(/assets/images/icon/loading.gif?v=0.0.1) \0 ;
    background-repeat: no-repeat!important;
    background-position: 50%!important;
    -moz-background-size: 30px 30px!important;
    background-size: 30px 30px!important
}

.loadingdata.white {
    background-image: url(/assets/images/icon/loading-white.svg);
    background: url(/assets/images/icon/loading-white.gif?v=0.0.1) \0
}




.g-common-ontherbanner {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    overflow: hidden;
    width: 100%;
    margin-bottom: 20px
}



a[href^="https://www.cnzz.com/stat/website.php"] {
    display: none
}

a[href="https://www.cnzz.com/stat/website.php?web_id=1281277756"] {
    display: none
}

.flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.flex-center {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.flex-between-center,.flex-center,.flex-left-center {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.flex-between-center {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.flex-right-center {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.flex-column-center {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.flex-column-center,.flex-column-start {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.flex-column-start {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}


@media (min-width: 768px) {
    .dl-horizontal dt {
        float: left;
        width: 160px;
        overflow: hidden;
        clear: left;
        text-align: right;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

.pull-right {
    float: right !important;
}
.label {
    display: inline;
    padding: .2em .6em .3em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    -webkit-border-radius: .25em;
    -moz-border-radius: .25em;
    border-radius: .25em;
}
.tab-content>.active {
    display: block;
}

.detail-body .detail-intro-container p {
    line-height: 28px;
    color: #676c73;
    margin-bottom: 0;
}


.couresnav {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}
.couresnav>li {
    position: relative;
    display: block;
}
.nav-pills>li {
    float: left;
}
.course-module-nav-extra.position {
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -10px;
}
.tab-content>.active {
    display: block;
}
.course-module-nav>li {
    /* position: relative; */
}
.nav-pills>li {
    float: left;
}
.nav>li {
    position: relative;
    display: block;
}
.detail-body .detail-intro-container {
    overflow: hidden;
    padding-top: 8px;
    font-size:16px;
}