@charset "utf-8";
/* header */

.edu-students {
    min-height: calc(100vh - 323px);
}

.es-header {
    height: 200px;
    background: url(../images/edu-students/header.png) no-repeat center #27405C;
}

.es-header-block {
    height: 100%;
}

.es-header-block .main-wrap {
    height: 100%;
}

.es-header-wrap {
    height: 100%;
    justify-content: flex-start;
    position: relative;
}

.es-header-wrap .img-block {
    margin: 0;
    width: 102px;
    height: 102px;
    border-radius: 50%;
    overflow: hidden;
}

.es-user-info {
    margin-left: 30px;
    color: #fff;
}

.es-user-info .item-title {
    font-size: 18px;
    font-weight: bold;
}

.es-user-info .item-p {
    margin-top: 15px;
}

.es-user-info .item-level .vip {
    padding-left: 22px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAARCAMAAADnhAzLAAAAn1BMVEUAAAD/xwD/zAD/zAD/zAD/zAD/tAD/wgD/tAD/zAD/tAD/zAD/zAD/zAD/tAD/zAD/tAD/tAD/zAD/zAD/zAD/zAD/zAD/tAD/////xwD/tgD/9+j/ngD/7Lr/77H/36v/owH/ugD/rgD/mAD/7c//6Mz/56z/1ZD/zI//54f/xWf/xlj/tj//1Cj/wCj/yCT/vCD/pRD/twr/wQD/pwAVzWOpAAAAFnRSTlMACK/89erj4N7b18jCjmppX1VONyQVZ2JjSAAAAK9JREFUGNNVzkeOw0AMRNFqOedcrJbkPDk43/9spgTBsN+GH9yQcC0+tFCaWGQl2gSFrqWx2qTWhRubWcpS6jkGQtvnh1bkt7Q0awcMzV2U8V/SwXuIprn9u45L6Wvv3UTCwqdWUnYuziQIPbpfuR/z6gVg0fE4+eZtE8nOAm7eILeZ9LclG3OUZnXGtdY3sj5DZVrjJs+vrE3xMOIu35EjPBnQDfAiKR56Ffr9UOUdIvgTM+S7PdoAAAAASUVORK5CYII=) no-repeat left center;
}

.es-user-info .item-level .end-date {
    font-size: 12px;
    color: #ffcc00;
}

.es-user-info .item-level .to-study-card {
    padding: 3px 10px;
    background-color: #EF8B4F;
    border-radius: 5px;
    margin-left: 10px;
}

.es-user-info .item-level .to-study-card:hover {
    background-color: #cf7844;
}

.es-header-tools {
    position: absolute;
    right: 0;
    bottom: 30px;
    font-size: 0;
}

.es-header-tools .item-btn {
    color: #fff;
    font-size: 18px;
    display: inline-block;
    vertical-align: middle;
    height: 20px;
    line-height: 20px;
    padding: 0 14px;
    border-right: 2px solid #fff;
}

.es-header-tools .item-btn:hover {
    color: #20B09F;
}

.es-header-tools .item-btn:last-child {
    border-right: 0;
}

/* nav */

.es-content {
    padding: 50px 0 70px;
}

.es-content-wrap {
    align-items: flex-start;
}

.es-content-l {
    width: 260px;
}

.es-nav-block {
    box-sizing: border-box;
    border: 1px solid #E5E5E5;
    position: relative;
    z-index: 1;
}

.es-nav-block .item-cur {
    position: absolute;
    z-index: -1;
    width: calc(100% + 2px);
    height: 50px;
    background-color: #20B09F;
    left: -1px;
    top: 0;
    display: none;
}

.es-nav-block .item-cur:before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-width: 25px 0 25px 22px;
    border-style: solid;
    border-color: transparent transparent transparent #20B09F;
    top: 0;
    right: -22px;
}

.es-nav-block .item {
    position: relative;
}

.es-nav-block .item-btn {
    display: block;
    height: 50px;
    line-height: 50px;
    cursor: pointer;
    color: #666;
    font-size: 16px;
    padding-left: 42px;
    position: relative;
}

.es-nav-block .item.cur .item-btn {
    color: #fff;
}

.es-nav-block .item.cur .item-btn:hover {
    background: none;
}

.es-nav-block .item-btn:before {
    margin-right: 16px;
    width: 20px;
    display: inline-block;
    vertical-align: middle;
}

.es-nav-block .item[data-id="es-center"] .item-btn:before {
    content: url(../images/edu-students/es-center.svg);
}

.es-nav-block .item.cur[data-id="es-center"] .item-btn:before {
    content: url(../images/edu-students/es-center-cur.svg);
}

.es-nav-block .item[data-id="ended-course"] .item-btn:before {
    content: url(../images/edu-students/ended-course.svg);
}

.es-nav-block .item.cur[data-id="ended-course"] .item-btn:before {
    content: url(../images/edu-students/ended-course-cur.svg);
}

.es-nav-block .item[data-id="vip-course"] .item-btn:before {
    content: url(../images/edu-students/vip-course.svg);
}

.es-nav-block .item.cur[data-id="vip-course"] .item-btn:before {
    content: url(../images/edu-students/vip-course-cur.svg);
}

.es-nav-block .item[data-id="comments"] .item-btn:before {
    content: url(../images/edu-students/comments.svg);
}

.es-nav-block .item.cur[data-id="comments"] .item-btn:before {
    content: url(../images/edu-students/comments-cur.svg);
}

.es-nav-block .item[data-id="coupon"] .item-btn:before {
    content: url(../images/edu-students/coupon.svg);
}

.es-nav-block .item[data-id="orders"] .item-btn:before {
    content: url(../images/edu-students/orders.svg);
}

.es-nav-block .item[data-id="settings"] .item-btn:before {
    content: url(../images/edu-students/settings.svg);
}

.es-nav-block .item.cur[data-id="settings"] .item-btn:before {
    content: url(../images/edu-students/settings-cur.svg);
}

.es-nav-block .item[data-id="feedback"] .item-btn:before {
    content: url(../images/edu-students/feedback.svg);
}

.es-nav-block .item.cur[data-id="feedback"] .item-btn:before {
    content: url(../images/edu-students/feedback-cur.svg);
}

.es-nav-block .item-btn[href]:hover {
    background-color: #F9F9F9;
}

.es-nav-block .item-btn.switch-tab:after {
    content: url(../images/edu-students/down.svg);
    position: absolute;
    right: 30px;
    top: 0;
    transition: transform .3s ease;
}

.es-nav-block .item-btn.switch-tab.cur:after {
    transform: rotateZ(180deg);
}

.switch-content {
    display: none;
}

.switch-content.switch-disabled {
    display: block;
}

.es-nav-block .item-s {
    position: relative;
}

.es-nav-block .item-s-btn {
    display: block;
    height: 50px;
    line-height: 50px;
    padding-left: 78px;
    color: #666;
}

.es-nav-block .item-s-btn:hover {
    background-color: #F9F9F9;
}

.es-nav-block .item-s.cur .item-s-btn {
    color: #fff;
}

.es-nav-block .item-s.cur .item-s-btn:hover {
    background: none;
}

/* content */

.es-content-r {
    margin-left: 75px;
    width: 865px;
}

.edu-students .pagination {margin-top: 20px;}

/* 学员中心 */

.es-center-block {
    justify-content: flex-start;
    flex-wrap: wrap;
}

.es-center-block .item {
    width: 262px;
    height: 184px;
    margin: 0 38px 38px 0;
    border-radius: 10px;
    transition: all .3s ease;
}

.es-center-block .item:hover {
    transform: translateY(-6px);
    box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.3);
}

.es-center-block .item:nth-child(3n) {
    margin-right: 0;
}

.es-center-block .item:nth-last-child(-n+3) {
    margin-bottom: 0;
}

.es-center-block .item a {
    display: block;
    height: 100%;
    overflow: hidden;
}

.es-center-block .img-block {
    height: 50px;
    line-height: 50px;
    text-align: center;
    margin-top: 45px;
}

.es-center-block .img-block svg {
    display: inline-block;
    vertical-align: middle;
}

.es-center-block .item-title {
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    margin-top: 20px;
}

.es-center-block .item.ended-course {
    background-color: #14B5B0;
}

.es-center-block .item.vip-course {
    background-color: #EF8B4F;
}

.es-center-block .item.comment {
    background-color: #6CBE3F;
}

.es-center-block .item.coupon {
    background-color: #F17171;
}

.es-center-block .item.orders {
    background-color: #22B5E5;
}

.es-center-block .item.settings {
    background-color: #6C80E6;
}

/* 已学课程 */

.ended-course-block .items-block {
    flex-wrap: wrap;
    justify-content: flex-start;
}

.ended-course-block .item {
    width: 420px;
    margin: 0 25px 25px 0;
    transform: none;
}

.ended-course-block .item:nth-child(2n) {
    margin-right: 0;
}

.ended-course-block .item:hover {
    transform: translateY(-10px);
    box-shadow: 0 0 20px 0 rgba(50, 50, 50, 0.2);
}

.ended-course-block .item .img-block {
    height: 237px;
    overflow: hidden;
}

.ended-course-block .item .img-block img {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.ended-course-block .item-info {
    box-sizing: border-box;
    height: 155px;
    border: 1px solid #eee;
    border-top: none;
    background-color: #fff;
    padding: 0 22px;
    overflow: hidden;
}

.ended-course-block .item-title {
    margin-top: 24px;
    font-size: 18px;
    font-weight: bold;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.ended-course-block .item-bottom {
    justify-content: space-between;
    margin-top: 15px;
    color: #666;
}

.ended-course-block .item-speaker,
.vip-course-block .item-speaker {
    padding-left: 20px;
    background: url(../images/training-centre/index/zhujiang.png) no-repeat left center;
    color: #666;
}

.ended-course-block .item-duration,
.vip-course-block .item-duration {
    padding-left: 20px;
    background: url(../images/training-centre/show/time.png) no-repeat left center;
    color: #666;
}

.ended-course-block .item-status {
    justify-content: space-between;
    margin-top: 10px;
    color: #666;
}

.ended-course-block .item-progress {
    flex: 1;
    justify-content: space-between;
}

.ended-course-block .item-progress .item-p {
    font-size: 14px;
    color: #20B09F;
}

.ended-course-block .item-total {
    height: 7px;
    border-radius: 50px;
    background-color: #E8F7F5;
    overflow: hidden;
    margin-top: 6px;
}

.ended-course-block .item-current {
    width: 0;
    height: 100%;
    background-color: #20B09F;
    border-radius: 50px;
    transition-duration: 1s;
}

.ended-course-block .item-btn {
    margin-left: 30px;
}

.ended-course-block .item-btn-a {
    width: 118px;
    height: 35px;
    line-height: 35px;
    font-size: 16px;
}

.ended-course-block .item-btn-buy {
    width: 118px;
    height: 35px;
    line-height: 35px;
    font-size: 16px;
    background-color: #EF8B4F;
}

.ended-course-block .item-need-buy-note {
    color: #999;
    padding-left: 22px;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTc1Mjc2MTQ0NDEwIiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjI1MjYiIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxwYXRoIGQ9Ik01MTMuMjA5NTQ4IDk1OS4yMjE2NDhjLTI0Ni45MDQzNDMgMC00NDcuMDU2ODk1LTIwMC4xNTI1NTMtNDQ3LjA1Njg5NS00NDcuMDU2ODk1IDAtMjQ2Ljg5OTIyNiAyMDAuMTUyNTUzLTQ0Ny4wNTY4OTUgNDQ3LjA1Njg5NS00NDcuMDU2ODk1czQ0Ny4wNTY4OTUgMjAwLjE1NzY2OSA0NDcuMDU2ODk1IDQ0Ny4wNTY4OTVDOTYwLjI2NjQ0MyA3NTkuMDY5MDk1IDc2MC4xMTM4OTEgOTU5LjIyMTY0OCA1MTMuMjA5NTQ4IDk1OS4yMjE2NDh6TTUxMy4yMDk1NDggMTE0Ljc4MTE4NmMtMjE5LjQ3MDUyNyAwLTM5Ny4zODM1NjYgMTc3LjkxOTE3OS0zOTcuMzgzNTY2IDM5Ny4zODM1NjYgMCAyMTkuNDcwNTI3IDE3Ny45MTQwNjIgMzk3LjM4MzU2NiAzOTcuMzgzNTY2IDM5Ny4zODM1NjZTOTEwLjU5MzExNCA3MzEuNjM1Mjc5IDkxMC41OTMxMTQgNTEyLjE2NDc1MkM5MTAuNTkzMTE0IDI5Mi42OTkzNDIgNzMyLjY3OTA1MiAxMTQuNzgxMTg2IDUxMy4yMDk1NDggMTE0Ljc4MTE4NnpNNTEzLjIwOTU0OCA3NjAuNTI5MzUzYy0yNy40MzQ4MzkgMC00OS42NzMzMjktMjIuMjM4NDktNDkuNjczMzI5LTQ5LjY3MzMyOXMyMi4yMzg0OS00OS42NzMzMjkgNDkuNjczMzI5LTQ5LjY3MzMyOWMyNy40MzQ4MzkgMCA0OS42NzMzMjkgMjIuMjM4NDkgNDkuNjczMzI5IDQ5LjY3MzMyOVM1NDAuNjQzMzY0IDc2MC41MjkzNTMgNTEzLjIwOTU0OCA3NjAuNTI5MzUzek00ODUuMTU4Njc4IDYxMS41MTAzODhsLTIwLjg0NzgxNy0zNDcuNzExMjYgOTcuOTQ0NzI5IDBMNTQwLjM3NTI1OCA2MTEuNTEwMzg4IDQ4NS4xNTg2NzggNjExLjUxMDM4OHoiIHAtaWQ9IjI1MjciIGZpbGw9IiM5OTk5OTkiPjwvcGF0aD48L3N2Zz4=) no-repeat left center;
    background-size: 18px auto;
}

/* 专属课程 */

.vip-course-block .item {
    margin-top: 30px;
    height: 244px;
    overflow: hidden;
    padding: 20px;
    box-shadow: 0 2px 15px 2px rgba(0, 0, 0, .1);
}

.vip-course-block .item:first-child {
    margin-top: 0;
}

.vip-course-block .img-block {
    margin: 0;
    width: 432px;
    height: 244px;
    overflow: hidden;
}

.vip-course-block .item-info {
    width: 0;
    flex: auto;
    height: 100%;
    box-sizing: border-box;
    position: relative;
}

.vip-course-block .expire-day {
    position: absolute;
    font-size: 12px;
    color: #999;
    border: 1px solid #ccc;
    padding: 1px 4px;
    right: 0;
    top: -5px;
}

.vip-course-block .item-title {
    font-size: 18px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-top: 20px;
    padding: 0 20px;
}

.vip-course-block .item-s-block {
    justify-content: space-between;
    padding: 0 0 0 20px;
    margin-top: 10px;
}

.vip-course-block .item-s-info {
    box-sizing: border-box;
    padding: 10px 20px;
    background-color: #F9F9F9;
    font-size: 14px;
    color: #666;
    height: 64px;
    overflow-y: auto;
    margin: 16px 0 25px;
}

.vip-course-block .item-s-span:not(:first-child) {
    margin-left: 15px;
}

.vip-course-block .item-attr {
    font-size: 18px;
    font-weight: bold;
    color: #FF8B00;
}

.vip-course-block .item-price {
    color: #FF8B00;
}

.vip-course-block .item-s-r a {
    width: 138px;
    height: 35px;
    line-height: 35px;
    font-size: 16px;
}

.vip-course-block .item-s-r .item-btn-code {
    display: inline-block;
    text-align: center;
    background-color: #FF7800;
    color: #fff;
}

.vip-course-block .item-s-r .item-btn-study {
    width: 170px;
    background-color: #FF7800;
}

.vip-note {
    height: 30px;
    line-height: 30px;
    padding: 0 15px;
    margin-bottom: 15px;
    background-color: #FFE699;
    color: #666;
}

/* 弹窗 */

#goodcover {
    display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: black;
    z-index: 1001;
    -moz-opacity: 0.8;
    opacity: 0.50;
    filter: alpha(opacity=80);
}

.pop-up {
    width: 430px;
    height: 180px;
    background-color: #fff;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    display: none;
    z-index: 1002;
    /* padding: 22px 22px 22px 22px; */
}

.pop-up .title {
    font-size: 17px;
    color: #333;
    font-weight: bold;
    margin: 28px 0px 0px 28px;
}

.pop-up .code_details {
    width: 100%;
    height: 36px;
    overflow: hidden;
    margin: 23px 0px 0px 0px;
}

.pop-up .code_details input {
    width: 230px;
    height: 32px;
    padding-left: 12px;
    margin: 0px 0px 0px 46px;
    float: left;
}

.pop-up .code_details .affirm {
    width: 88px;
    height: 36px;
    background: #20b09f;
    float: left;
    margin-left: 14px;
    cursor: pointer;
}

.pop-up .code_details .affirm p {
    color: #fff;
    line-height: 36px;
    text-align: center;
}

.pop-up .error {
    color: #ff2222;
    margin-top: 16px;
    margin: 20px 0 0 46px;
}

.pop-up img {
    position: absolute;
    top: 0;
    right: 0;
}

.pop-up .close {
    cursor: pointer;
    padding: 10px 10px 10px 10px;
}

/* 评论 */

.comments-block {
    border: 1px solid #E5E5E5;
}

.comments-block .item {
    padding: 25px 20px;
    border-top: 1px dashed #eee;
}

.comments-block .item:first-child {
    border-top: none;
}

.comments-block .item-info-t {
    justify-content: space-between;
}

.comments-block .item-title {
    font-weight: bold;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 700px;
}

.comments-block .item-date {
    font-size: 12px;
    color: #999;
}

.comments-block .item-comment {
    margin-top: 10px;
    line-height: 1.6em;
    color: #666;
}

/*.comments-pagination {
    border: 1px solid #E5E5E5;
    border-top: none;
    padding: 30px 0;
}*/

/* 课程邀请码 */

.coupon-code-block table {
    width: 100%;
    border: 1px solid #E5E5E5;
}

.coupon-code-block thead tr {
    background-color: #eee;
}

.coupon-code-block thead th {
    height: 48px;
    text-align: center;
    border-bottom: 1px solid #E5E5E5;
}

.coupon-code-block thead .coupon-code-num-th {
    width: 15%;
}

.coupon-code-block thead .coupon-code-status-th {
    width: 20%;
}

.coupon-code-block thead .coupon-code-date-th {
    width: 20%;
}

.coupon-code-block tbody {
    counter-reset: num;
}

.coupon-code-block tbody tr {
    counter-increment: num;
}

.coupon-code-block tbody td {
    height: 48px;
    border-bottom: 1px solid #E5E5E5;
    text-align: center;
    color: #666;
}

.coupon-code-block tbody .coupon-code-num:before {
    content: counter(num);
}

/* 无页面内容 */

.empty-block {
    padding: 50px 0;
}

.empty-block .empty-p {
    color: #999;
    text-align: center;
    margin-top: 15px;
    font-size: 16px;
}

/* 反馈 */

.feedback-block {
    padding: 50px 0;
}

.feedback-block .feedback-p {
    color: #666;
    text-align: center;
    margin-top: 30px;
}

.feedback-block .feedback-mail {
    color: #20B09F;
    text-align: center;
    margin-top: 15px;
    font-size: 16px;
}

/* 个性设置 */

.settings-form-block {
    padding-bottom: 35px;
    margin-bottom: 35px;
    border-bottom: 1px dashed #E5E5E5;
}

.settings-form-block .item-title {
    font-size: 18px;
    font-weight: bold;
    position: relative;
    padding-left: 12px;
}

.settings-form-block .item-title:before {
    content: "";
    position: absolute;
    width: 3px;
    height: 19px;
    background-color: #20B09F;
    left: 0;
    top: calc(50% - 9px);
}

.settings-photo-block {
    box-sizing: border-box;
    justify-content: space-between;
    align-items: flex-start;
    position: absolute;
    width: 750px;
    height: 350px;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    background-color: #fff;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.5);
    padding: 20px;
}

.settings-items-block {
    padding-left: 12px;
    margin-top: 35px;
}

.settings-items-block .item {
    justify-content: flex-start;
    margin-top: 20px;
    height: 42px;
    line-height: 42px;
}

.settings-items-block label {
    width: 60px;
    margin-right: 15px;
    text-align: right;
}

.settings-items-block .item-input {
    box-sizing: border-box;
    width: 300px;
    height: 100%;
    padding: 0 15px;
    border: 1px solid #ccc;
    outline: none;
}

.settings-items-block .item-input:focus {
    border-color: #20B09F;
}

.settings-fav-block {
    margin-top: 35px;
    padding-left: 12px;
}

.settings-fav-block .item-fav {
    display: inline-block;
    vertical-align: middle;
    margin-right: 60px;
    line-height: 20px;
    cursor: pointer;
}

.settings-fav-block input[type="checkbox"] {
    display: none;
}

.settings-fav-block .item-fav-span {
    vertical-align: middle;
    font-size: 12px;
    color: #666;
}

.settings-fav-block .item-fav:hover .item-fav-span {
    color: #333;
}

.settings-form-button {
    width: 180px;
    height: 40px;
    line-height: 40px;
    font-size: 18px;
}

.settings-fav-block .item-fav-cur {
    box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
    width: 14px;
    height: 14px;
    margin-right: 4px;
    position: relative;
}

.settings-fav-block .item-fav-check {
    position: absolute;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    border: 1px solid #999;
    background: no-repeat center;
}

.settings-fav-block input[type="checkbox"]:checked+.item-fav-check {
    border-color: #20B09F;
    background-color: #20B09F;
    background-image: url(../images/edu-students/cur.svg);
}

.settings-photo-block .item-l {
    width: 400px;
    text-align: center;
}

.settings-photo-block .item-l .img-block {
    height: 224px;
}

.settings-photo-block .item-l .img-block img {
    max-height: 100%;
}

.settings-photo-block .item-l input[type="file"] {
    display: none;
}

.settings-photo-block .settings-photo-select {
    width: 100px;
    height: 28px;
    line-height: 28px;
    margin-top: 20px;
    cursor: pointer;
}

.settings-photo-block .item-r {
    text-align: center;
    flex: 1;
}

.settings-photo-block .settings-photo-preview {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background-color: #eee;
    overflow: hidden;
}

.settings-photo-block .item-p {
    color: #666;
    text-align: center;
    margin-top: 10px;
}

.settings-form-photo-block {
    display: inline-block;
    margin-top: 40px;
}

.settings-form-photo-block .img-block {
    width: 102px;
    height: 102px;
    border-radius: 50%;
    background-color: #eee;
    overflow: hidden;
    position: relative;
    cursor: pointer;
}

.settings-form-photo-block .img-block:after {
    content: "点击修改";
    position: absolute;
    height: 24px;
    width: 100%;
    left: 0;
    top: calc(50% - 12px);
    background-color: rgba(0, 0, 0, 0.4);
    color: #fff;
    text-align: center;
    line-height: 24px;
}

.settings-photo-fixed {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 999;
    display: none;
}

.settings-photo-fixed:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.4);
}

.settings-photo-confirm {
    width: 160px;
    height: 45px;
    line-height: 45px;
    margin-top: 106px;
    cursor: pointer;
    font-size: 18px;
}

.settings-photo-close {
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    cursor: pointer;
}

.settings-photo-close:before {
    content: "x";
    font-size: 24px;
    font-family: Calibri;
}

/* 套餐详情页 */

.package-show {
    padding: 50px 0 70px;
}

.package-show-title {
    font-size: 24px;
    margin-bottom: 30px;
    position: relative;
    padding-left: 12px;
}

.package-show-title:before {
    content: "";
    position: absolute;
    width: 3px;
    height: 23px;
    background-color: #20B09F;
    left: 0;
    top: calc(50% - 11px);
}

.package-show-top .img-block {
    width: 435px;
    margin: 0;
}

.package-show-top .item-info {
    width: 0;
    flex: 1;
    align-self: stretch;
}

.package-show-top .item-p {
    padding-left: 40px;
}

.package-show-top .order-number {
    font-size: 16px;
    line-height: 3em;
}

.package-show-top .package-name {
    font-size: 20px;
    font-weight: bold;
    background-color: #f7f7f7;
    line-height: 2.4em;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.package-show-top .subcribe-price {
    font-size: 14px;
    color: #666;
}

.package-show-top .subcribe-price .price {
    font-size: 36px;
    color: #ff7800;
    font-weight: bold;
}

.package-show-top .subcribe-price .tag {
    display: inline-block;
    box-sizing: border-box;
    width: 62px;
    height: 22px;
    line-height: 20px;
    text-align: center;
    border: 1px solid #ff7800;
    border-radius: 5px;
    font-size: 12px;
    color: #ff7800;
    margin-left: 10px;
}

.package-show-top .subscribe-date {
    font-size: 14px;
    color: #666;
    margin-top: 14px;
}

.package-show-top .item-info-block {
    margin-top: 30px;
}

.package-show-list {
    margin-top: 57px;
}

.package-show-list .items-title {
    height: 42px;
    line-height: 42px;
    background-color: #F7F7F7;
    text-align: left;
    padding: 0 20px;
}

.package-show-list .item {
    padding: 24px 0;
    border-bottom: 1px solid #eee;
    height: 102px;
}

.package-show-list .img-block {
    width: 180px;
    margin: 0;
}

.package-show-list .item-info {
    margin-left: 25px;
    flex: 1;
    position: relative;
    align-self: stretch;
}

.package-show-list .item-title {
    font-size: 16px;
    margin-top: 8px;
    transition: all .3s ease;
}

.package-show-list [href]:hover .item-title {
    color: #20b09f;
}

.package-show-list .item-info-block {
    margin-top: 10px;
}

.package-show-list .speaker {
    color: #666;
}

.package-show-list .played {
    display: inline-block;
    vertical-align: middle;
    padding-left: 22px;
    background: url(../images/edu-students/packageShow/played.svg) no-repeat left center;
    color: #666;
    font-size: 12px;
    margin-right: 26px;
}

.package-show-list .sections {
    display: inline-block;
    vertical-align: middle;
    padding-left: 22px;
    background: url(../images/edu-students/packageShow/sections.svg) no-repeat left center;
    color: #666;
    font-size: 12px;
    margin-right: 26px;
}

.package-show-list .comments {
    display: inline-block;
    vertical-align: middle;
    padding-left: 22px;
    background: url(../images/edu-students/packageShow/comments.svg) no-repeat left center;
    color: #666;
    font-size: 12px;
}

.package-show-list .item-btn {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 118px;
    height: 35px;
    line-height: 35px;
    font-size: 16px;
    z-index: 1;
}

/* 已购买课程 */

.orders-buy .course {
    box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.2);
    padding: 24px 20px;
}

.orders-buy .course:not(:first-child) {
    margin-top: 26px;
}

.orders-buy .course .package-show-top .img-block {
    width: 284px;
}

.orders-buy .course .package-show-top .item-p {
    padding-left: 20px;
}

.orders-buy .course .package-show-top .order-number {
    font-size: 14px;
    color: #666;
    line-height: 1.6em;
}

.orders-buy .course .package-show-top .package-name {
    font-size: 18px;
    font-weight: normal;
    background: none;
    line-height: 1.6em;
    margin-top: 10px;
}

.orders-buy .course .package-show-top .item-info-block {
    margin-top: 10px;
}

.orders-buy .course .package-show-top .subcribe-price .price {
    font-size: 24px;
    font-weight: normal;
}

.orders-buy .course .package-show-top .item-info {
    position: relative;
}

.orders-buy .course .package-show-top .item-info .item-btn {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 118px;
    height: 35px;
    line-height: 35px;
    font-size: 16px;
}

.orders-buy .course .toggle-btn {
    box-sizing: border-box;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 118px;
    height: 35px;
    line-height: 33px;
    font-size: 16px;
    display: none;
}

.orders-buy .course .toggle-btn:before {
    content: "展开详情";
}

.orders-buy .course .toggle-btn.cur:before {
    content: "收起详情";
}

.orders-buy .course .toggle-btn:after {
    content: "";
    display: inline-block;
    vertical-align: top;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAMCAYAAACwXJejAAAAfUlEQVQYldXPsQnCABCF4U/JIPbZws6AiIogWIb0lhnBLWwcwEo7x9FWGwsrObmACBnAv7t3//G4wei4b7HTTztEiaZHibwMqcYUix9hnnld4IU1TrjjgjG2mMS+yKsnZjjjgA2qzEVdxwPLrFjl/CGk+K7jlhXXr+xPv8Mb6Z0lzT1XcwUAAAAASUVORK5CYII=) no-repeat center;
    width: 9px;
    height: 100%;
    margin-left: 5px;
    transition: transform .3s ease;
    transform: none;
}

.orders-buy .course .toggle-btn.cur:after {
    transform: rotateZ(180deg);
}

.orders-buy .course .package-show-list {
    margin-top: 24px;
    border-top: 1px solid #eee;
    display: none;
}

.orders-buy .course .package-show-list .item {
    border-bottom-style: dashed;
}

.orders-buy .course .package-show-list .item:last-child {
    padding-bottom: 0;
    border: none;
}

/* 学员卡订单 */

.study-card-orders-list {
    box-sizing: border-box;
    width: 100%;
    border: 1px solid #E5E5E5;
}

.study-card-orders-list thead {
    background-color: #eee;
}

.study-card-orders-list th {
    box-sizing: border-box;
    height: 50px;
    padding: 0 28px;
    border-bottom: 1px solid #E5E5E5;
    text-align: center;
}

.study-card-orders-list th:nth-child(1) {
    width: auto;
}

.study-card-orders-list th:nth-child(2) {
    width: 158px;
}

.study-card-orders-list th:nth-child(3) {
    width: 158px;
}

.study-card-orders-list th:nth-child(4) {
    width: 140px;
}

.study-card-orders-list th:nth-child(5) {
    width: 158px;
}

.study-card-orders-list td {
    padding: 0 28px;
    height: 50px;
    border-bottom: 1px solid #E5E5E5;
    text-align: center;
    color: #666;
}