﻿.header { height: 100px; position: absolute; width: 100%; left: 0; top: 0; background: rgba(255,255,255,0.5); z-index:2;}
.service .main { position: fixed; z-index: 1; width: 100%; left: 0; top:0px; bottom: 0; margin: 0; }
.service-bak { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-color: #fff; overflow: hidden; transform: translateY(100%); -webkit-transform: translateY(100%); transition: 0.8s all; -webkit-transition: 0.8s all; }

.service footer { position: fixed; left: 0; top: 100%; right: 0; z-index: 10; transform: translateY(0); -webkit-transform: translateY(0); }

footer {transition: 0.8s all; -webkit-transition: 0.8s all; position: relative; z-index: 3;border-top:#fff solid 1px; }

.service-bak img{width:100%;height:100%;}
.service-bak.service-1 { z-index: 1; top: 0; transform: translateY(0%); -webkit-transform: translateY(0%); }
.service-bak.service-2 { z-index: 5; }
.service-bak.service-3 { z-index: 6; }
.service-bak.service-4 { z-index: 7; }
.service-bak.service-5 { z-index: 8; }
.service-bak.service-6 { z-index: 9; }

.anim2_down .service-1 { transform: translateY(-50%); -webkit-transform: translateY(-50%); }
.anim2_down .service-2 { transform: translateY(0%); -webkit-transform: translateY(0%); }

.anim2_up .service-1 { transform: translateY(-30%); -webkit-transform: translateY(-30%); }
.anim2_up .service-3 { transform: translateY(100%); -webkit-transform: translateY(100%); }
.anim2_up .service-2 { transform: translateY(0%); -webkit-transform: translateY(0%); }

.anim3_down .service-1 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim3_down .service-2 { transform: translateY(-50%); -webkit-transform: translateY(-50%); }
.anim3_down .service-3 { transform: translateY(0%); -webkit-transform: translateY(0%); }

.anim3_up .service-2 { transform: translateY(-50%); -webkit-transform: translateY(-50%); }
.anim3_up .service-4 { transform: translateY(100%); -webkit-transform: translateY(100%); }
.anim3_up .service-3 { transform: translateY(0%); -webkit-transform: translateY(0%); }

.anim4_down .service-1 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim4_down .service-2 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim4_down .service-3 { transform: translateY(-50%); -webkit-transform: translateY(-50%); }
.anim4_down .service-4 { transform: translateY(0%); -webkit-transform: translateY(0%); }

.anim4_up .service-3 { transform: translateY(-50%); -webkit-transform: translateY(-50%); }
.anim4_up .service-5 { transform: translateY(100%); -webkit-transform: translateY(100%); }
.anim4_up .service-4 { transform: translateY(0%); -webkit-transform: translateY(0%); }

.anim5_down .service-1 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim5_down .service-2 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim5_down .service-3 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim5_down .service-4 { transform: translateY(-50%); -webkit-transform: translateY(-50%); }
.anim5_down .service-5 { transform: translateY(0%); -webkit-transform: translateY(0%); }

.anim5_up .service-4 { transform: translateY(-50%); -webkit-transform: translateY(-50%); }
.anim5_up .service-6 { transform: translateY(100%); -webkit-transform: translateY(100%); }
.anim5_up .service-5 { transform: translateY(0%); -webkit-transform: translateY(0%); }


.anim6_down .service-1 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim6_down .service-2 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim6_down .service-3 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim6_down .service-4 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim6_down .service-5 { transform: translateY(-50%); -webkit-transform: translateY(-50%); }
.anim6_down .service-6 { transform: translateY(0%); -webkit-transform: translateY(0%); }

.anim6_up .service-4 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim6_up .service-5 { transform: translateY(-50%); -webkit-transform: translateY(-50%); }
.anim6_up .service-6 { transform: translateY(0%); -webkit-transform: translateY(0%); }

.anim7_down .service-1 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim7_down .service-2 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim7_down .service-3 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim7_down .service-4 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim7_down .service-5 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim7_down .service-6 { transform: translateY(-100%); -webkit-transform: translateY(-100%); }
.anim7_down .service-7 { transform: translateY(-35%); -webkit-transform: translateY(-35%); }




.anim7_down.footer { transform: translateY(-100%); -webkit-transform: translateY(-100%); }


.right-button{position:fixed;right:50px;bottom:10%;z-index:20;}


.animate6 {
	-webkit-transition: all .6s ease-in-out .6s;
	-moz-transition: all .6s ease-in-out .6s;
	-ms-transition: all .6s ease-in-out .6s;
	-o-transition: all .6s ease-in-out .6s;
	transition: all .6s ease-in-out .6s;
}

.section-content .s_service_txt_bg{
	bottom:30%;
	opacity:1;
}
.right-button{right:85px; display:none;}
.s_menu .anim3 {
    left: 23px;
    top: -2px;}
    .s_menu li p{
    height: 34px;
    line-height: 34px;
   
    right: -10px;
    top: 13px;}
    
    
 .section-content .s_service_txt{
 	padding: 1rem 2rem 1.7rem;
	height:auto;}   
