/* CSS Document */
#slides{position: relative;text-align: center;overflow: hidden; height:520px;}
#slides img{width: 100%;}
.slidesjs-pagination{list-style: none;position: relative;bottom: 53px;z-index: 99;}
.slidesjs-pagination li{margin: 0 4px;display: inline-block;}
#slides a:link, #slides a:visited{color: #333;background-color: #fff;}
.slidesjs-pagination li a{display: block;width: 15px;height: 0;padding-top: 15px;float: left;overflow: hidden; border-radius:999em;}
#slides .slidesjs-slide{ display:block; width:100%; height:520px;}
#slides a:link, #slides a:visited{color: #d22929;text-decoration: none;font-weight: 600;}
#slides .slidesjs-pagination li a.active,
#slides .slidesjs-pagination li a:hover.active{background-color: #2fba7e;}
.slidesjs-play, .slidesjs-stop{display: none;}


.Ass-search{ height:90px; background:#f5f5f5; text-align:center;}
.Ass-block{ text-align:left; display:inline-block; padding:0 20px; vertical-align:top;}
.Ass-block p { color:#333; font-size:14px; padding:18px 0 5px 0;}
.Ass-center span { padding-right:20px; font-size:16px; color:#6e6e6e;}
.Ass-center span i{ display:inline-block; width:22px; height:22px; background-size:contain; vertical-align:middle; margin-top:-2px; margin-right:5px;}
.t-ui1{ background: url(../images/t-ui1.png) 0 0 no-repeat;}
.t-ui2{ background: url(../images/t-ui2.png) 0 0 no-repeat;}
.t-ui3{ background: url(../images/t-ui3.png) 0 0 no-repeat;}
.t-ui4{ background: url(../images/t-ui4.png) 0 0 no-repeat;}
.t-ui5{ background: url(../images/t-ui5.png) 0 0 no-repeat;}
.t-ui6{ background: url(../images/t-ui6.png) 0 0 no-repeat;}
.t-ui7{ background: url(../images/t-ui7.png) 0 0 no-repeat;}
.t-ui8{ background: url(../images/t-ui8.png) 0 0 no-repeat;}
.t-ui9{ background: url(../images/t-ui9.png) 0 0 no-repeat;}
.t-ui10{ background: url(../images/t-ui10.png) 0 0 no-repeat;}
.invit-block{ display:inline-block; border:1px solid #aeaeae; vertical-align:middle; height:30px; position:relative; width:250px;}
.invit-block input { border:none; height:30px; padding:0 10px; width:100%; font-size:14px; box-sizing:border-box;}
.invit-block button { position:absolute; right:0; top:0; height:30px; line-height:30px; text-align:center; color:#fff; border:none 0; padding:0 10px; font-family:Microsoft YaHei;}
.Ass-block1 .invit-block button { background:#2fba7e;}
.Ass-block2 { padding-top:30px;}
.Ass-block2 .invit-block button { background:#019ed3;}
.Ass-text{ display:inline-block; vertical-align:middle;}
.Ass-text h2 { font-size:24px; display:inline-block; vertical-align:middle;}
.Ass-text p { font-size:18px; color:#6e6e6e; display:inline-block; vertical-align:middle; padding:0 20px 0 0;}


.all_wrap .page{width: 100%;overflow: hidden;background: #F5F5F5; padding:100px 0; position:relative;}
#intro_top{width: 100%;height: 100%;background: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp_home/img/banner.jpg) 0 bottom no-repeat;-webkit-background-size: 100% 100%;background-size: 100% 100%;color: #fff;font-size: 5vmin;text-align: center;line-height: 10em;}
.intro_show{max-width:1200px;height: 100%;margin: auto; position:relative;}
.animate_content{width: 49%;height: 100%;display: inline-block;position: relative;}
.intro{position: absolute;}
.first_intro-s1{ position:absolute; left:50%; margin-left:-150px; top:0;}
.first_intro-s2{ position:absolute; bottom:0; left:0;}
.first_intro-s3{ position:absolute; top:80px; right:30px;}
.second_intro_s1{ position:absolute; right:0; top:50px; z-index:9;}
.second_intro_s2{ position:absolute; right:150px; top:80px; z-index:8;}
.second_intro_s3{ position:absolute; right:300px; top:110px; z-index:7;}
.third_intro_s1{ position:absolute; left:50%; margin-left:-251px; top:0}
.third_intro_s2{ position:absolute; left:50%; margin-left:-128px; top:0;}
.four_intro_s1{ position:absolute; right:220px; bottom:0; z-index:2;}
.four_intro_s2{ position:absolute; right:0; top:0; z-index:1;}
.five_intro_s1{ position:absolute; top:0; left:0;}
.six_intro_s1{ position:absolute; right:220px; bottom:50px; z-index:2;}
.six_intro_s2{ position:absolute; right:0; top:0; z-index:1;}
.seven_intro_s1{ left:50%; margin-left:-182px; top:0;}
.intro_title{text-align: center;font-size:38px;position: relative;top: -38%; color:#4c4c4c;}
.detail{text-align: center;font-size: 2.3vmin;color: #8E8E8E;position: relative;top: -31%;margin: 0 auto;}
.left_title{margin-bottom:5px; font-size:22px; color:#777;}
.fadeInRight{animation:fadeInRight 0.7s 0s ease both;-webkit-animation:fadeInRight 0.7s 0s ease both;-moz-animation:fadeInRight 0.7s 0s ease both;-ms-animation:fadeInRight 0.7s 0s ease both;}
.fadeInLeft{animation:fadeInLeft 0.7s 0.3s ease both;-webkit-animation:fadeInLeft 0.7s 0.3s ease both;-moz-animation:fadeInLeft 0.7s 0.3s ease both;-ms-animation:fadeInLeft 0.7s 0.3s ease both;}
.fadeInTop{animation:fadeInTop 0.7s 0.3s ease both;-webkit-animation:fadeInTop 0.7s 0.3s ease both;-moz-animation:fadeInTop 0.7s 0.3s ease both;-ms-animation:fadeInTop 0.7s 0.3s ease both;}
.faseInDown{animation:faseInDown 0.7s 0.3s ease both;-webkit-animation:faseInDown 0.7s 0.3s ease both;-moz-animation:faseInDown 0.7s 0.3s ease both;-ms-animation:faseInDown 0.7s 0.3s ease both;}
.coins{animation:coins 0.7s 0s ease both;-webkit-animation:coins 0.7s 0s ease both;-moz-animation:coins 0.7s 0s ease both;-ms-animation:coins 0.7s 0s ease both;}
.toSmall{animation: toSmall 1s 0.3s ease both;-webkit-animation: toSmall 1s 0.3s ease both;-moz-animation: toSmall 1s 0.3s ease both;-o-animation: toSmall 1s 0.3s ease both;-ms-animation: toSmall 1s 0.3s ease both;}
.fadeInup{animation:fadeInup 0.7s 0.3s ease both;-webkit-animation:fadeInup 0.7s 0.3s ease both;-moz-animation:fadeInup 0.7s 0.3s ease both;-ms-animation:fadeInup 0.7s 0.3s ease both;}
@keyframes fadeInLeft{0%{opacity:0;transform:translateX(-50%);}
100%{opacity:1;transform:translateX(0);}}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-50%);}
100%{opacity:1;-webkit-transform:translateX(0);}}@-moz-keyframes fadeInLeft{0%{opacity:0;-moz-transform:translateX(-50%);}
100%{opacity:1;-moz-transform:translateX(0);}}@-ms-keyframes fadeInLeft{0%{opacity:0;-ms-transform:translateX(-50%);}
100%{opacity:1;-ms-transform:translateX(0);}}
@keyframes fadeInRight{0%{opacity:0;transform:translateX(50%);}
100%{opacity:1;transform:translateX(0);}}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(50%);}
100%{opacity:1;-webkit-transform:translateX(0);}}@-moz-keyframes fadeInRight{0%{opacity:0;-moz-transform:translateX(50%);}
100%{opacity:1;-moz-transform:translateX(0);}}@-ms-keyframes fadeInRight{0%{opacity:0;-ms-transform:translateX(50%);}
100%{opacity:1;-ms-transform:translateX(0);}}
@keyframes fadeInTop{0%{opacity:0;transform:translateY(-50%);}
100%{opacity:1;transform:translateY(0);}}@-webkit-keyframes fadeInTop{0%{opacity:0;-webkit-transform:translateY(-50%);}
100%{opacity:1;-webkit-transform:translateY(0);}}@-moz-keyframes fadeInTop{0%{opacity:0;-moz-transform:translateY(-50%);}
100%{opacity:1;-moz-transform:translateY(0);}}@-ms-keyframes fadeInTop{0%{opacity:0;-ms-transform:translateY(-50%);}
100%{opacity:1;-ms-transform:translateY(0);}}
@keyframes faseInDown{0,50%{opacity:0;transform:translateY(0);}
50%{opacity:0;transform:translateY(100%);}
100%{opacity:1;transform:translateY(0);}}@-webkit-keyframes faseInDown{0%,50%{opacity:0;-webkit-transform:translateY(0);}
50%{opacity:0;-webkit-transform:translateY(100%);}
100%{opacity:1;-webkit-transform:translateY(0);}}@-moz-keyframes faseInDown{0%,50%{opacity:0;-moz-transform:translateY(0);}
50%{opacity:0;-moz-transform:translateY(-100%);}
100%{opacity:1;-moz-transform:translateY(0);}}@-ms-keyframes faseInDown{0%,50%{opacity:0;-ms-transform:translateY(0);}
50%{opacity:0;-ms-transform:translateY(-100%);}
100%{opacity:1;-ms-transform:translateY(0)}}
@keyframes coins{from, to{transform: scale(1, 1);}
0%{opacity:0;transform: scale(0, 0);}
100%{opacity:1;transform: scale(1, 1);}}@-webkit-keyframes coins{from, to{-webkit-transform: scale(1, 1);}
0%{opacity:0;-webkit-transform: scale(0, 0);}
100%{opacity:1;-webkit-transform: scale(1, 1);}}@-moz-keyframes coins{from, to{-moz-transform: scale(1, 1);}
0%{opacity:0;-moz-transform: scale(0, 0);}
100%{opacity:1;-moz-transform: scale(1, 1);}}@-ms-keyframes coins{from, to{-ms-transform: scale(1, 1);}
0%{opacity:0;-ms-transform: scale(0, 0);}
100%{opacity:1;-ms-transform: scale(1, 1);}}
@keyframes toSmall{0%{opacity:0;transform: scale(2);}
100%{opacity:1;transform: scale(1);}}@-webkit-keyframes toSmall{0%{opacity:0;-webkit-transform: scale(2);}
100%{opacity:1;-webkit-transform: scale(1);}}@-moz-keyframes toSmall{0%{opacity:0;-moz-transform: scale(2);}
100%{opacity:1;-moz-transform: scale(1);}}@-o-keyframes toSmall{0%{opacity:0;-o-transform: scale(2);}
100%{opacity:1;-o-transform: scale(1);}}@-ms-keyframes toSmall{0%{opacity:0;-ms-transform: scale(2);}
100%{opacity:1;-ms-transform: scale(1);}}
@keyframes fadeInup{0%{opacity:0;transform:translateY(50%);}
100%{opacity:1;transform:translateX(0);}}@-webkit-keyframes fadeInup{0%{opacity:0;-webkit-transform:translateY(50%);}
100%{opacity:1;-webkit-transform:translateX(0);}}@-moz-keyframes fadeInup{0%{opacity:0;-moz-transform:translateY(50%);}
100%{opacity:1;-moz-transform:translateX(0);}}@-ms-keyframes fadeInup{0%{opacity:0;-ms-transform:translateY(50%);}
100%{opacity:1;-ms-transform:translateX(0);}}
.video{background-color: rgba(0,0,0,0.5);z-index: 99999;position: fixed;width: 100%;height: 100%;top: 0;left: 0;}
.video video{position: relative;display: block;width: 700px;height: 525px;}
.video .close{cursor: pointer;position: absolute;top: 0;right: -50px;width: 30px;height: 30px;text-align: center;line-height: 30px;color: #fff;border: 2px solid #fff;border-radius: 50%;font-size: 30px;}
.video .close:hover{background-color: #e43a3a;}
.a-btn{display: block;margin: 0 auto;color: #fff;background-color: #fdcb2e;width: 22vmin;height: 5.6vmin;line-height: 5.6vmin;text-align: center;border-radius: 2px;font-size: 2.3vmin;}
.scroll{display: none;background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc/index/img/scrollUp1.png);width: 44px;height: 44px;background-size: 100% 100%;position: fixed;bottom: 50px;right: 40px;}
.scroll:hover{background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc/index/img/scrollUp2.png);}


@keyframes fadeOutIn{0%{transform: scale(1);opacity: 0.15}
100%{transform: scale(1.2);opacity: 1}
/*100%{transform: scale(1);opacity: 0.15}*/}
@-webkit-keyframes fadeOutIn{0%{-webkit-transform: scale(1);opacity: 0.15}
100%{-webkit-transform: scale(1.2);opacity: 1}
/*100%{-webkit-transform: scale(1);opacity: 0.15}*/}
@-moz-keyframes fadeOutIn{0%{-moz-transform: scale(1);opacity: 0.15}
100%{-moz-transform: scale(1.2);opacity: 1}
/*100%{-moz-transform: scale(1);opacity: 0.15}*/}
@-ms-keyframes fadeOutIn{0%{-ms-transform: scale(1);opacity: 0.15}
100%{-ms-transform: scale(1.2);opacity: 1}
/*100%{-ms-transform: scale(1);opacity: 0.15}*/}
@-o-keyframes fadeOutIn{0%{-o-transform: scale(1);opacity: 0.15}
100%{-o-transform: scale(1.2);opacity: 1}
/*100%{-o-transform: scale(1);opacity: 0.15}*/}



@media screen and (max-width: 1366px) {
.example-left-con{ width:34%;}
.example-right-con{ width:66%;}
}

@media screen and (max-width: 1280px) {
	.index-box1,.index-box2,.index-box3,.intro_show{ -webkit-transform: scale(0.9,0.9);-moz-transform: scale(0.9,0.9);}
	.tbox{-webkit-transform: scale(0.9,0.9);-moz-transform: scale(0.9,0.9);}
}

@media screen and (max-width: 1200px) {
.all_wrap .page{ padding:80px 0;}
.intro_show{-webkit-transform: scale(0.9,0.9);-moz-transform: scale(0.9,0.9);}
.phone_animate_left{ width:32%;}
.phone_container{ width:68%; margin-left:0;}
.left_middle ul li{ font-size:20px;}
.left_middle ul li span { width:65px; height:65px; line-height:65px; margin-right:20px;}
.animate-k-text{ padding-left:45px;}
.animate-k-text h1{ font-size:34px;}
.animate-k-text ul li{ font-size:18px; line-height:45px; padding:0 20px;}
.five_intro_s1{ width:550px; top:60px;}
.second_intro_s1{ width:560px; right:-50px;}
.Ass-block{ padding:0 10px;}
.Ass-center span{ padding-right:10px; font-size:14px;}
.invit-block{ width:200px;}
.invit-block input{ font-size:12px;}
.Ass-block2 {padding-top: 30px;}
}



/* 大首页----------------------- */
.h-footer{ height:60px; background:#fff; z-index:99; text-align:center; line-height:60px; font-size:14px; color:#4f4f4f; position:fixed; left:0; right:0; bottom:0;}
.h-header{ position:absolute; left:0; top:0; right:0; z-index:99;}
.h-header .h-logo{ float:left; margin-top:30px;}
.h-header .h-Slogan{ float:right; margin-top:30px;}
.wrap{height: 100%;position: relative;overflow: hidden;}
.wrapper{height: 100%;position: relative;overflow: hidden;}
.content{position: relative;width: 1200px;margin: 0 auto;}
.product_list{position: relative;height: 100%;}
.product_box{position: absolute;width: 100%;height: 100%;top: 0;left: -9999px;}
.bg_box{position: absolute;width: 100%;height: 100%;top: 0;left: 0;background-position: center center;background-repeat: no-repeat;}
.bg_main{width: 1000px;height: 100%;position: absolute;top: 0;left: 50%;margin-left: -500px;background-position: center center;background-repeat: no-repeat;}
.bg_box img{position: absolute;top: 50%;left: 50%;}
.product_box .content{width: 1000px;height: 100%;position: absolute;top: 0;left: 50%;margin-left: -500px;z-index: 5;transform-origin: center center;-webkit-transform-origin: center center;}
.product_box .main_box{position: relative;height: 100%;left: -9999px;top: 50%;}
.product_list .show{left: 0;}
.product_list .show .main_box{left: 0;}
.main_box h2{position: absolute;top: 50%;left: 50%;background-size: 100% 100%;width:738px;height:250px;margin: -220px 0 0 -369px;background-image: url(../images/txt_1.png);}
.btn_product{position: absolute;top: 50%;left:0; right:0;text-align: center;transition: transform .3s;-webkit-transition: transform .3s; margin-top:30px;}
.main_box h2{animation:tt_effect .6s .3s linear both;-webkit-animation:tt_effect .6s .3s linear both;}
.btn_product{animation:opacity .5s 1s linear both;-webkit-animation:opacity .5s 1s linear both;}
.product_btns{position: absolute;width: 100%;bottom: 100px;z-index: 6;transition: bottom .3s;-webkit-transition: bottom .3s;z-index: 10;}
.product_btns .content{width: 1000px;position: absolute;bottom: 0;left: 50%;margin-left: -500px;}
.product_btns .btns_area{margin: 0 auto;border-bottom: 3px solid #92a0b4;border-color: rgba(255,255,255,0.2);+zoom: 1;width:370px;height: 84px;}
.product_btns .btns_box{position: absolute;width: 100%;height: 84px;top: 3px;font-size: 0;line-height: 0;height: 84px;}
.product_btns .btns_box a{display: inline-block;+display: inline;+zoom: 1;position: relative;width: 70px;height: 84px;margin: 0 15px;}
.product_btns .btns_box a span{display: block;background-repeat: no-repeat;cursor: pointer;position: absolute;top: 0;left: 50%;height: 68px;}
.product_btns .btns_box a:hover,.product_btns .btns_box a.cur{background: url(about:blank);_height: 69px;}
.product_btns .ic_line{position: absolute;height: 3px;background: #fff;left: 0;bottom: 0;transition: left .3s;-webkit-transition: left .3s;width: 70px;}
.product_btns .btns_box .btn_ipr{margin: 0 15px 0 0;}
.product_btns .btns_box .btn_xav{margin: 0 0 0 15px;}
.btn_product a{ display:inline-block; height:54px; line-height:54px; background:#7694ec; border-radius:10px; font-size:18px;color:#fff; margin:0 25px; width:175px; text-align:center;}
.btn_product a i { display:inline-block; width:30px; height:30px; margin-right:8px; vertical-align:middle;}
.i-t1{ background:url(../images/i-t1.png) 0 0 no-repeat;}
.i-t2{ background:url(../images/i-t2.png) 0 0 no-repeat;}
.i-t3{ background:url(../images/i-t3.png) 0 0 no-repeat;}


@keyframes opacity{
	0%{opacity: 0;}
	100%{opacity: 1;}
}
@-webkit-keyframes opacity{
	0%{opacity: 0;}
	100%{opacity: 1;}
}

@keyframes tt_effect{
	0%{transform:translateY(-20px);opacity:0;}
	100%{transform:translateY(0);opacity:1;}
}
@-webkit-keyframes tt_effect{
	0%{-webkit-transform:translateY(-20px);opacity:0;}
	100%{-webkit-transform:translateY(0);opacity:1;}
}

@media screen and (max-width: 1200px) {
	.content{padding:0 20px; width:auto;}
	.head-logo { padding:0 20px;}
	.registform ul.regist-ul1 {padding:90px 0 0 150px}
	.footer-contact{ padding:0 30px 0 10px;}
	.footer-nav dl{ margin-right:50px;}
	.wap-box dl{ margin-right:50px;}
}








