/*!
 * fullPage 3.1.0
 * https://github.com/alvarotrigo/fullPage.js
 *
 * @license GPLv3 for open source use only
 * or Fullpage Commercial License for commercial use
 * http://alvarotrigo.com/fullPage/pricing/
 *
 * Copyright (C) 2018 http://alvarotrigo.com/fullPage - A project by Alvaro Trigo
 */
html.fp-enabled,
.fp-enabled body {
    margin: 0;
    padding: 0;
    overflow:hidden;

    /*Avoid flicker on slides transitions for mobile phones #336 */
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
.fp-section {
    position: relative;
    -webkit-box-sizing: border-box; /* Safari<=5 Android<=3 */
    -moz-box-sizing: border-box; /* <=28 */
    box-sizing: border-box;
}
.fp-slide {
    float: left;
}
.fp-slide, .fp-slidesContainer {
    height: 100%;
    display: block;
}
.fp-slides {
    z-index:1;
    height: 100%;
    overflow: hidden;
    position: relative;
    -webkit-transition: all 0.3s ease-out; /* Safari<=6 Android<=4.3 */
    transition: all 0.3s ease-out;
}
.fp-section.fp-table, .fp-slide.fp-table {
    display: table;
    table-layout:fixed;
    width: 100%;
}
.fp-tableCell {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
    height: 100%;
}
.fp-slidesContainer {
    float: left;
    position: relative;
}
.fp-controlArrow {
    -webkit-user-select: none; /* webkit (safari, chrome) browsers */
    -moz-user-select: none; /* mozilla browsers */
    -khtml-user-select: none; /* webkit (konqueror) browsers */
    -ms-user-select: none; /* IE10+ */
    position: absolute;
    z-index: 4;
    top: 50%;
    cursor: pointer;
    width: 0;
    height: 0;
    border-style: solid;
    margin-top: -38px;
    -webkit-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
.fp-controlArrow.fp-prev {
    left: 15px;
    width: 0;
    border-width: 38.5px 34px 38.5px 0;
    border-color: transparent #fff transparent transparent;
}
.fp-controlArrow.fp-next {
    right: 15px;
    border-width: 38.5px 0 38.5px 34px;
    border-color: transparent transparent transparent #fff;
}
.fp-scrollable {
    overflow: hidden;
    position: relative;
}
.fp-scroller{
    overflow: hidden;
}
.iScrollIndicator{
    border: 0 !important;
}
.fp-notransition {
    -webkit-transition: none !important;
    transition: none !important;
}
#fp-nav {
    position: fixed;
    z-index: 100;
    top: 50%;
    opacity: 1;
    transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translate3d(0,-50%,0);
}
#fp-nav.fp-right {
    //right: 17px;
}
#fp-nav.fp-left {
    left: 17px;
}
.fp-slidesNav{
    position: absolute;
    z-index: 4;
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    left: 0 !important;
    right: 0;
    margin: 0 auto !important;
}
.fp-slidesNav.fp-bottom {
    bottom: 17px;
}
.fp-slidesNav.fp-top {
    top: 17px;
}
#fp-nav ul,
.fp-slidesNav ul {
  margin: 0;
  padding: 0;
}
#fp-nav ul li,
.fp-slidesNav ul li {
    display: block;
    width: 14px;
    height: 13px;
    margin: 7px;
    position:relative;
}
.fp-slidesNav ul li {
    display: inline-block;
}
#fp-nav ul li a,
.fp-slidesNav ul li a {
    display: block;
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    cursor: pointer;
    text-decoration: none;
}
#fp-nav ul li a.active span,
.fp-slidesNav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li:hover a.active span{
    height: 12px;
    width: 12px;
    margin: -6px 0 0 -6px;
    border-radius: 100%;
 }
#fp-nav ul li a span,
.fp-slidesNav ul li a span {
    border-radius: 50%;
    position: absolute;
    z-index: 1;
    height: 4px;
    width: 4px;
    border: 0;
    background: #333;
    left: 50%;
    top: 50%;
    margin: -2px 0 0 -2px;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}
#fp-nav ul li:hover a span,
.fp-slidesNav ul li:hover a span{
    width: 10px;
    height: 10px;
    margin: -5px 0px 0px -5px;
}
#fp-nav ul li .fp-tooltip {
    position: absolute;
    top: -2px;
    color: #fff;
    font-size: 14px;
    font-family: arial, helvetica, sans-serif;
    white-space: nowrap;
    max-width: 220px;
    overflow: hidden;
    display: block;
    opacity: 0;
    width: 0;
    cursor: pointer;
}
#fp-nav ul li:hover .fp-tooltip,
#fp-nav.fp-show-active a.active + .fp-tooltip {
    -webkit-transition: opacity 0.2s ease-in;
    transition: opacity 0.2s ease-in;
    width: auto;
    opacity: 1;
}
#fp-nav ul li .fp-tooltip.fp-right {
    right: 20px;
}
#fp-nav ul li .fp-tooltip.fp-left {
    left: 20px;
}
.fp-auto-height.fp-section,
.fp-auto-height .fp-slide,
.fp-auto-height .fp-tableCell{
    height: auto !important;
}

.fp-responsive .fp-auto-height-responsive.fp-section,
.fp-responsive .fp-auto-height-responsive .fp-slide,
.fp-responsive .fp-auto-height-responsive .fp-tableCell {
    height: auto !important;
}

/*Only display content to screen readers*/
.fp-sr-only{
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.index-video,.index-video-m{
 width:100%; 
}

.section{
  position: relative;
}
.section.active {
    position: relative;
    z-index: 98;
}


          .video-section{
            position: relative;
            height: 969px;
          }
          
          .video-box{
            
            width: 100%;
    		overflow: hidden;
           	//height: calc(100% - 80px);
            position: absolute;
    		
          }
         
          .video-box img {
              width: 100%;
              position: absolute;
              top: 50%;
              transform: translateY(-50%);
          }
          .index-video{
            width: 100%;
            position: absolute;
            top: 50%;
            transform: translate(-50%,-50%);
            left: 50%; 
          }
.btn-list{height: 100vh;}      
.section-btn {
    position: absolute;
    transform: translate(-50%, -50%);
    cursor: pointer;
}
.section-title{
  top: 1rem;
    left: 2.8rem;
}
.color-white{
 color:#fff; 
}
.section-more{
  bottom: 0.15rem;
  right: 0;
}
.section-btn1{
  left: 45%;
  top: 25%;
}
.section-btn2{
  left: 26%;
  top: 35%;
}
.section-btn3{
  right: 0;
  bottom: 16%;
}
.section-btn4{
  left: 55%;
  top: 40%;
}



.btn-icon {
    width: 64px;
    height: 64px;
    position: relative;
    z-index: 10;
}
.btn-icon::before {
    content: '';
    width: 24px;
    height: 24px;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 10;
    transform: translate(-50%, -50%);
    background: rgba(0,92,161,0.3);
    animation: none;
}

.btn-icon::after {
    content: '';
    width: 0px;
    height: 0px;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 20;
    transform: translate(-50%, -50%);
    background: #fff;
    animation: none;
    transition: all .3s ease 0s;
}

.btn-icon-img {
    position: relative;
    width: 100%;
    height: 100%;
    display:block;
    z-index:20;
}
.btn-icon-img .btncircle {
    position: relative;
    opacity: 1;
}
.btn-icon-img .btnhover {
    position: absolute;
    opacity: 0;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}
.btn-icon-img::before {
    content: '';
    background: rgba(255, 255, 255, 0.6392156862745098);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    animation: kuosan 2.2s linear 0.1s infinite;
}
.section-btn:hover .btnhover{
  opacity: 1;
}
/*手表*/
.section-watch{
	left: 200px;
    bottom: 135px; 
}
/*AR*/
.section-ar{
 left: 650px;
 bottom: 200px;
}


/*臂环*/
.section-bracelet{
    left: 800px;
    bottom: 130px;
}

/*运动手表*/
.section-sports_watch{
	right: 600px;
    bottom: 300px;
}

/*车钥匙*/
.section-car_key{
	right: 500px;
    bottom: 110px;
}

/*蓝牙耳机*/
.section-earphone{
    right: 350px;
    bottom: 185px;
}

/*电子烟*/
.section-electronic_cigarette{
	right: 60px;
    bottom: 130px;
}

/*耳机*/
.section-mic{
 left: 960px;
 bottom: 185px; 
}

@media (max-width: 1920px){
  /*手表*/
.section-watch{
	left: 1.9rem;
    bottom: 1rem;
}
/*AR*/
.section-ar{
 left: 6.5rem;
 bottom:2rem;
}


/*臂环*/
.section-bracelet{
    left: 8rem;
    bottom: 1rem;
}

/*运动手表*/
  /*
.section-sports_watch{
    left: 12.2rem;
    bottom: 3rem;
}
  */

/*车钥匙*/
.section-car_key{
	right: 5.5rem;
    bottom: 1.1rem;
}

/*蓝牙耳机*/
.section-earphone{
	right: 3.6rem;
    bottom: 1.8rem;
}

/*电子烟*/
.section-electronic_cigarette{
	right: 0.6rem;
    bottom: 1.3rem;
}

/*耳机*/
  /*
.section-mic{
 	left: 10.2rem;
    bottom: 1.8rem;
}
  */
}

@media (max-width: 1680px){
  .section-bg img,.mobileBg {
    display:none;
}
  .section-ar {
      left: 6rem;
      bottom: 2.5rem;
  }
  .section-bracelet {
      left: 7.8rem;
    bottom: 2rem;
  }
  .section-watch {
      left: 1.65rem;
    bottom: 1.8rem;
  }
  .section-sports_watch {
         right: 5.2rem;
    bottom: 3.5rem;
  }
  .section-car_key {
      right: 4.45rem;
    bottom: 2rem;
  }
  .section-mic {
      left: 9rem;
    bottom: 2.7rem;
  }
  
  .section-earphone {
      right: 3.6rem;
      bottom: 2.5rem;
  }
  .section-electronic_cigarette {
      right: 0.5rem;
      bottom: 2.3rem;
  }
  
  
}

@media (max-width: 1440px){
  .section-ar {
      left: 5.5rem;
      bottom: 1.8rem;
  }
  .section-bracelet {
      left: 7.4rem;
      bottom: 1rem;
  }
  .section-watch {
     left: 2.5rem;
    bottom: 1rem;
  }
  .section-sports_watch {
    right: 3.2rem;
    bottom: 2.5rem;
}
  .section-car_key {
    right: 4.2rem;
    bottom: 0.8rem;
}
  .section-mic {
    left: 8.5rem;
    bottom: 1.6rem;
}
  .section-earphone {
      right: 3.4rem;
      bottom: 1.4rem;
  }
  .section-electronic_cigarette {
      right: 0.4rem;
      bottom: 1rem;
  }
}
@media (max-width: 1366px){
  .section-title {
    top: 1rem;
    left: 2.3rem;
}
  .section-ar {
      left: 5.5rem;
      bottom: 1.8rem;
  }
  .section-bracelet {
    left: 7.1rem;
    bottom: 1rem;
}
  .section-watch {
    left: 2.4rem;
    bottom: 1rem;
}

  .section-sports_watch {
    right: 5.4rem;
    bottom: 2.45rem;
}
  .section-car_key {
    right: 3.9rem;
    bottom: 0.9rem;
}
  .section-earphone {
    right: 3.1rem;
    bottom: 1.5rem;
}
  .section-electronic_cigarette {
      right: 0.35rem;
      bottom: 1.22rem;
  }
  .section-mic {
      left: 8.1rem;
      bottom: 1.7rem;
  }
  
}

@media (max-width: 1280px){
  .section-title {
    top: 1rem;
    left: 2.3rem;
}
  .section-ar {
     left: 4.8rem;
    bottom: 2.4rem;
  }
  .section-bracelet {
    left: 6.3rem;
    bottom: 1.8rem;
}
  .section-watch {
    left: 2.3rem;
    bottom: 1.7rem;
}

  .section-sports_watch {
   right: -1rem;
    bottom: 3rem;
}
  .section-car_key {
    right: 3.8rem;
    bottom: 1.8rem;
}
  .section-earphone {
    right: 2.5rem;
    bottom: 2.3rem;
}
  .section-electronic_cigarette {
      right: 0.35rem;
      bottom: 2rem;
  }
  .section-mic {
      left: 7.6rem;
    bottom: 2.4rem;
  }
  
}

@media (max-width: 780px){
   .section-bg img,.mobileBg {
      display:block;
  }
  .index-video{
   display:none; 
  }
  .section-btn1{
    left: 45%;
    top: 35%;
  }
  .section-btn2{
    left: 13%;
    top: 45%;
  }
  .section-btn3{
    left: 48%;
    top: 62%;
  }
  .section-btn4{
    left: 85%;
    top: 50%;
  }
}

@keyframes kuosan {
    0% {
        width: 24px;
        height: 24px;
        opacity: 1;
    }
    50% {
        width: 40px;
        height: 40px;
        opacity: 1;
    }
    100%{
        width: 60px;
        height: 60px;
        opacity: 0;
    }
}
          
          .btn-content{
              position: absolute;
              top:9px;
              left: 7px;
              transform: translateY(0);
              opacity: 0;
          }
          .btn-content-box{
           	position: relative;
            top: 0;
            transform: translateY(0);
            left: 0; 
            white-space: nowrap;
          }
          .btn-content-box::before {
            content: "";
            position: absolute;
            left: 0;
            top: 0;
            z-index: -1;
            width: 0;
            height: 100%;
            background: -webkit-linear-gradient(left, #337ab7, #0b4180);
            border-radius: 22px;
        }
          .section-bt:hover .btnicon {
              animation: yidong .36s ease .26s forwards;
          }
          .section-btn:hover .btn-content {
              opacity: 1;
              transition: all .36s .2s;
          }
          .section-btn:hover .btn-content-box::before{
              	width: 100%;
        		transition: all .4s cubic-bezier(.34, .44, .41, 1.12);
    	  }


          @keyframes yidong {

            0%{

                left: 0;

            }

            100%{

                left: 30px;

            }

        }
          .btn-text{
            color:#fff;
            line-height: 26px;
    		padding: 10px;
            padding-left: 50px;
          }
@media (max-width: 780px){
  .video-section{
    height:auto;
  }
  .video-box{
    position: initial;
  }
}