.login-bg {background-image: url(../images/mountain.svg), url(../images/stars_white.svg), url(../images/stars_dblue.svg), url(../images/stars_lblue.svg), linear-gradient(to bottom, #066ee2, rgba(6, 110, 226, 0.0)), linear-gradient(315deg, #01d1c1, rgba(0, 209, 193, 0.0)), linear-gradient(#63d9ea, #63d9ea) ;background-repeat: no-repeat !important;background-position: bottom right, left 50% top 60%, center, center, center, center, center !important;background-size: auto 45%, contain, contain, contain, contain, contain, contain !important;padding:80px 0 60px 0}
.login-main{width: 1068px;margin: 0 auto;background: #fafdfe;border-radius: 4px;display: flex;overflow: hidden;}
.login-main .left{background: #0b2149;padding:80px;width: 50%;box-sizing: border-box;color: #fff;}
.login-main .left h1{font-size: 35px;padding-bottom:10px}
.login-main .left p{font-size: 18px;padding:10px 0;line-height: 30px;}
.login-main .left a{color: #fff;}
.login-main .right{width: 50%;box-sizing: border-box;padding:70px 80px 80px;}
.login-main .login-box .layui-tab .layui-tab-title{height: 50px;}
.login-main .login-box .layui-tab .layui-tab-title li{padding:0; margin-right: 35px;font-size: 18px; line-height: 50px;}
.login-main .login-box .layui-tab-brief>.layui-tab-title .layui-this{color: #1865f2;font-weight: bold;}
.login-main .login-box .layui-tab-title .layui-this:after{height: 51px;border-bottom: 2px solid #1865f2;}
.login-main .item{margin:15px 0 0px 0;position: relative;overflow: hidden;}
.login-main .item .input{height: 40px;line-height: 40px;border-radius: 4px;border:#dbdcdd solid 1px;width: 100%;box-sizing: border-box;padding:0 10px;position: relative;}
.login-main .item .salt::placeholder{color: #f00}
.login-main .item .get-dxcode{ background:none;border:none; position:absolute;right:15px; color:#1865f2;bottom:0; cursor:pointer;height: 40px;line-height: 40px;}
.login-main .item .tip{display: none;position: absolute;top:0px;right:0;text-align: right;line-height: 32px;color: #d92916 ;}
.login-main .item h4{font-size: 18px;font-weight: normal;padding:0 0 5px;line-height: 32px;}
.login-main .submit{margin-top: 20px;background: #1865f2;display: inline-block;border-radius: 4px;height: 40px;line-height: 40px;font-size: 16px;font-weight: bold;color: #fff;width: 100%;text-align: center;border: none;cursor: pointer;}
.login-main .submit:hover {box-shadow: 0 0 0 1px #ffffff, 0 0 0 3px #1865f2;text-decoration: none;}
.login-main .item .forget{float: right;color: #1865f2;}
.login-main .item .remember{float: left;margin:3px 5px 0 0;}
.login-main .item-foot{text-align: center;padding: 30px 0 50px;}
.login-main .item-foot a{font-size: 16px;color: #1865f2;font-weight: bold;display: block;}
.login-main .item-foot a:nth-child(1){color: #6666665c;font-size: 12px;margin-bottom: 10px;font-weight: normal;}
.login-main .scan{    text-align: center;overflow: hidden;height: 300px;}
.login-main .scan iframe{width: 340px;height: 400px;margin-top: -37px;border: 0;-ms-transform: scale(0.85);-moz-transform: scale(0.85);-o-transform: scale(0.85);-webkit-transform: scale(0.85);transform: scale(0.85);-ms-transform-origin: 0 0;-moz-transform-origin: 0 0;-o-transform-origin: 0 0;-webkit-transform-origin: 0 0;transform-origin: 0 0;margin-left: 25px;}
.user-head{background: #f7f5f4;padding:28px 0}
.user-head .avatar{margin-right: 20px;}
.user-head .avatar img{width:100px;height: 100px;border-radius: 100%;}
.user-head .info h3{font-size: 28px;line-height: 32px;padding:14px 0 10px}
.user-head .info p{font-size: 18px;}
.user-head .btn{display: flex;justify-content: flex-end;align-items: center;flex-grow: 1;}
.user-head .btn a{border:#8c8c90 solid 1px;font-size: 16px;line-height: 40px;height: 40px;padding:0 30px;border-radius: 4px;color: #1865f2;font-weight: bold;}
.user-head .btn a:hover{background: #fff;border:#1865f2 solid 2px;text-decoration: none;box-sizing: border-box;padding: 0 29px;line-height: 36px;}


.user-main{width: 1120px;margin: 0 auto;display: flex;}
.user-nav{border-right:#dbdcdd solid 1px;width: 255px;padding:24px 0;flex-shrink: 0;}
.user-nav ul li a{font-size: 16px;line-height: 44px;padding-left:20px;display: block;}
.user-nav ul li .active{background: #f7f8fa;color: #1865f2;border-radius: 4px 0 4px 0;font-weight: bold;}
.user-content{padding:24px 0 0 30px;min-height: 500px;flex-grow: 1;}
.user-content h2{font-size: 28px;}

.me-course .course-box{display: flex;padding: 30px 0 0px;flex-direction: row;flex-wrap: wrap;justify-content:space-between;}
.me-course .course-box .item{width: 48%;margin-bottom: 50px;}
.me-course .course-box .item .title{border-bottom:#dbdcdd solid 1px;padding-bottom: 15px;display: flex;justify-content: space-between;}
.me-course .course-box .item .title h3{font-size: 16px;}
.me-course .course-box .item .title a{color: #1865f2;}
.me-course .course-box .item ul{margin:  20px 0;position: relative;}
.me-course .course-box .item ul::before{position: absolute;left:30px;height: 100%;width: 2px;background: #dbdcdd;content: '';left:17px}
.me-course .course-box .item ul li{padding: 10px 0 10px 0;position: relative;min-height: 44px;}
.me-course .course-box .item ul li a{display: flex;align-items: center;}
.me-course .course-box .item ul li .icon{width: 36px;height: 36px;background: #fcb500;border-radius: 100%;margin-right: 10px;text-align: center;position: relative;z-index: 1;}
.me-course .course-box .item ul li .icon i{color: #fff;font-size: 22px;line-height: 36px;}
.me-course .course-box .item ul li a:hover{text-decoration: none;}
.me-course .course-box .item ul li .t{font-size: 15px;line-height: 22px;display: flex;flex-direction:column}
.me-course .course-box .item ul li .t p{font-size: 12px;}
.me-course .course-box .item ul li a:hover .t{text-decoration: underline;}
.me-course .course-box .item ul li .btn{position: absolute;z-index:10;top:16px;right:0;background: #1865f2;padding: 0 20px;height:32px;line-height:32px;border-radius: 4px;font-size: 14px;color: #fff;font-weight: bold;display: inline-block;}
.me-course .course-box .item ul li .btn:hover{ box-shadow: 0 0 0 1px #ffffff, 0 0 0 3px #1865f2;text-decoration: none;}
.course-none{text-align: center;width: 100%;}
.course-none .btn{display: block;}
.course-none .btn a{background: #1865f2;display: inline-block;border-radius: 4px;padding:0 40px;height: 46px;line-height: 46px;font-size: 18px;font-weight: bold;color: #fff;text-decoration: none;}
.course-none .btn a:hover {box-shadow: 0 0 0 1px #ffffff, 0 0 0 3px #1865f2;text-decoration: none;}
.course-none p{font-size: 18px;padding:20px 0}
.course-none img{margin-left: -100px;}
.me-progress {padding-bottom:20px}
.me-progress .layui-table-view{border:none}
.me-progress .layui-table-cell{padding:15px 0;height: auto;}
.me-progress .layui-table-column{padding:30px 0;text-align: right;}
.me-progress .title-icon{padding-right: 5px;}
.me-progress .layui-laypage .layui-laypage-curr .layui-laypage-em{background-color: #1865f2;}
.me-progress .progress-search{display: flex;margin:20px 0 0 0;}
.me-progress .progress-search .layui-form{display: flex;}
.me-progress .progress-search .layui-form-select{margin-right: 10px;}
.me-progress .progress-search .count{display: flex;align-items: center;flex-grow: 1;justify-content: flex-end;}
.me-progress .progress-search .count h2{margin-left: 30px;font-size: 36px;line-height: 38px;font-family: arial;}
.me-progress .progress-search .count span{line-height: 18px;padding-left: 5px;}
.me-order .order-lists{padding:16px 0 50px;font-family: arial;}
.me-order .order-lists li{display: flex;border-bottom: #eee solid 1px;padding:30px 0;}
.me-order .order-lists li .icon{display: flex;align-items: center;width:60px;height:60px;background: #fcb500;border-radius: 100%;justify-content: center;margin-right: 16px;}
.me-order .order-lists li .icon i{color: #fff;font-size: 30px;line-height: 60px;}
.me-order .order-lists li .txt h3{font-size: 20px;}
.me-order .order-lists li .txt h4{font-size: 18px;padding:10px 0;color: #d92916;}
.me-order .order-lists li .txt p{font-size: 16px;}
.me-order .order-lists li .state{text-align: right;flex-grow: 1;justify-content: flex-end;}
.me-order .order-lists li .state p{font-size: 16px;padding-bottom:10px}
.me-order .order-lists li .state .btn a{margin-top:5px;background: #1865f2;display: inline-block;border-radius: 4px;padding: 0 30px;height: 40px;line-height: 40px;font-size: 16px;font-weight: bold;color: #fff;text-align: center;border: none;cursor: pointer;}
.me-order .order-lists li .state .btn a:hover {box-shadow: 0 0 0 1px #ffffff, 0 0 0 3px #1865f2;text-decoration: none;}
.me-order .order-lists li .state .unpaid{color: #d92916;}
.me-order .order-lists li:last-child{border:none}

.me-info .layui-form{padding:30px 0 30px 0}
.me-info .avatar{position: relative;width: 100px;height: 100px;overflow: hidden;}
.me-info .avatar span{position: absolute;left:0;top:0;width: 100%;height: 100%;z-index: 2;cursor: pointer;}
.me-info .avatar img{width: 100px;height: 100px;position: relative;}
.me-info .submit-btn{margin-top:5px;background: #1865f2;display: inline-block;border-radius: 4px;padding: 0 30px;height: 40px;line-height: 40px;font-size: 16px;font-weight: bold;color: #fff;text-align: center;border: none;cursor: pointer;}
.me-info .submit-btn:hover {box-shadow: 0 0 0 1px #ffffff, 0 0 0 3px #1865f2;text-decoration: none;}

.me-info .accounts{padding:0 0 100px}
.me-info .accounts .title{font-size: 18px;font-weight: bold;padding-bottom:30px;}
.me-info .accounts ul{display: flex;}
.me-info .accounts ul li{display: flex;margin-right: 50px;}
.me-info .accounts ul li .icon{margin-right: 12px;}
.me-info .accounts ul li .icon i{font-size:70px;color: #d3d6d9;}
.me-info .accounts ul li .info h3{font-size: 16px;}
.me-info .accounts ul li .info p{font-size: 12px;color: #d92916;padding:5px 0}
.me-info .accounts ul li .info a{color: #1865f2;border:#1865f2 solid 1px;border-radius: 30px;padding:0 10px;line-height: 22px;display: inline-block;}
.me-info .accounts ul li.bound .icon .icon-weixin{color: #40ba49;}
.me-info .accounts ul li.bound .icon .icon-qq{color: #3aaffc;}

.goods-head{background: #0b2149;padding:32px 0;border-top:#556480 solid 1px;}
.goods-head h2{font-size: 35px;color: #fff;}
.goods-content{margin: 50px 0;border-radius: 4px;background: #fff;border:#dbdcdd solid 1px;padding:10px 50px 40px}
.goods-content h3{padding:30px 0 10px 0 }
.goods-content .summary{border-top:#dbdcdd solid 1px;padding:20px 0 0 0;}
.goods-content .summary .item{display: flex;justify-content: flex-end;font-size: 16px;padding:8px 0;font-family: arial;line-height: 30px;}
.goods-content .summary .item em{width:140px;text-align: right;}
.goods-content .summary .item b{width:140px;text-align: right;font-size:24px;color: #d92916;}
.goods-content .summary .btn{display: flex;justify-content: flex-end;padding-top:10px}
.goods-content .summary .btn a{margin-top:5px;background: #d92916;display: inline-block;border-radius: 4px;padding: 0 30px;height: 40px;line-height: 40px;font-size: 16px;font-weight: bold;color: #fff;text-align: center;border: none;cursor: pointer;}
.goods-content .summary .btn a:hover {box-shadow: 0 0 0 1px #ffffff, 0 0 0 3px #d92916;text-decoration: none;}
.goods-content .course-info{display: flex;align-items: center;padding-top:10px}
.goods-content .course-info .icon{display: flex;align-items: center;width:50px;height:50px;background: #fcb500;border-radius: 100%;justify-content: center;margin-right: 16px;}
.goods-content .course-info .icon i{color: #fff;font-size:28px;line-height:50px;}
.goods-content .course-info h4{font-size: 18px;}
.goods-content .course-info .price{flex-grow: 1;text-align: right;font-family: arial;font-size: 20px;}
.goods-content .course-info .price span{margin-left: 10px;font-size: 16px;color: #666;text-decoration: line-through;}
.goods-content .course-pay{display: flex;align-items: center;padding-bottom: 30px;}
.goods-content .course-pay .item{background: #f7f8fa;border-radius: 4px;width: 200px;height: 80px;text-align: center;margin:10px 20px 0 0;display: flex;align-items: center;cursor: pointer;box-sizing: border-box;}
.goods-content .course-pay .item .img{width: 100%;}
.goods-content .course-pay .item.active{border:#f01414 solid 2px;position: relative;}
.goods-content .course-pay .item.active::before{content: '';position: absolute;right:0;bottom:0;width: 0;height: 0;border-bottom: 20px solid red;border-left: 20px solid transparent;}
.goods-content .course-pay .item.active::after{content:'\e633';position: absolute;right:-1px;bottom:-1px;font-family: 'iconfont';color: #fff;font-size: 12px;}
.tui_link_btn {width: 90px;height: 30px;background: #9bb86c;color: #fff;text-align: center;border-radius: 5px;line-height: 30px;cursor: pointer;margin-left: 15px;}
.index-btn{margin-top:5px;background: #1865f2;display: inline-block;border-radius: 4px;padding: 0 32px;height:56px;line-height:56px;font-size: 18px;font-weight: bold;color: #fff;text-align: center;border: none;cursor: pointer;}
.index-btn:hover {box-shadow: 0 0 0 1px #ffffff, 0 0 0 3px #1865f2;text-decoration: none;color: #fff;}