﻿
#index-slider{ overflow:hidden;}
.clearfix {
 *zoom: 1;
}
.videolist { position: relative;
    float: left;
    width: 31%;
    height:280px;
    margin-right: 10px;
    margin-left: 10px;
    margin-top: 15px;
    margin-bottom: 90px; }
.videolist:hover{ cursor: pointer; }
.videoed {
    display: block !important;width:50px; height:50px; position: absolute; left: 44%; top: 36%; z-index:99; border-radius:100%; }

.vid{  border: 1px solid #080808; position:fixed; left:50%; top:50%; margin-left:-320px; margin-top:-210px; z-index:100; width:640px; height:360px; }
.videos{ text-align:center;display:none; padding-top:7%; background:rgba(0,0,0,0.5);  position: fixed; left:0; top:0;  z-index:100; width:100%; height:100%; }
.vclose { position:absolute; top:10%; border-radius:100%; cursor: pointer; }
.vtit{ text-align:center; height:60px; line-height:60px; font-size:16px; background:#f7f7f7}

.indexvid{ width: 92%;    margin: 54px auto;}
.indexvid .videolist{width: 31.0%;
    float: left;
    margin: 0 16px;
    position: relative;
    margin-top: 25px;
    overflow: hidden;
	height: 380px;}
.indexvid .vtit {
    width: 100%;
    float: left;
    height: 37px;
    text-align: center;
    background: url(../images/movtit.png) top center no-repeat;
    color: #fff;
    line-height: 32px;
}

@media screen and (max-width:1440px){
.indexvid .videolist {
    width:31.5%;
    float: left;
    margin: 0 10px;
    position: relative;
    margin-top: 25px;
    overflow: hidden;
    height: 330px;
}
.indexvid .videolist img {
    max-width: 100%;
    max-height: 290px;
    border: none;
}


.indexvid .vtit {
    width: 100%;
    float: left;
    height: 37px;
    text-align: center;
    background: url(../images/movtit.png) top center no-repeat;
    color: #fff;
    background-size: contain;
    line-height: 32px;
}
.case199 .pro199 .list199 li a img {
    display: block;
    width: 320px;
    height: 288px;
}
}

@media screen and (max-width:768px){
.indexvid .videolist {
    width: 47%;
    float: left;
    margin: 0 5px;
    position: relative;
    margin-top: 10px;
    overflow: hidden;
    height: 210px;
}
.indexvid {
    width: 92%;
    margin: 24px auto;
}
.videolist {
    position: relative;
    float: left;
    width: 47%;
    height: 110px;
    margin-right: 5px;
    margin-left: 5px;
    margin-top: 15px;
    margin-bottom: 40px;
}
.videoed {
    display: none;
    width: 50px;
    height: 50px;
    position: absolute;
    left: 36%;
    top: 32%;
    z-index: 99;
    border-radius: 100%;
}
.vtit {
    text-align: center;
    min-height: 40px;
    line-height: 40px;
    font-size: 16px;
    background: #f7f7f7;
}
.indexvid .videolist img {
    max-width: 100%;
    max-height: 150px;
    border: none;
}
.indexvid .vtit {
    width: 100%;
    float: left;
    height: 37px;
    text-align: center;
    background: url(../images/movtit.png) top center no-repeat;
    color: #fff;
    background-size: contain;
    line-height: 22px;
}
}
@media screen and (max-width:415px){
.indexvid .videolist {
    width: 47%;
    float: left;
    margin: 0 5px;
    position: relative;
    margin-top: 10px;
    overflow: hidden;
    height: 140px;
}
.indexvid {
    width: 92%;
    margin: 24px auto;
}
.videolist {
    position: relative;
    float: left;
    width: 47%;
    height: 110px;
    margin-right: 5px;
    margin-left: 5px;
    margin-top: 15px;
    margin-bottom: 40px;
}
.videoed {
    display: none;
    width: 50px;
    height: 50px;
    position: absolute;
    left: 36%;
    top: 32%;
    z-index: 99;
    border-radius: 100%;
}
.vtit {
    text-align: center;
    min-height: 40px;
    line-height: 40px;
    font-size: 16px;
    background: #f7f7f7;
}
.indexvid .videolist img {
    max-width: 100%;
    max-height: 100px;
    border: none;
}
.indexvid .vtit {
    width: 100%;
    float: left;
    height: 37px;
    text-align: center;
    background: url(../images/movtit.png) top center no-repeat;
    color: #fff;
    background-size: contain;
    line-height: 22px;
}
}