.big{ font-size: 2.8vw; line-height: 3.4vw; opacity:0; transform:translateY(20px); transition:all 0.3s linear; }
.middle{ font-size: 3vw; line-height: 3.4vw; margin: 0.5vw auto 1.5vw auto; opacity:0; transform:translateY(20px); transition:all 0.3s linear; }
.small{ font-size: 1.2vw; line-height: 2vw; margin-top: 2vw; opacity:0; transform:translateY(20px); transition:all 0.3s linear; }
.big.active,.middle.active,.small.active{ opacity:1; transform:translateY(0px); }
.hs{ opacity:0; transform:translateY(20px); transition:all 0.3s linear; }
.hs.active{ opacity:1; transform:translateY(0px); }
.blue{ background-color: #577e4d;-webkit-background-clip: text;-webkit-text-fill-color:#ffffff;-webkit-text-stroke:2px transparent;}
.blue.active{ background: linear-gradient(to right, #577e4d, #a3c99a);-webkit-background-clip: text;color: transparent; -webkit-text-fill-color:inherit; }
.blue2{ background: linear-gradient(to bottom, #f0f8ed, #6d8d65); }
.circleblue{ background-image: linear-gradient(to right ,#6e8e65,#fdfefd,#6e8e65); }
.colotWhite{ color:#ffffff; }
.pr{ position:relative; overflow:hidden; }
.pa{ position:absolute; }
.textCenter{ text-align:center; }
.floatLeft{ float:left; }
#g3 { color: #000000;}
#g3 img{ width: 100%; max-width: 100%; vertical-align: bottom; }
#g3 .box1{ overflow:hidden; position: relative; }
#g3 .box1 .box{ width:40%; position:absolute; left:16%; top:20%;  }
#g3 .box1 .b{ font-size:5vw; line-height:5.2vw; }
#g3 .box1 .bb{ font-size:6vw; line-height:6.2vw; font-weight:bold; }
#g3 .box1 .m{ font-size:2.6vw; line-height:3vw; margin-bottom:3%; }
#g3 .box1 .s{ font-size:1.2vw; line-height:1.6;  }
#g3 .ht{  text-align:center; margin:4% auto; overflow:hidden; }
#g3 .ht .t{ display:inline-block; font-size:3vw; line-height:3.2vw; }
#g3 .box2{ width:75%; margin:0% auto; overflow:hidden; position:relative; }
#g3 .box2 .blue2{ height:21vw; overflow:hidden; }
#g3 .box2 .p1{ width:calc(50% - 0.5vw); }
#g3 .box2 .p2{ width:calc(50% - 0.5vw); top:0px; right:0px; }
#g3 .box2 .p3{ margin-top:1vw; width:calc(25% - 1vw); }
#g3 .box2 .p4{ margin-top:1vw; width: 50%; top: 0%; left: 25%;}
#g3 .box2 .p5{ margin-top:1vw; width:calc(25% - 1vw); top:0%; right:0%; }
#g3 .box2 .p6{ width:calc(50% - 0.5vw); margin-top:1vw; }
#g3 .box2 .p7{ width:calc(50% - 0.5vw); margin-top:1vw; top:0px; right:0px; }
#g3 .box2 .p1 .img{ width:86%; left:7%; bottom:0%; }
#g3 .box2 .p2 .img{ width:92%; left:0%; bottom:0%; }
#g3 .box2 .p3 .img{ width:42%; left:29%; top:20%; }
#g3 .box2 .p4 .img{ width:84%; right:0%; bottom:0%; }
#g3 .box2 .p5 .img{ width:100%; left:0%; bottom:0%; }
#g3 .box2 .p6 .img{ width:62%; left:19%; top:22%; }
#g3 .box2 .p7 .img{ width:72%; left:14%; top:26%; }
#g3 .box2 .blue2 .img{ transition:all 0.3s linear; }
#g3 .box2 .blue2:hover .img{ transform:scale(1.2);  }
#g3 .box2 .fbs{ font-size:1vw; line-height:1.2; top:76%; }
#g3 .box2 .t1{ width:56%; left:0%; }
#g3 .box2 .t2{ width:100%; left:0%; }
#g3 .box2 .t3{ width:100%; left:0%; }
#g3 .box2 .t4{ width:62%; left:0%;  transition:all 0.1s linear;}
#g3 .box2 .blue2:hover .t4{ width:53%;  }
#g3 .box2 .t5{ width:50%; right:0%; }
#g3 .box2 .t6{ width:100%; left:0%; }
#g3 .box2 .t7{ width:55%; left:0%; }
#g3 .box2 .t8{ width:66%; right:0%; }
#g3 .box2 .t9{ width:100%; left:0%; }
#g3 .box2 .fts{ font-size:0.8vw; line-height:1.2; }
#g3 .box3 .box{ width:50%; margin:0px auto; }
#g3 .box3 .imgBox{ width:66%; margin:2% auto; height:36vw; }
#g3 .box3 .img{ width:82%; margin-left:9%; transform:scale(1.4); }
#g3 .box4{ margin-top:4%; }
#g3 .box4 .box{ width:50%; margin:0px auto; }
#g3 .box4 .imgBox{ margin:2% auto; }
#g3 .box4 .color1{ background: linear-gradient(to bottom, #ffffff, #e8fae4); }
#g3 .box4 .color2{ background: linear-gradient(to bottom, #ffffff, #d4cfff); }
#g3 .box4 .color3{ background: linear-gradient(to bottom, #ffffff, #dbdee7); }
#g3 .box4 .c1:before{ background: linear-gradient(to bottom, #aecca7, #4b5d47);  }
#g3 .box4 .c2:before{ background: linear-gradient(to bottom, #989fff, #9890d6); }
#g3 .box4 .c3:before{ background: linear-gradient(to bottom, #a6a6a6, #232323);  }
#g3 .box4 .circle{ width:30px;height:30px; border-radius:50%; margin-bottom:2vw; position:relative; border:1px solid transparent; }
#g3 .box4 .circle:before{ position:absolute; content:'';width:20px;height:20px; left:5px;top:5px; border-radius:50%; }
#g3 .box4 .swiper-slide .img{ width:22%; margin-left:39%; margin-top:2%; }     
#g3 .box4 .swiper-pagination-bullets{ width:12%; bottom:inherit; top:40%; left:10%; }
#g3 .box4 .swiper-pagination-bullet{ width:33.33%; height:auto; border-radius:inherit;float:left; margin:0px ;}
#g3 .box4 .swiper-pagination-bullet-active{ background:inherit; }
#g3 .box4 .swiper-pagination-bullet{ background:inherit; opacity:1; }
#g3 .box4 .t{ width:100%; left:0%; bottom:0px; text-align:left; font-size:1.2vw; line-height:1.5; }
#g3 .box4 .swiper-pagination-bullet .t{ opacity:0; }
#g3 .box4 .swiper-pagination-bullet-active .t{ opacity:1; }
#g3 .box4 .swiper-pagination-bullet-active .c1{ border:1px solid #aecca7; }
#g3 .box4 .swiper-pagination-bullet-active .c2{ border:1px solid #989fff; }
#g3 .box4 .swiper-pagination-bullet-active .c3{ border:1px solid #a6a6a6; }
#g3 .box4 .ul{ width:14%; left:72%; top:32%; z-index:3; }
#g3 .box4 .li{ margin-bottom:14%; }
#g3 .box4 .b{ font-size:1.4vw; line-height:1.5; }
#g3 .box4 .s{ font-size:1vw; line-height:1.5; }
#g3 .box4 .tips{ font-size:0.8vw; line-height:1.5; margin:2% auto; }
#g3 .box5 .box{ width:66%; margin:4% auto 2%; }
#g3 .box5 .floatLeft{ width:45%; margin-right:10%; }
#g3 .box5 .floatLeft:last-child{ margin-right:0px; }
#g3 .box5 .imgBox{ margin:2% auto; width:66%; overflow:hidden; opacity:0; transform:translateY(20px); transition:all 0.3s linear; }
#g3 .box5 .imgBox.active{ opacity:1; transform:translateY(0px); }
#g3 .box5 .big{ font-size:2.4vw; }
#g3 .box5 .small{ margin-top:0px; }
#g3 .box5 .ul{ margin:2% auto; overflow:hidden; width:66%; }
#g3 .box5 .li{ width:25%; margin-right:0px; opacity:0; transform:translateY(20px); transition:all 0.3s linear; }
#g3 .box5 .li.active{ opacity:1; transform:translateY(0px); }
#g3 .box5 .b{ font-size:1.4vw; line-height:1.5; }
#g3 .box5 .s{ font-size:1vw; line-height:1.5; }
#g3 .box6 .box{ width:66%; margin:0px auto; }
#g3 .box6 .imgBox{ width:66%; margin:2% auto; }
#g3 .box6 .img{  transform:scale(1.4); }
#g3 .box6 .ul{ width:38%; left:10%; top:12%; z-index:3; }
#g3 .box6 .li{ margin-bottom:14%; }
#g3 .box6 .b{ font-size:1.4vw; line-height:1.5; color:#ffffff; }
#g3 .box6 .s{ font-size:0.8vw; line-height:1.5; color:#ffffff; }
#g3 .box7 .bgcolor{ width:100%; height:0%; background: linear-gradient(to bottom, #577e4d, #a3c99a); bottom:0px;left:0px; 
	transition: all 0.3s linear;
}
#g3 .box7 .bgcolor.active{ height:100%; }
#g3 .box7 .img{ z-index:2; }
#g3 .box7 .imgBox1{ width:80%; margin-left:10%; z-index:3;margin-top:-7%; }
#g3 .box7 .box{ width:80%; left:10%; top:38%; }
#g3 .box8 .video{ width:50%; margin-left:25%; transform:translateY(-9%); }
#g3 .box9{ width:66%; margin:2% auto; }
#g3 .box9 .box{ width:40%; }
#g3 .box9 .big{ font-size:2vw; opacity:1; transform:translateY(0px); }
#g3 .box9 .small{ font-size:0.8vw; line-height:1.5; margin-top:0px; opacity:1; transform:translateY(0px); }
#g3 .box9 .swiper-button-next,#g3 .box9 .swiper-button-prev{ width:40px;height:40px; top:91%; }
#g3 .box9 .swiper-button-next{ background-image: url('../Images/g3max/overview/rb.png'); background-size: cover; right: 0px; left: inherit; }
#g3 .box9 .swiper-button-prev{ background-image: url('../Images/g3max/overview/lb.png'); background-size: cover; right: 50px; left: inherit; }
#g3 .box9 .my-button-disabled{ opacity:0.2; }
#g3 .box10 .imgBox{ width:66%; margin:1% auto 2%; }
#g3 .box10 .img{ width:48%; }
#g3 .box10 .pa{ right:0px; top:0px; }
#g3 .box10 .box{ width:32%; margin:1% 0px 2% 17%; }
#g3 .box10 .big{ font-size:2vw;  }
#g3 .box10 .small{ font-size:0.8vw; margin-top:0px; line-height:1.5; }
#g3 .box11 .imgBox{ width:66%; margin:1% auto 2%; }
#g3 .box11 .box{ width:32%; margin:1% 0px 2% 17%; }
#g3 .box11 .big{ font-size:2vw;  }
#g3 .box11 .small{ font-size:0.8vw; margin-top:0px; line-height:1.5; }
#g3 .box12 .imgBox{ width:66%; margin:1% auto 2%; }
#g3 .box12 .img{ width:48%; }
#g3 .box12 .pa{ right:0px; top:0px; }
#g3 .box12 .box{ width:32%; margin:1% 0px 2% 17%; }
#g3 .box12 .big{ font-size:2vw;  }
#g3 .box12 .small{ font-size:0.8vw; margin-top:0px; line-height:1.5; }
#g3 .box13 .box{ width:66%; margin:2% auto; }
#g3 .box13 .ul{ overflow:hidden; margin:4% auto; width:66%; }
#g3 .box13 .li{ width:23.5%; margin-right:2%; overflow:hidden; background: linear-gradient(to bottom, #E9FFEA, #A3C99A); border-radius:2vw; }
#g3 .box13 .li:last-child{ margin-right:0px; }
#g3 .box13 .img{ width:30%; margin:9% auto 2%; }
#g3 .box13 .s{ font-size:0.8vw; line-height:1.5; }
#g3 .box13 .b{ font-size:1.8vw; line-height:1.5; }
#g3 .box13 .gray{ color:#AFB8C6; font-size:0.8vw; line-height:1.5; margin-bottom:7%; display:inline-block; }
#g3 .box13 .out{ opacity:0; }
#g3 .box13 .tips{ font-size:0.8vw; line-height:1.5;  }
#g3 .box14 .imgBox{ width:16%; margin:5% auto 4%; }
#g3 .box14 .s{ width:66%; margin:4% auto; font-size:1vw; line-height:1.5; }
#g3 .box14 .fixedBox{ width:100%; }
#g3 .box14 .ulBox{ width:66%; margin:9% auto; overflow:hidden; }
#g3 .box14 .ul{ width: 100%; opacity:0; transition:all 0.3s linear; }
#g3 .box14 .li{ width:32%; margin-right:2%; background: linear-gradient(to bottom, #F7F7F7, #F7F7F7); overflow:hidden; }
#g3 .box14 .li:last-child{ margin-right:0px; }
#g3 .box14 .img{ width:56%; display:block; margin: 18% auto; }
#g3 .box14 .ul.active{ z-index:2; opacity:1; }
#g3 .box14 .ul:nth-child(1){ z-index:1; }
#g3 .box14 .ul:nth-child(2),#g3 .box14 .ul:nth-child(3){ top: 0%; left: 0%; }
#g3 .box15 .imgBox{ width:40%; margin:4% auto 4%  43%; }
#g3 .box15 .imgBox .img{ width:36%; margin-left:40%; }
#g3 .box15 .p{ left:27%; top:41%; width:7%; overflow:hidden; }
#g3 .box15 .p2{ left:0%; top:0%; width:100%; -webkit-animation: slide 2s linear infinite ;animation: slide 2s  linear infinite ; }
@-webkit-keyframes slide{
	0% { top: 0%; }
    50% { top: 100%; }
    100%{ top: 0%;  }
}
@keyframes slide{
	0% { top: 0%; }
    50% { top: 100%; }
    100%{ top: 0%;  }
}
#g3 .box15 .box{ width:30%; left:17%; top:36%; }
#g3 .box15 .big{ font-size:2vw; }
#g3 .box15 .small{ margin-top:2%; }
#g3 .box16 .imgBox{ width:18%; margin:0% auto 2% 28%; }
#g3 .box16 .img{ margin-top:60%; }
#g3 .box16 .p{ width:80%; top:10%; left:10%; }
#g3 .box16 .img1{ animation:circleRoate 5s infinite linear; }
@-webkit-keyframes circleRoate{
	from{transform: rotate(0deg);}
    to{transform: rotate(360deg);}
}
@keyframes circleRoate{  
    from{transform: rotate(0deg);}
    to{transform: rotate(360deg);}
}  
#g3 .box16 .img2{ width:80%; left:10%; top:10%; }
#g3 .box16 .img3{ width:100%; top:0%; left:0%;animation:slide2 5s infinite linear; }
@-webkit-keyframes slide2{
	0% { top: 0%; }
    50% { top: 90%; }
    100%{ top: 0%;  }
}
@keyframes slide2{
	0% { top: 0%; }
    50% { top: 90%; }
    100%{ top: 0%;  }
}
#g3 .box16 .box{ width:30%; left:60%; top:54%; }
#g3 .box16 .big{ font-size:2vw; }
#g3 .box16 .small{ margin-top:0px; }
#g3 .box16 .pa.hs.active{ transition-delay:0.5s; }
#g3 .box17 .imgBox{ width:66%; margin:2% auto; }
#g3 .box17 .big{ left:0%; width:100%; top:7%; color:#ffffff; opacity:1; }
#g3 .box17 .ul{ width:66%; margin:4% auto 2%; overflow:hidden; }
#g3 .box17 .li{ width:25%; }
#g3 .box17 .m{ font-size:1.4vw; line-height:1.5; }
#g3 .box17 .icon{ width:auto; max-width:inherit; height:4vw; margin-bottom:4%; }
#g3 .box18 .button{ font-size:2.6vw; line-height:1.5; width:40%; left:17%; top:48%; color:#000000; }