img{

    display: block;

    width: 100%;

}

.clearfix:after{/*伪元素是行内元素 正常浏览器清除浮动方法*/

    content: "";

    display: block;

    height: 0;

    clear:both;

    visibility: hidden;

}

.clearfix{

    *zoom: 1;/*ie6清除浮动的方式 *号只有IE6-IE7执行，其他浏览器不执行*/

}

.indexbody{

    background-image: url(../images/course_bg.png);

    background-size: 100% auto;

    background-position: top center;

    background-repeat: no-repeat;

    max-width: 640px;

    margin: auto;

    padding:1rem 0.8rem;

}



.course .header{

    margin:auto auto 1rem;

    max-width: 640px;

}

.course .header .logo{

    float: left;

    width: 5.2rem;

}

.course .header .name{

    float: right;

    color: #fff;

    font-size: 0.6rem;

}

.course .tipTitle{

    text-align: center;

    color: #fff;

    font-size: 0.8rem;

    line-height: 1.6;

}

.course .title-box{

    text-align: center;

    margin-top: 1rem;

    margin-bottom: 2rem;

}

.course .title-box .text{

    font-size: 0.7rem;

    line-height: 1.2rem;

}

.course .title-box h1{

    font-weight: bold;

    font-size: 1.5rem;

    line-height: 2rem;

    letter-spacing: 8px;

    color: #feffc9;

}

.course .title-box .time{

    color: #ffffff;

    margin-top: 0.8rem;

    line-height: 1.6;

    font-size: 0.7rem;

}

.course .title-box .date{

    border-radius: 0.8rem;

    border:1px solid #fff;

    padding:0.2rem 0.5rem;

    display: inline-block;

    width: 5.6rem;

    line-height: 0.8rem;

}

.course .title-box .date .date-select{

    display: inline-block;

    width:4.5rem;

    color: #88ddfd;

    font-size: 0.5rem;

    line-height: 0.8rem;

    padding: 0 0.8rem 0 0.2rem;

    outline: none;

    text-align: center;

    text-align-last: center;

    -moz-text-align-last: center;

    /*将默认的select选择框样式清除*/

    appearance:none;

    -moz-appearance:none;

    -webkit-appearance:none;



    background-image: url(../images/icon_calendar.png);

    background-size: 0.8rem auto;

    background-repeat: no-repeat;

    background-position: center right;

    background-color: transparent;

}

/*.course .title-box .icon-calendar{*/

/*    width:0.8rem;*/

/*    height: 0.8rem;*/

/*    background-image: url(../images/icon_calendar.png);*/

/*    background-size: contain;*/

/*    background-repeat: no-repeat;*/

/*    background-position: center center;*/

/*    background-color: transparent;*/

/*}*/

.course-data-container{

    min-height: 50vh;

}

.course .list li{

    display: -webkit-box;

    display: -moz-box;

    display: -ms-flexbox;

    display: -webkit-flex;

    display: flex;



    border-radius: 0.5rem;

    background-color: #fff;

    box-shadow: 0 0 0.3rem #999;

    min-height: 5rem;

    margin-bottom: 1rem;

}

.course .list .lesson{

    width:20%;

    max-width: 145px;

    border-bottom-left-radius: 0.5rem;

    border-top-left-radius: 0.5rem;

    background:url(../images/icon_am.png) center  0.7rem no-repeat,url(../images/icon_book.png) center bottom no-repeat;

    background-color: #ff7289;

    background-size: contain;

}

/* .course .list .course-am .lesson{

    background:url(../images/icon_am.png) center  0.7rem no-repeat,url(../images/icon_book.png) center bottom no-repeat;

    background-color: #ff7289;

    background-size: contain;

} */

.course .list .course-pm .lesson{

    background:url(../images/icon_pm.png) center  0.7rem no-repeat,url(../images/icon_book.png) center bottom no-repeat;

    background-color: #0ac2fb;

    background-size: contain;

}

.course .list .lesson .title{

    font-size: 0.6rem;

    color: #fff;

    font-weight: bold;

    margin-top: 1.5rem;

    text-align: center;

}

.course .list .name{

    -webkit-box-flex: 1;      /* OLD - iOS 6-, Safari 3.1-6 */

    -moz-box-flex: 1;         /* OLD - Firefox 19- */

    -webkit-flex: 1;          /* Chrome */

    -ms-flex: 1;              /* IE 10 */

    flex: 1;                  /* NEW, Spec - Opera 12.1, Firefox 20+ */



    padding:0.5rem;

    position: relative;

}

.course .list .name .box{

    margin-bottom: 0.5rem;

}

.course .list .name .box:last-child{

    margin-bottom: 0;

}

.course .list .name h2{

    font-size: 0.7rem;

    line-height: 1rem;

    font-weight: normal;

}

.course .list .name h2 .teacher{

    color: #999;

    font-size: 0.5rem;

    float: right;

}

.course .list .name .name-des{

    font-size: 0.5rem;

    line-height: 1.6;

    padding-top: 0.2rem;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 2;

    overflow: hidden;

    clear: both;

}

.course .list .name .btn{

    /* display: flex;

    align-items: center; */

    margin-top: 0.2rem;

}

/*.course .list .name .btn-bottom{*/

/*    position: absolute;*/

/*    left: 0.5rem;*/

/*    right: 0.5rem;*/

/*    bottom: 0.5rem;*/

/*}*/

.course .list .name .time{

    font-size: 0.5rem;

    color: #999;

    margin-top: 0.3rem;

    display: inline-block;

}

.course .list .name .btn-view{

    background-color: #cecece;

    color: #fff;

    font-size: 0.6rem;

    padding:0.2rem 0.8rem;

    line-height: 1rem;

    border-radius: 1rem;

    border: none;

    float: right;

    cursor: pointer;

}

.course .list .box.view-start .btn-view{

    background-color: #2c97f9;

}



.course .list li.onlyone .name  .btn{

    margin-top: 0.8rem;



}



.alert_bg {

    /*display: none;*/

    background-color: rgba(0,0,0,0.2);

    padding: 0 0 0 0;

    width: 100%;

    height: 100%;

    left: 0;

    top: 0;

    bottom: 0;

    right: 0;

    position: absolute;

    z-index: 200;

}

.alert_box{

    width:300px;

    /*margin-left: auto;*/

    text-align: center;

    position: absolute;

    z-index: 230;

    top: 50%;

    left: 50%;

    margin-left: -150px;

    margin-top: -110px;

    border-radius: 10px;

    border: 1px solid #efefef;

    background-color: #ffffff;

    /*padding-bottom: 5%;*/

}

.alert_box .title{

    font-size: 16px;

    line-height: 1.6;

    margin-top: 30px;

    font-weight: bold;

    color: #333333;

}

.alert_box .pass_input{

    padding: 30px 0 40px 0;

}



.alert_box .pass_input .input{

    display: block;

    width: 80%;

    margin: 0 auto;

    height: 40px;

    line-height: 40px;

    font-size: 16px;

    background-color: #ffffff;

    color: #3c3c3c;

    /*padding-left: 0.2rem;*/

    border-radius: 3px;

    border: 1px solid #A9A9A9;

    text-align: center;

}



.alert_box .btn-list{

    border-top: 1px solid #efefef;

}

.alert_box .btn-list .item{

    float: left;

    width: 49.9%;

    text-align: center;

    line-height: 40px;

    height: 40px;

    font-size: 16px;

    color: #666;

}

.alert_box .btn-list .item.submit{

    border-left: 1px solid #efefef;

    color: #5094F2;

}





.footer-download-text{

    font-size: .6rem;

    text-align: center;

    padding: 0px 0 15px 0;

    color: #2b97f9;

}

.footer-download-text a{

    color: #2b97f9;

}

.bottom-download{

    position:fixed;

    bottom: 30px;

    left:50%;

    z-index:10;

    overflow: hidden;

    transform: translate(-50%,0);

    color: #fff;

    display: block;

    font-size: .6rem;

    width: 8.6rem;

    text-align: center;

    background-color: #2b97f9;

    padding: 10px 15px;

    box-shadow: 0 0 0.3rem #eee;

    border-radius: 20px;

}

.bottom-download a{

    color: #fff;

}