body{
    max-width: 1920px;
    background:#fff;
    margin: 0 auto;
}
.limit-line{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space:nowrap;
}
.notFound_content{
	text-align: center;
}
video:focus {
    outline: none
  }
.limit-line3{
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }
.limit-line2{
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
*{
    margin: 0;
    padding: 0;
}
li,ul{
    list-style: none;
    padding: 0;
}
.header{
    height: 70px;
    background:url(../images/logoPc.png) no-repeat left center;
    background-size:auto 34px;
    border-bottom: 1px solid rgba(221,221,221,.5);
    margin-bottom: 20px;
}
.top_box{
    height: 244px;
}
.jm{
    display: none;
}
.jiemu_box{
    display: none;
}
img{
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
}
#container{
    width: 1200px;
    margin: 0 auto;

}
.article-image{
    width: 344px;
    height: 194px;
    box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    float: left;
    overflow: hidden;
    cursor: pointer;
}
.article-right{
    margin-left: 364px;
}
.top_title{
    width: 836px;
    max-height: 84px;
    font-size: 30px;
    font-weight: 500;
    color: #343A40;
    line-height: 42px;
    position: relative;
    cursor: pointer;
    
}
.top_title_border{
    position: relative;
}
.hoverTitle,.hoverTitleDesc{
    display: none;
    position: absolute;
    width: 550px;
    padding: 15px;
    color: #008BFF;
    font-size: 16px;
    line-height: 22px;
    background: white;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.19);
    border-radius: 4px;
    margin-left:70px;
    margin-top: 20px;
    z-index: 10;
}
.hoverTitle div,.hoverTitleDesc div{
	width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-right: 15px solid transparent;
    border-bottom: 15px solid white;
    border-left: 15px solid transparent;
    position: absolute;
    left: 50%;
    top: -30px;
    margin-left: -15px;
    z-index: 10;
}
.article-box-inner .desc{
    width: 836px;
    height: 50px;
    font-size: 18px;
    position: relative;
    font-weight: 400;
    color: #6A727A;
    line-height: 25px;

}
.myVideo{
    width: 799px;
    height: 449px;
}
.auther{
    height:30px;
    margin:10px 0  20px 0;
    vertical-align: middle;
    line-height: 30px;
    font-size: 18px;
    font-weight: 400;
    color: #343A40;

}
.videoOrAudio{
    width: 799px;
    height: 449px;
    cursor: pointer;
    overflow: hidden;
    margin-bottom: 10px;
}

.detail .auther{
    border-bottom: 1px solid rgba(221,221,221,.5);
    padding-bottom:10px ;
}
.auther img{
    height: 30px;
    width: 30px;
    border-radius: 100%;
    vertical-align: middle;
    margin-right: 10px;
}
.detail .auther span{
    float: right;
}
.tab_title{
    border-bottom: 1px solid rgba(221,221,221,.5);
    width: 800px;
    height: 46px;
    cursor: pointer;
}
.content{
    width: 800px;
    float: left;
}
.tab_title li{
    color: #343A40;
    margin-right: 32px;
    font-size: 24px;
    font-weight: 500;
    color: #343A40;
    line-height: 33px;
    display: none;
    float: left;
    margin-left: 10px;
    padding-bottom: 5px;
}
.tab_title li.active_tab>div{
    width: 30px;
    height: 3px;
    background: #008BFF;
    border-radius: 2px;
    margin: 3px auto;

}
.active_tab{

}
.desc_context{
    padding: 20px;
}
.detail  .desc_context{
    padding: 0px;
}
.desc_context p{
    margin: 10px 0 ;
    
    font-size: 18px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #343A40;
    line-height: 25px;
}
.desc_context img{
    width: 100%;
}
.program p{
    height: 55px;
    font-size: 18px;
    color: #343A40;
    line-height: 55px;
    border-bottom: 1px solid #E9ECEF;
    padding: 0;
    margin: 0;
    position: relative;
    padding-right: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}
.program p:hover{

    color:#008BFF;
}
.program p:hover::before{
    background: url(../images/videoBlue.png) no-repeat;
    background-size:cover ;
}
.program p::before{

    content: '';
    display:inline-block;
    vertical-align: middle;
    background: url(../images/videoGray.png) no-repeat;
    background-size:cover ;
    width: 22px;
    height: 22px;
    margin-right: 20px;
    margin-top: -3px;
    margin-left: 16px;
}
.program .jiemuDivAudio::before{
    background: url(../images/audioGray.png) no-repeat;
    background-size:cover ;
}
.program .jiemuDivAudio:hover::before{
    background: url(../images/audioBlue.png) no-repeat;
    background-size:cover ;
}
.program p span{
    position: absolute;
    right: 0;
    margin-right: 20px;
}
.hobbyAndhot{
    width: 360px;
    margin-left: 839px;
}
.hot_title{
    height: 40px;
    border-bottom:  1px solid #E9ECEF;
    padding-left: 10px; 
    font-weight: 500;
}
.desc_title.hot_title{
    display: none;
}
.hot_title img{
    vertical-align: middle;
    width: 20px;
    height: auto
    
}
.hot_title>div{
    display: inline;
    margin-left: 5px;
    position: relative;
    top: 2px;
}
.article_content:hover{
    color:#008BFF;
    cursor: pointer;
}
.hobbyAndhot .article_content{
    padding: 16px 10px;
    border-bottom: 1px solid #DEE2E6;
    height: 81px;
}
.hobbyAndhot .article_content img{
    width: 144px;
    height: 81px;
    float: left;
}
.hobbyAndhot .article_content .article_words{
    margin-left: 156px;
}
.toTop{
    width: 50px;
    height: 50px;
    position: fixed;
    bottom: 100px;
    right: 10%;
    background:url(../images/top.png) no-repeat;
    background-size: cover;
    display: none
}
.videoOrAudio{
    position: relative;
}
.sanjiao{
    width: 102px;
    height: 102px;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    background: url(../images/sanjiao.png) no-repeat;
    background-size: cover;
    z-index: 10;
}
.progressBorder{
    position: absolute;
    left: 0;
    bottom: -49px;
    width: 100%;
}
.tools{
    width: 100%;
    height: 45px;
    padding: 0 30px;
    box-sizing: border-box;
    background: rgba(0,0,0,.6);
    display: flex;
    align-items: center;
  
    z-index: 3;
}
.play{
    width: 22px;
    height: 20px;
    background-repeat: no-repeat;
   
    margin-right: 20px;
    cursor: pointer;
    background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACoAAAAoCAYAAACIC2hQAAACG0lEQVRYR+3ZPWsVQRTG8f9DEMXG1GJhI1h5q7Q2QfB7qKCNWhhQiRa+QdIYIYl+ARWx1kIsDaQwRK1UsDHEykaERDFy5IFdMLi7zk3u3Z1ATntndn/M7MycM1fskFCKMyL2AoeAVUk/UvoMuk0jNCKOArPAcWAPsAE8Ba5J+jRoTNPzaqER0QMWgX0VD1gHJoF7kn63AW6CvgGMbYrXwClJ74aNrYRGxEF/j4kv/wVMAbck/Uzs03ezOug48LLPp70HTkta6LNfUvM66AngRdITNjcKYA64Kun7FvrXdhk0tHzRZ+CcpOeDwg4LWvoeAhclfd0ueNhQ+4w8L+nxdrBtQEvfs+JzWNkKuE2ofV5gl4H7krzwkqNtaAl7VWxlH1KlXUHt8+FwA5iW5ByiMbqElrC3xTG81CTNAWqfE5tLkmbqsLlAS58PiQdV2NygX4DDkpzobIrcoMb1qtLGXej/tpua350De+r/2a5yG9HsF5O3pwlJd3Penlxvue5y/VUbXU69j9CbrrdyPkKdlJyR5DorKdoeUad5V4D5nNM8109nJWWbOLsUuSDpUdIc1zQa9tQbZ2S2xZ2n19OcbbnsOmjeC6atC4gdc6VzBPiY+PE7d5z25t3FJZkX2XL2144eyYgYKy7KRitGdg24Dsx0fpFbYI8Bd4CTwAhg4BPgdjZX43+PYkQcAPYD3yQZ23ok/SvSuqrihX8Ae9bqKfV8U/gAAAAASUVORK5CYII=);
    background-size: 22px 20px;
}
.play.pause{
    background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAYAAAAehFoBAAAA9UlEQVRYR+2Y0QnCQBBEZ1rwT7EHW7ANLcQiLETbsAV7EPNnCyvBC2jg9jyXiCeT38DwmJvsbYZo7GFjvBDw1CfmOmxmSwB7AGsA8wTTATgB2JG8fAIY0c0CJ9EzgFkG6gZgVQsd1fWADwA2BQePJLc1LptZSNcDvj7FIMfUkVxUAod0PWB7B4Rk1aQxs5CugEunIocHh6JO5JyO6irDyvDIAUVCkVAktEs8MpBbqjQlNCU0JTQlNCVevwL9hCY/dHEMwVAkFInxVflDF0eotHN6iZDuX9WtffveTqHdH2mk2vf24ohuVbdbWs6/8V7AU7vcnMN3V848PLSCPmsAAAAASUVORK5CYII=);
    background-size: 22px 20px;
}
.time{
    font-size: 16px;
    line-height: 22px;
    color: #fff;
    font-family: Helvetica Neue;
    margin-right: 12px;
}
/* .progress{
    flex: 1;
    height: 40px;
   
    margin-right: 10px;
    
} */
.progress{
  
    width: 100%;
    height: 4px;

    bottom: 45px;

}
#progressWrap{

    background: hsla(0,0%,100%,.5);
}
.progress_point{
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    top: 50%;
    right: -3px;
    transform: translateY(-50%);
    cursor: pointer;
    display: none;
}
.volume{
    width: 22px;
    height: 20px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAoCAYAAACFFRgXAAADpElEQVRYR9WZW6imUxjHf38unDI5NITUHGKUxoUpoYgSRSkXyGHILUMpoaaZjHFIIjJuuXFWjERETnMhx2LfoJwSk5zKqSH89d8977Ta7W9/3zf729/e33Pz7fU+77vWb631nNbaYsJEi81re7mkHwblWFRg208BFwKfAFdKercf+KIB287YWdlDC/If4HbgVkn/9QIfGbDtvYBLgCOAhyX91G+1bJ8FPAkc0rz7NLBe0l+zfT8SYNsHA48D59QgT0gKfF+xfWQmCJzdvPwmcK6kP2d2MG9g22uBZ4HVTec7JJ3el7ZeqN25H9jQfPM8cIGkf9t+5gVs+yLgIeCAGXCzAts+MDYKZEfukTTVfmd7M7ClebZN0rXzBra9dznITT1WsRfw1cCD9c3vwOWSnpsBHX3e6+Q8SS92jaFX2HYcJPba2txM7l7ARwEfNZHBwEZJd3Yd1GK8CpxRz3YCx0v6Je2hgG2fUPa6qo999rRh28cCsc/8dnKdpAca6BXAx0BMKHKXpJuHArZ9cdnr/gM405xOZ/sgIOErYS3yN3CqpA8a6BuAu6v9B7AyGVEVwI8B9p0DZD2QDgaV3cAVAU4DpiT93ADFUd8HjqtnnwMnSvo1bdv7AV8Ch5f+FklbAvxMwsegJAO+1wK/XPYeJztf0usNdEJi0nG3WJsk3dboNwJd+zNJawKcNDiULQ8A3QInCXQxeVfgJe3oAfVNbf107LW9EviiGW9dgOOpo5YWOM71GpAIEfkKWCspKx6o5UBA9yl9ksX2ZkIxm3XVvn7BgQtqDfAh0DnsZklbG6hHgMuqvV3SbhO1vQ24pnSPjQW4oDdVlkszzrRa0vTu2r4UeLSgdkpKfTEttq+q6JTm1DiBA/FtY3urJAU8UCcDbze6ZZJ+K10KqpdK993YgGvwH5ssd6akN+r5YcD3DfAKSV+X7iTgndLtGjdwauSu9l3awFX3To5J2J7L6RIhEikii+90ticnrFV1NtLEsdCp+S0gxU9kJKl5oYufV6qMHFnxk8JnIcvLlIk5PbwnKXG4y2ApL1P/xr4jg5WXTbCe888xFPCnSEq90U1o9gJ+UODKOpNzRGpmPjmH0AY6x/w7gBt77NDSOea3gHtwkbIMuBfI79axXaTMgB7VVdV9QHvLM/qrqsZEJucysIGenOvWYUJjM8EkrCSSrj4e74X2HkK/kHtg4FPgiiX9L4NKRFnlo3PM7w6k/SY+6guUfuPNW/8/NuxNDUEJqGwAAAAASUVORK5CYII=) no-repeat;
    background-size: 22px 20px;
    position: relative;
    cursor: pointer;
    margin-right: 30px;
}
.progress_f{
    height: 4px;
    background:#fff;
    position: relative;
    width: 0px;
}
.full_screen{
    width: 20px;
    height: 20px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAqCAYAAADBNhlmAAACiklEQVRYR82ZPYxMURTHf/8EUVD4ytIofFQSKiIaDRWFRkJLIiFUEtaKiEjsUmgIiYSWRKOgEoVCQlS29VFokGATUYhs9siZ3De5Jm929t15e+feZmbeu2/Ob86553/PPSMKH6rjM7MlwEZgRSb+38BnSbO99v4DNLPlwGXgBLA6E1xl5idwD7gi6U91sQsY4F4AezKD9Zp7BeyrIGPASWA8zP4LPAe+ZYIdA/YDy4K9KUkX/H0HMKw5h/GwOtxeSa8zwXXMmNlu4GWA9HCP+ZqsADcBHwPQM0kHc8JVtszsKXAgfN4s6VMFuB14F248kHR8RID3gWPB9g5J0wMBzWwDcAlYNQ/095B9/po8zCwJ8A5wcgFWJyVNLGBe3ympgA+BIwMMu8AelvSkFEAPxVQEMyPpxzBwIZOTQtzPgxOSXDtbG22E2H9hnOEXJV1ri7ANwK2+1oAYqjVPtgIo6YOZ+TYUQ45Luj6sJ1sDDAs6hpwD1knyLSp5pALeAk4DLiXr42w1s/PBk9PAzrp6rgltKuBa4Czwpk7nzMwLjF/DwiXLTBMPDDs3yYPDGm3yfFZAM1sKrKxLHDM7BOwCbkrqFhjZAAPcW2Ab4GJ+o/Kkma0BvgJ+MLst6Ux0r/lW1yREkSFPHK/QHcJHV8zNbAvwPlx/JOlodsCQkeeAWLw7kMUA1oh5x5PA4yI8GIWtd1uMC47RhTheuzV7d3V7dIAhW+NzjJ+5ew9jowEMOudrrcrifmIwMsC4SzGfUt2VdCq7zJiZFxjehPLXfmMGuCrpS3bAFHEfVM0U3/rwxVxu8yi4t9z2WwD07mq5DcwIsswWcM/WVGYTPVUeFvO52r8hFtNg0+8uHvAf494ISer9l54AAAAASUVORK5CYII=) no-repeat;
    background-size: 20px;
}
.flex1{
    flex:1;
}
.volume_bar{
    width: 100%;
    height: 84px;
    padding: 10px;
    box-sizing: border-box;
    background: #000;
    border-radius: 13px;
}
.volume_box{
    width: 26px;
    height: 124px;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%);
    display: none;
}
.volume_progress{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    background: hsla(0,0%,100%,.5);
    border-radius: 6px;
    box-sizing: border-box;
}
.flex1{
    flex:1;
    margin:0 30px;
}
.audioImg{
    width: 400px;
    height: 225px;
    border-radius: 8px;
    border: 3px solid #FFFFFF;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    z-index: 4;
}
.audioImgFilter{
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -1;
    filter: blur(10px);
   
}
.volume.noMargin{
    margin-right: 0;
}
.volume_progress_f{
    width: 100%;
    background: #fff;
    position: relative;
    height: 60px;
    border-radius: 6px;
}
.volume_point{
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    top: -9px;
    left: 50%;
    z-index: 2;
    transform: translate(-50%);
}
/* 图文 */
.tuwen{
    width: 800px;
    height: 113px;

    border-bottom: 1px solid #E9ECEF;
    cursor: pointer;
}
.tuwen:hover .tuwen-title{
    color: #008BFF;
   
}
.tuwen:hover{
    background: #F8F9FA;
}
.tuwen .image-left{
    width: 144px;
    height: 81px;
    float: left;
    position: relative;
    margin-top: 17px;
}
.tuwen .image-left .icon{
    position: absolute;
    width: 20px;
    height: 20px;
    left: 5px;
    bottom: 5px;

}
.tuwen .image-left .inner{
    width: 100%;
    height: 100%;
}
.tuwen-title{
    margin-left: 164px;
    color: #343A40;
    vertical-align: middle;
    line-height: 28px;
    font-size: 20px;
    height: 100%;
    display: table;
}
.tuwen-title span{
    display: table-cell;
    vertical-align:middle;
}
.loading{
    position: fixed;
    width: 20px;
    height: 20px;
	left: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	display: none;
}