.w-outer2{
    width: 100% !important;
    padding: 0 15px !important;
}
.header{
    width: 100%;
    height: 1.78rem;
    text-align: center;
    background: url(http://m.gjnlyd.com/images/header-bg.jpg);
    background-size: cover;
    color: #fbfbfb;
}
.header .back{
    float: left;
    height: 0.56rem;
    padding-top: 0.6rem;
}
.header .back img{
    width: 0.3rem;
    display: inline-block;
    vertical-align: top;
}
.header .back p{
    display: inline-block;
    font-size: 0.6rem;
    line-height: 0.56rem;
    vertical-align: top;
}
.header .menu{
    float: right;
    padding-top: 0.8rem;
}
.header .menu img{
    width: 0.82rem;
    height: 0.18rem;
}
.header .title{
    display: inline-block;
    font-size: 0.68rem;
    line-height: 1.78rem;
    color: #fcfcfc;
    font-weight: normal;
    letter-spacing:0.2rem;
}

.sub-head{
    width: 100%;
    height: 1.82rem;
    background: #0777d6;
    padding: 0.26rem 0;
    color: #fff;
    box-sizing: border-box;
}
.sub-head .logo-cot{
    float: left;
}
.sub-head .logo-cot img{
    display: inline-block;
    width: 1.22rem;
    height: 100%;
    margin-right: 0.4rem;
    vertical-align: middle;
}
.sub-head .logo-cot span{
    font-size: 0.6rem;
    line-height: normal;
    display: inline-block;
}
.sub-head .msg{
    float: right;
    width: 0.76rem;
    height: 100%;
}
.sub-head .msg img{
    width: 100%;
    margin-top: 0.2rem;
    margin-right: 2px;
}
.sub-head .search-cont{
    float: right;
    position: relative;
    height: 0.84rem;
    width: 4.64rem;
    overflow: hidden;
    margin-top: 0.2rem;
    margin-right: 0.64rem;
    border-radius: 15px;
}
.sub-head .search-cont input{
    width:100%;
    height:100%;
    border:0;
    background: #2888da;
    text-indent: 10px;
    color: #fff;
    display: block;
}
.sub-head .search-cont .search-btn{
    position: absolute;
    right: 0.3rem;
    top: 0.17rem;
    width: 0.48rem;
    height: 0.48rem;
}
.sub-head .search-cont .search-btn img{
    width: 100%;
    height: 100%;
    display: block;
}

.f-h{
    height: 50px;
}
.footer{
    position: fixed;
    bottom: 0;
    width: 100%;
    background: #fff;
    padding-top: 8px;
    box-sizing: border-box;
}
.footer-menu-list{
    height: 100%;
}
.footer-menu-list li{
    float: left;
    width: 16.9%;
    height: 100%;
    text-align: center;
}
.footer-menu-list li i{
    width: 20px;
    height: 35px;
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
	background-position: center bottom;
}
.footer-menu-list li i.icon1{
    background-image: url(../images/icon51.png);
}
.footer-menu-list li.current i.icon1{
    background-image: url(../images/icon51_h.png);
}
.footer-menu-list li i.icon2{
    background-image: url(../images/icon52.png);
}
.footer-menu-list li.current i.icon2{
    background-image: url(../images/icon52_h.png);
}
.footer-menu-list li i.icon3{
    background-image: url(../images/icon53.png);
}
.footer-menu-list li.current i.icon3{
    background-image: url(../images/icon53_h.png);
}
.footer-menu-list li i.icon4{
    background-image: url(../images/icon54.png);
}
.footer-menu-list li.current i.icon4{
    background-image: url(../images/icon54_h.png);
}
.footer-menu-list li i.icon5{
    background-image: url(../images/icon55.png);
}

.footer-menu-list li.current i.icon5{
    background-image: url(../images/icon55_h.png);
}
.footer-menu-list li i.icon6{
    background-image: url(../images/icon56.png);
}
.footer-menu-list li.current i.icon6{
    background-image: url(../images/icon56_h.png);
}
.footer-menu-list li span{
    display: block;
    font-size: 14px;
    color: #b3b3b3;
}
.footer-menu-list li.current i{
    color: #026cff;
}
.footer-menu-list li.current span{
    color: #026cff;
}

.commonLine{height: 54px;}
.commonLine2{height: 135px;}

.header{width: 100%;height: 50px;background: #00B4FF;padding: 0 20%;box-sizing: border-box;overflow: hidden;}
.header ul li{height: 43px;line-height: 50px;color: #fefefe;font-size: 18px;float: left;width: 20%;margin-left: 20%;text-align: center;}
.header ul li.active{border-bottom: 3px #fff solid;}
.mian{width: 100%;height:auto;overflow: hidden;}
.mian .main_title{width: 100%;height: 40px;border-bottom: 1px #EBEBEB solid;padding: 0px 4%;box-sizing: border-box;font-size: 14px;display: flex;justify-content: space-between;align-items:center;color: #5A5A5A;background: #fff;}
.mian .main_title .m_t_p .span1{margin-right: 10px;color: #3a3a3a;}
.mian .main_title .m_t_p .span2{margin-left: 10px;color: #868686;}
.mian .main_title img{width: 3%;}
.mian .main_list{width: 100%;height: auto;padding: 0px 4%;box-sizing: border-box;background: #fff;overflow: hidden;padding-bottom: 10px;margin-bottom: 15px;border-bottom: 1px #E8E8E8 solid;}
.mian .main_list li{width: 47%;margin-top: 4%;float: left;margin-right: 6%;}
.mian .main_list li:nth-child(even){margin-right: 0;}
.mian .main_list li .main_list_top{width: 100%;height: 85px;background: #B7B7B7;}
.mian .main_list li p{text-overflow: ellipsis;overflow: hidden;white-space: nowrap;margin-top: 8px;color: #676767;font-size: 12px;}
.footer{width: 100%;height: 50px;position: fixed;bottom: 0px;left: 0px;background: #fff;}
.footer ul li{float: left;width: 20%; text-align: center;}
.footer ul li .p_img1{width: 43%;height: 25px;text-align: center;margin: 0px auto;margin-top: 5px;display:block;}
.footer ul li .p_img1 img{width: 100%;}
.footer ul li .p_img2{width: 43%;height: 25px;text-align: center;margin: 0px auto;margin-top: 5px;display: none;}
.footer ul li .p_img2 img{width: 100%;}
.footer ul li .p_name{color: #b1b1b1;font-size: 12px;text-align: center;}
.footer ul li.active .p_name{color: #6f6f6f;}
.footer ul li.active .p_img1{display: none;}
.footer ul li.active .p_img2{display:block;}

.popup{width: 100%;height: 100%;position: fixed;background:rgba(0,0,0,.44);top: 0;left: 0;z-index: 9999;}
.confirmBox,.confirmBox2{width: 80%;background: #fff;border-radius: 8px;margin: 0px auto;top: 50%;margin-top: -100px;position: relative;text-align: center;padding: 0 4%;box-sizing: border-box;padding-top: 35px;padding-bottom: 35px;}
.confirmBox .p1,.confirmBox2 .p1{color: #555555;font-size: 16px;}
.confirmBox .p2,.confirmBox2 .p2{color: #929292;font-size: 12px;margin: 20px 0px;}
.confirmBox .p3 span,.confirmBox a.a1,.confirmBox2 .p3 span{width: 40%;display: inline-block;height: 30px;border-radius: 5px;line-height: 30px;cursor: pointer;background: #299EDE;border: none;color: #fff;}
.confirmBox .p3 span.join_yes,.confirmBox .p3 a.join_yes,.confirmBox .p3 span.join_yes2,.confirmBox2 .p3 span.join_no,.confirmBox .p3 span.join_en{background: none;border: 1px #A5A5A5 solid;color: #555555;margin-left: 10px;}
.confirmBox2 .p3 span.join_no{margin-right: 10px;margin-left: 0px;}
.confirmBox .p3 span.confirmBtn{background: #299EDE;border: none;color:#fff;}
.alertBox{width:80%;background:#fff;border-radius:8px;margin:0 auto;top:50%;margin-top:-100px;position:relative;text-align:center;padding:0 4%;box-sizing:border-box;padding-top:30px;padding-bottom:30px}
.alertBox .p1{color:#555;font-size:16px}
.alertBox .p2{color:#929292;font-size:12px;margin:20px 0}
.alertBox .p3 span{width:45%;display:inline-block;height:30px;border:1px #A5A5A5 solid;border-radius:5px;line-height:30px;color:#555;cursor:pointer}
.alertBox .p3 span.join_yes{background:#299EDE;border:none;color:#fff}

.courseListHead{padding: 0px 4%;display: flex;justify-content: space-between;align-items: center;color: #fff;}
.courseListHead img{width: 3%;}
.courseListHead p{font-size: 18px;}

.info_top{width: 100%;height:400px;background: #C4C4C4;position: relative;}
.info_top .bank_img{position: absolute;top: 5%;left: 3%;z-index: 99;width: 12%;}
.info_top .play_btn{position: absolute;top: 50%;margin: 0px auto;z-index: 99;width: 20%;left: 50%;margin-left: -10%;margin-top: -10%;}
.course_info{width: 100%;background: #D4D4D4;height: 80px;padding: 15px 0px;box-sizing: border-box;}
.course_info .course_info_box{width: 100%;height: 50px;background: #F8F8F8;padding: 0px 8px;box-sizing: border-box;}
.course_info .course_info_box .p1{color: #676767;font-size: 12px;line-height: 28px;}
.course_info .course_info_box .p2{color: #d61d1d;font-size: 14px;}
.course_picture{width: 100%;background: #F1F1F1;height: 300px;padding: 8px;box-sizing: border-box;}

.train_top_icon{position: absolute;right: 4%;top: 14px;width: 5%;}
.train_box{width: 100%;height: auto;overflow: hidden;display: flex;justify-content: space-between;background: #FFFFFF;border-bottom: #D7D7D7 1px solid;padding: 5%;box-sizing: border-box;align-items: center;margin-bottom: 3%;}
.train_box ul{width: 60%;}
.train_box ul li{width: 100%;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;display: inline-block;line-height: 30px;color: #a3a3a3;}
.train_box ul li.active{color: #666666;}
.train_box img{width: 60%;float: right;}
.train_list{width: 100%;height: auto;overflow: hidden;background: #fff;border-top: #D7D7D7 1px solid;margin-bottom: 70px;}
.train_list ul li{width: 100%;height: 70px;border-bottom: #D7D7D7 1px solid;padding: 0 4%;box-sizing: border-box;line-height: 70px;color: #666666;}

.music{width: 100%;height:auto;overflow: auto;background: #F8F8F8;}
.music .music_list{width: 100%;height:auto;overflow: auto;}
.music .music_list li{background: #fff;width: 100%;height: 70px;border-bottom: 1px #D7D7D7 solid;padding: 0 4%;box-sizing: border-box;}
.music .music_list li .p1{text-overflow: ellipsis;overflow: hidden;white-space: nowrap;color: #3a3a3a;line-height: 40px;}
.music_list li .p2{color: #aaaaaa;font-size: 12px;}

.mine{width: 100%;height: auto;overflow: hidden;}
.mine .mine_top{width: 100%;height: auto;position: relative;}
.mine .mine_top>img{width: 100%;}
.mine .mine_top .news_icon{position: absolute;width: 30px;height: 30px;top: 5%;right: 5%;}
.mine .mine_top .news_icon img{width: 100%;}
.mine .mine_top .news_icon .haveNews{width: 5px;height: 5px;border: 1px #fff solid;border-radius: 100%;display: block;background: #FF5757;position: absolute;top: 0px;right: -5px;}
.mine .mine_top .mine_top_center{width: 30%;height: auto;position: absolute;top: 10%;left: 50%;margin-left: -15%;text-align: center;color: #fff;}
.mine .mine_top .mine_top_center .p_head_pic{width: 100px;height: 100px;position: relative;}
.mine .mine_top .mine_top_center .p_head_pic img{width: 100%;}
.mine .mine_top .mine_top_center .p_head_pic .head_vip_bg{position: absolute;left: 3px; bottom: 0px; width: 94%;}
.mine .mine_top .mine_top_center .p_head_pic .vip_grade{position: absolute;left: 3px; bottom: 5px; width: 100%; font-size: 12px;}
.mine .mine_top .mine_top_center .p_neme{font-size: 16px;}
.mine .mine_top .mine_top_center .p_ip{font-size: 14px;}
.mine .mine_center{width: 100%;height: auto;overflow: hidden;margin-top: 3%;border-top: 1px #DBDBDB solid;}
.mine .mine_center li{background: #fff;border-bottom: 1px #DBDBDB solid;height: 45px;line-height: 45px;padding: 0 5%;box-sizing: border-box;}
.mine .mine_center li .p1{float: left;}
.mine .mine_center li .p2{float: right;width: 50%;}
.mine .mine_center li .p1 img{width: 27%; margin-top: 7px; float: left; margin-right: 8px;}
.mine .mine_center li .p1 span{display: block;float: left;}
.mine .mine_center li .p2 img{width: 7%;float: right;margin-top: 12px;}
.mine .mine_center li .p2 span{display: block;float: left;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width: 90%;}

.mine_grade{width: 100%;height: auto;}
.mine_grade ul li{width: 100%;border-bottom: 1px #E6E6E6 solid;border-top: 1px #E6E6E6 solid;height: 120px;margin-top: 3%;background: #fff;display: flex;justify-content: space-between;align-items: center;padding: 10px 4%;box-sizing: border-box;}
.mine_grade ul li .p1{color: #868686;font-size: 15px;line-height: 28px;}
.mine_grade ul li .p2{color: #868686;font-size: 12px;line-height: 25px;}
.mine_grade ul li .see_info{background:#00B4FF;width: 80px;height: 30px;text-align: center;line-height: 30px;color: #fff;border-radius: 5px;font-size: 13px;}

.video_popup {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: url(../images/video_bg.png);
    z-index: 999999;
}
.video_popup .video_con {
    position: absolute;
    font-size: 14px;
    color: #000;
    text-align: center;
    width: 55%;
    height: 0;
    left: 50%;
    top: -30%;
    opacity: 0;
    filter: alpha(opacity=0);
    display: block;
}
.video_popup .video_close {
    width: 27px;
    height: 27px;
    background: url(../images/video_close.png) center center no-repeat;
    position: absolute;
    right: -25px;
    top: -25px;
    cursor: pointer;
    background-size: cover;
}
.video_popup video {
    background: #fff9;
    text-align: center;
    min-height: 60px;
    line-height: 60px;
}

.notification.error.png_bg{
    color: #ff0000;

}

.m1{
    margin-left: 5px;
}