﻿@charset "utf-8";

body { background-color: #f6f3f3; }

.video-list-page .section { display: block; margin-bottom: 10px; }
/*.video-list-page .section01 { position: fixed; z-index: 111; top: 0; left: 0; right: 0; margin: auto; background-color: #fff; }*/
.video-list-page .section01 { background-color: #fff; }
.video-list-page .section01 .video { height: 210px; position: relative; }
.video-list-page .section01 .video .video-bd { width: 100%; height: 100%; }
.video-list-page .section01 .video .img { width: 100%; height: 100%; }
.video-list-page .section01 .video .icon-play { position: absolute; z-index: 11; top: 50%; left: 50%; /*margin-left: -30px;*/ margin-top: -30px; width: 60px; height: 60px; outline: none; border: none; /*background: url(/uploads/image/tvdimages/icon-video-play.png) no-repeat 0 0; background-size: 100%;*/ }
.video-list-page .section01 .txt { background-color: #fff; padding: 5% 3%; }
.video-list-page .section01 .txt .tit { display: block; font-size: 2rem; font-weight:700; line-height: 1.4; margin-bottom: 6px;}
.video-list-page .section01 .txt p { color: #ccc; font-size: 1.2rem; margin: 5px 0; }
.video-list-page .section01 .txt p .icon { display: inline-block; vertical-align: middle; margin-top: -2px; width: 14px; height: 14px; /*background: url(/uploads/image/tvdimages/icon-video-play-small.png) no-repeat 0 0; background-size: 100%;*/ margin-right: 5px; }
.video-list-page .section01 .txt p span { margin-left: 15px; }
.video-list-page .section02 { background-color: #fff; padding: 15px 0 0; }
/*.video-list-page .section02 { background-color: #fff; padding: 15px 0 0; margin-top: 305px; }*/
.video-list-page .section02 .m-tit { display: block; text-align: center; font-size: 1.4rem; color: #666; margin-bottom: 10px; }
.video-list-page .section02 .m-tit .dot { display: inline-block; vertical-align: middle; height: 1px; width: 20px; background: #eee; margin: 0 10px; }
.video-list-page .section02 .bd { height: 360px; overflow-x: hidden; }
.video-list-page .section02 .bd .item { display: block; padding: 2% 3%; overflow: hidden; }
.video-list-page .section02 .bd .item .video { width: 140px; height: 80px; float: left; background-color: #d8d8d8; position: relative; }
.video-list-page .section02 .bd .item .video .img { width: 140px; height: 80px; }
.video-list-page .section02 .bd .item .video .icon-play { position: absolute; z-index: 11; top: 50%; left: 50%; margin-left: -15px; margin-top: -15px; width: 30px; height: 30px; outline: none; border: none; background: url(/uploads/image/tvdimages/icon-video-play.png) no-repeat 0 0; background-size: 100%; }
.video-list-page .section02 .bd .item .txt { width: 58%; height: 80px; float: right; color: #333; position: relative; }
.video-list-page .section02 .bd .item .txt .tit { font-size: 1.6rem; line-height: 1.2; font-weight: normal; }
.video-list-page .section01 .txt .list-title {  }
.video-list-page .section02 .bd .item .txt .num { position: absolute; z-index: 11; left: 0; bottom: 0; font-size: 1.2rem; color: #bbb; }
.video-list-page .section02 .bd .item .txt .num .icon { display: inline-block; vertical-align: middle; margin-top: -2px; width: 14px; height: 14px; background: url(/uploads/image/tvdimages/icon-video-play-small.png) no-repeat 0 0; background-size: 100%; margin-right: 5px; }
.video-list-page .section02 .bd .item .txt .add { position: absolute; z-index: 11; right: 0; bottom: 0; font-size: 1.2rem; color: #ccc; }
.video-list-page .section02 .bd .item:active { background-color: #f5f5f5; }

.company-info { line-height: 25px; font-size: 12px; color: #999; text-align: center; }

.wrapper { margin-bottom: 20px; }

/* 媒体查询 */
/* iphone4 */
@media screen and (min-width: 320px) {
    .video-list-page .section02 .bd .item .video { width: 105px; height: 60px; }
    .video-list-page .section02 .bd .item .video .img { width: 105px; height: 60px; }
    .video-list-page .section02 .bd .item .txt { width: 62%; height: 60px; }
}
/* android5.5 */
@media screen and (min-width: 360px) {
    .video-list-page .section02 .bd .item .video { width: 123px; height: 70px; }
    .video-list-page .section02 .bd .item .video .img { width: 123px; height: 70px; }
    .video-list-page .section02 .bd .item .txt { width: 62%; height: 70px; }
}
/* iphone6 */
@media screen and (min-width: 375px) {
    .video-list-page .section02 .bd .item .video { width: 140px; height: 80px; }
    .video-list-page .section02 .bd .item .video .img { width: 140px; height: 80px; }
    .video-list-page .section02 .bd .item .txt { width: 58%; height: 80px; }
}
/* iphone6plus */
@media screen and (min-width: 414px) {
    .video-list-page .section02 .bd .item .video { width: 140px; height: 80px; }
    .video-list-page .section02 .bd .item .video .img { width: 140px; height: 80px; }
    .video-list-page .section02 .bd .item .txt { width: 62%; height: 80px; }
}
/* android */
@media screen and (min-width: 540px) {
    .video-list-page .section02 .bd .item .video { width: 140px; height: 80px; }
    .video-list-page .section02 .bd .item .video .img { width: 140px; height: 80px; }
    .video-list-page .section02 .bd .item .txt { width: 64%; height: 80px; }
}
/* ipad 768 */
@media screen and (min-width: 768px) {
    .video-list-page .section02 .bd .item .video { width: 210px; height: 120px; }
    .video-list-page .section02 .bd .item .video .img { width: 210px; height: 120px; }
    .video-list-page .section02 .bd .item .txt { width: 68%; height: 120px; }
}
/* ipad pro1024*/
@media screen and (min-width: 1024px) {
    .video-list-page .section02 .bd .item .video { width: 280px; height: 160px; }
    .video-list-page .section02 .bd .item .video .img { width: 280px; height: 160px; }
    .video-list-page .section02 .bd .item .txt { width: 68%; height: 160px; }
}

