.main-title-box,
.about-img-box,
.save-img-title,
.save-sgs-title,
.save-sgs-list-box,
.sgs-products,
.save-img1,
.video-list-box,
.products-class-box,
.products-list-box,
.contact-logo,
.index-banner-slong1,
.index-banner-slong2,
.header-menu li,
.about-info-list-box,
.save-info,
.contact-form-box,
.contact-logo{
	opacity: 0;
}


.main-title-box span,
.save-img1-box span,
.sgs-products-box span{
	transform: scale(1,0);
}
.main-title-box{
	transform: translate(0,20px);
}
.main-title-box.active{
	opacity: 1;
	transform: translate(0,0);
	transition: all 1.5s ease;
}
.about-img-box{
	opacity: 0;
	transform: translate(50px,0);
	display: block;
	transition: all 1.5s ease;
}
.about-img-box.active
{	
	opacity: 1;

	transform: translate(0,0);
}

.main-title-box.active span{
	transform-origin: top;
	animation: line2 .8s linear .5s 1 forwards;
}


.about-info-box.active .about-info-list-box{
	opacity: 1;
	transition: all 1s ease;
	transform: translate(0,0%);
}
.about-info-list-box{
	transform: translate(0,100px);
	display: block;
}


.index-scroll-icon{
	animation: fadeUpout-banner-arrow  2s linear 0s infinite alternate;
}

/*-----------save------------*/
.save-info{
	transition: all 1s ease;
	opacity: 0;
	transform: translate(0,-40px);
}
.save-info.active{
	opacity: 1;
	transform: translate(0,0);
}
.save-img1-box span{
	transition: all .8s linear;
}
.save-img1{
	transition: all 1s ease;
	transform:    rotateY(90deg) ;
	transition-delay: .3s;
}
.save-img1-box.active .save-img1{
	opacity: 1;
	transform:   rotateY(0deg) ;
}
.save-img-title{
	transform: translate(40px,0);
	transition: all 1s ease
}
.save-img1-box.active .save-img-title{
	opacity: 1;
	transform: translate(0,0);
}

.save-img1-box.active span{
	transform-origin: left;
	transform: scale(1,1);
}


.save-sgs-box.active .save-sgs-title{
	animation: fade .8s linear 0s 1 forwards;
}

.save-sgs-box.active .save-img-title{
	opacity: 1;
	transform: translate(0,0);
}
.save-sgs-box.active .save-sgs-list-box{
	animation: fade .8s linear .2s 1 forwards;
}
.save-sgs-box.active .sgs-products-box span{
	transform-origin: left;
	animation: line .5s linear .4s 1 forwards;
}

.save-sgs-box.active .sgs-products{
	animation: fade .8s linear 0.6s 1 forwards;
}

.video-box.active .video-list-box{
	animation: fade 1.3s linear 0s 1 forwards;
}


.products-box.active .products-class-box{
	animation: fade .8s linear 0s 1 forwards;
}
.products-box.active .products-list-box{
	animation: fade .8s linear 0.2s 1 forwards;
}

.contact-form-box,
.contact-info{
	transition: all 1.5s ease;
	transform: translate(0,30%);
}
.contact-form-box.active,
.contact-info-box.active .contact-info{
	opacity: 1;
	transform: translate(0,0);
}
.contact-logo{
	transition-delay: 1.5s;
	transition: all 1.5s ease;
}
.contact-info-box.active .contact-logo{
	opacity: 1;
}



.contact-info-list.active{
	animation: fade .8s linear 0s 1 forwards;
}

.index-banner-slong1{
	animation: fadeInDown 1.5s ease 3.4s 1 forwards;
}
.index-banner-slong2{
	animation: fadeInDown 1.5s ease 4s 1 forwards;
}

.header-menu li:nth-child(1){
	animation: fade 1.2s linear 3.1s 1 forwards;
}
.header-menu li:nth-child(2){
	animation: fade 1.2s linear 3.4s 1 forwards;
}
.header-menu li:nth-child(3){
	animation: fade 1.2s linear 3.7s 1 forwards;
}
.header-menu li:nth-child(4){
	animation: fade 1.2s linear 4s 1 forwards;
}
.header-menu li:nth-child(5){
	animation: fade 1.2s linear 4.3s 1 forwards;
}