body{ color: #000000; }
#airbuds img{ max-width: 100%; width: 100%; vertical-align: bottom; }

.float-left{ float: left; }
.clear{ clear: both; }
.center{ text-align: center; }
.big{ font-size: 2vw; line-height: 2.2vw; }
.middle{ font-size: 1.4vw; line-height: 1.6vw; }
.small{ font-size: 1.2vw; line-height: 2vw; }
#airbuds .box1{ background-color: #000000; padding-top: 36vw; position: relative; overflow: hidden; }
#airbuds .box1 .bigTitle{ color: #FFC700; position: absolute; width: 100%; text-align: center; left: 0%; top: 40%;
 font-size: 8vw; line-height: 8vw; font-weight: bold; z-index: 2; letter-spacing: 0.5vw;
}
#airbuds .box1 .img1{ position: absolute; width: 11%; left: 33%; top: 16%; z-index: 1; 
  transform:rotate(-66deg);
  -ms-transform:rotate(-66deg); 
  -moz-transform:rotate(-66deg);
  -webkit-transform:rotate(-66deg);
  -o-transform:rotate(-66deg);

  transition: all 0.3s linear;
  -ms-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
}
#airbuds .box1 .img2{ position: absolute; width: 12%; left: 56%; top: 21%; z-index: 3; 
  transform:rotate(92deg);
  -ms-transform:rotate(92deg); 
  -moz-transform:rotate(92deg);
  -webkit-transform:rotate(92deg);
  -o-transform:rotate(92deg);

  transition: all 0.3s linear;
  -ms-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
}
#airbuds .box1 .img1.active{
  transform:rotate(0deg);
  -ms-transform:rotate(0deg); 
  -moz-transform:rotate(0deg);
  -webkit-transform:rotate(0deg);
  -o-transform:rotate(0deg);
}
#airbuds .box1 .img2.active{
  transform:rotate(0deg);
  -ms-transform:rotate(0deg); 
  -moz-transform:rotate(0deg);
  -webkit-transform:rotate(0deg);
  -o-transform:rotate(0deg);
}
#airbuds .box1 .kouhao{ position: absolute; width: 29%; left: 69%; top: 29%; color: #ffffff; font-size: 1.4vw; 
  line-height: 2vw; 
}
#airbuds .box1 .leftbottom{ position: absolute; width: 30%; left: 14%; top: 61%; font-size: 1.4vw; line-height: 2vw; color: #ffffff;}
#airbuds .box2{ background-color: #101010; position: relative; padding-top: 36vw; overflow: hidden; }
#airbuds .box2 .widthBox{ position: absolute; width: 68%; left: 16%; top: 0%;height: 50vw; }
#airbuds .box2 .widthBox .img2{ position: absolute; left: 0%; top: 0%; width: 35%; }
#airbuds .box2 .widthBox .img3{ position: absolute; left: 0%; top: 48%; width: 35%; }
#airbuds .box2 .widthBox .img4{ position: absolute; left: 37%; top: 0%; }
#airbuds .box2 .widthBox .img5{ position: absolute; right: 0%; top: 0%; }
#airbuds .box2 .widthBox .width{ width: 30.5%; }
#airbuds .box2 .widthBox .img6{ position: absolute; left: 37%; top: 36%; width: 39%; }
#airbuds .box2 .widthBox .img7{ position: absolute; right: 0%; top: 36.3%; width: 22.3%; }
#airbuds .box2 .widthBox .t2{ font-weight: bold; position: absolute; width: 32%; left: 2%; top: 2%; color:#FFC700; font-size: 1vw; line-height: 1.6vw; 
  text-align: right;
}
#airbuds .box2 .widthBox .t3{ font-weight: bold; position: absolute; width: 40%; left: 2%; top: 50%; color:#FFC700; font-size: 1vw; line-height: 1.6vw; }
#airbuds .box2 .widthBox .t4{ font-weight: bold; position: absolute; width: 40%; left: 38%; top: 2%; color:#FFC700; font-size: 1vw; line-height: 1.6vw; }
#airbuds .box2 .widthBox .t5{ font-weight: bold; position: absolute; width: 40%; left: 71%; top: 2%; color:#FFC700; font-size: 1vw; line-height: 1.6vw; }
#airbuds .box2 .widthBox .t6{ font-weight: bold; position: absolute; width: 40%; left: 38%; top: 37%; color:#FFC700; font-size: 1vw; line-height: 1.6vw; }
#airbuds .box2 .widthBox .t7{ font-weight: bold; position: absolute; width: 40%; left: 79%; top: 37%; color:#FFC700; font-size: 1vw; line-height: 1.6vw; }
#airbuds .box3 { overflow: hidden; }
#airbuds .box3 .text{ width: 68%; margin: 2% auto; text-align: center; }
#airbuds .box3 .text .mt{ margin-top: 1%; }
#airbuds .box3 .text .mtb{ margin-top: 5%; }
#airbuds .box3 .imgBox{ width: 68%; margin: 4% auto 8% auto; position: relative; }
#airbuds .box3 .img3{ position: absolute; width: 13%; left: 14%; top: 64%; }
#airbuds .box3 .img4{ position: absolute; width: 3%; left: 22%; top: 78%; z-index: 1; }
#airbuds .box3 .img5{ position: absolute; width: 3%; left: 22%; top: 106%; z-index: 1; }
#airbuds .box3 .line{ width: 10%; height: 2px; background-color: #FFC700; position: absolute; left: 25%; 
  outline: none; border:none; width: 0%;
  transition: all 0.3s linear;
  -ms-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
}
#airbuds .box3 .line.active{ width: 10%; }
#airbuds .box3 .l1{ top: 80%; }
#airbuds .box3 .l2{ top: 108%; }
#airbuds .box3 .t{ position: absolute; width: 8%; font-size: 1.8vw; line-height: 2.2vw; left: 36%; color: #FFC700; 
  opacity: 0; filter: alpha(opacity=0);
  transition: all 0.3s linear;
  -ms-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
}
#airbuds .box3 .t.active{ opacity: 1; filter: alpha(opacity=100); }
#airbuds .box3 .t1{ top: 77%; }
#airbuds .box3 .t2{ top: 106%; }
#airbuds .box4 { background-color: #000000; padding-top: 1%; position: relative;padding-bottom: 18vw; }

#airbuds .box4 .text{ width: 68%; margin: 2% auto;  text-align: center; color: #ffffff; }
#airbuds .box4 .text .big{ color: #FFC700; }
#airbuds .box4 .text .middle{ color: #8F8F8F; }
#airbuds .box4 .text .mt{ margin-top: 1%; }
#airbuds .box4 .text .mtb{ margin-top: 5%; }
#airbuds .box4 .dingwei2{ position: absolute; width: 68%; margin: 0% auto; left: 16%;  }
#airbuds .box4 .dingwei2 .icon{ position: absolute; right: 9.3%; 
  transition: all 0.6s linear;
  -ms-transition: all 0.6s linear;
  -moz-transition: all 0.6s linear;
  -webkit-transition: all 0.6s linear;
  -o-transition: all 0.6s linear;
}
#airbuds .box4 .dingwei2 .icon_1{  width: 8.2%; top: 0%; z-index: 11; right: 9%; }
#airbuds .box4 .dingwei2 .icon_2{ width: 7%; top: 3%; z-index: 10; }
#airbuds .box4 .dingwei2 .icon_3{  width: 6%; top: 5%; z-index: 9; }
#airbuds .box4 .dingwei2 .icon_4{ width: 6%; top: 6%; z-index: 8; }
#airbuds .box4 .dingwei2 .icon_5{  width: 6%; top: 7%; z-index: 7; }
#airbuds .box4 .dingwei2 .icon_6{  width: 7%; top: 10%; z-index: 6; }
#airbuds .box4 .dingwei2 .icon_7{ width: 5%; top: 11%; z-index: 5; }
#airbuds .box4 .dingwei2 .icon_8{ width: 6%; top: 12%; z-index: 4; }
#airbuds .box4 .dingwei2 .icon_9{ width: 8%; top: 8%; z-index: 3; }
#airbuds .box4 .dingwei2 .icon_10{ width: 8%; top: 8%; z-index: 2;  }
#airbuds .box4 .dingwei2 .icon_11{ width: 5.6%; top: 13%; z-index: 1;right: 10%; }
#airbuds .box4 .dingwei2 .icon_12{  width: 15%; margin-left: 85%;  }

#airbuds .box4 .dingwei2 .icon_1.active{  right: 90%; }
#airbuds .box4 .dingwei2 .icon_2.active{right: 83%; }
#airbuds .box4 .dingwei2 .icon_3.active{  right: 76%; }
#airbuds .box4 .dingwei2 .icon_4.active{ right: 69%; }
#airbuds .box4 .dingwei2 .icon_5.active{  right: 61%; }
#airbuds .box4 .dingwei2 .icon_6.active{ right: 53%; }
#airbuds .box4 .dingwei2 .icon_7.active{ right: 47%; }
#airbuds .box4 .dingwei2 .icon_8.active{ right: 40%; }
#airbuds .box4 .dingwei2 .icon_9.active{ right: 31%; }
#airbuds .box4 .dingwei2 .icon_10.active{ right: 22%; }
#airbuds .box4 .dingwei2 .icon_11.active{ right: 16%; }


#airbuds .box5 { overflow: hidden;  }
#airbuds .box5 .text{ width: 68%; text-align: center; margin: 2% auto; }
#airbuds .box5 .text .mt{ margin-top: 1%; color: #8F8F8F; }
#airbuds .box5 .imgBox{ position: relative; width: 68%; margin: 10% auto 4% auto; }
#airbuds .box5 .imgBox .txt{ font-size: 1.2vw; line-height: 2.6vw; width: 44%; color: #555555; }
#airbuds .box5 .imgBox .img2{ width: 15%; margin-top: 2%; }
#airbuds .box5 .imgBox .img3{ position: absolute; width: 45%; top: 6%; left: 53%; }
#airbuds .box5 .imgBox .t{ width: 24%; text-align: center; top: 74%; position: absolute; font-size: 1vw; line-height: 1.4vw;
  color: #555555;
}
#airbuds .box5 .imgBox .t1{ left: 49%; }
#airbuds .box5 .imgBox .t2{ left: 79.5%; }
#airbuds .box6{ overflow: hidden; background-color: #161616; }
#airbuds .box6 .imgBox{ position: relative; width: 68%; margin: 4% auto;  }
#airbuds .box6 .imgBox .img2{ width: 48%; }
#airbuds .box6 .imgBox .tt{ width: 40%; position: absolute; left: 60%; top: 11%; }
#airbuds .box6 .imgBox .tt .b{ color: #ffffff; font-size: 1.6vw; line-height: 1.8vw; }
#airbuds .box6 .imgBox .tt .m{ color: #8F8F8F; font-size: 1.4vw; line-height: 1.6vw; margin-top: 3%; }
#airbuds .box6 .imgBox .tt .s{ margin-top: 14%; color: #ffffff; font-size: 1.2vw; line-height: 1.4vw; }
#airbuds .box6 .imgBox .img3{ height: 20px; width: auto; margin-top: 2%; }
#airbuds .box6 .imgBox .img4{ height: 20px; width: auto; margin-top: 2%; }
#airbuds .box6 .imgBox .img5{ height: 20px; width: auto; margin-top: 2%; }
#airbuds .box6 .imgBox .tips{ font-size: 0.6vw; line-height: 1.6vw; margin-top: 14%; color: #7B7B7B; }
#airbuds .box7{ background-color: #000000; overflow: hidden; }
#airbuds .box7 .text{ width: 68%; text-align: center; margin: 2% auto; }
#airbuds .box7 .text .big{ color: #FFC700; }
#airbuds .box7 .text .small{ color: #ffffff; margin-top: 2%; }
#airbuds .box7 .imgBox{ width: 40%; margin: 4% auto; }
#airbuds .box8{ position: relative; overflow: hidden; }
#airbuds .box8 .imgBox{ width: 68%; margin: 4% auto; }
#airbuds .box8 .imgBox .img{ width: 37%; }
#airbuds .box8 .text{ width: 44%; left: 46%; top: 28%; position: absolute; }
#airbuds .box8 .text .big{  }
#airbuds .box8 .text .middle{ color: #8F8F8F; margin-top: 2%; margin-bottom: 6%; }
#airbuds .box8 .text .small{ margin-bottom: 2%; font-size: 1.2vw; }
#airbuds .box8 .text .small .img2{ width: 3%; margin-right: 5px; vertical-align: middle; }
#airbuds .box9{ position: relative; overflow: hidden; }
#airbuds .box9 .text{ width: 32%; left: 16%; top: 12%; position: absolute; }
#airbuds .box9 .text .img2{ width: 42%; margin-top: 6%; }
#airbuds .box9 .text .big{}
#airbuds .box9 .text .middle{ margin: 2% auto 4% auto; color: #8F8F8F; }
#airbuds .box10{ position: relative; overflow: hidden; }
#airbuds .box10 .text{ width: 28%; left: 16%; top: 29%; position: absolute; }
#airbuds .box10 .text .big{ color: #FFC700; }
#airbuds .box10 .text .middle{ margin: 2% auto 4% auto; color: #8F8F8F; }
#airbuds .box10 .text .small{ color: #ffffff; margin-top: 15%; }
#airbuds .box11{ overflow: hidden; }
#airbuds .box11 .imgBox{ width: 68%; margin: 4% auto; position: relative; }
#airbuds .box11 .img{ width: 45%; }
#airbuds .box11 .text{ width: 40%; margin-left: 5%; }
#airbuds .box11 .text .big{ margin: 15% auto 2% auto; }
#airbuds .box11 .text .middle{ margin: 2% auto 4% auto; color: #8F8F8F; }
#airbuds .box11 .text .small{ margin-top: 10%; }
#airbuds .box11 .img3{ position: absolute; width: 46%; left: 37.2%; top: 4%; }
#airbuds .box11 .img2{ position: absolute; width: 45%; right: 0%; bottom: 0%; }