.big{ font-size: 2.8vw; line-height: 3.4vw; }
.middle{ font-size: 3vw; line-height: 3.4vw; margin: 0.5vw auto 1.5vw auto; }
.small{ font-size: 1.4vw; line-height: 2.2vw; margin-top: 2vw; }
.gradient{ background: linear-gradient(to left, #95e2ff, #0da2fe);-webkit-background-clip: text;color: transparent; }
#power7 img{ width: 100%; max-width: 100%; vertical-align: bottom; }
#power7 .box1{ overflow: hidden; position: relative; }
#power7 .box1 .pp{ position: absolute; color: #ffffff; }
#power7 .box1 .p1{ width: 40%; left: 22%; top: 70%;  }
#power7 .box1 .p1 .bb{ font-size: 4vw; line-height: 4.4vw; }
#power7 .box1 .p1 .ss{ font-size: 3vw; line-height: 3.2vw; }
#power7 .box1 .p2{ width: 26%; top: 71%; left: 67%; }
#power7 .box1 .p2 .s{ font-size: 1vw; line-height: 1.4vw; margin-bottom: 2%; }
#power7 .box2{ position: relative; overflow: hidden; }
#power7 .box2 .ss{ position: absolute; font-size: 1.4vw; line-height: 1.6vw; text-align: center; font-weight: bold; }
#power7 .box2 .s1{ width: 19.5%; left: 14.8%; top: 11%; }
#power7 .box2 .s2{ width: 29.5%; left: 35.5%; top: 11%; }
#power7 .box2 .s3{ width: 18.5%; left: 66.4%; top: 11%; }
#power7 .box2 .s4{ width: 29.5%; left: 35.5%; top: 55%; }
#power7 .box2 .s5{ width: 19.5%; left: 14.8%; top: 92%; color: #ffffff; }
#power7 .box2 .s6{ width: 29.5%; left: 35.5%; top: 68%; }
#power7 .box2 .s7{ width: 18.5%; left: 66.4%; top: 56%; }
#power7 .box3{ position: relative; overflow: hidden; background-color: #000000; }
#power7 .box3 .fixedBox{ position: relative; width: 100%; min-height: 30vw; }
#power7 .box3 .fixedBox .box{ position: absolute; width: 70%; left: 15%; top: 12%; transition: all 0.3s linear; opacity: 0; text-align: center; color: #ffffff; }
#power7 .box3 .fixedBox .img{ position: absolute; width: 118%; top: 43%; right: 0%; max-width: inherit; transform: translateX(90%); }
#power7 .box4{ position: relative; overflow: hidden; background-color: #000000; }
#power7 .box4 .box{ width: 70%; margin:2% auto; color: #ffffff; text-align: center; }
#power7 .box4 .imgBox{ width: 68%; margin: 4% auto; overflow: hidden; position: relative; }
#power7 .box4 .circle{ width: 50px; height: 50px; border-radius: 25px; display: inline-block; vertical-align: bottom; }
#power7 .box4 .c1{ background: linear-gradient(45deg, #95e2ff, #0da2fe) ; }
#power7 .box4 .c2{ background: linear-gradient(45deg, #fff495, #ffa200) ; }
#power7 .box4 .c3{ background: linear-gradient(45deg, #828282, #141414) ; }
#power7 .box4 .swiper-pagination1{ position: relative; width: 100%; margin-top: 2%; }
#power7 .box4 .swiper-pagination-bullet{ width: 33.33%; height: auto; border-radius: inherit; opacity: 1; }
#power7 .box4 .swiper-pagination-bullet-active{ background-color: inherit ; }
#power7 .box4 .text{ color: #808080; font-size: 1.4vw; line-height: 50px; display: inline-block; height: 50px; }
#power7 .box4 .swiper-pagination-bullet-active .text{ color: #ffffff; }
#power7 .box5{ overflow: hidden; position: relative; background-color: #000000; }
#power7 .box5 .fixedBox{ overflow: hidden; position: relative; width: 100%; }
#power7 .box5 .fixedBox .box{ width: 70%; left: 15%; top: 10%; position: relative; opacity: 0; transition: all 0.3s linear; 
    color: #ffffff; z-index: 3; text-align: center;
}
#power7 .box5 .fixedBox .clientHeight{ width: 100%; position: relative; min-height: 30vw; }
#power7 .box5 .fixedBox .img{ position: absolute; left: 15%; width: 70%; bottom: 0%; z-index: 2; opacity: 0; transition: all 0.3s linear; }
#power7 .box5 .fixedBox .img2{ position: absolute; left: 0%; width: 100%; top: 0%; z-index: 1; transform: scale(1); }
#power7 .box5 .fixedBox .bg{ position: absolute; width: 45vw; height: 20vw; top: 46%; left: 28%; background-color: #000000; z-index: 3; 
    border-radius: 2.8vw; opacity: 0;
}
#power7 .box5 .fixedBox .bg.active{ animation: shan 0.6s 1 forwards; }
#power7 .box5 .fixedBox .bg.active2{ opacity: 0.4 !important; }
@keyframes shan{
    0%{ opacity: 0; }
    50%{ opacity: 1; }
    100%{ opacity: 0; }
}
#power7 .box5 .fixedBox .img3{ position: absolute; left: 35%; width: 30%; top: 54%; z-index: 4; opacity: 0; }
#power7 .box5 .fixedBox .img3.active{  transition: all 0.3s linear 0.3s; opacity: 1; }
#power7 .box6{ overflow: hidden; position: relative; background-color: #000000; }
#power7 .box6 .box{ margin: 4% auto 0% auto; width: 70%; text-align: center; color: #ffffff; }
#power7 .box6 .fixedBox{ overflow: hidden; position: relative; width: 100%; }
#power7 .box6 .fixedBox .clientHeight{ width: 100%; position: relative; min-height: 30vw; }
#power7 .box6 .fixedBox .img{ position: absolute; width: 100%; bottom: 0%; left: 0%; }
#power7 .box6 .fixedBox .img2{ position: absolute; width: 120%; bottom: 0%; left: -40%; opacity: 0; transition: all 0.3s linear;
    max-width: inherit;
}
#power7 .box6 .fixedBox .img2.active{ width: 81%;  left: 12%; opacity: 1;}
#power7 .box6 .fixedBox .p{ position: absolute; left: 8%; width: 23%; color: #ffffff; text-align: right; opacity: 0; transition: all 0.3s linear; }
#power7 .box6 .fixedBox .p1{ top: 28%; opacity: 1; }
#power7 .box6 .fixedBox .p2{ top: 44%; left: 6%; }
#power7 .box6 .fixedBox .p3{ top: 60%; left: 6%; }
#power7 .box6 .fixedBox .p4{ top: 76%; left: 6%; }
#power7 .box6 .fixedBox .p2.active{ transition-delay:0.2s; left: 8%; opacity: 1; }
#power7 .box6 .fixedBox .p3.active{ transition-delay:0.4s; left: 8%; opacity: 1;}
#power7 .box6 .fixedBox .p4.active{ transition-delay:0.6s; left: 8%;opacity: 1; }
#power7 .box6 .fixedBox .b{ font-size: 3vw; line-height: 3.4vw; font-weight: bold; }
#power7 .box6 .fixedBox .s{ font-size: 1.4vw; line-height: 1.8vw; }
#power7 .box7{ overflow: hidden; position: relative; background-color: #000000; }
#power7 .box7 .box{ width: 70%; margin:4% auto; color: #ffffff; text-align: center; }
#power7 .box7 .img{ display: block; margin:2% auto; width: 70%; }
#power7 .box8{ position: relative; overflow: hidden; background-color: #000000; }
#power7 .box8 .fixedBox{ position: relative; width: 100%; }
#power7 .box8 .fixedBox .clientHeight{ position: relative; width: 100%; min-height: 30vw; }
#power7 .box8 .fixedBox .clientHeight .box{ position: absolute; width: 70%; left: 15%; top: 10%; text-align: center; color: #ffffff; 
    opacity: 0; transition: all 0.3s linear; color: #ffffff;
}
#power7 .box8 .fixedBox .clientHeight .box.active{ opacity: 1; }
#power7 .box9{ overflow: hidden; position: relative; background-color: #000000; }
#power7 .box9 .fixedBox{ position: relative; overflow: hidden; width: 100%; }
#power7 .box9 .fixedBox .clientHeight{ width: 100%; position: absolute; min-height: 30vw; }
#power7 .box9 .fixedBox .overflow{ overflow: hidden; }
#power7 .box9 .fixedBox .box{ position: absolute; width: 70%; left: 15%; top: 15%; text-align: center; color: #ffffff;  }
#power7 .box9 .fixedBox .box1{ position: absolute; width: 70%; left: 15%; top: 22%; text-align: center; color: #ffffff; }
#power7 .box9 .fixedBox .box1 .toTop1{ transform: translateY(-8vw); transition: all 0.3s linear; }
#power7 .box9 .fixedBox .box2{ position: absolute; width: 70%; left: 15%; top: 18%; text-align: center; color: #ffffff; }
#power7 .box9 .fixedBox .box2 .toTop2{ transform: translateY(-8vw); transition: all 0.3s linear; }
#power7 .box9 .fixedBox .img{ width: 38%; position: absolute; left: 31%; top: 40%; }
#power7 .box9 .fixedBox .img2{ width: 34%; position: absolute; left: 106%; top: 106%; }
#power7 .box9 .fixedBox .img3{ width: 34%; position: absolute; left: 106%; top: 106%; }
#power7 .box10{ position: relative; overflow: hidden; }
#power7 .box10 .fixedBox{ position: relative; overflow: hidden; width: 100%; }
#power7 .box10 .fixedBox .clientHeight{ position: relative; width: 100%; min-height: 30vw; }
#power7 .box10 .fixedBox .clientHeight .box{ position: absolute; width: 70%; left: 15%; top: 10%; color: #ffffff; text-align: center; }
#power7 .box10 .fixedBox .clientHeight .pp{ position: absolute; color: #ffffff; width: 30%; opacity: 0; transition: all 0.3s linear; }
#power7 .box10 .fixedBox .clientHeight .p1{ top: 35%; left: 4%; text-align: right; }
#power7 .box10 .fixedBox .clientHeight .p2{ top: 35%; left: 64%; }
#power7 .box10 .fixedBox .clientHeight .p3{ top: 65%; left: 4%; text-align: right; }
#power7 .box10 .fixedBox .clientHeight .p4{ top: 65%; left: 64%; }
#power7 .box10 .fixedBox .clientHeight .pp.active{ opacity: 1; }
#power7 .box10 .fixedBox .clientHeight .p2.active{  transition-delay: 0.3s; }
#power7 .box10 .fixedBox .clientHeight .p3.active{ transition-delay: 0.6s; }
#power7 .box10 .fixedBox .clientHeight .p4.active{ transition-delay: 0.9s; }
#power7 .box10 .fixedBox .clientHeight .b{ font-size: 2vw; line-height: 2.4vw; }
#power7 .box10 .fixedBox .clientHeight .s{ font-size: 1.4vw; line-height: 1.8vw; }
#power7 .box11{ overflow: hidden; position: relative; background-color: #000000; }
#power7 .box11 .img{ width: 100%; }
#power7 .box11 .box{ width: 40%; position: absolute; left: 55%; top: 35%; color: #ffffff; }
#power7 .box12{ position: relative; overflow: hidden; background-color: #000000; }
#power7 .box12 .fixedBox{ position: relative; width: 100%; overflow: hidden; }
#power7 .box12 .fixedBox .clientHeight{ position: relative; width: 100%; overflow: hidden; min-height: 30vw; }
#power7 .box12 .fixedBox .clientHeight .box{ position: absolute; width: 40%; left: 15%; color: #ffffff; opacity: 0; z-index: 1; }
#power7 .box12 .fixedBox .clientHeight .b1{ top: 30%; }
#power7 .box12 .fixedBox .clientHeight .b2{ top: 41%; }
#power7 .box12 .fixedBox .clientHeight .b3{ top: 44%; }
#power7 .box12 .fixedBox .clientHeight .b1.active{ opacity: 1; transition: all 0.3s linear; z-index: 2; }
#power7 .box12 .fixedBox .clientHeight .b2.active{ opacity: 1; transition: all 0.3s linear; z-index: 3; }
#power7 .box12 .fixedBox .clientHeight .b3.active{ opacity: 1; transition: all 0.3s linear; z-index: 4; }
#power7 .box12 .fixedBox .clientHeight .img{ width: 30%; position: absolute; bottom:0%; right: 10%; }
#power7 .box12 .fixedBox .clientHeight .imgAll{ position: absolute;  opacity: 0; }
#power7 .box12 .fixedBox .clientHeight .img1{ top: 34%;left: 58%; width: 4%; }
#power7 .box12 .fixedBox .clientHeight .img2{ top: 18%;left: 70.8%; width: 2%; }
#power7 .box12 .fixedBox .clientHeight .img3{ top: 23%;left: 81%; width: 5%; }
#power7 .box12 .fixedBox .clientHeight .img1.active{ opacity: 1;  transition: all 0.3s linear; }
#power7 .box12 .fixedBox .clientHeight .img2.active{ opacity: 1;  transition: all 0.3s linear; }
#power7 .box12 .fixedBox .clientHeight .img3.active{ opacity: 1;  transition: all 0.3s linear; }
#power7 .box12 .ul{ overflow: hidden; margin-top: 6%; transform: translateX(-7%); }
#power7 .box12 .ul .li{ float: left ; width: 33.33%; text-align: center; }
#power7 .box12 .ul .li .img5{ height: 4vw ; width: auto; max-width: auto; margin-bottom: 2%; }
#power7 .box12 .ul .li .s{ font-size: 1.4vw; line-height: 1.8vw; color: #ffffff; }
#power7 .box13{ position: relative; overflow: hidden; background-color: #000000; }
#power7 .box13 .box{ width: 70%; text-align: center; margin:4% auto; }
#power7 .box13 .ul{ overflow: hidden; margin:4% auto 8% auto; width: 80%; }
#power7 .box13 .ul .li{ float: left; width: 25%; text-align: center; }
#power7 .box13 .ul .li .s{ color: #7BD7FF; font-size: 1.4vw; line-height: 1.8vw; margin-top: 4%; }
#power7 .box13 .ul .li .img{ width: 32%; }