body,hr, p, blockquote,h1,h2,h3,h4,h5,h6, /* structural elements 结构元素 */
dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
pre, /* text formatting elements 文本格式元素 */
form, fieldset, legend, button, input, textarea, /* form elements 表单元素 */
th, td /* table elements 表格元素 */ {
    margin: 0;
    padding: 0;
}

.clear { *zoom :1;}
.clear:after{ content:"."; clear:both; display:block; height:0; overflow:hidden; visibility:hidden;}
.pull-left { float:left;}
.pull-right { float:right;}
.adapt_screen{position: relative; width: 100%; margin: 0 auto;}
.isshow{display: block !important; z-index: 2;}
.isvis{visibility:visible !important;}
/*.awith{width: 21% !important;}*/
h2{font-weight: 700;font-size: 28px;}
section p{font-size: 16px;}
ul li{list-style: none;}
em{display: block;}
span{display:inline-block;}
img{display: block;}
video {display: block; object-fit:cover;}
html,body{overflow-x: hidden;position: relative;}
.isshow{display: block!important;}

/* pocket头部 */
.vlog img{width: 100%;}
.vlog .vlog-des{width: 23%; position: absolute; top: 40%; left: 55.2%;}
.vlog-des h2{font-size: 30px; color: #fff; margin:25px 0;}

.vlog-des .listss li{float: left; height: 120px; width: 190px; position: relative;} 
.vlog-des .listss li .list-shade{cursor: pointer; position: absolute; height: 120px; width: 190px; background: rgba(0,0,0,0.4);}
.vlog-des .listss li img{cursor: pointer; height: 28px; width: 28px; position: absolute; left: 50%; top: 50%; margin-left: -14px; margin-top: -14px;}
.vlog-des .listss li .list-shade:hover{background: rgba(0,0,0,0); opacity: 0.6;}
.vlog-des .listss li:nth-of-type(1){margin-right: 10px; background: url(../divideo1.html) no-repeat;}
.vlog-des .listss li:nth-of-type(2){background: url(../divideo2.html) no-repeat;}

/* 颜色 */
.color img{width: 100%;}
.color-des{position: absolute; top: 24%; left: 17.2%; width: 550px; color: #fff; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.color-run{animation: des 2s forwards;}
.color-des p{line-height: 30px; font-size: 16px;}
.color .color-vlog{width: 20%; position: absolute; top: 7.5%; left: 56.25%;}
.color .color-vlog img{display: none;}
.color-des .color-cir{margin-top: 120px;}
.color-des .color-cir .c-cir{float: left; width: 140px; text-align: center;}
.color-des .color-cir .cir-1{width: 40px; height: 40px; background: #fcbebf; border: 3px solid #fff; border-radius: 50%; cursor: pointer; margin:0 auto;}
.color-des .color-cir .cir-2{width: 40px; height: 40px; background: #000; border: 3px solid #fff; border-radius: 50%; cursor: pointer; margin:0 auto;}




/* 轮播图 */
.swiper-container {
    width: 100%;
    height: 100%;
    position: relative;
}
.swiper-slide {
    position: relative;
    text-align: center;
    font-size: 18px;
    background: #fff;

    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.swiper-slide .sw-des{position: absolute; top: 55%; width: 400px; left: 62%; color: #fff; text-align: left;}
.swiper-slide .sw-des h2{margin-bottom: 20px;text-shadow: 1px 1px 1px #333;}
.swiper-slide .sw-des p{line-height: 30px; font-size: 16px;text-shadow: 1px 1px 1px #333;}

.swiper-slide-active .animate {
-webkit-animation-duration: 1.5s;
animation-duration: 1.5s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.swiper-slide-active .m-bounceInUp {

-webkit-animation-name: bounceInUp;

animation-name: bounceInUp;

}

.slide1 .sw-des{position: absolute;left: 68%;}
.slide2 .sw-des{position: absolute;left: 76%;top: 30%;}
.slide4 .sw-des{position: absolute; top: 20%;}
.slide3 .sw-des{position: absolute; left: 12%;}

.swiper-des{position: absolute; top: 37%; left: 50.3%; text-align: center; width: 500px; color: #000; z-index: 1000;}
.swiper-des h2{margin-bottom: 20px;}
.swiper-des p{line-height: 30px; font-size: 16px;}

/* 调平 */
.levelling-des{position: absolute; top: 33.5%; left: 25%; text-align: center; width: 360px; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.levelling-run{animation: des 2s forwards;}
.levelling-des h2{margin-bottom: 20px;}
.levelling-des p{line-height: 30px; font-size: 16px;}

/* 横竖屏 */
.heng img{width: 100%;}
.heng-des{position: absolute; top: 37.5%; width: 700px; text-align: center; left: 48%; color: #000; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.heng-run{animation: des 2s forwards;}
.heng-des h2{margin-bottom: 20px;}
.heng-des p{line-height: 30px; font-size: 16px;}

/* 原生相机 */
.support img{width: 100%;}
.support-des{position: absolute; top:35%; left: 12.5%; color: #000; width: 410px; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.support-run{animation: des 2s forwards;}
.support-des h2{margin-bottom: 20px;}
.support-des p{line-height: 30px; font-size: 16px;}

/* 轻巧机身 */
.deft img{width: 100%;}
.deft-des{position: absolute; top: 28%; left: 17.1%; width: 440px; color: #fff; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.deft-run{animation: des 2s forwards;}
.deft .p1{position: absolute; top: 6%; left: 46%; color: #fff;}
.deft .frame{position: absolute; bottom: 12.75%; left: 17.1%; color: #fff;}
.deft .frame span{text-indent: 20px;}
.deft .frame p{font-size:30px; font-weight: 700; text-indent: 20px;}
.deft .frame em{width: 4px; height: 60px; background: #fff; position: absolute; left: 0; top: 0;}
.deft-des h2{margin-bottom: 20px;}
.deft-des p{line-height: 30px; font-size: 16px;}

/* 延时追踪 */
.trace img{width: 100%;}
.trace-des{position: absolute; top: 57.5%; width: 720px; left: 50%; margin-left: -360px; color: #fff; text-align: center; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.trace-run{animation: des 2s forwards;}
.trace-des h2{margin-bottom: 20px;text-shadow: 1px 1px 1px #333;}
.trace-des p{line-height: 30px; font-size: 16px;text-shadow: 1px 1px 1px #333;}

/* 更多玩法 */
.moreplay{padding: 50px 0; text-align: center;}



/* 续航 */
.xuhang-des{position: absolute; top: 15.6%; width: 455px; left: 28.6%; color: #fff; text-align: center; color: #fff; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.xuhang-run{animation: des 2s forwards;}
.xuhang-des h2{margin-bottom: 20px;}
.xuhang-des p{line-height: 30px; font-size: 16px;}
.xh-hours h3{font-size: 100px;}
.xh-hours span{font-size: 24px; line-height: 36px;}
.xh-hours em{font-size: 16px; font-style: normal;}

/* 希区柯克 */
.bianjiao-des{position: absolute; top: 8.25%; width: 1080px; left: 50%; margin-left: -540px; text-align: center; color: #fff; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.bianjiao-des h2{margin-bottom: 20px;}
.bianjiao-des p{text-shadow: 1px 1px 1px #333;}
.bianjiao-run{animation: des 2s forwards;}
/* 宣传视频 */
.body-shade{cursor: pointer; display: none; top: 0; position: fixed; height: 100%; width: 100%; background: rgba(0,0,0,0.5); z-index: 100;}
.publicity-video,.publicity-video2{position: fixed;display: none; left: 50%; top: 50%; margin-left: -480px; height: 540px; width:960px; margin-top: -299px; z-index: 100;}
.publicity-video video,.publicity-video2 video{width: 100%;}

@media screen and (min-width: 1200px) and (max-width:1599px) {
    .color-des .color-cir{margin-top: 60px;}
    .color-des{width: 500px; left: 15%; top: 12%;}
    .levelling-des{left: 15%;}
    .vlog .vlog-des{top: 34%;}
    .heng-des{left: 44%; width: 640px;}
    .support-des{left:6%;}
    .deft .frame{bottom:3.75%; left: 8%;}
    .xuhang-des{left: 20%;}
    .deft-des{top: 10%; left: 8%;}
    .slide2 .sw-des{position: absolute;left: 58%;}

}

/*字推移*/
@keyframes des{
	from{
		-webkit-transform: translateY(35px);
		-ms-transform: translateY(35px);
		-o-transform: translateY(35px);
		transform: translateY(35px);
		filter:alpha(opacity=0);  
	    -moz-opacity:0;  
	    -khtml-opacity: 0;
      	opacity: 0;  
	}
	to{
		-webkit-transform: translateY(0px);
		-ms-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);
		filter:alpha(opacity=100);  
	    -moz-opacity:1;  
	    -khtml-opacity: 1;
      	opacity: 1; 
	}
}

.levelling img,.bianjiao img,.swiper-slide img,.xuhang img{width:100%;}

