* {
	margin:0px;
	padding:0px;
	touch-action:pan-y;
}
body{}
li{ list-style:none;}
.app_wrap {
 width:100%;
height: 100%;
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    overflow: hidden;
    margin: 0 auto;
}

.app {
	 width:100%;
height: 100%;
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    overflow: hidden;
    margin: 0 auto;
    background-color: #0E0F1A;
    display: flex; 
    align-items: center; 
    justify-content: center;
}
.bom {
	position:absolute;
	top:730px;
	right:0px;
	bottom:0px;
	left:0px;
	overflow:hidden;
	margin:0 auto;
	font-size:12px;
}
/*#player {
	width:348px;
	height:600px;
	margin-top:20px;
	margin-bottom:20px;
	margin-left:20px;
	float:left;
	z-index:100;
}*/
#player {
	width:100%;
	height:auto;
	z-index:100;
	animation-duration:2s;
}

.xhms { cursor:pointer; width:51px; height:19px; background:url(images/lianbo_ico.png) no-repeat 0 0; background-size:51px; box-sizing:border-box; border:0; padding:0; margin:0; font-size:12px; padding-left:14px; line-height:20px; color:#555;}
button:focus{outline:0;}
/*.xhms:hover {
	background:-webkit-gradient( linear,left top,left bottom,color-stop(0.05,#c62d1f),color-stop(1,#f24537) );
	background:-moz-linear-gradient( center top,#c62d1f 5%,#f24537 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c62d1f',endColorstr='#f24537');
	background-color:#c62d1f;
}
.xhms:active {
	position:relative;
	top:1px;
}*/
.zdlb {cursor:pointer;width:51px; height:19px; background:url(images/lianbo_ico.png) no-repeat 0 -20px; background-size:51px; box-sizing:border-box; border:0; padding:0; margin:0; font-size:12px; padding-left:6px; text-align:left; line-height:20px; color:#fff;}
/*.zdlb:hover {
	background:-webkit-gradient( linear,left top,left bottom,color-stop(0.05,#77a809),color-stop(1,#89c403) );
	background:-moz-linear-gradient( center top,#77a809 5%,#89c403 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#77a809',endColorstr='#89c403');
	background-color:#77a809;
}
.zdlb:active {
	position:relative;
	top:1px;
}*/
.vid-wrap{
    position:relative;
}


.m-play_ico{ width:48px; height:48px; background:url(images/play_ico.png) no-repeat center center; border:0; line-height:999; overflow:hidden; position:absolute;  left:50%; top:50%; margin-left:-24px; margin-top:-24px; z-index:150;}

.m-full_ico{ display:none; cursor:pointer; position:absolute; bottom:-30px; background:none; border:1px solid #fff; color:#fff; text-align:center; font-size:12px; width:44px; height:20px; border-radius:10px; left:50%; margin-left:-22px; opacity:0.8;}



.right_bar{ position:absolute; right:10px; bottom:100px;}
.right_bar li.vid_logo{  position:relative; width:50px; margin-bottom:18px; z-index:99999; margin-left:-5px;animation:turn 6s linear infinite;}
.right_bar li.vid_logo img{ box-shadow: 2px 2px 5px rgba(0,0,0,0.15); border-radius:100%;}
  .pause {
    animation-play-state: paused!important;
  }

.right_bar li{ list-style:none; width:40px; margin-bottom:8px;}
.right_bar li img{ max-width:100%; height:auto;}

.bottom_bar{position:absolute; left:0; width:100%; padding-left:20px; height:50px; color:#fff; bottom:0px;}
.bottom_bar h1{ font-size:16px;}
.bottom_bar h2{ font-size:12px;}
.bottom_bar h1,h2{ margin:0!important; padding:0!important;}


.top_bar{ box-sizing:border-box; padding:10px; position: absolute; z-index:99; top:0; left:0;  display: flex;    justify-content: space-between;    flex-wrap: wrap; width:100%;}
.top_bar .back_btn{ width:20px; height:20px;}
.top_bar .back_btn img{ width:100%; height:auto;}

.lit-container{ position:relative; top:20px;}
.minimal {
   position:absolute; top:0;right:0;
  display: grid;
  align-content: center;
  justify-content: center;
  border-radius: 5px;
}

.element-2 {
  width: 50px;
  height: 50px; border-radius:100%;
}
.lit-container:hover .lit,
.lit-container:focus-within .lit {
  background: rgba(153,153,153,0.2) !important;
}
/* lit --------------------------- */
[data-lit-hue] {
  position: relative;
}

.blur {
    filter: url(blur.svg#blur); /* IE10, IE11 */
     
    -webkit-filter: blur(5px); /* Chrome, Opera */
       -moz-filter: blur(5px);
        -ms-filter: blur(5px);   
            filter: blur(5px);
     
    filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=5, MakeShadow=false); /* IE6~IE9 */
}

span.lit {
  height: 10px;
  width: 10px;
  border-radius: 50%;
  position: absolute;
  pointer-events: none;
  transform: translate(-50%, -50%);
  animation: blow 2s ease-in infinite;
  transition: all 400ms ease;
}
@-moz-keyframes blow {
  0% {
    transform: translate(-50%, -50%) scale(0.1);
    opacity: 0;
  }
  10% {
    transform: translate(-50%, -50%);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -40vh);
    opacity: 0;
  }
}
@-webkit-keyframes blow {
  0% {
    transform: translate(-50%, -50%) scale(0.1);
    opacity: 0;
  }
  10% {
    transform: translate(-50%, -50%);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -20vh);
    opacity: 0;
  }
}
@-o-keyframes blow {
  0% {
    transform: translate(-50%, -50%) scale(0.1);
    opacity: 0;
  }
  10% {
    transform: translate(-50%, -50%);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -20vh);
    opacity: 0;
  }
}
@keyframes blow {
  0% {
    transform: translate(-50%, -50%) scale(0.1);
    opacity: 0;
  }
  10% {
    transform: translate(-50%, -50%);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -20vh);
    opacity: 0;
  }
}


    /* 
      turn : 定义的动画名称
      1s : 动画时间
      linear : 动画以何种运行轨迹完成一个周期
      infinite :规定动画应该无限次播放
     */
    @keyframes turn{
      0%{-webkit-transform:rotate(0deg);}
      25%{-webkit-transform:rotate(90deg);}
      50%{-webkit-transform:rotate(180deg);}
      75%{-webkit-transform:rotate(270deg);}
      100%{-webkit-transform:rotate(360deg);}
    }

.load_wrap{ position: fixed; bottom:20px; width:100%;display:none;}
	.loading{
				width: 60px;
		height: 6px;
		margin: 0 auto;
	}
	.loading span{
		display: inline-block;
		width: 6px;
		opacity:0;
		height: 100%;
		margin-right: 3px;
		border-radius: 50%;
		background: #fff;
		-webkit-animation: load 1.04s ease infinite;
	}
	.loading span:last-child{
		margin-right: 0px; 
	}
	@-webkit-keyframes load{
		0%{
			opacity: 0;
		}
		50%{
			opacity: 0.4;
		}
		100%{
			opacity: 0;
		}
	}
	.loading span:nth-child(1){
		-webkit-animation-delay:0.13s;
	}
	.loading span:nth-child(2){
		-webkit-animation-delay:0.26s;
	}
	.loading span:nth-child(3){
		-webkit-animation-delay:0.39s;
	}
	.loading span:nth-child(4){
		-webkit-animation-delay:0.52s;
	}
	.loading span:nth-child(5){
		-webkit-animation-delay:0.65s;
	}

.play_btn, .right_part{ display: none;}

/*电脑 */
@media screen and (min-width:1200px) {
	.m-video_module{ width:100%; height:900px; padding-top:80px; margin-top:80px; min-width:1200px; background:#ffffff url(images/pc_bg.jpg) no-repeat center top;}
	.m-video_module .content{ width:1200px; margin:0 auto;}
	
    .app_wrap{ position:relative;
  border-radius: 50px; float:left;
  background:#fff url(images/mobile_demc.png) no-repeat center top;
  box-shadow: 0px 10px 40px 0px rgba(173, 173, 173, 0.35);
  width: 381px; box-sizing:border-box;
  height: 696px; padding:50px 24px 20px 24px;
		}
    .app { border-radius:6px; boder-radius:10px;
         width:344px; height:606px; top:50px;
		 
    }
	.back_btn,.vid_tel{ visibility:hidden;}
	
	.right_part{ display:block; width:800px; height: auto; float: right;}
 	.right_part .title{ text-align:right; padding-top:90px; margin-bottom:40px; padding-right:30px;}
 	.right_part h1{ font-size:36px; font-weight:900; color:#413e3e;}
 	.right_part h2{ font-size:18px;font-weight:400; color:#939393;}
	#video_list{}
	#video_list li{ cursor:pointer; width:236px; float:left; margin-left:19px; margin-bottom:20px;}
	
	#video_list li:hover .thumb .bg_blue{  
    filter: url(blur.svg#blur); /* IE10, IE11 */
	  -webkit-filter: blur(2px); /* Chrome, Opera */
       -moz-filter: blur(2px);
        -ms-filter: blur(2px);   
            filter: blur(2px);
     
    filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=2, MakeShadow=false); /* IE6~IE9 */ }
	.video_list_wrap{ width:100%; height:508px; overflow:auto;}
	#video_list li .thumb .bg_play{ z-index:100; width:48px; height:48px; left:50%; margin-left:-24px; top:60px;}
	#video_list li .thumb .bg_center{ z-index:99;object-fit: contain;}
	#video_list li .thumb{ width:236px; height:173px; position:relative; overflow:hidden;}
	#video_list li .thumb img{width:236px; height:173px; position:absolute; left:0; top:0;}
	#video_list li a{ text-decoration:none;}
	#video_list li h2{ font-size:14px; color:#413e3e; font-weight:bold; margin:15px 0; height:40px; line-height:20px; overflow:hidden;}
	.play_btn{ display:block; position: absolute; bottom:5px; z-index:9999; text-align:center; width:300px; left:50%; margin-left:-150px;}
	.play_btn a{ color:#555; text-decoration:none; font-size:14px; font-weight:bold; display:inline-block; padding:5px 10px;}
	.
	
}

@media screen and (max-width: 768px) {
/*.app{ max-width:100%; width:100%;
height: 100%;
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    overflow: hidden;
    margin: 0 auto;
    background-color: #0E0F1A;
    display: flex; 
    align-items: center; 
    justify-content: center;

}*/

/*.vid-wrap video{
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%
}*/


.m-video_module{
  position: fixed;
  height: 100vh;
  width: 100%;
  z-index: 999999999999999999999999;

}

#player{width: 100%;
    height: auto;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    float: none;
    z-index: 100;
	}

.box{ display:none;  position:relative; z-index:99999; background:none;}

}