/*cosscoss*/
ul {
    list-style: none;
}
.banner-com{ position: relative; }
.banner-com .banner-text{ position: absolute; width: 100%; left: 0; top: 26%; text-align: center; }
.banner-com .banner-text .logo{ width: 971px; display: block; margin: 0 auto;}
.banner-com .banner-text p{ display: block; margin-top: 46px; font-size: 30px; color: #262626; }
.video-com{ width: 100%; position: relative; overflow: hidden; }
.video-com .video-bg img{ display: block; width: 100%;}
.video-com .video-text{ width: 100%; text-align: center; position: absolute; left: 0; bottom: 10%;}
.video-com .video-text a.video-play{ cursor: pointer; width: 127px; display: inline-block; }
.video-com .video-text a.video-play img{ display: block; width: 100%;transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;}
.video-com .video-text a:hover.video-play img{-webkit-transform:scale(1.1,1.1); -moz-transform:scale(1.1,1.1);}
.video-com .video-text .text-title{ font-size: 52px; line-height: 1; font-weight: bold; color: #fff; margin: 100px auto 40px; display: block; }
.video-com .video-text p{ font-size: 24px;color: #fff; line-height: 42px; }

.features-com{ width: 100%; overflow: hidden;position:relative;}
.features-com .features-box{ width: 80%; text-align: center;position: absolute; left: 10%; top: 0; padding: 50px 0; }
.features-com .features-box .features-tit{ text-align: left;}
.features-com .features-box .features-tit strong{ display: block; font-size: 50px; line-height: 1.2; color: #000;}
.features-com .features-box .features-tit span{ display: block; font-size: 20px; color: #5e5e5e; }
.features-com .features-box .features-list{ width: 100%; overflow: hidden; margin-top: 30px; }
.features-com .features-box .features-list ul{ text-align: center;width: 100%;margin: 0 auto;overflow: hidden; display: table;}
.features-com .features-box .features-list ul li{ display: inline-block; width: 20%; margin:2.5% 0; text-align: center;}
.features-com .features-box .features-list ul li img{ display: block; width: 68%; margin: 0 auto; cursor: pointer;transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;}
.features-com .features-box .features-list ul li img:hover{-webkit-transform:scale(1.02,1.02); -moz-transform:scale(1.02,1.02);/*filter: drop-shadow(8px 8px 10px (235,235,235,0.5)); 
 -webkit-filter: drop-shadow(8px 8px 10px (235,235,235,0.5));*/}
.features-com .features-box .features-list ul li p{ display: block; font-size: 26px; font-weight: bold; margin: 15px 0 0 0; padding: 0; }
.features-com .features-box .features-list ul li:nth-child(1) p{ color: #d70c19; }
.features-com .features-box .features-list ul li:nth-child(2) p{ color: #4ba259; }
.features-com .features-box .features-list ul li:nth-child(3) p{ color: #fabf1b; }
.features-com .features-box .features-list ul li:nth-child(4) p{ color: #023894; }
.features-com .features-box .features-list ul li:nth-child(5) p{ color: #5e318f; }
.features-com .features-box .features-list ul li:nth-child(6) p{ color: #d02e8c; }
.features-com .features-box .features-list ul li:nth-child(7) p{ color: #5e318f; }
.features-com .features-box .features-list ul li:nth-child(8) p{ color: #d70c19; }
.features-com .features-box .features-list ul li:nth-child(9) p{ color: #4ba259; }

.footer{ background-color: #000;}


.slideInUp{ 
	-webkit-animation: slideInUp 0.5s; animation: slideInUp 0.5s;
	/* animation-name: topIn;
	animation-duration: 1s;
	animation-delay: 1s; */
	/* -webkit-animation-name:slideInUp;
	animation-name:slideInUp;
	-webkit-animation-duration: .6s;
	animation-duration: .6s; */
	/* -webkit-animation-delay: 1s;
	animation-delay: 1s; */
	animation-fill-mode:forwards;
}

@-webkit-keyframes slideInUp{0%{-webkit-transform:translateY(100%);transform:translateY(100%);opacity: 0;}100%{-webkit-transform:translateY(0);transform:translateY(0);opacity: 1;}}
@keyframes slideInUp{0%{-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);opacity: 0;}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity: 1;}}


@media (min-width: 1441px) and (max-width: 1680px){
	.banner-com .banner-text .logo{ width: 784px;}
	.banner-com .banner-text p{margin-top: 44px; font-size: 28px;}

	.video-com .video-text{ bottom: 10%;}
	.video-com .video-text a.video-play{ width: 102px;}
	.video-com .video-text .text-title{ font-size: 42px; margin: 80px auto 35px; }
	.video-com .video-text p{ font-size: 22px; line-height: 40px; }

	.features-com .features-box{ padding: 40px 0; }
	.features-com .features-box .features-tit strong{ font-size: 40px;}
	.features-com .features-box .features-tit span{ font-size: 16px;}

	}
@media (min-width: 1201px) and (max-width: 1440px){
	.banner-com .banner-text .logo{ width: 680px;}
	.banner-com .banner-text p{margin-top: 40px; font-size: 26px;}

	.video-com .video-text{ bottom: 10%;}
	.video-com .video-text a.video-play{ width: 102px;}
	.video-com .video-text .text-title{ font-size: 40px; margin: 70px auto 30px; }
	.video-com .video-text p{ font-size: 20px; line-height:36px; }

	.features-com .features-box{ padding: 36px 0; }
	.features-com .features-box .features-tit strong{ font-size: 38px;}
	.features-com .features-box .features-tit span{ font-size: 16px;}
	.features-com .features-box .features-list ul li p{ font-size: 22px; }

	}
@media (min-width: 993px) and (max-width: 1200px){
	.banner-com .banner-text .logo{ width: 490px;}
	.banner-com .banner-text p{margin-top: 30px; font-size: 18px;}

	.video-com .video-text{ bottom:8%;}
	.video-com .video-text a.video-play{ width: 96px;}
	.video-com .video-text .text-title{ font-size: 32px; margin: 30px auto 15px; }
	.video-com .video-text p{ font-size: 16px; line-height: 24px; }

	.features-com .features-box{ padding: 30px 0; }
	.features-com .features-box .features-tit strong{ font-size: 30px;}
	.features-com .features-box .features-tit span{ font-size: 14px;}
	.features-com .features-box .features-list{ margin-top: 15px;}
	.features-com .features-box .features-list ul li{ margin: 2% 0;}
	.features-com .features-box .features-list ul li p{ font-size: 17px; }

	}
@media (max-width: 991px) and (min-width: 768px){
	.banner-com .banner-text{ top: 33%;}
	.banner-com .banner-text .logo{ width: 80%;}
	.banner-com .banner-text p{ margin-top: 26px; font-size: 18px;}

	.video-com .video-text{bottom: 2%;}
	.video-com .video-text a.video-play{ width: 60px; }
	.video-com .video-text .text-title{ font-size: 22px; margin: 10px auto;}
	.video-com .video-text p{ font-size: 14px; line-height: 18px; }

	.features-com .features-box{width: 90%; left: 5%; padding: 30px 0;}
	.features-com .features-box .features-tit{text-align: center;}
	.features-com .features-box .features-tit strong{ font-size: 26px;}
	.features-com .features-box .features-tit span{ font-size: 12px;}
	.features-com .features-box .features-list{ margin-top: 10px; }
	.features-com .features-box .features-list ul{ padding: 0; }
	.features-com .features-box .features-list ul li{ width: 33%; margin: 3.5% 0;}
	.features-com .features-box .features-list ul li img{ width: 80%; }
	.features-com .features-box .features-list ul li p{ font-size: 13px; margin: 10px 0 0 0; display: inline-grid;}

    }
@media (max-width: 767px){
	.banner-com .banner-text{ top: 33%;}
	.banner-com .banner-text .logo{ width: 80%;}
	.banner-com .banner-text p{ margin-top: 26px; font-size: 18px;}

	.video-com .video-text{bottom: 2%;}
	.video-com .video-text a.video-play{ width: 60px; }
	.video-com .video-text .text-title{ font-size: 22px; margin: 10px auto;}
	.video-com .video-text p{ font-size: 14px; line-height: 18px; }

	.features-com .features-box{width: 90%; left: 5%; padding: 30px 0;}
	.features-com .features-box .features-tit{text-align: center;}
	.features-com .features-box .features-tit strong{ font-size: 26px;}
	.features-com .features-box .features-tit span{ font-size: 12px;}

	.features-com .features-box .features-list{ margin-top: 10px; }
	.features-com .features-box .features-list ul{ padding: 0; }
	.features-com .features-box .features-list ul li{ width: 33%; margin: 3.5% 0;}
	.features-com .features-box .features-list ul li img{ width: 80%; }
	.features-com .features-box .features-list ul li p{ font-size: 13px; line-height: 18px; margin: 5px 0 0 0; display: inline-grid;}
}

