
#uwatch3s img{ width: 100%; max-width: 100%; }

.float-left{ float: left; }
.overflow{ overflow: hidden; }
.position-relative{ position: relative; }
.position-absolute{ position: absolute; }
.text-title{ font-size: 2vw; line-height: 2vw; }
.text-middle{ font-size: 1.2vw; line-height: 1.2vw; }
.text-small{ font-size: 1vw; line-height: 1.4vw; }
.opacity{ opacity: 0;filter: alpha(opacity=0); }
.opacity-non{ opacity: 1;filter: alpha(opacity=100); }
.center{ text-align: center; }
.animal{
	-webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: txt-action;
    animation-name: txt-action;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
.delay{ -webkit-animation-delay: .3s; animation-delay: .3s; }
.delay2{ -webkit-animation-delay: .6s; animation-delay: .6s; }
@-webkit-keyframes txt-action{
   0%{ opacity: 0;filter: alpha(opacity=0); -webkit-transform: translateY(3.75rem); transform: translateY(3.75rem);}
   100%{ opacity: 1;filter: alpha(opacity=100); -webkit-transform: translateY(0); transform: translateY(0); }
}
@keyframes txt-action{
   0%{ opacity: 0;filter: alpha(opacity=0); -webkit-transform: translateY(3.75rem); transform: translateY(3.75rem);}
   100%{ opacity: 1;filter: alpha(opacity=100); -webkit-transform: translateY(0); transform: translateY(0); }
}
#uwatch3s .box-1 .box-box{ width: 50%; top: 36%; left: 16%; text-align: left; }
#uwatch3s .box-1 .box-box .text-title{font-size: 3vw; line-height: 3.2vw;}
#uwatch3s .box-1 .box-box .text-middle{ font-size: 1.9vw; line-height: 2.2vw; }
#uwatch3s .box-1 .box-box .text-small{font-size: 1.1vw; line-height: 1.4vw;}
#uwatch3s .box-1 .box-box .mt{ margin:2% auto 5% auto; }
#uwatch3s .box-1 .box-box .mt-1{ margin-top: 0.8%; }
#uwatch3s .box-1 .img{ width: 72%; left: 14%; top: 32%; }
#uwatch3s .box-1 .pp{ font-size: 0.8vw; line-height: 1vw; text-align: center; left: 0%; bottom: 1%; width: 100%; color: #968f8f; }
#uwatch3s .box-2{ background-color: #F7F7F7; }
#uwatch3s .box-2 ul{ width: 75%; margin:4% auto; }
#uwatch3s .box-2 ul li{ width: 25%; }
#uwatch3s .box-2 ul li.mt{  margin-top: 3%; }
#uwatch3s .box-2 ul li .img{ width: 18%; }
#uwatch3s .box-2 ul li .text-small{ margin-top: 3%; }
#uwatch3s .box-3 .box-box{ width: 75%; margin:4% auto; }
#uwatch3s .box-3 .box-box .text-middle{ margin: 2% auto; }
#uwatch3s .box-3 .box-box .text-small{ margin-top: 2%; }
#uwatch3s .box-4 .img{ margin: 2% auto; display: block; width: 96%; }
#uwatch3s .box-5{ margin-bottom: 4%; }
#uwatch3s .box-5 .box-box{ width: 75%; margin:4% auto; }
#uwatch3s .box-5 .box-box .text-middle{ margin: 2% auto; }
#uwatch3s .box-5 .box-box .text-small{ margin-top: 2%; }
#uwatch3s .box-5 .box-box-animal{ height: 30vw; background-color: #cccccc; margin: 2% auto; }
#uwatch3s .box-5 .box-box-animal .bg{ 
  position: absolute; width: 100%; height: 100%; left: 0%;top: 0%;
  background: url(/new/Images/uwatch3s/overview/banner5-1-new.png) center center no-repeat;
  background-size: cover; z-index: 2;
}
#uwatch3s .box-5 .box-box-animal .green{ position: absolute; left: 54%; width: 471px; height: 100%;top: 0%; z-index: 1; }
#uwatch3s .box-5 .box-box-animal .green img{ height: 100%; width: 471px; }
#uwatch3s .box-5 .box-box-animal .uwatch_gt{ position: absolute; top: 18%; left: 32.5%; max-width: 35%; z-index: 3; }
#uwatch3s .box-5 .box-box-animal .green2{ position: absolute;left:47%; top: 32%; max-width: 5%; z-index: 4; }
#uwatch3s .box-5 .box-box-animal .img{ width: 30%; top: 3%; left: 54%; z-index: 3; }
#uwatch3s .box-5 .box-box-animal .img1{ width: 5%; top: 44%; left: 62%; z-index: 4; }
#uwatch3s .box-5 .box-box-animal .img2{ width: 5%; top: 33%; left: 63%; z-index: 4; }
#uwatch3s .box-5 .box-box-animal .toRight{ 
  animation-name:toRight;
  animation-duration:1s;
  animation-timing-function:linear;
  animation-delay:0s;
  animation-iteration-count:infinite; 
  animation-direction:normal;
}

@-webkit-keyframes toRight{
  0%{ left: 54%;}
  100%{ left: 100%; }
}
@keyframes toRight{
  0%{ left: 54%;}
  100%{ left: 100%; }
}
#uwatch3s .box-5 .box-box-animal .toLeft{ 
  animation-name:toLeft;
  animation-duration:1s;
  animation-timing-function:linear;
  animation-delay:0s;
  animation-iteration-count:infinite; 
  animation-direction:normal;
}

@-webkit-keyframes toLeft{
  0%{ left: 0%;}
  100%{ left: 100%; }
}
@keyframes toLeft{
  0%{ left: 0%;}
  100%{ left: 100%; }
}
#uwatch3s .box-5 .box-box-animal .toshow{ 
  animation-name:toshow;
  animation-duration:1s;
  animation-timing-function:linear;
  animation-delay:0s;
  animation-iteration-count:infinite; 
  animation-direction:normal;
}

@-webkit-keyframes toshow{
  0%{ z-index: 1;}
  60%{ z-index: 3 }
  61%{ z-index: 3; }
  100%{ z-index: 1; }
}
@keyframes toshow{
  0%{ z-index: 1;}
  60%{ z-index: 3 }
  61%{ z-index: 3; }
  100%{ z-index: 1; }
}
#uwatch3s .box-6 .box-box{ width: 75%; margin:2% auto 6% auto; }
#uwatch3s .box-6 .box-box .text-middle{ margin: 2% auto; }
#uwatch3s .box-6 .box-box .text-small{ margin-top: 2%; }
#uwatch3s .box-6 .box-img{ padding-top: 16%; }
#uwatch3s .box-6 .box-img .img1{ width: 40%; top: 0%; left: 56%; }
#uwatch3s .box-6 .box-img .img2{ width: 20%; bottom: 0%; left: 14%; z-index: 1; }
#uwatch3s .box-6 .box-img .pox{ width: 21%; left: 14%; top: -3%; }
#uwatch3s .box-6 .box-img .pox img{ width: 20%; }
#uwatch3s .box-6 .box-img .pox .bold{ font-size: 1.1vw; line-height: 1.1vw; }
#uwatch3s .box-6 .box-img .pox .third{ font-size: 1vw; line-height: 1.4vw; margin-top: 2%; }
#uwatch3s .box-7 .box-box{ width: 75%; margin:4% auto; }
#uwatch3s .box-7 .box-box .text-middle{ margin: 2% auto; }
#uwatch3s .box-7 .box-box .text-small{ margin-top: 2%; }
#uwatch3s .box-7 img{ margin: 4% auto -1% auto; max-width: 34%; display: block; }
#uwatch3s .box-8 .box-box{ width: 75%; margin: 2% auto 4% auto; }
#uwatch3s .box-8 .box-box .text-middle{ margin: 2% auto; }
#uwatch3s .box-8 .box-box .text-small{ margin-top: 2%; }
#uwatch3s .box-9 .box-box{ width: 75%; margin:4% auto; }
#uwatch3s .box-9 .box-box .text-middle{ margin: 2% auto; }
#uwatch3s .box-9 .box-box .text-small{ margin-top: 2%; }
#uwatch3s .box-9 .box-img{ width: 73%; margin: 4% auto; }
#uwatch3s .box-9 .box-img .img{ width: 40%; left: -100%; bottom: 0%; transition: all 0.3s linear;
-ms-transition: all 1s linear;
-moz-transition: all 1s linear;
-webkit-transition: all 1s linear;
-o-transition: all 1s linear; }
#uwatch3s .box-9 .box-img .img.activity{ left: 0%; }
#uwatch3s .box-10 .box-box{ width: 75%; top: 6%; left: 12.5%; }
#uwatch3s .box-10 .box-box .text-middle{ margin: 2% auto; }
#uwatch3s .box-10 .box-box .text-small{ margin-top: 2%; }
#uwatch3s .box-10 ul{ width: 80%; top: 76%; left: 10%; }
#uwatch3s .box-10 ul li{ width: 50%; box-sizing: border-box; color: #ffffff; padding: 0% 5%; }
#uwatch3s .box-10 ul li.left-div{ border-right: 2px solid #4CB5EE; }
#uwatch3s .box-10 ul li .title{ font-size: 1.2vw; line-height: 1.2vw; }
#uwatch3s .box-10 ul li .big{ font-size: 3vw; line-height: 3.2vw; }
#uwatch3s .box-10 ul li .middle{ font-size: 1.2vw; line-height: 1.2vw; margin: 2% auto 4% auto; }
#uwatch3s .box-10 ul li .small{ font-size: 1vw; line-height: 1.6vw; }
#uwatch3s .box-10 .small-small{ width: 100%; left: 0%; bottom: 1%; font-size: 0.8vw; line-height: 0.8vw; color: #86E0FF; }
#uwatch3s .box-11 .box-box{ width: 75%; top: 6%; left: 12.5%; }
#uwatch3s .box-11 .box-box .text-middle{ margin: 2% auto; }
#uwatch3s .box-11 .box-box .text-small{ margin-top: 2%; }
#uwatch3s .box-11 ul{ width: 75%; left: 12.5%; top: 20%; }
#uwatch3s .box-11 ul li{ width: 11.11%; margin-top: 3%; }
#uwatch3s .box-11 ul li img{ width: 47%; }
#uwatch3s .box-11 ul li.ml{ margin-left: 22%; }
#uwatch3s .box-12 .box-box{ width: 75%; margin:4% auto; }
#uwatch3s .box-12 .box-box .text-middle{ margin: 2% auto; }
#uwatch3s .box-12 .box-box .text-small{ margin-top: 2%; }
#uwatch3s .box-12 table{ width: 40%; left: 7%; top: 65%; color: #ffffff; border-collapse: collapse; }
#uwatch3s .box-12 table .title{ font-size: 1.4vw; line-height: 1.4vw; border:1px solid #ffffff; border-left: inherit; }
#uwatch3s .box-12 table .text1{ font-size: 1.2vw; line-height: 1.2vw; padding: 2% 0px; padding-left: 2%;border:1px solid #ffffff; }
#uwatch3s .box-12 table .text{ font-size: 1vw; line-height: 1.8vw; padding: 2% 0% 2% 2%;border:1px solid #ffffff; }
#uwatch3s .box-12 table .mr{ border-right: inherit; }
#uwatch3s .box-13 .box-box{ width: 75%; margin:4% auto; left: 12.5%; top: 4%; }
#uwatch3s .box-13 .box-box .text-middle{ margin: 2% auto; }
#uwatch3s .box-13 .box-box .text-small{ margin-top: 2%; }
#uwatch3s .box-13 .box-img{ padding-bottom: 4vw; }
#uwatch3s .box-13 .box-img .img{ width: 19%; left: 40.5%; top: 35%; display: block;margin: 0% auto; z-index: 1; }
#uwatch3s .box-13 .box-img .img1{ width: 14.5%; left: 26%; bottom: 9%; }
#uwatch3s .box-13 .box-img .img2{ width: 13.5%; left: 59.5%; bottom: 9%; }
#uwatch3s .box-13 .width{ width: 11%; top: 53%; left: 44.5%; z-index: 0; }
#uwatch3s .box-13 .width .swiper-container{ width: 100%; }
#uwatch3s .box-14 .img{ width: 54%; display: block; margin: 4% auto; }
#uwatch3s .box-14 .box-box{ width: 38%; top: 41%; left: 31%; }
#uwatch3s .box-14 .box-box .text-title{ line-height: 2.4vw; }
#uwatch3s .box-14 .box-box .text-middle{ margin: 2% auto; }
#uwatch3s .box-14 .box-box .text-small{ margin-top: 3%; }
#uwatch3s .box-14 .img1{ width: 14%; left: 33%; top: 5%; }
#uwatch3s .box-14 .img2{ width: 14%; left: 64%; top: 21%; }
#uwatch3s .box-14 .img3{ width: 14%; left: 18%; top: 37%; }
#uwatch3s .box-14 .img4{ width: 14%; left: 26%; top: 66%; }
#uwatch3s .box-14 .img5{ width: 14%; left: 58%; top: 71%; }
.animal1{
	top: -4.125rem;
    left: 24.9375rem;
    -webkit-animation: circle-floating-5 7s infinite linear;
    animation: circle-floating-5 7s infinite linear;
}
@-webkit-keyframes circle-floating-5{
   0%{ 
	   	-webkit-transform: translateY(-16px) translateX(16px) rotate(-0.8deg);
	    transform: translateY(-16px) translateX(16px) rotate(-0.8deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
@keyframes circle-floating-5{
   0%{ 
	   	-webkit-transform: translateY(-16px) translateX(16px) rotate(-0.8deg);
	    transform: translateY(-16px) translateX(16px) rotate(-0.8deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
.animal1{
	top: -4.125rem;
    left: 24.9375rem;
    -webkit-animation: circle-floating-1 7s infinite linear;
    animation: circle-floating-1 7s infinite linear;
}
@-webkit-keyframes circle-floating-1{
   50%{ 
	   	-webkit-transform: translateY(-16px) translateX(16px) rotate(-0.8deg);
	    transform: translateY(-16px) translateX(16px) rotate(-0.8deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
@keyframes circle-floating-1{
   50%{ 
	   	-webkit-transform: translateY(-16px) translateX(16px) rotate(-0.8deg);
	    transform: translateY(-16px) translateX(16px) rotate(-0.8deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
.animal2{
	top: 12.8125rem;
    right: 4.75rem;
    -webkit-animation: circle-floating-3 7s infinite linear;
    animation: circle-floating-3 7s infinite linear;
}
@-webkit-keyframes circle-floating-2{
   50%{ 
	   	-webkit-transform: translateY(-12px) translateX(-12px) rotate(1deg);
	    transform: translateY(-12px) translateX(-12px) rotate(1deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
@keyframes circle-floating-2{
   50%{ 
	   	-webkit-transform: translateY(-12px) translateX(-12px) rotate(1deg);
	    transform: translateY(-12px) translateX(-12px) rotate(1deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
.animal3{
	top: 12.5rem;
    left: 3rem;
    -webkit-animation: circle-floating-2 7s infinite linear;
    animation: circle-floating-2 7s infinite linear;
}
@-webkit-keyframes circle-floating-3{
   50%{ 
	   	-webkit-transform: translateY(12px) rotate(0.8deg);
	    transform: translateY(12px) rotate(0.8deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
	   	-webkit-transform: translateY(0);
    	transform: translateY(0);
   }
}
@keyframes circle-floating-3{
   50%{ 
	   	-webkit-transform: translateY(12px) rotate(0.8deg);
	    transform: translateY(12px) rotate(0.8deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
	   	-webkit-transform: translateY(0);
    	transform: translateY(0);
   }
}
.animal4{
	left: 8.1875rem;
    bottom: 5.75rem;
    -webkit-animation: circle-floating-4 8s infinite linear;
    animation: circle-floating-4 8s infinite linear;
}
@-webkit-keyframes circle-floating-4{
   50%{ 
	   	-webkit-transform: translateY(16px) translateX(16px) rotate(-0.8deg);
	    transform: translateY(16px) translateX(16px) rotate(-0.8deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
	   	-webkit-transform: translateY(0);
    	transform: translateY(0);
   }
}
@keyframes circle-floating-4{
   50%{ 
	   	-webkit-transform: translateY(16px) translateX(16px) rotate(-0.8deg);
	    transform: translateY(16px) translateX(16px) rotate(-0.8deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
	   	-webkit-transform: translateY(0);
    	transform: translateY(0);
   }
}
.animal5{
	right: 14.5rem;
    bottom: -0.25rem;
    -webkit-animation: circle-floating-1 7s infinite linear;
    animation: circle-floating-1 7s infinite linear;
}
@-webkit-keyframes circle-floating-5{
   50%{ 
	   	-webkit-transform: translateY(15px);
	    transform: translateY(15px);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
	   	-webkit-transform: translateY(0);
    	transform: translateY(0);
   }
}
@keyframes circle-floating-5{
   50%{ 
	   	-webkit-transform: translateY(15px);
	    transform: translateY(15px);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
	   	-webkit-transform: translateY(0);
    	transform: translateY(0);
   }
}
#uwatch3s .box-15 ul{ width: 75%; margin: 2% auto; }
#uwatch3s .box-15 ul li{ width: 25%; }
#uwatch3s .box-15 ul li img{ max-width: 80%; }
#uwatch3s .box-15 ul li .third{ margin-top: 4%; font-size: 1.2vw; line-height: 1.6vw; }