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; 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;}
.react-shaow{box-shadow: 20px 10px 5px #89d4f4 !important; background: #00a0e8 !important;}
.cool-border{border-bottom: 2px solid #29bae7 !important; color: #29bae7 !important;}

/* ak头部 */
.ak2000c-header{padding: 100px 0 60px; position: relative; z-index: 10000;}
.ak2000c-header .ak2000c-title{width:334px; margin: 0 auto;}
.ak2000c-header .ak2000c-logo{margin: 30px auto; width:240px;}
.ak2000c-header .ak2000c-logo img{width:100%;}
.ak2000c-header .ak2000c-logo .ak2000c-play{margin-top: 20px;}
.ak2000c-header .ak2000c-logo .ak2000c-play img{width: 28px; float: left; margin-left: 30px;}
.ak2000c-header .ak2000c-logo .ak2000c-play a{display: inline-block; color: #535353; font-size: 16px; float: left;}
.ak2000c-header .ak2000c-logo .ak2000c-play a:hover{text-decoration: underline; color: #04b8ed;}

/* 拍我所爱 */
.banner-des{width:18.75%; position: absolute; top: 30%; left: 20%;}
.banner-des h3{font-size: 30px; color: #444; margin-top: 20px;}
.ak2000c-banner{position: relative; z-index: 10000;}
.ak2000c-banner .ak2000c-play2{cursor: pointer; margin-top: 20px; height: 36px; line-height: 36px; width:208px; border-radius: 5px; border: 1px solid #434343; position:relative; background: url("../png/ak2000c-play2.png") no-repeat 90% 4px;}
.ak2000c-banner .ak2000c-play2:hover{border: 1px solid #00a0e9; background: url("../png/h-ak2000c-play.png") no-repeat 90% 4px;}
.ak2000c-banner .ak2000c-play2 a{text-indent: 30px; font-size: 16px; color: #404040; display: block;}
.ak2000c-banner .ak2000c-play2:hover a{color: #00a0e9;}
/* 稳 */
.stable{padding: 50px 0 200px;}
.stable img{width:1000px; margin: 0px auto;}
.stable span{position: absolute; top: 0; right: 25%; color: #494949; font-size: 12px;}
.stable .stable-list{width:640px; position: absolute; bottom: 15%; left: 50%; margin-left: -320px;}
.stable .stable-list li{width:192px; float: left;  border:5px solid #e4e4e6; border-radius: 50%; height: 192px; background: #fff; position: relative;}
.stable .stable-list li:nth-of-type(2){ margin: 0 18px;}
.stable .stable-list li p{font-size: 18px; text-align: center; margin-top: 38px; color: #444444;}
.stable .stable-list li h3{font-size: 26px; text-align: center; color: #444444; font-weight: 700;}
.stable .stable-list li:nth-of-type(2) p{margin-top: 70px;}
.stable .stable-list li:nth-of-type(3) p{margin-top: 50px;}
.stable .stable-list li .time-graph {position: absolute; top: -5px; right: -5px; display:flex;display:-webkit-flex;justify-content: center;align-items: center; z-index: 10;}
#time-graph-canvas1,#time-graph-canvas2,#time-graph-canvas3 {width: 192px;height: 192px;}
.stable .p1{position: absolute; width:800px; text-align: center; bottom:2%; left: 50%; margin-left: -400px; color: #434343; line-height: 30px; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0; font-size:18px; margin-bottom: 10px;}
.stable .h3{position: absolute; width:800px; text-align: center; bottom:2%; left: 50%; margin-left: -400px; color: #434343; font-size: 36px;filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0; margin-bottom: 10px;}
.stablep-run{animation: des 2s forwards;}
.stableh-run{animation: des 2s forwards;}

/* 巧 */
.skilful{padding: 80px 0;}
.skilful-des{width:620px; text-align: center; margin: 0 auto;}
.skilful-des h2{font-size: 42px; background: linear-gradient(to right, #4287c0, #424649); -webkit-background-clip: text; color: transparent;}
.skilful-des p{color:#444444; font-size: 16px;  margin-top: 30px; line-height: 30px;}
.skilful-des h3{color: #444; font-size: 22px; margin-top: 10px;}
.skilful .skilful-box{width:62.5%; margin: 50px auto; }
.skilful .skilful-box .skilful-video{width:66.7%; float: left; }
.skilful .skilful-box .skilful-video video{width:100%; display: none;}
.skilful-box .skilful-list{width:25%; margin-left: 7.3%; float: left; margin-top: 20px; position: relative; z-index: 10000;}
.skilful-box .skilful-list li:nth-of-type(1) .react p{text-indent: 32px;}
.skilful-box .skilful-list li{margin-bottom: 40px;}
.skilful-box .skilful-list li .react{margin-left: 20%; width: 80%;height: 42px;line-height: 42px;text-align: center; background: #898989;transform: skewX(-45deg); cursor: pointer; border-radius: 6px; box-shadow: 20px 10px 5px #cdcdcd; }
.skilful-box .skilful-list li .text {font-size: 18px; display: inline-block;transform: skewX(45deg);color: #fff;}


.overlying{position: relative; padding: 50px 0; height: 1400px;}
.overlying .overly-3{position: fixed; width:520px; top: 180px; z-index: 10; left: 50%; transform:rotate(-5deg); filter:alpha(opacity=0); -moz-opacity:0;  -khtml-opacity: 0;opacity: 0; box-shadow:0 0 30px #ddd;}
.overlying .overly-2{position: fixed; width:580px; top: 180px; z-index: 20; left: 18%; transform:rotate(-10deg); filter:alpha(opacity=0); -moz-opacity:0;  -khtml-opacity: 0;opacity: 0; box-shadow:0 0 30px #ddd;}
.overly-run{animation: opactimg 1.5s forwards;}
.overlying .overly-1{position: fixed; width:640px; top: 180px; z-index: 40; left: 28%; transform:rotate(2deg); filter:alpha(opacity=0); -moz-opacity:0;  -khtml-opacity: 0;opacity: 0; box-shadow:0 0 30px #ddd;}

/* 手柄 */
.simple{padding-bottom: 30px; background: #fff;}
.simple .bg-simple1{width:52%; margin: 0 auto; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.simple .simple-des{position: absolute; top: 30%; left: 25%; width:400px; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.simple .simple-des p{color:#434341; font-size: 16px; line-height: 30px;}
.simple .simple-des h2{color:#02a0ea; font-size: 42px; margin: 20px 0;}
.simple .simple-des h2{color:#02a0ea; font-size: 24px;}
.simple .simple-des h3{font-size: 22px;}
.simple .bg-simple2{position: absolute; width:26%; left: 45%; top: 3%; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}

.simple-run{animation: des 2s forwards; animation-delay:2s; -webkit-animation-delay:2s;}
.simple1-run{animation:opactimg 1s forwards;}
.simple2-run{animation:opactimg 1s forwards; animation-delay:1s; -webkit-animation-delay:1s;}


.simpleImg .simpleImg-bg1{width:48%; position: relative; left: -15%; transform:rotate(-30deg)}
.simpleImg .simpleImg-box{width:42%; margin: 0 auto; position: absolute; left: 29%; top: -10%; z-index: 100;}
.simpleImg-box img{float: left;}
.simpleImg-box .simpleImg-1{width:100%; margin-bottom: 20px; box-shadow:0 0 20px #999; z-index: 100;}
.simpleImg-box .simpleImg-2{width:39%; margin-right: 3%; box-shadow:0 0 20px #999; z-index: 100;}
.simpleImg-box .simpleImg-3{width:58%; box-shadow:0 0 20px #999; z-index: 100;}

.simpleImg .simpleImg-bg2{width:35%; position: absolute; top: 0; right: -5%;}

/* 玩 */
.play{padding: 100px 0 50px; background: #fff;}
.play img{width:396px; margin: 0 auto;}
.play .play-des{width:450px; position: absolute; top: 60px; left: 50%; margin-left: -225px; text-align: center;}
.play .play-des p{line-height: 28px; font-size: 16px; color: #424443;}
.play .play-des h2{margin: 10px 0; background: linear-gradient(to right, #81c16b, #00b8ee); -webkit-background-clip: text; color: transparent; font-size: 42px; }
.play .play-des h3{font-size: 26px; color: #424443; margin-top: 10px;}

/* 强 */
.strong{padding: 50px 0;}
.strong .strong-img{position: relative; width:23%; left: 23%;}
.strong .strong-des{position: absolute; top: 20%; width:32%; left: 48%;}
.strong .strong-des h2{margin-bottom: 15px; background: linear-gradient(to right, #00b7f0, #12b5b0); -webkit-background-clip: text; color: transparent; font-size: 42px; }
.strong .strong-des p{font-size: 16px; line-height: 30px;}
.strong .strong-des h3{font-size: 20px; margin: 15px 0 25px;}

/* 潮 */
.tide .tide1{position: relative; left: 38%; width:20%; top: 20px; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.tide .tide1 span{position: absolute; bottom: 12%; left: 28%; text-align: center;}
.tide span{color: #313131; border:1px solid #bfbfbf; display: block; border-radius: 5px; padding: 5px 20px;}
.tide .tide-des{margin: 50px auto 200px; text-align: center; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0; width:500px; text-align: center;}
.tide .tide-des h2{margin-bottom: 15px; background: linear-gradient(to right, #00b7f0, #12b5b0); -webkit-background-clip: text; color: transparent; font-size: 42px;}
.tide .tide-des p{font-size: 20px; line-height: 36px;}

.tide .tide2{position: absolute; width:23%; left: 11.8%; top: 10%; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.tide .tide2 span{position: absolute; top: 44%; right: -16%;text-align: center;}

.tide .tide3{position: absolute; width:25%; left: 62.3%; top: 10%; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.tide .tide3 span{position: absolute; bottom: 0%; left: 30%;}

.tide1-run{animation:opactimg .8s forwards;}
.tide2-run{animation:opactimg .8s forwards; animation-delay:1s; -webkit-animation-delay:.8s;}
.tide3-run{animation:opactimg .8s forwards; animation-delay:1.5s; -webkit-animation-delay:1.5s;}
.tide-run{animation: des 1s forwards; animation-delay:2s; -webkit-animation-delay:2s;}

/* 值 */
.price{margin-bottom: 80px;}
.price-des{width:580px; margin: 0 auto 60px; text-align: center; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}
.price-des h2{ background: linear-gradient(to right, #00b7f0, #12b5b0); -webkit-background-clip: text; color: transparent; font-size: 42px; }
.price-des p{font-size: 18px; margin-top: 20px;}
.price img{width:62.5%; margin: 0 auto;}
.price-run{animation: des 2s forwards;}
/* 扩展 */
.expand-des{margin: 50px auto; text-align: center; width:880px;}
.expand-des h2{font-size: 42px; color: #444444; }
.expand-des p{font-size: 18px; color: #444; margin-top: 20px;}
.expand-img{width:63.5%; margin: 0 auto; position: relative; z-index: 10000;}
.expand-img .expandBg{width:100%;}

.expand-img .exImg{width:25.5%; left: 0%; top: 24%;}
.expand-img .expandImg{ position: absolute; cursor: pointer;}
.expand-img .expandImg img{width:100%;}
.expand-img .expandImg img:nth-of-type(2){display: none;}
.expand-img .expandImg:hover img:nth-of-type(1){display: none;}
.expand-img .expandImg:hover img:nth-of-type(2){display: block;}
.expand-img .expandImg h3{font-size: 28px; color: #fff;}
.expand-img .expandImg p{color: #fff; line-height: 30px; font-size: 16px; margin-top: 10px;}
/* .expand-img .exImg h3{left: 15%; position: absolute; bottom: 15%;} */

.expandImg .exImg1-des{width:73.5%; left: 6.5%; bottom: 10%; position: absolute;} 

.expand-img .exImg2{width:73.5%; left: 26.5%; top: 24%;} 
.exImg2 .exImg2-des{position: absolute; top: 20%; width:230px; right: 10%;}

.expand-img .exImg3{width:42%; left: 26.5%; top: 48%;} 
.exImg3 .exImg3-des{position: absolute; top: 30%; width:230px; right: 5%; text-align: right;}

.expand-img .exImg4{width:31%; left: 69.5%; top: 48%;} 
.exImg4 .exImg4-des{position: absolute; top: 10%; width:160px; left: 10%;}

.expand-img .exImg5{width:68.5%; left: 0%; top: 72%;} 
.exImg5 .exImg5-des{position: absolute; top: 25%; width:260px; left: 6%;}

.expand-img .exImg6{width:100%; left: 0%; top: 0%;} 
.exImg6 .exImg6-des{position: absolute; top: 20%; width:370px; left: 50%; margin-left: -170px; text-align: center;}

/* 底部 */
.ak2c-footer{padding: 50px 0; background: #fff;}
.ak2c-footer .f-ak2000c{width:277px; position: relative; left: 34%;}

.ak2c-footer .footer-des{width:360px; position: absolute; left: 48%; top: 12%;}
.ak2c-footer .f-logo{width:370px; margin: 80px auto 50px;}
.site-footer{position: relative !important; z-index: 1000 !important;}

.body-shade{cursor: pointer; display: none; top: 0; position: fixed; height: 100%; width: 100%; background: rgba(0,0,0,0.7); z-index: 10000;}
.publicity-video,.publicity-video2{position: fixed;display: none; left: 50%; top: 50%; margin-left: -480px; height: 540px; width:960px; margin-top: -299px; z-index: 20000;}
.publicity-video video,.publicity-video2 video{width: 100%;}

@media screen and (min-width: 1200px) and (max-width:1599px) {
  .expand-img,.price img{width:80%;}
  .simple .simple-des{left: 15%;}
  .strong .strong-des{width:38%; top: 15%;}
  .tide .tide-des{margin-bottom: 100px;}
  .tide .tide2 span{right: -16%; top: 45%;}
}

/*字推移*/
@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; 
  }
}

@keyframes opactimg{
  from{
    filter:alpha(opacity=0);  
      -moz-opacity:0;  
      -khtml-opacity: 0;
        opacity: 0;  
  }
  to{
    filter:alpha(opacity=100);  
      -moz-opacity:1;  
      -khtml-opacity: 1;
        opacity: 1; 
  }
}


/* 炫 */
.video-bg video{object-fit:fill; height: 100%; width: 1200px;}
.display-box {
  position: relative;
  width: 1200px;
  background-color: rgba(123, 124, 125, .6);
  height: 600px;
  margin: 0 auto 100px;
  z-index: 10000;
}
/* @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;
}

.fy-list .fy-item .text {
  bottom: 0%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  opacity: 1
}

.fy-list .fy-item .text p{font-size: 20px;font-weight: 700; color: #fff;}

.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;
  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 h2{line-height: 50px;}

.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;
}

.fy-list .fy-item .video-tip {
  font-size: 14px;
  top: 5%;
  opacity: .5;
}

.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%
}

.display-box .cool-list{width:1200px; margin: 30px auto;}
.display-box .cool-list li{float: left; width: 25%; text-align: center; cursor: pointer;}
.display-box .cool-list li p{border-bottom: 2px solid #cccccc; color: #3d3d3d; height: 46px; line-height: 46px;}