.main{width:1200px;margin:0px auto; }

.top{ height:40px; line-height:40px; background-color:#f3f6ff; color:#647589; display:none }
.top .honour{ width:50%;}
.top span{ margin:0px 10px; color:#ffb606;}
.top .flink a{ color:#647589;}
.top .flink a:hover{ color:#ffb606;}


.header{ padding:30px 0; height:100px;background:url(../images/bg-header.png) bottom center no-repeat; width:100%;}
.header .logo{ margin-top:0px;}
.header .logo img{ height:100px;}
.header .slogan{ font-size:16px; margin-top:10px; height:20px; font-weight:bold; margin-right:-15px; overflow:hidden; margin-bottom:15px;color:#e50000; text-align:right;}
.header .slogan span{ margin:0px 10px;}
.header .serch{ width:25%; margin-right:30px; position:relative;}
.header .serch .searchtxt{ width:100%; height:40px; line-height:40px; border:1px solid #647589;border-radius:25px; padding-left:25px; color:#647589; position:absolute;}
.header .serch .btn{ position:absolute; right:-15px; top:52px;  width:30px; height:28px;}
@media only screen and (min-width: 321px) and (max-width: 1024px){
.header{ height:80px;background-size: 100%  100% ;}
.header .logo img{ height:80px;}
.header .slogan{ font-size:16px; margin-bottom:10px;margin-right:-20px; }
.header .serch{ width:30%; margin-right:30px; position:relative;}
}

.navbox{width:100%;margin:0px auto;height:50px;position:relative;z-index:9;background-color:#0061B4;}
.nav li{float:left;height:50px;width:12.5%;position:relative;}
.nav li a{float:left;display:block;height:50px;overflow:hidden; width:100%; }
.nav li a span{display:block;line-height:50px;font-size:20px; font-weight:bold; color:#fff;cursor:pointer;text-align:center; border-right:1px solid #297AC0;}
.nav li.home a span{ border-left:1px solid #297AC0;}
.nav li a span i{ margin:5px 10px 0 0;  font-weight:bold;}
@media only screen and (min-width: 321px) and (max-width: 1024px){
.nav li a span{width:116px;}
.nav li a span{display:block;line-height:50px;font-size:16px; font-weight:bold; color:#fff;cursor:pointer;text-align:center; border-right:1px solid #297AC0;}

}

.nav li.selected a span,.nav li a.selected span{color:#fff; background-color:#0084E9;}
.nav li.selected .submenu{display:block; display:none;}

.nav li .submenu{display:none;position:absolute;top:50px; clear:both; }
.nav li .submenu{border-style:solid;border-width:0px 1px 0px 1px;border-color:#D5D5D5; margin-left:-2px;width:100%;background:#FFF;}
.nav li .submenu li{padding:0;background:none;height:auto; width:100%;border-bottom:solid 1px #D5D5D5;}
.nav li .submenu li.last{border:none;}
.nav li .submenu li a{float:none;padding:0;text-align:center;height:40px;line-height:40px;background:none; color:#647589; font-size:14px; }
.nav li .submenu li a:hover{ color:#ffb606;}

/*banner*/
.home-banner{position: relative;z-index: 3px;width: 100%;height: 400px;overflow: hidden; background-color:#dedede;}
.home-banner .slider li{width: 1200px;height: 400px; margin:0px auto;}
.home-banner .sliderParent{position: relative;margin: 0 auto;}
.home-banner .sliderParent .bx-wrapper .bx-prev{width: 60px;height: 60px;display: block;text-indent: -9999px;position: absolute;top: 45%;z-index: 1000;background: url(../images/prev_btn.png) no-repeat;}
.home-banner .sliderParent .bx-wrapper .bx-next{width: 60px;height: 60px;display: block;text-indent: -9999px;position: absolute;top: 45%;z-index: 1000;background: url(../images/next_btn.png) no-repeat;}
.home-banner .sliderParent .bx-wrapper .bx-next:hover,
.home-banner .sliderParent .banner .bx-wrapper .bx-prev:hover{position: absolute;z-index: 1000;clear: both;opacity: 1;filter: alpha(opacity=100);}
.home-banner .sliderParent .opacity{background: #000;position: absolute;top: 0;height: 100%;z-index: 2;}
/*ebanner*/

/*广告图开始*/
#banner{width:100%;height:400px;overflow:hidden;}
#banner .bannerCon{width:1200px;height:400px;background:blue;margin:0px auto;position:relative;}
#banner .bannerCon .before{width:600px;height:400px;background:rgba(0,0,0,0.8);position:absolute;left:-600px;bottom:0px;z-index:1;}
#banner .bannerCon .before img{position:absolute;right:20px;top:150px;cursor:pointer;}
#banner .bannerCon .after{width:600px;height:400px;background:rgba(0,0,0,0.8);position:absolute;right:-600px;bottom:0px;z-index:1;}
#banner .bannerCon .after img{position:absolute;left:20px;top:150px;cursor:pointer;}
#banner .bannerCon .scroll{width:2000%;height:400px;position:relative;left:-1200px;}
#banner .bannerCon .scroll img{width:1200px;height:400px;float:left;}
#banner .bannerBut{width:100px;height:25px;position:absolute;left:550px;bottom:0px;}
#banner .bannerBut ul li{width:10px;height:10px;border-radius:10px;background:#666;margin:5px;float:left; cursor:pointer;}
#banner .bannerBut ul li.hover{background:#0061B4;}

/* flexslider */
.flexslider{position:relative;height:400px; overflow:hidden; width:1200px;  margin:0px auto;overflow:hidden;background:url(../images/loading.gif) 50% no-repeat;}
.slides{position:relative;z-index:1;}
.slides li{height:400px;}
.slides li h1{ position:absolute;bottom:15px; text-align:center; width:100%;text-align:center; font-weight:bold; font-size:26px; color:#fff; background-color: rgba(0, 0, 0, .0); text-shadow:3px 3px 6px #000;}
.slides li a{ display:block; width:100%; height:400px;}
.slides li h1 span{ margin:0px 10px;}
.flex-control-nav{position:absolute;bottom:15px;rigth:15px;z-index:2;width:98%;text-align:right;}
.flex-control-nav li{display:inline-block;width:14px;height:14px;margin:0 5px;*display:inline;zoom:1;}
.flex-control-nav a{display:inline-block;width:14px;height:14px;line-height:40px;overflow:hidden;background:url(../images/dot.png) right 0 no-repeat;cursor:pointer;}
.flex-control-nav .flex-active{background-position:0 0;}

.flex-direction-nav{position:absolute;z-index:3;width:100%;top:40%; } 
.flex-direction-nav li a{display:block;width:50px;height:50px;overflow:hidden;cursor:pointer;position:absolute;}
.flex-direction-nav li a.flex-prev{left:40px;background:url(../images/prev.png) center center no-repeat;}
.flex-direction-nav li a.flex-next{right:40px;background:url(../images/next.png) center center no-repeat;}


.category {border-bottom: 1px solid #C7DEF4;height:45px; line-height:45px; margin-bottom:10px;}
.category span{ float:right;}
.category li{height:45px;width: 90px;  text-align:center;font-weight:bold;float:left;cursor: pointer; transition: all .5s;-webkit-transition: all .5s;}
.category li a{font-size:18px; color:#333;}
.category li:hover{ border-bottom:2px solid #0061B4; color: #0061B4;}
.category li.active{border-bottom:2px solid #0061B4; color: #0061B4;}
.category li.active a{ color:#0061B4;}

.title{width: 100%;height: 45px;line-height:45px;border-bottom: 1px solid #C7DEF4; margin-bottom:10px;}
.title h1{height:45px;width: 100px; font-size:18px; text-align:center;font-weight:bold;border-bottom:2px solid #0061B4; color:#0061B4}
.title h1.t2{height:45px;width: 110px; text-align:center;font-weight:bold;border-bottom:2px solid #0061B4;}
.title span{ float:right;}

.News {padding:20px 0 10px 0; /*background-color:#f3f6ff;*/}
.News .w1{ width:33%; height:320px; padding-right:2%; float:left; border-right:1px solid #dedede;}
.News .w2{ width:33%; height:320px;  padding:0 2%; float:left; border-right:1px solid #dedede;}
.News .w3{ width:26%; height:320px; float:right;}


.News_list li{ font-size:14px; height:30px; line-height:30px; overflow:hidden;}
.News_list li span{ float:right; margin-left:15px; color:#999;}

.News_list2 li{ font-size:14px; height:35px; line-height:35px; overflow:hidden;}
.News_list2 li span{ float:right; margin-left:15px; color:#999;}


.notice li{padding: 3px 0; font-size:14px; line-height: 24px; border-bottom: 1px dashed #ddd; height: auto!important;}
.notice li span{margin-left: 10px; font-size: 13px;color:#999;}


.newspic{ margin:15px 0px;}
.newspic li{width:48%;
	float:left;
	position:relative;
	margin-bottom:10px;
	text-align:center;
	height:125px;
    overflow: hidden;}
.newspic li.right{ float:right; margin-right:0px;}
.newspic li .pic{ height:130px;overflow:hidden; display:block;}
.newspic li .pic img{ width:100%; }
.newspic li .txt{width:97%; height:30px; overflow:hidden; padding:0px 2%; display:block; position:absolute;_position:relative; bottom:0px;line-height:30px;font-size:13px; background:rgba(255, 255, 255, 0.8) none repeat scroll 0 0 !important;/*实现FF背景透明，文字不透明*/
filter:Alpha(opacity=80); background:#fff;/*实现IE背景透明*/}
.newspic li .txt a{color:#414141; position:relative;}
.newspic li a:hover{ color:#FF3300;}

.picnews li{ height:90px; margin-bottom:12px; overflow:hidden;}
.picnews li .picurl{ width:210px; height:90px; float:left; margin-right:15px;}
.picnews li a{ font-size:16px;overflow:hidden;}
.picnews li p{color:#666; font-size:14px; margin:8px 0;}
.picnews li span{color:#999; font-size:14px; line-height:150%;}

.Fast li{ width:32%; float:left; margin-bottom:5px; padding:10px 0; background-color:#647589; margin-right:2%; text-align:center; cursor:pointer;}
.Fast li:hover{ background-color:#ffb606; transition: all .5s;-webkit-transition: all .5s;}
.Fast li.f_r{ float:right; margin-right:0;}
.Fast li span{ display:block; margin-bottom:5px;}
.Fast li span img{ width:30px;}
.Fast li a{ color:#fff; font-size:14px;}
.Fast li a:hover{ color:#fff;}

.zwhz{ width:100%; height:100px; margin-top:3px;background:url(../images/zwhz.jpg) top center no-repeat;background-size:100% auto;}
.zwhz h1{  font-size:22px; line-height:30px;font-weight:bold;text-align:center;background-color: rgba(0, 0, 0, .4); width:100%; height:100%; }
.zwhz h1 a{ color:#fff; padding-top:20px; display:block;}
.zwhz h1 a:hover{ color:#ffb606;}

/*右侧悬浮 on*/
.m-toolbar{position:fixed; top: 280px; left: 0; z-index: 8; width: 60px;}
.g-toolbar{position: relative; height: 220px;}
.m-toolbtn{position: absolute; width: 60px; height: 220px; background: #0061B4;}
.m-toolbtn li{position: relative; height: 60px; text-align: center;}
.m-toolbtn li a{display: block; padding: 35px 0 3px; border-bottom: 1px solid #dedede; color: #fff; background-image: url(../images/icon-toolbar.png); background-repeat: no-repeat;}
.m-toolbtn li a:hover{background-color: #0084E9;}
.m-toolbtn li img{position: absolute; left: 60px; top: 0; display: none; width: 100px; height: 100px;}
.g-toolbar p{position: absolute; left: 0; bottom: 0; height: 47px; width: 60px; cursor: pointer; background-color: #0061B4; background-image: url(../images/icon-toolbar.png); background-position: 0 -420px;}
.g-toolbar p.u-active{background-position: 0 -467px;}
.m-toolbtn li.u-active a{background-color: #0084E9;}
.m-toolbtn li.u-tl01 a{background-position: 0 0;}
.m-toolbtn li.u-tl02 a{background-position: 0 -120px;}
.m-toolbtn li.u-tl03 a{background-position: 0 -180px;}
.m-toolbtn li.u-tl04 a{background-position: 0 -60px;}
.m-toolbtn li.u-tl05 a{background-position: 0 -240px;}
.m-toolbtn li.u-tl06 a{background-position: 0 -300px;}
.m-toolbtn li.u-tl07 a{background-position: 0 -360px;}
.m-toolbtn li.u-tl08 a{background-position: 0 -520px;}
/*右侧悬浮 end*/



/* footer */
.foot_nav{width:100%;background:#545454; overflow:hidden; width:1002px; margin:0px auto; padding-bottom:10px; display:none;}
.foot_ul,.foot_ulnone{width:12.5%;float:left;padding:0px;margin:5px 0px;}
.foot_ul{background:url(../images/foot_line.gif) no-repeat top right;}
.foot_ul li,.foot_ulnone li{color:#FFF;font-size:12px;line-height:24px;margin-left:33%; text-align:center;}
.foot_ul li a{ color:#dcdcdc;}
.foot_ul li a:hover{ color:#FF3300;}
.fontbold{ font-size:16px;}

#footer{ background-color:#666;padding:15px 0; margin-top:15px;}
#footer_main{line-height:30px;padding:0px 15px;}
#footer_main p{ float:left; }
#footer_main .select{ float:right;}
#footer_main .copyright{ float:left; color:#A9A999; font-size:13px; }
#footer_main .copyright a{  color:#A9A999;}
#footer_main .copyright a:hover{  color:#ff0000;}

@media only screen and (min-width: 321px) and (max-width: 1024px){
.navbox,.flexslider,.main,#footer_main,#footer,.News{width:1002px; overflow:hidden;}
.category li a{font-size:14px; color:#333;}
.select{ display:none}

}


/*
 *  视频播放器
 * */
.video-box {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  font-size: 0;
  z-index: 99999999999;
}
.video-box button {
  display: inline-block;
  padding: 0;
  border: 0 none;
  background: none;
  text-align: center;
  outline: none;
  cursor: pointer;
}
.video-box .video-button {
  display: inline-block;
  width: 36px;
  height: 36px;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.video-box .video-button i {
  font-size: 56px;
}
.video-box .video-button.video-btn-volume i {
  font-size: 20px;
}
.video-box .video-button.video-tooltip-toggle i {
  font-size: 20px;
}
.video-box .video-video {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.video-box .video-video video {
  position: relative;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
}
.video-box .video-container {
  width: 852px;
  min-height: 480px;
  max-height: 90vh;
  background: #000000;
  overflow: hidden;
  opacity: 0;
}
.video-box .video-container.video-ready {
  opacity: 1;
}
.video-box.quanping .video-container {
  width: 100%;
  height: 100%;
  max-height: 100%;
  position: relative;
  left: 0;
  top: 0;
  transform: none;
}
.video-box.video-playing .video-div.video-hide-ui .video-ui {
  -webkit-transform: translateY(39px);
  -ms-transform: translateY(39px);
  transform: translateY(39px);
}
.video-box.heibian .video-container {
  padding: 40px 0;
}
.video-box.heibian .video-div.video-hide-ui .video-ui {
  -webkit-transform: translateY(0px);
  -ms-transform: translateY(0px);
  transform: translateY(0px);
}
.video-box.heibian.quanping .video-container {
  padding: 0;
}
.video-box.hideui .video-div .video-ui {
  -webkit-transform: translateY(39px);
  -ms-transform: translateY(39px);
  transform: translateY(39px);
}
.video-box .i {
  font-family: none;
  height: 100%;
  width: 100%;
  background-size: 80%;
  background-position: center;
  background-repeat: no-repeat;
}
.video-box .i:before,
.video-box i:after {
  display: none !important;
}
.video-box .i-voice-on {
  background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2030%2030'%20%20%3E%3Cg%20%20stroke%3D'%23fff'%20stroke-width%3D'1'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M2%2C10L2%2C20L5%2C20L13%2C25L13%2C5L5%2C10L5%2C10Z'%2F%3E%3Cpath%20d%3D'M18%2C10C%2022%2C12%2022%2C18%2018%2C20'%20%2F%3E%3Cpath%20d%3D'M22%2C6C%2028%2C10%2028%2C20%2022%2C24'%20%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.video-box .i-voice-off {
  background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2030%2030'%20%20%3E%3Cg%20%20stroke%3D'%23fff'%20stroke-width%3D'1'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%20%3E%3Cpath%20d%3D'M2%2C10L2%2C20L5%2C20L13%2C25L13%2C5L5%2C10L5%2C10Z'%2F%3E%3Cpath%20d%3D'M18%2C11L27%2C20'%20%2F%3E%3Cpath%20d%3D'M18%2C20L27%2C11'%20%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.video-box .i-bofang {
  background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2030%2030'%3E%3Cg%20fill%3D'%23fff'%20stroke%3D'%23fff'%20stroke-width%3D'1'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M10%2C7L10%2C23L24%2C15z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.video-box .i-zhanting {
  background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2030%2030'%3E%3Cg%20fill%3D'%23fff'%20stroke%3D'%23fff'%20stroke-width%3D'1'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M7%2C7L7%2C23L11%2C23L11%2C7z'%2F%3E%3Cpath%20d%3D'M20%2C7L20%2C23L24%2C23L24%2C7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.video-box .i-quanping {
  background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2030%2030'%20%20%3E%3Cg%20%20stroke%3D'%23fff'%20stroke-width%3D'1'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%20%3E%3Cpath%20d%3D'M6%2C10L6%2C6L10%2C6'%2F%3E%3Cpath%20d%3D'M6%2C21L6%2C25L10%2C25'%2F%3E%3Cpath%20d%3D'M20%2C6L24%2C6L24%2C10'%2F%3E%3Cpath%20d%3D'M20%2C25L24%2C25L24%2C21'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.video-box .i-suoxiao {
  background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2030%2030'%20%20%3E%3Cg%20%20stroke%3D'%23fff'%20stroke-width%3D'1'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%20%3E%3Cpath%20d%3D'M6%2C10L10%2C10L10%2C6'%2F%3E%3Cpath%20d%3D'M6%2C21L10%2C21L10%2C25'%2F%3E%3Cpath%20d%3D'M20%2C6L20%2C10L24%2C10'%2F%3E%3Cpath%20d%3D'M20%2C25L20%2C21L24%2C21'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.video-bg {
  position: absolute;
  height: 100%;
  width: 100%;
  background: #000;
  opacity: .9;
}
.video-div {
  background: #000;
  font-size: 0;
  letter-spacing: -1px;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.video-ui {
  position: absolute;
  width: 100%;
  height: 41px;
  background-color: rgba(0, 0, 0, 0.8);
  left: 0;
  bottom: 0;
  z-index: 6;
  letter-spacing: .25px;
  -webkit-transition: transform 0.3s ease;
  -o-transition: transform 0.3s ease;
  -ms-transition: transform 0.3s ease;
  -moz-transition: transform 0.3s ease;
  transition: transform 0.3s ease;
  -webkit-transform: translateY(0px);
  -o-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -moz-transform: translateY(0px);
  transform: translateY(0px);
}
.video-loading-pulse {
  position: absolute;
  width: 6px;
  height: 24px;
  top: 50%;
  left: 50%;
  background-color: rgba(255, 255, 255, 0.2);
  -webkit-animation: pulse 750ms infinite;
  animation: pulse 750ms infinite;
  -webkit-animation-delay: 250ms;
  animation-delay: 250ms;
}
.video-loading-pulse:before,
.video-loading-pulse:after {
  content: '';
  position: absolute;
  display: block;
  height: 16px;
  width: 6px;
  background: rgba(255, 255, 255, 0.2);
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-animation: pulse 750ms infinite;
  animation: pulse 750ms infinite;
}
.video-loading-pulse:before {
  left: -12px;
}
.video-loading-pulse:after {
  left: 12px;
  -webkit-animation-delay: 500ms;
  animation-delay: 500ms;
}
@keyframes pulse {
  50% {
    background: white;
  }
}
.video-loading {
  opacity: 1;
  color: #2c97f6;
  font-size: 0;
  overflow: hidden;
  box-shadow: 0px 0px 0px 3600px #000;
  background: #000;
  width: 30px;
  height: 30px;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s;
}
.video-loading i {
  border-radius: 50%;
  width: 24px;
  height: 24px;
  display: block;
  border: 0.25rem solid rgba(255, 255, 255, 0.2);
  border-top-color: white;
  -webkit-animation: adeg 1s infinite linear;
  -o-animation: adeg 1s infinite linear;
  -ms-animation: adeg 1s infinite linear;
  -moz-animation: adeg 1s infinite linear;
  animation: adeg 1s infinite linear;
}
.video-loading .i-loading:before {
  display: none;
  opacity: 0;
  visibility: hidden;
}
.video-loading.yihuanchun {
  opacity: 0;
}
@keyframes adeg {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.video-close {
  position: absolute;
  top: calc(52px + 2%);
  right: 5%;
  width: 30px;
  height: 30px;
  cursor: pointer;
  background: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2030%2030'%3E%3Cg%20fill%3D'%23fff'%3E%3Cpath%20d%3D'M0%2C1L1%2C0L30%2C29L29%2C30z'%2F%3E%3Cpath%20d%3D'M29%2C0L29%2C0L30%2C1L1%2C30L0%2C29z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
}
.video-bofang.f-czspjuzhong {
  z-index: 2;
  font-size: 0;
}
.video-bofang.f-czspjuzhong i {
  display: block;
  border-radius: 50%;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.8);
  color: #fff;
  width: 60px;
  height: 60px;
  cursor: pointer;
  line-height: 62px;
  font-size: 66px;
  -webkit-transition: transform 1s;
  -o-transition: transform 1s;
  -ms-transition: transform 1s;
  -moz-transition: transform 1s;
  transition: transform 1s;
}
.video-hide {
  z-index: 0 !important;
}
.video-hide i {
  opacity: 0;
  -webkit-transform: scale(3);
  -o-transform: scale(3);
  -ms-transform: scale(3);
  -moz-transform: scale(3);
  transform: scale(3);
  will-change: transform, opacity;
  z-index: 0;
}
.video-progress {
  display: block;
  position: absolute;
  width: 100%;
  bottom: 36px;
  height: 5px;
  cursor: pointer;
  -webkit-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
  z-index: 2;
}
.video-progress:hover .video-progress-hover,
.video-progress:hover .video-tooltip-time {
  opacity: 1;
}
.video-tooltip-time {
  width: 46px;
  position: absolute;
  height: 20px;
  z-index: 5;
  left: 0;
  right: 0;
  bottom: 8px;
  opacity: 0;
  -webkit-transition: opacity 0.5s;
  -o-transition: opacity 0.5s;
  -ms-transition: opacity 0.5s;
  -moz-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
.video-tooltip-time .video-tinytip-content {
  margin-left: -23px;
}
.video-tooltip-time .video-text {
  background: rgba(0, 0, 0, 0.5);
  padding: 2px;
  border-radius: 2px;
}
.video-tinytip .video-tooltip-content {
  display: inline-block;
  padding: 0 4px;
  color: rgba(255, 255, 255, 0.5);
  font-size: 10px;
  line-height: 20px;
  text-align: center;
}
.video-progress-padding {
  position: absolute;
  width: 100%;
  height: 16px;
  bottom: 0;
  z-index: 40;
  cursor: pointer;
}
.video-progress-list {
  position: relative;
  top: -1px;
  z-index: 39;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.2);
  -webkit-transform: scaleY(0.6);
  -ms-transform: scaleY(0.6);
  transform: scaleY(0.6);
  transition: -webkit-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
  transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1);
  transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1), -webkit-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
}
.video-progress-play,
.video-progress-buffer,
.video-progress-hover {
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
}
.video-progress-buffer {
  z-index: 33;
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.video-progress-hover {
  z-index: 34;
  background-color: rgba(255, 255, 255, 0.5);
  opacity: 0;
  -webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
  -o-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
  -ms-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
  -moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
  transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
}
.video-progress-play {
  z-index: 35;
  background-color: #2c97f6;
}
.video-progress-handle {
  width: 13px;
  height: 13px;
  position: absolute;
  top: 50%;
  right: -6.5px;
  margin-top: -6.5px;
  border-radius: 50%;
  background-color: #2c97f6;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
  transition: -webkit-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
  transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1);
  transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1), -webkit-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
}
.video-progress-padding:hover + .video-progress-list {
  -webkit-transform: scaleY(1);
  -ms-transform: scaleY(1);
  transform: scaleY(1);
}
.video-progress-padding:hover + .video-progress-list .video-progress-handle {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.video-controls-buttons {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 36px;
  width: 100%;
  padding: 0 10px;
  z-index: 3;
}
.video-time-panel {
  font-size: 12px;
  color: #777;
  display: inline-block;
  vertical-align: top;
  height: 36px;
  padding: 0 5px;
  line-height: 36px;
  letter-spacing: .25px;
}
.video-time-panel-current {
  color: #DEDEDF;
}
.video-fullscreen {
  float: right;
}
.video-definition {
  float: right;
  width: 55px;
  height: 36px;
  position: relative;
}
.video-definition .video-button {
  width: 100%;
}
.video-definition .video-button span {
  background: #fff;
  color: #333;
  font-size: 14px;
  padding: 2px 5px;
}
.video-definition .video-tooltip-content {
  width: 80px;
  left: 50%;
  margin-left: -40px;
  display: none;
  background: rgba(0, 0, 0, 0.5);
}
.video-definition:hover .video-tooltip-content {
  position: absolute;
  bottom: 35px;
  color: #aaa;
  display: block;
  z-index: 6;
}
.video-menu .video-menu-item {
  display: block;
  width: 100%;
  line-height: 36px;
  font-size: 14px;
  text-align: center;
  white-space: nowrap;
  padding: 0 12px;
  cursor: pointer;
  position: relative;
  height: 38px;
  background: -webkit-linear-gradient(top, transparent 0, transparent 50%, rgba(255, 255, 255, 0.1) 50%) center bottom no-repeat;
  background-size: 80% 1px;
}
.video-menu .video-menu-item:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
}
.video-menu .video-menu-item.video-active {
  color: #FF8F00;
}
.video-volume {
  float: right;
  position: relative;
}
.video-popup .video-popup-content {
  transform: scaleY(0);
  bottom: 41px;
  position: absolute;
}
.video-popup .video-popup-content:after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 50%;
  margin-left: -5px;
  border: 5px solid transparent;
  border-top-color: rgba(0, 0, 0, 0.5);
}
.video-popup:hover .video-popup-content {
  -webkit-transform: scaleY(1);
  -o-transform: scaleY(1);
  -ms-transform: scaleY(1);
  -moz-transform: scaleY(1);
  transform: scaleY(1);
}
.video-volume-slider {
  left: 0;
  width: 36px;
  height: 100px;
  cursor: pointer;
  background: rgba(0, 0, 0, 0.8);
}
.video-tinytip-tiao {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.video-volume-range {
  position: absolute;
  left: 16px;
  top: 10px;
  width: 4px;
  height: 80px;
  background-color: rgba(0, 0, 0, 0.2);
}
.video-volume-range-current {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 50%;
  background-color: #2c97f6;
}
.video-volume-handle {
  position: absolute;
  top: 0;
  left: -4px;
  width: 12px;
  height: 3px;
  background-color: #fff;
}
@media (max-width: 998px) {
  .video-box .video-container {
    width: 80vw;
    max-height: 80vh;
    min-height: 44.9vw;
  }
}
@media (max-width: 468px) {
  .video-box .video-container {
    width: 100vw;
    min-height: 54.9vw;
  }
  .video-loading i {
    font-size: 26px;
  }
  .video-definition {
    display: none;
  }
}
/*
 * 视频结尾
 * */
.f-czspjuzhong {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}