/***************** gen *****************/

/***************** list *****************/

.video_list .list_link{width:100%; height:100%;}

.video_box .thumb{width: 100%;height: auto;max-height:420px;display: flex;}
.video_box .thumb img {width: 100%;height: auto;object-fit: cover;display: block;}

.video_list .txt_box {width: 100%;padding:25px 15px;text-align: left;background:#fff;}
.video_list .txt_box h2{font-size:17px;color:#333;font-weight:500;word-break: keep-all;}
.video_list .txt_box p{font-size:14px;color:#777;font-weight:400;word-break: keep-all;margin-top:8px;}
.video_list .txt_box p span{margin-right:8px;position:relative;}
.video_list .txt_box p span:after {content: '';display: inline-block;width: 1px;height: 11px;background: #666;margin-left: 8px;}
.video_list .txt_box p span:last-child{margin-right:0;}
.video_list .txt_box p span:last-child:after{display:none;}


/***************** view *****************/

#video_view {background: #efefef;}
.video_view .txt_box {width: 100%;padding:20px;text-align: left;background:#fff;border-top: 1px solid #ddd;border-bottom: 1px solid #ddd;}
.video_view .txt_box h2{font-size:24px;color:#333;font-weight:600;word-break: keep-all;margin-bottom:15px;}
.video_view .txt_box p{font-size:17px;color:#777;font-weight:500;word-break: keep-all;padding-left:8px;position:relative;}
.video_view .txt_box p:after {content: '';width: 4px;height: 4px;background: #777;position: absolute;top:11.5px;left: 0;border-radius: 50px;}

.video_view .txt_con {width: 100%;height:100%;padding:20px;text-align: left;border-bottom: 1px solid #ddd;background:#fff;}
.video_view .txt_con .con_tit{font-size:16px; color:#000; font-weight:600;margin-bottom:20px;}
.video_view .txt_con p{font-size:16px; font-weight:400; color:#777;word-break: keep-all;}

#video_view button.vjs-big-play-button {position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);z-index:88;}

#video_view .tag{position: relative;margin-top:8px;}
#video_view .tag:after{content:'';clear:both;display: block;}
#video_view .tag li{display:flex;align-items:center;justify-content: center; float:left;margin-right:5px;}
#video_view .tag li:last-child{margin-right:0;}
#video_view .tag li {background: #edf6fb;padding: 3px 5px;border-radius: 3px;font-size: 12px;color: #2a3b6c;}

@media(max-width:450px) {
    .video_view .video_box .thumb{height:280px;}
    .video_view .txt_box h2{font-size:20px;}
    .video_view .txt_box p{font-size:16px;}
}

/***************** related *****************/

.video_view .related_con {width: 100%;height:100%;padding:20px;text-align: left;border-bottom: 1px solid #ddd;background:#fff;}
.video_view .related_con .con_tit{font-size:16px; color:#000; font-weight:600;margin-bottom:20px;}
.video_view .related_con p{font-size:16px; font-weight:400; color:#777;word-break: keep-all;}

.related_con ul {display: flex;flex-flow: row wrap;margin: 0 -10px;}
.related_con ul > li {display: flex;width: 50%;padding: 0 10px 10px;}

.rela_wrap {width: 100%;display: flex;align-items: center;}

.rela_pt.pt_lf {width:130px;height: 85px;display: flex;align-items: center;justify-content: center;padding-right:10px;}
.rela_pt.pt_lf img{width:100%;height:auto;display:block;}

.rela_pt.pt_rt {width: calc(100% - 140px);}
.rela_pt.pt_rt h2 {font-size: 15px;font-weight: 500;margin-bottom:6px;display: inline-block;width: 100%;overflow : hidden; text-overflow : ellipsis; height :18px; word-wrap : break-word; display : -webkit-box;-webkit-line-clamp : 1; -webkit-box-orient: vertical;}
.rela_pt.pt_rt h4 {font-size: 14px;margin-bottom: 5px;color: #005eaf;font-weight: 400;word-break: keep-all;}
.rela_pt.pt_rt p {font-size: 12px;color: #777;font-weight: 400;word-break: keep-all;}

@media(max-width:610px) {
    .related_con ul{margin:0 auto;}
    .related_con ul > li{width:100%;padding: 0 0 10px;}
}



/***************** config *****************/
.config{padding:0;}
.config li{border-bottom:1px solid #eee;list-style: none;}
.config li a{font-size: 16px;color: #333;width: 100%;display: flex;align-items: center;justify-content: space-between;padding: 20px;}
.config li a > span{display:flex;align-items: center;}
.config li a > span > i{font-size:26px;margin-right:15px;color:#777;}


/***********scrollbar***********/
.main_wrap::-webkit-scrollbar {
    width: 5px;
    background-color:transparent;
    position:fixed;
    z-index:999999;
} /* this targets the default scrollbar (compulsory) */
.main_wrap::-webkit-scrollbar-track{
    background-color:#666;
}
.main_wrap::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.4);
    border-radius:20px;
} /* this will style the thumb, ignoring the track */



@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles goes underneath */
}

@media(max-width:820px) {
}