
.big{ font-size: 2.6vw; line-height: 1.2; }
.middle{ font-size: 1.6vw; line-height: 2.4vw; margin: 0.5vw auto 1vw auto; }
.small{ font-size: 1.2vw; line-height: 1.4; margin-top: 1vw; }
.gradientBlue{ background: linear-gradient(to bottom, #21e7d0, #00c9b6);-webkit-background-clip: text;color: transparent; }
.gradientGray{ background: linear-gradient(to left, #89898C, #C4C3C5);-webkit-background-clip: text;color: transparent; }
.upTo{ transform:translateY(4%); opacity:0; transition:all 0.2s linear; }
.upDown{ transform:translateY(0%); opacity:1; }
.delay{ transition-delay: 0.2s; }
.overflow{ overflow:hidden; }
.float{ float:left; }
.showPoint{ opacity:0; filter:alpha(opacity=0); transform:translateY(10%); transition:all 0.3s linear; }
.showPoint.active{ opacity:1; filter:alpha(opacity=100); transform:translateY(0%); }
#activet1{ color:#000000; }
#activet1 img{ width: 100%; max-width: 100%; vertical-align: bottom; }
#activet1 .box1{ position:relative; }
#activet1 .box1 .box{ width:40%; left:10%; top:30%; position:absolute; }
#activet1 .box1 .b{ font-size:3vw; line-height:1; }
#activet1 .box1 .m{ font-size:2vw; line-height:1; margin:2% 0px 6%; }
#activet1 .box1 .s{ font-size:1vw; line-height:1.8; }
#activet1 .box2{ position:relative; width:80%; margin:8% auto; }
#activet1 .box2 .left{ width:74.5%; }
#activet1 .box2 .pt{ float:left; width:32%; margin-right:2%; margin-bottom:2%; height:16vw; background-color:#ededee; position:relative;overflow:hidden; }
#activet1 .box2 .mr{ margin-right:0px; }
#activet1 .box2 .pt .box{ width:100%; left:0%; top:2vw;  position:absolute; text-align:center; font-size:1vw; line-height:1.2; }
#activet1 .box2 .p1 .img{ position:absolute; width:80%; left:10%; top:38%; }
#activet1 .box2 .p2 .img{ position:absolute; width:80%; left:10%; top:45%; }
#activet1 .box2 .p3 .img{ position:absolute; width:52%; left:24%; top:40%; }
#activet1 .box2 .p4 .img{ position:absolute; width:100%; left:0%; bottom:0%; }
#activet1 .box2 .p5 .img{ position:absolute; width:90%; left:13%; top:46%; }
#activet1 .box2 .p6 .img{ position:absolute; width:100%; left:0%; top:37%; }
#activet1 .box2 .p7 .img{ position:absolute; width:80%; left:10%; top:26%; }
#activet1 .box2 .p8 .img{ position:absolute; width:48%; left:26%; top:34%; }
#activet1 .box2 .p9 .img{ position:absolute; width:90%; left:7%; top:10%; }
#activet1 .box2 .p10 .img{ position:absolute; width:100%; left:0%; top:27%; }
#activet1 .box2 .p11 .img{ position:absolute; width:100%; left:0%; bottom:0%; }
#activet1 .box2 .p9{ background-color:#000000; color:#ffffff; }
#activet1 .box2 .p10{ background-color:#000000; color:#ffffff; }
#activet1 .box2 .p4{ width:100%; height:24.5vw; margin-bottom:7.4%; }
#activet1 .box2 .p11{ width:100%; height:24.5vw; }
#activet1 .box2 .right{ width:23.5%; top:0%; right:0%; position:absolute; }
#activet1 .box3{ position:relative; width:80%; margin:0px auto; }
#activet1 .box3 .box{ position:absolute; left:5%; width:90%; top:4%; color:#ffffff; text-align:center; }
#activet1 .box3 .ul{ width:80%; position:absolute; left:10%; top:64%; }
#activet1 .box3 .ul .li{ width:25%; text-align:center; color:#ffffff; }
#activet1 .box3 .ul .li .b{ font-size:1.4vw; line-height:1.2; margin-bottom:2%; }
#activet1 .box3 .ul .li .s{ font-size:1; line-height:1; }
#activet1 .box3 .img-ul{ width:80%; position:absolute; left:10%; top:78%; }
#activet1 .box3 .img-ul .li{ width:23.5%; margin-right:2%; overflow:hidden; }
#activet1 .box3 .img-ul .li.mr{ margin-right:0px; }
#activet1 .box3 .img-ul .li .img-box{ width:100%; height: 12vw; overflow: hidden; background: linear-gradient(to bottom, #1b1b1b, #121212);color: transparent;
	position: relative; 
}
#activet1 .box3 .img-ul .li .img-box .img1{ width:60%; position:absolute; left:20%; top:0%; }
#activet1 .box3 .img-ul .li .img-box .img2{ width:60%; position:absolute; left:20%; bottom:0%; }
#activet1 .box3 .img-ul .li .img-box .img3{ width:42%; position:absolute; left:29%; top:10%; }
#activet1 .box3 .img-ul .li .img-box .img4{ width:100%; position:absolute; left:0%; top:0%; }
#activet1 .box3 .img-ul .li .s{ font-size:0.8vw; line-height:1.4; margin-top:4%; color:#ffffff; }
#activet1 .box4{ position:relative; overflow:hidden; }
#activet1 .box4 .box{ width:75%; margin:4% auto 2%; text-align:center; }
#activet1 .box4 .ul{ width:72%; margin:2% auto; text-align:center; }
#activet1 .box4 .ul .li{ width:50%;  }
#activet1 .box4 .ul .li .img{ width:93%; background-color:#000000; height:32vw; position:relative; margin:0px auto; border-radius:0.5vw; }
#activet1 .box4 .ul .li .s{ font-size:1vw; line-height:1.2; margin-top:2%; }
#activet1 .box4 .ul .li .img img{  position:absolute; top:0%; left:21%; width:58%; }
#activet1 .box4 .ul .li .img1 img{  position:absolute; top:0%; left:0%; width:100%; }
#activet1 .box5{ position:relative; overflow:hidden; }
#activet1 .box5 .box{ width:75%; margin:6% auto 4%; text-align:center; }
#activet1 .box5 .img-box{ width:80%; margin:2% auto; }
#activet1 .box5 .ul{ width:80%; margin:2% auto; }
#activet1 .box5 .ul .li{ width:25%; text-align:center;  }
#activet1 .box5 .ul .img{ width:13%; margin-right:4%; vertical-align:middle; margin-left:18%; }
#activet1 .box5 .ul .t{ width:65%; vertical-align:middle; text-align:left; }
#activet1 .box5 .ul .b{ font-size:1.4vw; line-height:1; }
#activet1 .box5 .ul .s{ font-size:1vw; line-height:1; margin-top:2%; }
#activet1 .box6{ position:relative; overflow:hidden; }
#activet1 .box6 .box{ width:75%; margin:8% auto 6%; text-align:center; }
#activet1 .box6 .img-box{ width:80%; margin:2% auto; }
#activet1 .box7{ position:relative; overflow:hidden; }
#activet1 .box7 .box{ width:75%; margin:8% auto 6%; text-align:center; }
#activet1 .box7 .img-box{ width:80%; margin:2% auto; }
#activet1 .box7 .ul{ width:80%; margin:0px auto 2%; }
#activet1 .box7 .li{ width:33.33%; }
#activet1 .box7 .li .img{ width:9%; margin-left:25%; margin-right:4%; }
#activet1 .box7 .t{ width:62%; }
#activet1 .box7 .b{ font-size:1.2vw; line-height:1; margin-bottom:2%; }
#activet1 .box7 .s{ font-size:1vw; line-height:1; }
#activet1 .box8{ position:relative; overflow:hidden; }
#activet1 .box8 .box{ width:75%; margin:4% auto; text-align:center; }
#activet1 .box8 .img-box{ background-color:#e6e6e6; border-radius:1vw; position:relative; height:36vw; width:80%; margin:2% auto; }
#activet1 .box8 .img-box .img{ position:absolute; width:93%; right:0px;  top:16%; }
#activet1 .box8 .ul{ width:80%; margin:2% auto; }
#activet1 .box8 .ul .li{ width:49%; margin-right:2%; margin-bottom:2%; background-color:#000101; height:22.3vw; position:relative; border-radius:1.7vw; }
#activet1 .box8 .ul .white{ background-color:#ffffff; }
#activet1 .box8 .ul .mr{ margin-right:0px; }
#activet1 .box8 .ul .img1{ position:absolute; left:0%; top:14%; width:118%; max-width:auto; }
#activet1 .box9{ width:90%; margin:4% auto; position:relative; }
#activet1 .box9 .box{ width: 60%; position:absolute; left:20%; top:10%; text-align:center; color:#ffffff; }
#activet1 .box10{ position:relative; overflow:hidden; }
#activet1 .box10 .box{ width:75%; margin:4% auto; text-align:center; }
#activet1 .box10 .img-box{ width:80%; margin:2% auto; }
#activet1 .box10 .img{ width:49%; margin-right:2%; }
#activet1 .box10 .mr{ margin-right:0px; }
#activet1 .box11{ position:relative; overflow:hidden; }
#activet1 .box11 .box{ width:75%; margin:6% auto 4%; text-align:center; }
#activet1 .box11 .img-box{ width:80%; margin:2% auto 0%; }
#activet1 .box11 .img1{ width:9%; margin-left:18.5%; }
#activet1 .box11 .ul{ width:100%; margin:0% auto 6%;  }
#activet1 .box11 .li{ width:20%; text-align:center; }
#activet1 .box11 .imgs{ width:26%; margin:0px auto; }
#activet1 .box11 .t{ font-size:1vw; line-height:1; margin-top:2%; }
#activet1 .box12{ position:relative; overflow:hidden; background-color:#020202; }
#activet1 .box12 .box{ width:75%; margin:4% auto; text-align:center; color:#ffffff; }
#activet1 .box12 .img-box{ width:60%; margin:2% auto; }
#activet1 .box13{ position:relative; overflow:hidden; background-color:#020202; margin-bottom:8%; }
#activet1 .box13 .box{ width:29%; position: absolute; left: 58%; top: 34%; color:#ffffff; }
#activet1 .box13 .img{ width:135%; }
#activet1 .box13 .img-box{ width:56%; height:50vw; }
#activet1 .box14{  position:relative; padding-bottom:2%; }
#activet1 .box14 .boxbb{ width:75%; margin:0% auto 4%; color:#ffffff; text-align:center; position:relative; }
#activet1 .box14 .boxbb .img{ width:6%; margin:0px auto 2%; }
#activet1 .box14 .b{ font-size:1.2vw; line-height:1; }
#activet1 .box14 .s{ font-size:0.8vw; line-height:1.2; margin-top:2%; }
#activet1 .box14 .img-boxs{ width:80%; margin:2% auto; overflow:hidden; text-align:center; position:relative; }
#activet1 .box14 .is1{ position:absolute; width:24%; left:12%; top:3%; }
#activet1 .box14 .is2{ width: 30%; }
#activet1 .box14 .is3{ position:absolute; width:34%; left:58%; top:3%; }
#activet1 .box14 .bt{ width:60%; position:absolute; left:20%; top:67%; }
#activet1 .box14 .dd{ width:48%; position:absolute; color:#ffffff; box-sizing:border-box; padding:0px 4%; text-align:left; }
#activet1 .box14 .left{ left:0%; top:20%; }
#activet1 .box14 .right{ right:0%; top:20%; }
#activet1 .box15{ margin:0px auto 4%; width:80%; }
#activet1 .box15 .box{ width:60%;  }
#activet1 .box15 .img-box{ width:100%; margin:2% auto; }
#activet1 .box15 .img{ width:60%; }
#activet1 .box15 .img1{ width:60%; margin-left:40%; margin-top:2%; }
#activet1 .box15 .t{ width:60%; margin:2% 0px 0px 40%; }
#activet1 .box16{ margin:0px auto 2%; }
#activet1 .box16 .box{ margin:6% auto 4%; width:80%;  }
#activet1 .box16 .img-box{ margin:2% auto; position:relative; }
#activet1 .box16 .mm{ position:relative; overflow:hidden; margin:0px auto; width:99%; }
#activet1 .box16 .mm .m{ position:relative; }
#activet1 .box16 .mm .mt{ margin-top:1%; }
#activet1 .box16 .img1{ position:relative; width:29%; }
#activet1 .box16 .img2{ position:absolute; width:31.8%; left:27.6%; top:0%; }
#activet1 .box16 .img3{ position:absolute; width:42.2%; right:0%; top:0%; }
#activet1 .box16 .img4{ position:relative; width:26.5%; }
#activet1 .box16 .img5{ position:absolute; width:31.7%; left:25.2%; bottom:0%; }
#activet1 .box16 .img6{ position:absolute; width:24.2%; left:55.5%; bottom:0%; }
#activet1 .box16 .img7{ position:absolute; width:21.7%; right:0%; bottom:0%; }
#activet1 .box16 .right{ position:absolute; left:0%; top:0%; width:100%; }
#activet1 .box16 .left{ -webkit-animation: toLeft 7s linear infinite; animation: toLeft 7s linear infinite; }
@-webkit-keyframes toLeft {
   0% { transform: translateX(0%); }
   100% { transform: translateX(-100%); }
}

@keyframes toLeft {
   0% { transform: translateX(0%); }
   100% { transform: translateX(-100%); }
}
#activet1 .box16 .right{ transform: translateX(100%); position: absolute; top: 0%; ;left: 0%; width: 100%;
	-webkit-animation: toLeft2 7s linear infinite; animation: toLeft2 7s linear infinite; 
}
@-webkit-keyframes toLeft2 {
   0% { transform: translateX(100%); }
   100% { transform: translateX(00%); }
}

@keyframes toLeft2 {
   0% { transform: translateX(100%); }
   100% { transform: translateX(0%); }
}
#activet1 .box17{ background-color:#010101; }
#activet1 .box17 .s{ width:80%; margin:4% auto; color:#ffffff; font-size:1vw; line-height:2.6; }
#activet1 .box17 .b{ font-size:1.4vw; line-height:1; margin-bottom:2%; }