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%; max-width: 1920px; margin: 0 auto;}
.isshow{display: block !important;}
/*.awith{width: 21% !important;}*/
h2{font-weight: 300 !important;font-size: 28px !important;}
section p{font-size: 16px;}
ul li{list-style: none;}
em{display: block;}
span{display:inline-block;}
img{display: block;}
video {display: block;}
html,body{overflow-x: hidden;position: relative;}
.cir{width: 8px !important; height: 8px !important; border-radius: 50% !important;}
.table-back{background: #00a0ea;}
/* 头图 */
.header-g6p video{width: 100%;}
.header-g6p img{width: 100%;}
.header-g6p .shade{position: absolute; top: 0; height: 100%; width: 100%; background: rgba(0,0,0,0.3);}
.header-g6p .g-logo{width: 20.4%; position: absolute; left: 39.6%; top: 17.1%;z-index: 10; }
.header-g6p .header-des{position: absolute; top: 30%; left: 50%; color: white; text-align: center; width: 600px; margin-left: -300px; z-index: 10; }
.header-g6p .header-des h3{font-size: 40px; line-height: 70px; height: 70px; color: white;}
.header-g6p .header-des p{font-size: 20px; color: white;}
.header-g6p .header-play{ font-size: 14px !important; cursor: pointer; position: relative; text-decoration: underline; width: 40%; margin: 0 auto; text-align: center;}
.header-g6p .header-play:hover{color: #6cf;}
.header-g6p .header-play .h-header-play{width: 20px!important; height: 20px !important; position: absolute; left: 2%;}
/* 小机身 */
.small img{width: 100%;}
.small-des{position: absolute; width: 860px; text-align: center; top: 1.8%; left: 50%; margin-left: -430px;}
.small-des h2{color: #4b4b4b; height: 60px; line-height: 60px;}
.small-des p{line-height: 30px;}
.small .small-list{width: 840px; bottom: 6.25%; left: 50%; margin-left: -420px; position: absolute;}
.small .small-list li{margin-right: 120px; float: left;}
.small .small-list li:nth-last-of-type(2){margin-right:50px;}
.small .small-list li:nth-last-of-type(1){margin-right:0px;}
.small .small-list li p{height: 56px; line-height: 56px; font-size: 20px;}
.small .small-list li h3{color:#4c4c4c; font-size: 40px;}
.small .small-list li h3 span{font-size: 14px; width: 150px; line-height: 20px;}

.small p{font-size: 14px;}
.small .smp1{position: absolute; top: 21%; left: 51.8%;}
.small .smp2{position: absolute; top: 53.4%; left: 54%;}
.small .smp3{position: absolute; top: 25.8%; left: 54%;}
.small .smp4{position: absolute; top: 21.4%; left: 56.2%;}
.small .smp5{position: absolute; top: 61.4%; left: 55.6%;}

.small .sma2{position: absolute; width: 100%; bottom: 28%; z-index: 200;}
.small .sma3{position: absolute; bottom: 25.3%; width: 44.5%; left: 27.9%;}
.small .sma3 img{width: 100%;}
.bkrun{animation: bkrun 5s forwards infinite;}
.small .sma3 .bk{position: absolute; transform: translateX(0%); width: 100%; height: 100%; background: #fff; z-index: 10;}


.small-des p{color: #4c4c4c; font-size: 16px;}
@media screen and (min-width: 1200px) and (max-width:1599px) {
    .small .small-list{width: 640px; bottom: 6.25%; left: 50%; margin-left: -320px; position: absolute;}
    .small .small-list li p{font-size:16px;}
    .small .small-list li h3{font-size: 30px;}
    .small .small-list li h3 span{font-size: 12px;}
    .small p{font-size: 12px;}
    .small-des h2{color: #4b4b4b; height: 40px; line-height: 40px;}
}

.video-bg video{object-fit:fill; height: 100%; width: 100%;}
.display-box {
  position: relative;
  width: 100%;
  background-color: rgba(123, 124, 125, .6);
  height: 800px;overflow:hidden;
}
@media screen and (min-width: 1200px) and (max-width:1599px) {
    .display-box {height: 600px}
}

.fy-list,
.v-func-list {
  display: block;
  position: absolute;
  top: 0;
  left: 0
}

.fy-list {
  width: 100%;
  height: 100%;
  z-index: 9
}

.fy-list:after,
.v-func-list:after {
  content: '';
  display: block;
  height: 0;
  clear: both
}

.fy-list .fy-item {
  height: 100%;
  width: 25%;
  float: left;
  position: relative;
  transition: all .5s ease-in-out;
  cursor: pointer;
}

.fy-list .fy-item .fy {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  transition: all .5s ease-in-out;
  z-index: 2
}

.fy-list .fy-item .s-bg {
  opacity: 1;
  transition: all .5s ease-in-out;
  z-index: 1
}

.fy-list .fy-item .text,
.fy-list .fy-item .top-text {
  width: 100%;
  transition: all .3s ease-in-out;
  position: absolute;
  z-index: 3
}

.fy-list .fy-item .top-text {
  bottom: 8%;
  text-transform: uppercase;
  left: 15%;
  opacity: 0
}

.fy-list .fy-item .top-text .describe {
  font-size: 24px;
  color: #fff;
  font-family: "Gotham", "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", Arial, sans-serif
}

.fy-list .fy-item .text {
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  opacity: 1
}

.fy-list .fy-item .text .number {
  font-size: 30px;
  color: #fff;
  margin-bottom: 18px
}

.fy-list .fy-item .text .describe {
  font-size: 24px!important;
  color: #fff;
  font-weight: 300;
  font-family: "Gotham", "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", Arial, sans-serif;
  padding: 0 15%
}

.fy-list .fy-item .text .icon {
  margin-bottom: 20px
}

.fy-list .fy-item .bottom-text,
.fy-list .fy-item .video-tip {
  text-align: left;
  color: #fff;
  position: absolute;
  width: 100%;
  padding: 0 15%;
  display: none;
  z-index: 3
}

.fy-list .fy-item .bottom-text {
  bottom: 5%;
  line-height: 28px;
  font-size: 16px
}

.fy-list .fy-item .bottom-text .describe {
  font-size: 24px;
  margin-bottom: 20px;
  color: #fff;
  text-align: left;
  text-transform: uppercase;
  font-family: "Gotham", "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", Arial, sans-serif
}

.fy-list .fy-item .video-tip {
  font-size: 14px;
  top: 5%;
  opacity: .5;
  font-family: "Open Sans", "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", Arial, sans-serif
}

.fy-list:hover .fy-item {
  box-sizing:border-box;
  border-right: 1px solid rgba(112, 116, 115, .7)
}


.fy-list:hover .fy-item .s-bg {
  opacity: 0
}

.fy-list:hover .fy-item .fy {
  background: rgba(0, 0, 0, .4)
}

.fy-list:hover .fy-item .top-text {
  opacity: .5
}

.fy-list:hover .fy-item .text {
  opacity: 0
}

.fy-list:hover .fy-item .bottom {
  display: none
}

.fy-list .fy-item.active {
  color: #ddd
}

.fy-list .fy-item.active .top-text {
  opacity: 0
}

.fy-list .fy-item.active .bottom-text {
  display: block;
  -webkit-animation-duration: .5s;
  animation-duration: .5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp
}

.fy-list .fy-item.active .video-tip {
  display: block
}

.v-func-list {
  z-index: 8
}

.v-func-list .v-func-item {
  height: 100%;
  width: 25%;
  float: left;
  position: relative;
  transition: opacity .5s ease-in-out
}

.v-func-list .v-func-item .s-bg {
  background-color: #000;
  height: 100%;
  width: 100%;
  background-position:center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.v-func-list,.v-list {
  width: 100%;
  height: 100%
}

.v-list .v-item {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0
}

.v-list .v-item .video-bg {
  position: relative;
  height: 100%;
  overflow: hidden
}

.v-list .v-item .video-bg video {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%)
}

.v-list .v-item .video-bg video[poster] {
  width: 100%
}


/* 兼容 */
.compatible img{width: 100%;}
.compatible .compatible-des{position: absolute; top: 4.25%; width: 1000px; text-align: center; left: 50%; margin-left: -500px;}
.compatible .compatible-des h2{color:#393939; height: 60px; line-height: 60px;}
.compatible .compatible-des p{color:#515151; line-height: 30px;}
.compatible .list{position: absolute; width: 70%; top: 93%; left: 17%;}
.compatible .list li{float: left; width: 25%; text-align: center; color: white;}
.compatible .list li:nth-last-of-type(1) p{text-indent: -20%;}
.compatible .adaption-file{
  position:absolute;width:70%;margin-left:15%;text-align:center;color:red;top:78%;
}
.compatible .adaption-file a{color: red;}


/* WIFI+蓝牙 */
.mode img{width: 100%;}
.mode .mode-des{position: absolute; top: 3.25%; width: 700px; left: 50%; margin-left: -350px; text-align: center;}
.mode .mode-des h2{height: 60px; line-height: 60px; color: #4c4c4c;}
.mode .mode-des p{height: 30px; line-height: 30px; color: #4c4c4c;}
.mode .mp{position: absolute; left: 75%; bottom: 2.5%; color: #b0b0b0; font-size: 12px; width: 460px;}
@media screen and (min-width: 1200px) and (max-width:1599px) {
    .mode .mp{ left: 62%;}
}


/* 魔焦环 */
.confocal img{width: 100%;}
.confocal h2{position: absolute; top: 36.75%; left: 52.16%; color: #fff; width: 600px; line-height: 40px;}
.confocal .list{width: 37.4%; position: absolute; top: 65.75%; left: 50.16%;}
.confocal .list li{float: left; width: 25%; text-align: center; color: white;} 
.confocal .list li p{width: 92%; margin:0 auto; text-align: center;}
/* .confocal .list li:nth-of-type(1) p{margin-right: 10%;}
.confocal .list li:nth-of-type(2) p{text-indent: -15%;} */
@media screen and (min-width: 1200px) and (max-width:1599px) {
    .confocal h2{top: 26%;}
}



/* 变焦跟焦 */
.zooming{padding: 140px 0; background: #efefef;}
.zo-top{width:68.425%; background: #fff; margin: 0 auto;}
.zo-top .z-li{position: relative;}
.zo-top .z-li img{display: none;}
.zo-top .z-li .play{position: absolute; width: 12%; left: 45%; top: 43%; cursor: pointer; z-index: 222;}
.zo-top .z-li .zom-video{position: absolute; position: absolute; top: 0; height: 100%; width: 100%;}
.zo-top .z-li .zom-video video{position: absolute; width: 100%; position: absolute; top: 0; height: 100%; object-fit:fill;}
.zo-top li{width: 50%; float: left;}

.top-title{width: 76.9%; margin: 30px auto 0; padding-left: 5%;}
.top-title li{width: 49%; border-right: 1px solid #ccc; float: left;}
.top-title li:nth-last-of-type(1){border-right: none;}
.top-title li p{text-align: center; font-size: 18px;} 

.zo-top .top-list{width: 76.9%; margin: 10px auto 0; padding-left: 5%;}
.zo-top .top-list li{width: 25%; height: 60px; line-height: 60px; cursor: pointer; border-bottom: 2px solid #ccc; text-align: center;}
/*.zo-top .top-list li:nth-of-type(1) p{height: 60px; line-height: 60px; margin: 0px;}*/
.zo-top .top-list li p{font-size: 12px; /*line-height: 20px; margin-top: 10px; margin-bottom: 10px;*/ height: 60px; line-height: 60px; margin: 0px;}
.zo-top .top-list li em{height: 2px; width: 100%; display: block; position: relative; top:-2px;}
.zo-top .top-list-des{width: 76.9%; margin: 30px auto 0; padding-left: 5%;}
.zo-top .top-list-des p{display: none; line-height: 22px;}

.zo-bottom {width:68.425%; background: #fff; margin: 100px auto;}
.zo-bottom li{width: 50%; float: left; position: relative;}
.zo-bottom li h2{margin-top: 20%; color: #4c4c4c; height: 80px; line-height: 80px; text-align: center; }
.zo-bottom li p{color: #868686; text-align: center;}
.zo-bottom .play{position: absolute; width: 12%; left: 45%; top: 43%; cursor: pointer;}
.zo-bottom li video{width: 100%; position: absolute; top: 0; object-fit:fill; height: 100%;}
@media screen and (min-width: 1200px) and (max-width:1599px) {
    .zooming{padding: 80px 0 50px;}
    .zo-bottom{margin: 50px auto;}
    .zo-bottom li h2{font-size: 22px !important; margin-top: 15%;}
    .zo-bottom li p{width: 90%; margin: 0 auto; line-height: 30px;}
    .zo-top .top-list p{font-size: 13px;}
    .zo-top .top-list-des p{font-size: 13px;}
}


/* 指示屏 */
.scope img{width: 100%;}
.scope .ao-1{position: absolute; left: 59.375%; top: 47.4%; width: 8.4%; filter:alpha(opacity=0);  -moz-opacity:0;  -khtml-opacity: 0; opacity: 0;}
.ao1-run{animation: imgrun 2s forwards;}

.scope .ao-2{position: absolute; left: 55.9%; top: 43.5%; width: 9.6%; filter:alpha(opacity=0);  -moz-opacity:0;  -khtml-opacity: 0; opacity: 0;}
.ao2-run{animation: imgrun 2s forwards; animation-delay:1s;}

.scope .ao-3{position: absolute; left: 53.9%; top: 40%; width: 9.6%; filter:alpha(opacity=0);  -moz-opacity:0;  -khtml-opacity: 0; opacity: 0;}
.ao3-run{animation: imgrun 2s forwards; animation-delay:2s;}

.scope .ao-4{position: absolute; left: 51.9%; top: 36.5%; width: 9.6%; filter:alpha(opacity=0);  -moz-opacity:0;  -khtml-opacity: 0; opacity: 0;}
.ao4-run{animation: imgrun 2s forwards; animation-delay:3s;}

.scope .scope-des{position: absolute; left: 16.875%; top: 28.25%; width: 480px;}
.scope .scope-des h2{line-height: 40px; color: #4c4c4c;}
.scope .scope-des p{color:#4c4c4c; height: 30px; line-height: 30px;}
.scope .scope-list{position: absolute; top: 60%; width: 30.125%; left: 15.875%;}
.scope .scope-list li{float: left; width: 20%; text-align: center;}
.scope .scope-list li p{font-size: 14px;}
@media screen and (min-width: 1200px) and (max-width:1599px) {
    .scope .scope-list li p{font-size: 12px;}
    .scope .scope-des{top: 20.25%; width: 440px;}
}

/* 手动横滚调节 */
.roll-des{width: 750px; margin: 0 auto; text-align: center; padding-top: 60px;}
.roll-des h2{line-height: 40px; color: #4c4c4c;}
.roll-image{margin: 0 auto; width: 71.8%; position: relative; padding: 100px 0 130px;}
.roll-image .roll-left,.roll-image .roll-right{width: 47.6%; position: relative;}
.roll-image .roll-left img,.roll-image .roll-right img{width: 100%;}
.roll-image .roll-right .roll-video{position: absolute; top: 0; width: 100%; height: 100%;}
.roll-image .roll-right .play{position: absolute; width: 12%; left: 45%; top: 43%; cursor: pointer; z-index: 222;}
.roll-image .roll-right .roll-video video{width: 100%; position: absolute; top: 0; object-fit:fill; height: 100%; z-index: 10;}

@media screen and (min-width: 1200px) and (max-width:1599px) {
    .roll-des{padding-top: 40px;}
    .roll-image{margin: 0 auto; width: 71.8%; position: relative; padding: 60px 0 75px;}
}

/* 续航 */
.endurance img{width: 100%;}
.endurance .end-des{position: absolute; top: 5%; width: 640px; text-align: center; left: 50%; margin-left: -320px; color: white;}
.endurance .end-des h2{line-height: 40px;}
.endurance .end-time{font-size: 18px; color: white; width: 400px; left: 50%; margin-left: -200px; bottom: 32%; position: absolute; text-align: center;}
.endurance .end-time span{font-size: 60px;}
/* 算法 */
.algorithm img{width: 100%;}
.algo-des{position: absolute; top: 40%; left: 14.8%; width: 540px;}
.algo-des h2{line-height: 40px; color: #595959;}
.algo-des p{height: 30px; line-height: 30px; color: #393939;}
@media screen and (min-width: 1200px) and (max-width:1599px) {
    .algo-des{position: absolute; top: 30%; left: 5.8%; width: 540px;}
}

/* 底部和侧面螺纹孔 */
.whorl-des{width: 760px; text-align: center; left: 50%; margin-left: -380px; position: absolute; top: 4%;}
.whorl-des h2{height: 60px; line-height: 60px; color: #4c4c4c;}
.whorl-des p{height: 30px; line-height: 30px; color: #4c4c4c;}
.whorl img{width: 100%;}

/* .whorl .whorl-img{width: 80%; margin: 0 auto; padding-top: 60px;}
.whorl .whorl-img img{width: 46.2%;}
@media screen and (min-width: 1200px) and (max-width:1599px) {
    .whorl{padding: 40px 0 68px;}
    .whorl .whorl-img{padding-top: 40px;}
} */

/* 扩展配件 */
.peijian img{width: 100%;}
.pei-des{position: absolute; width: 800px; left: 50%; margin-left: -400px; top: 6%; text-align: center;}
.pei-des h2{height: 60px; line-height: 60px;}

/* 全能王 */
.pei-2 img{width: 100%;}
.pei-2 h2{position: absolute; top: 35%; width: 600px; text-align: center; left: 50%; margin-left: -300px; font-size: 40px !important; font-weight: 900px;}

/* 头部 */
.body-shade{cursor: pointer; display: none; top: 0; position: fixed; height: 100%; width: 100%; background: rgba(0,0,0,0.5); z-index: 2000;}
.publicity-video{position: fixed;display: none; left: 50%; top: 50%; margin-left: -480px; height: 540px; width:960px; margin-top: -299px; z-index: 2000;}
.publicity-video video{width: 100%;}
/*css运动*/
@keyframes imgrun{
  from{
    -webkit-transform: translate(20px,20px);
    -ms-transform: translate(20px,20px);
    -o-transform: translate(20px,20px);
    transform: translate(20px,20px);
    filter:alpha(opacity=0);  
    -moz-opacity:0;  
    -khtml-opacity: 0;
    opacity: 0; 
  }
  to{
    -webkit-transform: translateY(0px,0px);
    -ms-transform: translateY(0px,0px);
    -o-transform: translateY(0px,0px);
    transform: translateY(0px,0px);
    filter:alpha(opacity=100);  
      -moz-opacity:1;  
      -khtml-opacity: 1;
        opacity: 1;
  }
}

@keyframes bkrun{
  from{   
    transform: translateX(0%);  
  }
  to{
    transform: translateX(100%); 
    
  }
}