
/** { touch-action: pan-y; } */
.bold{ 
	-webkit-transform: translate(0,2rem);
    -ms-transform: translate(0,2rem);
    transform: translate(0,2rem);
    opacity: 0;
    -webkit-transition: opacity ease-in-out .6s,-webkit-transform ease-in-out 1s;
    transition: opacity ease-in-out .6s,-webkit-transform ease-in-out 1s ;
    transition: transform ease-in-out .6s,opacity ease-in-out 1s;
    transition: transform ease-in-out .6s,opacity ease-in-out 1s,-webkit-transform ease-in-out 1s;
}
.italic{ 
	-webkit-transform: translate(0,2rem);
    -ms-transform: translate(0,2rem);
    transform: translate(0,2rem);
    opacity: 0;
    -webkit-transition: opacity ease-in-out .6s,-webkit-transform ease-in-out 1s;
    transition: opacity ease-in-out .6s,-webkit-transform ease-in-out 1s;
    transition: transform ease-in-out .6s,opacity ease-in-out 1s;
    transition: transform ease-in-out .6s,opacity ease-in-out 1s,-webkit-transform ease-in-out 1s;
}
.third{  
	-webkit-transform: translate(0,2rem);
    -ms-transform: translate(0,2rem);
    transform: translate(0,2rem);
    opacity: 0;
    -webkit-transition: opacity ease-in-out .6s,-webkit-transform ease-in-out 1s;
    transition: opacity ease-in-out .6s,-webkit-transform ease-in-out 1s;
    transition: transform ease-in-out .6s,opacity ease-in-out 1s;
    transition: transform ease-in-out .6s,opacity ease-in-out 1s,-webkit-transform ease-in-out 1s;
}
.bold.active,.third.active,.italic.active{
	-webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    transform: translate(0,0);
    opacity: 1
}

.big{ font-size: 3vw; line-height: 4vw; }
.middle{ font-size: 3vw; line-height: 3.22vw; margin: 0.5vw auto 1.5vw auto; }
.small{ font-size: 1.8vw; line-height: 2.6vw; }
.color-yellow{ color: #FFC604; }
#power5 { color: #000000;}
#power5 img{ width: 100%; max-width: 100%; vertical-align: bottom; }
#power5 .box1 { position: relative; }
#power5 .box1 .box{ width: 100%; position: absolute; left: 0%; top: 5%; color: #ffffff; text-align: center; }
#power5 .box1 .box .b{ font-size: 6vw; line-height: 6vw; color: #FFC604; }
#power5 .box1 .box .m{ font-size: 3vw; line-height: 3.22vw; margin: 0vw auto 1vw auto; }
#power5 .box1 .box .s{ font-size: 1.4vw; line-height: 2vw; }
#power5 .box1 .box .s span{ font-size: 1.4vw; line-height: 2vw; }
#power5 .box1 .box .ul{ overflow: hidden; width: 52%; margin: 2% auto; }
#power5 .box1 .box .ul .li{ float: left; width: 33.33%; position: relative; padding-left: 9%; box-sizing: border-box; text-align: left; }
#power5 .box1 .box .ul .li .icon{ width: 20%; position: absolute; left: 0%; top: 2%; }
#power5 .box1 .umidigi{ padding :1vw 2vw; font-size: 2vw; color: #000000; background-color: #FFC604; position: absolute; left: 10%; top: 0%; }
#power5 .box2{ background-color: #FFC604; overflow: hidden; }
#power5 .box2 .box{ width: 74%; margin: 5vw auto; position: relative; overflow: hidden; }
#power5 .box2 .pp{ position: absolute; color: #FFC604; box-sizing: border-box; }
#power5 .box2 .p1{  width: 49%; left: 0%; top: 5%; text-align: center;}
#power5 .box2 .p2{ width: 49%; left: 51%; top: 9%; padding:0px 2%; }
#power5 .box2 .p3{ width: 49%; left: 51%; top: 28%; padding:0px 2%; }
#power5 .box2 .p4{ width: 32%; left: 0%; top: 57%; padding:0px 2%; }
#power5 .box2 .p5{ width: 32%; left: 34%; top: 55%; text-align: center; }
#power5 .box2 .p6{ width: 32%; left: 68%; top: 53%; padding:0px 2%; }
#power5 .box2 .p7{ width: 32%; left: 0%; top: 78%; padding:0px 2%; }
#power5 .box2 .p8{  width: 32%; left: 68%; top: 78%; text-align: center; }
#power5 .box2 .pp .b{ font-size: 2.4vw; line-height: 2.8vw; }
#power5 .box2 .pp .s{ font-size: 2vw; line-height: 2.4vw; }
#power5 .box2 .pp .bb{ font-size: 3.6vw; }
#power5 .box2 .p2 .b{ font-size: 1.6vw; line-height: 2vw; }
#power5 .box2 .p2 .s{ font-size: 1.2vw; line-height: 1.62vw; }
#power5 .box2 .p3 .b{ font-size: 1.6vw; line-height: 2vw; }
#power5 .box2 .p3 .s{ font-size: 1.2vw; line-height: 1.6vw; }
#power5 .box2 .p4 .b{ font-size: 1.6vw; line-height: 2vw; }
#power5 .box2 .p4 .s{ font-size: 1.2vw; line-height: 1.6vw; }
#power5 .box2 .p5 .b{ font-size: 1.6vw; line-height: 2.4vw; }
#power5 .box2 .p5 .s{ font-size: 1.2vw; line-height: 1.6vw; }
#power5 .box2 .p6 .b{ font-size: 1.6vw; line-height: 2.4vw; }
#power5 .box2 .p6 .s{ font-size: 1.2vw; line-height: 1.6vw; }
#power5 .box2 .p7 .b{ font-size: 1.6vw; line-height: 2.4vw; }
#power5 .box2 .p7 .s{ font-size: 1.2vw; line-height: 1.6vw; }
#power5 .box2 .p8 .b{ font-size: 1.6vw; line-height: 2.4vw; }
#power5 .box2 .p8 .s{ font-size: 1.2vw; line-height: 1.6vw; }
#power5 .box3{ position: relative; overflow: hidden; }
#power5 .box3 .img2{ width: 68%; left: 49%; top: 49%; position: absolute; transition: all 0.3s linear; opacity: 0; filter: opacity(0); }
#power5 .box3 .img2.active{ left: 16%; top: 34%;opacity: 1; filter: opacity(100); }
#power5 .box3 .img3{ width: 34%; left: -12%; top: 37%; position: absolute; transition: all 0.3s linear;opacity: 0; filter: opacity(0); }
#power5 .box3 .img3.active{ left: 21%; top: 53%;opacity: 1; filter: opacity(100); }
#power5 .box3 .box{ position: absolute; width: 74%; left: 13%; top: 6%; text-align: center; color: #ffffff; }
#power5 .box3 .ul{ overflow: hidden; position: absolute; width: 74%; left: 13%; top: 83%;  }
#power5 .box3 .ul .li{ width: 25%; float: left; box-sizing: border-box; text-align: center; }
#power5 .box3 .ul .li .icon{ width: 20%; }
#power5 .box3 .ul .li .ss{ color: #ffffff; font-size: 1.4vw; line-height: 1.8vw; }
#power5 .box3 .ul .li .color-yellow{ font-size: 1.6vw; line-height: 2vw; color: #FFC604; margin: 0.2vw auto; }
#power5 .box3 .ul .li .mr{ border-right:  2px solid #ffffff; }
#power5 .box4{ position: relative; overflow: hidden; background-color: #000000; }
#power5 .box4 .img{ margin-left: -13%;transition: all 0.3s linear; }
#power5 .box4 .img.active{ margin-left: 0%; }

#power5 .box4 .img2{ width: 68%; left: 28%; top: 40%; position: absolute; transition: all 0.3s linear; }
#power5 .box4 .img2.active{ left: 16%; top: 34%; }
#power5 .box4 .box{ position: absolute; width: 74%; left: 13%; top: 4%; text-align: center; color: #ffffff; }
#power5 .box4 .ul{ overflow: hidden; position: absolute; width: 50%; left: 25%; top: 87%;  }
#power5 .box4 .ul .li{ width: 50%; float: left; box-sizing: border-box; text-align: center; }
#power5 .box4 .ul .li .ss{ color: #ffffff; font-size: 1.4vw; line-height: 1.8vw; }
#power5 .box4 .ul .li .color-yellow{ font-size: 2vw; line-height: 2.4vw; color: #FFC604; margin: 0.2vw auto; }
#power5 .box5{ position: relative; overflow: hidden; }
#power5 .box5 .box{ color: #000000; width: 74%; left: 13%; top: 6%; text-align: center; position: absolute; }
#power5 .box5 .img2{ width: 34%; left: 3%; bottom: 0%; position: absolute; transition: all 0.3s linear; }
#power5 .box5 .img2.active{ left: 13%;  }
#power5 .box5 .img3{ width: 20%; left: 41%; top: 47%; position: absolute; opacity: 0; filter: opacity(0);  transition: all 0.3s linear 0.3s; }
#power5 .box5 .img3.active{ opacity: 1; filter: opacity(100); }
#power5 .box5 .img4{ width: 48%; left: 64%; bottom: 0%; position: absolute; transition: all 0.3s linear; }
#power5 .box5 .img4.active{ left: 54%;  }
#power5 .tips{ width: 74%; margin: 2% auto 5% auto; font-size: 1.4vw; line-height: 1.8vw; text-align: center; opacity: 1; filter: opacity(100); }
#power5 .box6{ overflow: hidden; position: relative; }
#power5 .box6 .img{ position: absolute; width: 24%; left: 38%; bottom: -40%; transition: all 0.3s linear; }
#power5 .box6 .img.active{ bottom: 0%;  }
#power5 .box6 .show3{ opacity: 0; filter: opacity(0);  transition: all 0.3s linear 0.3s; }
#power5 .box6 .show3.active{ opacity: 1; filter: opacity(100); }
#power5 .box6 .pp{ position: absolute; width: 20%; left: 13%; top:40%; }
#power5 .box6 .pp .bb{ font-size: 5vw; line-height: 5.4vw; }
#power5 .box6 .pp .ss{ font-size: 2vw; line-height: 2.4vw; }
#power5 .box6 .ul{ position: absolute; width: 24%; left: 65%; top: 20%; }
#power5 .box6 .ul .li{ padding-left: 20%; box-sizing: border-box; margin-bottom: 12%; position: relative; }
#power5 .box6 .ul .li .mm{ font-size: 1.4vw; line-height: 2vw; }
#power5 .box6 .ul .li .icon{ position: absolute; width: 15%; left: 0%; top: -12%; }
#power5 .box6 .ul .l5{ margin-top: 17%; }
#power5 .box6 .ul .l5 .icon{ top: -89%; }
#power5 .box7{ width: 63%; padding: 4% 0px; margin: 0% auto; }
#power5 .box7 .p{ position: relative; overflow: hidden; }
#power5 .box7 .p1{ width: 100%; position: relative; }
#power5 .box7 .p2{ position: relative; }
#power5 .box7 .p2 img{  margin-top: 6%; height: 25.5vw; width: auto; }
#power5 .box7 .img{ position: absolute; right: 0%; bottom: 0%; }
#power5 .box7 .text{ position: absolute; width: 10%; left: 4%; top: 4%; font-size: 4vw; line-height: 4.4vw; color: #ffffff; }
#power5 .box7 .t2{ top: 18%; }
#power5 .box7 .t3{ top: 18%; right: 0%; z-index: 1; left: inherit; }
#power5 .box8{ margin: 4% auto; width: 74%; }
#power5 .box8 .box{ color: #000000; text-align: center; }
#power5 .box8 .imgBox{ margin-top: 4%; position: relative; }
#power5 .box8 .imgBox .on{ position: absolute; width: 10%; font-size: 3vw; line-height: 3.4vw;top: 4%; right: 53%; color: #FFC604; }
#power5 .box8 .imgBox .off{ position: absolute; width: 10%; font-size: 3vw; line-height: 3.4vw;top: 4%; right: 4%; color: #FFC604; }
#power5 .box9{ margin: 4% auto; }
#power5 .box9 .box{ color: #000000; text-align: center;  margin: 4% auto 0% auto; width: 74%;}
#power5 .box9 .imgBox{ position: relative;  }
#power5 .box9 .imgBox .div{ position: absolute; background-color: #ffffff; transition: all 0.2s linear; }
#power5 .box9 .imgBox .d1{ width: 100%; height: 20%; top: 0%; left: 0%; }
#power5 .box9 .imgBox .d2{ width: 20%; height: 100%; top: 0%; right: 0%; }
#power5 .box9 .imgBox .d3{ width: 100%; height: 20%; bottom: 0%; left: 0%; }
#power5 .box9 .imgBox .d4{ width: 20%; height: 100%; top: 0%; left: 0%; }
#power5 .box9 .imgBox .d1.active{ height: 0%; }
#power5 .box9 .imgBox .d2.active{ width: 0%; }
#power5 .box9 .imgBox .d3.active{ height: 0%; }
#power5 .box9 .imgBox .d4.active{ width:0% ; }
#power5 .box10{ margin: 4% auto; }
#power5 .box10 .box{ color: #000000; text-align: center;  margin: 4% auto; width: 74%;}
#power5 .box10 .imgBox{ width: 74%; margin: 4% auto; }
#power5 .box11{ margin: 4% auto; }
#power5 .box11 .box{ color: #000000; text-align: center;  margin: 4% auto; width: 74%;}
#power5 .box11 .imgBox{ width: 74%; margin: 4% auto; }
#power5 .box12{ position: relative; }
#power5 .box12 .box{ color: #000000; text-align: center; position: absolute; top: 6%; left: 13%; width: 74%;}
#power5 .box12 .newBox{ width: 74%; position: absolute; left: 13%; top: 26%; color: #000000; text-align: center; }
#power5 .box12 .newBox .img{ width: 54%; }
#power5 .box12 .newBox .m{ font-size: 2.4vw; line-height: 2.8vw; margin: 1% auto; }
#power5 .box12 .newBox .s{ font-size: 1.4vw; line-height: 1.8vw; color: #AF7B04; }
#power5 .box12 .img222{ width: 56%; position: absolute; left: 22%; bottom: -20%; transition: all 0.3s linear; }
#power5 .box12 .img222.active{ bottom: 0%; }
#power5 .box12 .left{ position: absolute; width: 40%; left: 13%;  top: 42%; }
#power5 .box12 .right{ position: absolute; width: 40%; right: 0%; top: 42%; }
#power5 .box12 .bb{ font-size: 3vw; line-height: 3.4vw; }
#power5 .box12 .mm{ font-size: 1.4vw; line-height: 1.8vw; }
#power5 .box12 .pp{ position: relative; margin-top: -6%; }
#power5 .box12 .pp .img{ position: absolute; left: 0%; top: 0%; width: 72%; 
	transition: all 0.05s linear;
    -moz-transition: all 0.05s linear;
    -webkit-transition: all 0.05s linear;
    -o-transition: all 0.05s linear;
    opacity: 0;
    filter: alpha(opacity=0);
}
#power5 .box12 .pp .img1{ position: inherit; left: inherit; top: inherit; }
#power5 .box12 .pp .img.active{ opacity: 1; filter: alpha(opacity=100);}
#power5 .box12 .pp .img1{}
#power5 .box12 .pp .img2{transition-delay: 0.05s;-moz-transition-delay: 0.05s;-webkit-transition-delay: 0.05s;-o-transition-delay: 0.05s;}
#power5 .box12 .pp .img3{transition-delay: 0.1s;-moz-transition-delay: 0.1s;-webkit-transition-delay: 0.1s;-o-transition-delay: 0.1s;}
#power5 .box12 .pp .img4{transition-delay: 0.15s;-moz-transition-delay: 0.15s;-webkit-transition-delay: 0.15s;-o-transition-delay: 0.15s;}
#power5 .box12 .pp .img5{transition-delay: 0.2s;-moz-transition-delay: 0.2s;-webkit-transition-delay: 0.2s;-o-transition-delay: 0.2s;}
#power5 .box12 .pp .img6{transition-delay: 0.25s;-moz-transition-delay: 0.25s;-webkit-transition-delay: 0.25s;-o-transition-delay: 0.25s;}
#power5 .box12 .pp .img7{transition-delay: 0.3s;-moz-transition-delay: 0.3s;-webkit-transition-delay: 0.3s;-o-transition-delay: 0.3s;}
#power5 .box12 .pp .img8{transition-delay: 0.35s;-moz-transition-delay: 0.35s;-webkit-transition-delay: 0.35s;-o-transition-delay: 0.35s;}
#power5 .box12 .pp .img9{transition-delay: 0.4s;-moz-transition-delay: 0.4s;-webkit-transition-delay: 0.4s;-o-transition-delay: 0.4s;}
#power5 .box12 .pp .img10{transition-delay: 0.45s;-moz-transition-delay: 0.45s;-webkit-transition-delay: 0.45s;-o-transition-delay: 0.45s;}
#power5 .box12 .pp .img11{transition-delay: 0.5s;-moz-transition-delay: 0.5s;-webkit-transition-delay: 0.5s;-o-transition-delay: 0.5s;}
#power5 .box12 .pp .img12{transition-delay: 0.55s;-moz-transition-delay: 0.55s;-webkit-transition-delay: 0.55s;-o-transition-delay: 0.55s;}
#power5 .box12 .pp .img13{transition-delay: 0.6s;-moz-transition-delay: 0.6s;-webkit-transition-delay: 0.6s;-o-transition-delay: 0.6s;}
#power5 .box12 .pp .img14{transition-delay: 0.65s;-moz-transition-delay: 0.65s;-webkit-transition-delay: 0.65s;-o-transition-delay: 0.65s;}






#power5 .box13{ position: relative; }
#power5 .box13 .box{ color: #ffffff; position: absolute; top: 12%; left: 13%; width: 34%; z-index: 1; }
#power5 .box13 .boxNew{ color: #ffffff; position: absolute; top: 60%; left: 13%; width: 34%;z-index: 1; }
#power5 .box13 .imgBig{ transition: all 0.3s linear; opacity: 0.5; filter: opacity(50); }
#power5 .box13 .imgBig.active{  opacity: 1; filter: opacity(100); }
#power5 .box13 .img{ width: 18%; vertical-align: middle; }
#power5 .box14{ position: relative; }
#power5 .box14 .box{ color: #ffffff; text-align: center; position: absolute; top: 8%; left: 13%; width: 74%;}
#power5 .box15{ position: relative; }
#power5 .box15 .box{ color: #000000; position: absolute; top: 8%; right: 13%; width: 36%;}
#power5 .box15 .pp{ position: absolute; width: 20%; box-sizing: border-box; padding-left: 6%; font-size: 1.8vw; line-height: 2.2vw; }
#power5 .box15 .p1{ left: 22%; top: 10%; }
#power5 .box15 .p2{ left: 58%; top: 83%; }
#power5 .box15 .img{ width: 22%; position: absolute; left: 0%; top: 0%; }
#power5 .box16{ position: relative; }
#power5 .box16 .box{ color: #ffffff; position: absolute; top: 4%; left: 13%; width: 74%; text-align: center; }
#power5 .box16 .imgNew{ position: absolute; width: 74%; left: 13%; bottom: -12%; z-index: 1; }
#power5 .box16 .ul1{ position: absolute; width: 17%; left: 13%; top: 42%; text-align: right; }
#power5 .box16 .ul1 .li{ padding-right: 25%; box-sizing: border-box; color: #ffffff; font-size: 1.4vw; line-height: 1.8vw; margin-bottom: 24%; position: relative; }
#power5 .box16 .ul1 .li.l2,#power5 .box16 .ul1 .li.l3{ margin-top: 30%; }
#power5 .box16 .ul2{ position: absolute; width: 17%; right: 13%; top: 37%; }
#power5 .box16 .ul2 .li{ padding-left: 25%; box-sizing: border-box; color: #ffffff;  font-size: 1.4vw; line-height: 1.8vw; position: relative; margin-bottom: 24%; }
#power5 .box16 .img1{ width: 20%; position: absolute; right: 0%; top: 0%; }
#power5 .box16 .img2{ width: 20%; position: absolute; right: 0%; top: -54%; }
#power5 .box16 .img3{ width: 20%; position: absolute; right: 0%; top: -54%; }
#power5 .box16 .img4{ width: 20%; position: absolute; left: 0%; top: 0%; }
#power5 .box16 .img5{ width: 20%; position: absolute; left: 0%; top: 0%; }
#power5 .box16 .img6{ width: 20%; position: absolute; left: 0%; top: 0%; }
#power5 .box16 .img7{ width: 20%; position: absolute; left: 0%; top: -50%; }
#power5 .box17 .pt{ position: relative; }
#power5 .box17 .box{ color: #000000; position: absolute; top: 37%; left: 13%; width: 74%; text-align: center; }
#power5 .box17 .ul{ position: absolute; width: 74%; top: 80%; left: 13%; }
#power5 .box17 .ul .li{ float: left; width: 32%; margin-right: 2%; position: relative; }
#power5 .box17 .ul .li .ss{ position: absolute; width: 100%; left: 0%; top: 84%; font-size: 1.6vw; text-align: center; }
#power5 .box17 .ul .l3{ margin-right: 0%; }
#power5 .box17 .pt2{ margin-top: 16vw; }
#power5 .box17 .buttonBox{ position: relative; text-align: center; overflow: hidden; padding: 2vw 0px; box-sizing: border-box; }
#power5 .box17 .buttonBox .swiper-pagination{ width: 100%; }
#power5 .box17 .buttonBox .swiper-pagination-bullet{ background-color: inherit; height: auto; width: 14%; font-size: 1.6vw; line-height: 2vw; 
	border-bottom: 2px solid #333333; color: #333333; border-radius: inherit; box-sizing: border-box;
}
#power5 .box17 .buttonBox .swiper-pagination-bullet-active{ color: #000000; border-bottom: 2px solid #FFC603; }
#power5 .box17 .imgBox{ width: 63%; margin: 4% auto; }

#power5 .box18{ position: relative; }
#power5 .box18 .box{ color: #000000; position: absolute; top: 8%; left: 13%; width: 40%; }
#power5 .box19{ position: relative; }
#power5 .box19 .box{ color: #000000; position: absolute; top: 8%; left: 13%; width: 74%; text-align: center; }
#power5 .box19 .box .img{ width: 26%; vertical-align: middle; margin-top: -1%; }
#power5 .box19 .img1{ width: 20%; position: absolute; left: 13%; top: 34%; transition: all 0.3s linear; }
#power5 .box19 .img2{ width: 20%; position: absolute; left: 40%; top: 38%; transition: all 0.3s linear;  }
#power5 .box19 .img3{ width: 20%; position: absolute; left: 67%; top: 34%; transition: all 0.3s linear;  }
#power5 .box19 .img1.active{ top: 34%; }
#power5 .box19 .img3.active{ top: 34%; }
#power5 .box19 .img1.active1{ top: 42%; }
#power5 .box19 .img3.active1{ top: 42%; }
#power5 .box20{ position: relative; }
#power5 .box20 .box{ color: #ffffff; position: absolute; top: 8%; left: 13%; width: 74%; text-align: center; }