@charset "utf-8";

*{

   -webkit-tap-highlight-color:rgba(0,0,0,0); 

}

 ol,

 ul,

 li {

    list-style: none;

    margin: 0;



}

html,

body {

    margin: 0 auto;

    background: #ffffff;

    font-size: 14px;

    max-width: 750px;

    -webkit-overflow-scrolling:touch; 

    overflow-scrolling: touch;

}

img {

    max-width: 100%;

}

p,h1,h2,h3,h4,h5,h6{

    margin: 0;

}



a:hover{

    -webkit-tap-highlight-color: transparent;

}



@font-face {

  font-family: 'iconfont';  /* project id 1761429 */

  src: url('https://at.alicdn.com/t/font_1761429_x5hf3aqp4tf.eot');

  src: url('https://at.alicdn.com/t/font_1761429_x5hf3aqp4tf.eot?#iefix') format('embedded-opentype'),

  url('https://at.alicdn.com/t/font_1761429_x5hf3aqp4tf.woff2') format('woff2'),

  url('https://at.alicdn.com/t/font_1761429_x5hf3aqp4tf.woff') format('woff'),

  url('https://at.alicdn.com/t/font_1761429_x5hf3aqp4tf.ttf') format('truetype'),

  url('https://at.alicdn.com/t/font_1761429_x5hf3aqp4tf.svg#iconfont') format('svg');

}

 .iconfont {

  font-family: "iconfont" !important;

  font-size: 20px;

  font-style: normal;

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

}

.show_nr_article span:first-child i {

    transform: rotate(180deg);

    display: inline-block;

}



/*.spring{

    background: #f3f3f3;

    height: 100vh;

}*/



/*搜索*/

.search {

    margin: 10px 15px;

    overflow: hidden;

}

.search_zs {

    background: #f3f3f3;

    display: flex;

    overflow: hidden;

    padding: 5px 15px;

    border-radius: 20px;

}

.search_zs button {

    background: transparent;

    border: none;

    outline: none;

    border-radius: 0;

    box-shadow: none;

}

.search_zs i {

    min-width: 30px;

    text-align: right;

    font-size: 20px;

    color: #999;

}

.search_zs input {

    border: 0;

    color: #000;

    font-size: 14px;

    display: inline-block;

    background: transparent;

    -webkit-box-flex: 1;

    -webkit-flex: 1;

    flex: 1;

    outline: none;

    border-radius: 0;

    box-shadow: none;

    height: 20px;

    line-height: 20px;

}



.search_zs input::-webkit-input-placeholder {

    color: #999999;

}



.search_zs input:-moz-placeholder {

    color: #999999;

}



.search_zs input::-moz-placeholder {

    color: #999999;

}



.search_zs input:-ms-input-placeholder {

    color: #999999;

}

/*搜索页*/

.search_nr {

    display: flex;

    padding: 10px 15px;

    background: #fff;

    overflow: hidden;

}

.search_nr .search_nr_inp {

    -webkit-box-flex: 1;

    -webkit-flex: 1;

    flex: 1;

    background: #f3f3f3;

    padding: 3px 10px;

    border-radius: 30px;

    margin-right: 20px;

    position: relative;

}

.search_nr label {

    padding-top: 5px;

    overflow: hidden;

}

.search_nr label a {

    text-decoration: none;

    color: #000000;

}

#searchClear {

    display: none;

    position: absolute;

    right: 15px;

    color: #000;

    top: 7px;

    font-size: 17px;

}

.search_nr .search_nr_inp input {

    width: 100%;

    background: transparent;

    border: none;

    outline: none;

    box-shadow: none;

    font-size:14px;

    height: 20px;

    line-height: 20px;

}

.search_sore {

    margin: 15px;

    overflow: hidden;

}



.search_sore_top{

    padding-bottom: 10px;

    overflow: hidden;

}

.search_sore_top h3 {

    font-size: 15px;

    color: #333333;

    font-weight: normal;

}

.search_sore_bottom {

    overflow: hidden;

    overflow-y: scroll;

}

.search_sore_bottom_nr {

    display: flex;

    overflow: hidden;

    border-bottom: 1px solid #eee;

    padding: 10px 0px;

    font-size: 14px;

}

.search_sore_bottom_nr p {

    -webkit-box-flex: 1;

    -webkit-flex: 1;

    flex: 1;

    text-overflow: ellipsis;

    overflow: hidden;

    white-space: nowrap;

}

.search_sore_bottom_nr span {

    min-width: 70px;

    text-align: right;

}

.search_sore_bottom_nr span a {

    color: #128fc8;

    text-decoration: none;

}

.hot_history .hot_shop {

    height: 40px;

    line-height: 40px;

    font-size: 15px;

    padding: 0px 30px;

    background: #fff;

    border-top: 1px solid #eee;

}

.hot_list {

    font-size: 15px;

    text-align: center;

    background: #fff;

    border-top: 1px solid #eee;

    height: 40px;

    line-height: 40px;

}

/*搜索页*/

/*.search-con {

    display: flex;

    margin: 0px 15px;

    overflow: hidden;

}*/

/*搜索推荐课程*/

.recommend {

    margin: 20px 30px;

}

.recommend h3 {

    font-size: 30px;

    font-weight: normal;

    color: #999;

}

.recommend_nr {

    margin-top: 20px;

    font-size: 27px;

    color: #333;

}

.recommend_nr span {

    background: #e7e7e7;

    display: inline-block;

    padding: 0px 15px;

    border-radius: 8px;

    margin-bottom: 20px;

    margin-right: 10px;

}

/*  */

.index_banner {

    height:150px;

	overflow: hidden;

	background-color: transparent;

}



.index_banner .swiper-container {

    margin: 0px 15px;

    height: 150px;

    border-radius: 10px;

}

.index_banner .swiper-slide {

    text-align: center;

    font-size: 18px;

    /* Center slide text vertically */

    display: -webkit-box;

    display: -ms-flexbox;

    display: -webkit-flex;

    display: flex;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    -webkit-justify-content: center;

    justify-content: center;

    -webkit-box-align: center;

    -ms-flex-align: center;

    -webkit-align-items: center;

    align-items: center;

}

.index_banner .swiper-slide img{

	width: 100%;

	height: 100%;

    object-fit: cover;

}



.index_banner .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{



    left: 0px !important;

    text-align: center !important;

   

}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{

    margin: 0 10px !important;

}

.swiper-pagination-bullet-active{

    background: rgb(0,0,0,0.4) !important;

}

.index_banner .swiper-pagination{

    text-align: right !important;

}

.index_banner .swiper-pagination-bullet{

    width:10px !important;

    height: 10px !important;

    background: #0c2c67;

    opacity: 1 !important;

}

.systematics {

    padding: 20px 15px;

    overflow: hidden;

    display: flex;

    flex-wrap: wrap;

    background: #fff;

}

.systematics ul {

    text-align: center;

    -webkit-box-flex: 1;

    -webkit-flex: 1;

    flex: 1;

    margin-bottom: 20px;

    padding: 0;

    position: relative;

}



.systematics ul li:first-child{

    width: 50px;

    height: 50px;

    border-radius: 100%;

    margin: 0 auto;

    display: flex;

    align-items: center;

    text-align: center;

    background: #3a9dff;

}



.systematics ul li:first-child i {

    margin: 0 auto;

    color: #fff;

    font-size: 30px !important;

}

.systematics ul:nth-child(2) li:first-child{

     background-color: #fca719;

}

.systematics ul:nth-child(3) li:first-child{

     background: #fe5e7a;

}

.systematics ul:nth-child(4) li:first-child{

     background: #985eff;

}

.systematics ul li:nth-child(2){

    padding-top: 15px;

    font-size: 14px;

}

.systematics ul span {

    position: absolute;

    width: 10px;

    height: 10px;

    background: #ff2838;

    border-radius: 100%;

    top: 0;

    right: 20px;

}

.minute {

    margin: 0px 15px;

    overflow: hidden;

}

.minute_nr {

    overflow: hidden;

    margin-top: 30px;

}

.minute .minute_title {

    overflow: hidden;

}



.minute .minute_title h3 {

    font-size: 18px;

    float: left;

    margin: 0;

}

.minute .minute_title span {

    float: right;

    color: #c99b4d;

    font-size: 14px;

}

.minute .minute_title span i {

    font-size: 14px;

}

.minute_title span a {

    color: #128fc8;

    text-decoration: none;

}

.minute .minute_nr ul {

    display: flex;

    margin-bottom: 10px;

    padding: 0;

    overflow: hidden;



}

.minute .minute_nr ul li:first-child{

    margin-right: 15px;

}

.minute .minute_nr ul li:last-child {

    font-size: 34px;

    width: 100%;

}

.minute .minute_nr ul li h3 {

    white-space: nowrap;

    overflow: hidden;

    -o-text-overflow: ellipsis;

    text-overflow: ellipsis;

    width: 90%;

    font-weight: normal;

    font-size: 16px;

    margin: 0;

}

.minute_nr ul li .music-play i {

    font-size: 22px;

    color: #128fc8;

}

.course {

    margin: 0px 15px;

    overflow: hidden;

    margin-top: 20px;

}

.course_title h3 {

    float: left;

    font-size: 18px;

    margin: 0;

}

.course_title span {

    float: right;

    color: #c99b4d;

    font-size: 14px;

}

.course_title {

    overflow: hidden;

}

.course_title span a {

    color: #128fc8;

    text-decoration: none;

}

.course_title span i{

    font-size: 14px;

}

.course_nr {

    display: flex;

    overflow: hidden;

}

.course_nr .course_nr_thumb {

    height: 120px;

    border-radius: 28px;

    width: 100px;

    min-width: 100px;

    display: flex;

    justify-content: center;

    align-items: center;

}

.course_nr .course_nr_thumb img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    border-radius: 10px;

}

.course_nr {

    display: flex;

    overflow: hidden;

    margin-top: 15px;

}

.show_nr_brief {

    padding-top: 20px;

    overflow: hidden;

}

.course_nr_title {

    margin-left: 15px;

    margin-top: 10px;

}

.course_nr_title h3 {

    font-size: 16px;

    white-space: nowrap;

    overflow: hidden;

    -o-text-overflow: ellipsis;

    text-overflow: ellipsis;

    margin: 0;

}

.course_nr_title h6 {

    font-size: 14px;

    color: #666;

    margin: 0;

    display: -webkit-box;

    -webkit-line-clamp: 2;

    overflow: hidden;

    text-overflow: ellipsis;

    -webkit-box-orient: vertical;

    margin-top: 8px;

}

.course_nr_title p {

    padding: 10px 0px;

    font-size: 12px;

    color: #999;

    margin: 0;

}

.course_nr_title span {

    display: inline-block;

    font-size: 14px;

    color: #999;

    width: 100%;

    overflow: hidden;

}

.course_nr_title span img {

    width: 40px;

    height: auto;

}

.course_nr_title span i {

    margin-top: 0px;

    display: inline-block;

    vertical-align: middle;

}

.course_nr_title em {

    font-size: 40px;

    color: #daaa44;

    padding-top: 10px;

    display: inline-block;

}

.course_vedio {

    margin: 0px 30px;

    margin-top: 30px;

}

.course_vedio_nr {

    flex-flow: row wrap;

    display: flex;

    margin-top:30px;

}

.course_vedio_nr_sp {

    width: 47.7%;

    float: left;

    overflow: hidden;

    margin-right: 30px;

    margin-bottom: 30px;

}

.course_vedio_nr_sp:nth-child(2n) {

    float: right;

    margin-right: 0;

}

.course_vedio_nr_sp img {

    width: 100%;

    height: 200px;

    border-radius: 10px;

}

.course_vedio_nr_sp h3 {

    font-size: 30px;

    font-weight: normal;

    white-space: nowrap;

    overflow: hidden;

    -o-text-overflow: ellipsis;

    text-overflow: ellipsis;

    padding: 20px 0px;

}

.course_vedio_nr_sp p {

    font-size: 25px;

    color: #999;

}

.course_vedio_nr_sp p span:last-child {

    float: right;

}



.video_top {

    display: flex;

    overflow: hidden;

    background: #eee;

    padding: 0px 15px;

    height: 45px;

    line-height: 45px;

}

.video_top_nr label img {

    height: 18px;

    vertical-align: middle;

    margin-top: -5px;

}

.video_top_nr {

    -webkit-box-flex: 1;

    -webkit-flex: 1;

    flex: 1;

    text-align: right;

}

.music-list li {

    display: flex;

    padding-bottom: 10px;

    padding-top:10px;

    border-bottom: 1px solid #e5e5e5;

}

.music-list li .music-name h3 {

    white-space: nowrap;

    overflow: hidden;

    -o-text-overflow: ellipsis;

    text-overflow: ellipsis;

    width: 100%;

    font-weight: normal;

    font-size: 17px;

    margin: 0;

}

.music-list li .music-name p {

    font-size: 13px;

    color: #999;

    margin: 0;

}

.music-list {

    margin: 0;

    padding: 15px 15px;

    overflow: hidden;

}

.music-list .music-name {

    -webkit-box-flex: 1;

    -webkit-flex: 1;

    flex: 1;

}

.video-img-mask {

    text-align: right;

    font-size: 15px;

    vertical-align: top;

    margin-left: 10px;

    float: right;

    width: 60px;

    color: #09276f;

    padding-top: 5px;

}

.video-img-mask img {

    height: 30px;

}

/*详情*/

.show_nr {

    margin: 20px 15px 0px;

    overflow: hidden;

    overflow-y: auto;

}

.show_nr h3 {

    font-size: 17px;

    margin-top: 0;

}

.show_nr .show_nr_tu img {

    width: 50px;

    height: 50px;

    border-radius: 100%;

    float: left;

}

.show_nr .show_nr_tu h4 {

    float: left;

    margin-top: 20px;

    font-size: 15px;

}

.show_nr_tu span {

    float: right;

    font-size: 13px;

    color: #999;

    padding-top: 23px;

}

.show_nr_tu {

    overflow: hidden;

    border-bottom: 1px solid #ccc;

    padding: 15px 0px;

}

.show_nr_vedio {

    background: #e5e5e5;

    padding: 10px 20px;

    border-radius: 8px;

    display: flex;

    margin: 15px 0px;

}

.show_nr_vedio_tu .music-play i {

    font-size: 34px;

    color: #128fc8;

}



.show_nr_vedio_tu .music-play {

    display: inline-block;

    margin-right: 12px;

}

.show_nr_vedio_tu .music-no i{

    font-size: 34px;

    color: #128fc8;

}

.show_nr_vedio_tu .music-no{

    display: inline-block;

    margin-right: 12px;

}

.music-range {

    width: 100%;

    height: 2px;

    background: #999;

    border-radius: 10px;

    -webkit-appearance: none;

    margin: 0 auto;

    cursor: pointer;

   

}

.music-range::-webkit-slider-thumb {

  width: 10px;

  height: 10px;

  background: #fff;

  box-shadow: 1px 1px 5px #888888;

  cursor: pointer;

  border-radius: 100%;

  -webkit-appearance: none;

  z-index: 99999;

  position: relative;

}

p#bar {

    position: absolute;

    background: #128fc8;

    content: "";

    height: 2px;

    top: 13px;

    z-index: 9999;

    padding-top: 0 !important;

    display: inline-block;

}

.music_nr {

    float: left;

    width: 100%;

    position: relative;

}

.music_nr p {

    font-size: 12px;

    color: #666;

    padding-top: 3px;

}



.show_nr_brief h3 {

    padding-bottom: 10px;

}

.show_nr_brief p {

    font-size: 14px;

    line-height: 25px;

    padding-bottom: 10px;

    color: #333;

    display: inline-block;

}

.show_nr_article {

    display: flex;

    justify-content: center;

    padding-top: 30px;

    overflow: hidden;

}

.show_nr_article span {

    display: inline-block;

    padding: 0px 20px;

    color: #999;

}

.show_nr_article span a {

    color: #999;

    font-size: 14px;

    text-decoration: none;

}

.show_nr_article span a i {

    font-size: 20px;

    vertical-align: middle;

}

.video_content {

    margin: 15px 15px;

    overflow: hidden;

}

.video_thumb {

    width: 100%;

    overflow: hidden;

}

.video_thumb .video_thumb_nr {

    width: 100%;

    height: 200px;

    border-radius: 10px;

    position: relative;

    overflow: hidden;

}

.video_thumb .video_thumb_nr img{

    width: 100%;

    height: 100%;

    object-fit: cover;

    border-radius: 10px;

}



.video_thumb .video_thumb_nr .anniu {

    position: absolute;

    top: 0;

    width: 100%;

    display: flex;

    justify-content: center;

    height: 100%;

    align-items: center;

}

.video_thumb .video_thumb_nr .anniu i {

    font-size:50px;

    color: #ffffff;

}

.video_content p {

    padding: 10px 0px;

    font-size: 13px;

    color: #666666;

    margin-bottom: 10px;

}

.video_banner {

    width: 100%;

    height: 200px;

    overflow: hidden;

}

.video_banner video {

    width: 100%;

    height: 100%;

    object-fit: cover;

}

@media only screen and (max-width: 375px) {

    .video_thumb .video_thumb_nr {

        width: 100%;

        height: 180px;

        border-radius: 10px;

        position: relative;

        overflow: hidden;

    }

}

@media only screen and (max-width: 325px) {

    .video_thumb .video_thumb_nr {

        width: 100%;

        height: 160px;

        border-radius: 10px;

        position: relative;

        overflow: hidden;

    }

}