@charset "utf-8";
/* CSS Document */
.screen{ position:relative;}
/*N+智网站*/
.N-idx1{ height:690px;}
.N-idx1 .N_title,.N-idx2 .N_title{ position:absolute; top:30px; left:0; transition: all .3s; opacity:0;}
.N-idx1_con{ width:814px; position:absolute; top:267px; left:50%; margin-left:-407px; transition: all .3s; opacity:0;}
.N2_img1{ position:absolute; width:20px; height:20px; left:131px; top:131px; transition: all .5s; opacity:0;}
.N2_img2{ position:absolute; width:20px; height:20px; left:391px; top:58px; transition: all .5s; opacity:0;}
.N2_img3{ position:absolute; width:20px; height:20px; left:650px; top:124px; transition: all .5s; opacity:0;}
.N-adv .N_title{ position:absolute; top:15px; left:0; transition: all .3s; opacity:0;}
.N-adv_con{ width:1200px; position:absolute; top:215px; left:50%; margin-left:-600px; transition: all .3s; opacity:0;}
.N-adv_con-1,.N-adv_con-2,.N-adv_con-3,.N-adv_con-4,.N-adv_con-5,.N-adv_con-6{ transition: all .3s; opacity:0;}
.N-idx3{ height:730px;}
.N-idx3 .N_title{ position:absolute; top:30px; left:0; transition: all .3s; opacity:0;}
.N-idx3_con{ /*width:1200px;*/ position:absolute; top:267px;left: 0; /*left:50%; margin-left:-600px;*/ transition: all .3s; opacity:0;width: 100%;}
.N-idx5{ height:562px;}
.N-idx5 .N_title{ position:absolute; top:30px; left:0; transition: all .3s; opacity:0;}
.N-idx5_con{ width:1200px; position:absolute; top:267px; left:50%; margin-left:-600px; transition: all .3s; opacity:0;}
.N_sh_ico1,.N_sh_ico2,.N_sh_ico3,.N_sh_ico4,.N_sh_ico5,.N_sh_ico6{ position:absolute; top:22px; left:22px; width:44px; height:44px; transition: all .3s; opacity:0;}
.N-idx2_con{ width:1200px; position:absolute; top:210px; left:50%; margin-left:-600px; transition: all .3s; opacity:0;}
.N-idx2_con .picScroll-left .bd ul li div{ position:absolute; top:-80px; left:50%; margin-left:-117px; transition: all .6s; opacity:0;}
.N-idx2_con .picScroll-left .bd ul li:hover div{ -webkit-transform: rotateY(180deg); /* flip horizontally 180deg*/ -moz-transform: rotateY(180deg); transform: rotateY(180deg); -webkit-transition-delay: 0s; -moz-transition-delay: 0s; transition-delay: 0s;}

/*N+智网站动画效果---------------------------------*/
.N-idx1.animation .N_title,.N-idx2.animation .N_title{ top:70px; opacity:1;}
.animation .N-idx1_con{ top:227px; opacity:1;}
.animation .N2_img1{ width:73px; height:73px; left:105px; top:105px; opacity:1; transition-delay:.2s;}
.animation .N2_img2{ width:73px; height:73px; left:365px; top:32px; opacity:1; transition-delay:.35s;}
.animation .N2_img3{ width:73px; height:73px; left:624px; top:98px; opacity:1; transition-delay:.45s;}
.N-adv.animation .N_title{ top:55px; opacity:1;}
.animation .N-adv_con{ opacity:1;}
.animation .N-adv_con-1{ opacity:1; transition-delay:.3s;}
.animation .N-adv_con-2{ opacity:1; transition-delay:.4s;}
.animation .N-adv_con-3{ opacity:1; transition-delay:.5s;}
.animation .N-adv_con-4{ opacity:1; transition-delay:.6s;}
.animation .N-adv_con-5{ opacity:1; transition-delay:.7s;}
.animation .N-adv_con-6{ opacity:1; transition-delay:.8s;}
.N-idx3.animation .N_title{ top:70px; opacity:1;}
.animation .N-idx3_con{ top:227px; opacity:1;}
.N-idx5.animation .N_title{ top:70px; opacity:1;}
.animation .N-idx5_con{ top:227px; opacity:1;}
.animation .N_sh_ico1,.animation .N_sh_ico2,.animation .N_sh_ico3,.animation .N_sh_ico4,.animation .N_sh_ico5,.animation .N_sh_ico6{ top:0; left:0; width:88px; height:88px; opacity:1; transition-delay:.3s;}
.animation .N-idx2_con{ top:250px; opacity:1;}
.animation .picScroll-left .bd ul li div{ top:0; opacity:1;}

/*解决方案*/
.s_banner h1{ position:absolute; top:120px; width:100%; transition: all .3s; opacity:0;}
.s_banner p{ position:absolute; top:180px; width:100%; transition: all .3s; opacity:0;}
.s_banner1{ position:absolute; top:627px; left:50%; margin-left:-284px; z-index:5; transition: all .3s; opacity:0;}
.s_banner2{ position:absolute; top:628px; left:50%; margin-left:44px; z-index:4; transition: all .3s; opacity:0;}
.s_banner3{ position:absolute; top:627px; left:50%; margin-left:-448px; z-index:3; transition: all .3s; opacity:0;}
.s_banner4{ position:absolute; top:627px; left:50%; margin-left:268px; z-index:2; transition: all .3s; opacity:0;}
.s_banner5{ position:absolute; top:627px; left:50%; margin-left:-503px; z-index:1; transition: all .3s; opacity:0;}
.s-idx1{ height:650px;}
.s-idx1 .s_title,.s-idx2 .s_title{ position:absolute; top:15px; left:0; transition: all .3s; opacity:0;}
.s-idx1_con{ width:1200px; position:absolute; top:244px; left:50%; margin-left:-600px; transition: all .3s;}
.s-idx1_con li div{ position:absolute; top:57px; left:50%; margin-left:-57px; width:88px; height:88px; transition: all .3s; opacity:0; transition-timing-function:ease-out;}
.s-idx2_img{ position:absolute; top:324px; transition: all .6s; opacity:0;}
.s-idx2_con{ position:absolute; top:847px; width:100%; left:0; transition: all .3s; opacity:0;}
.s-idx3 .s_title{ position:absolute; top:25px; left:0; transition: all .3s; opacity:0;}
.s-idx3_con{ width:1200px; position:absolute; top:346px; left:50%; margin-left:-600px;}
.s-idx3_con li{ transition: all .3s; opacity:0;}
.s-idx3_con li.s-idx3_ico1{ top:40px;}
.s-idx3_con li.s-idx3_ico2{ top:40px;}
.s-idx3_con li.s-idx3_ico3{ top:40px;}
.s-idx3_con li.s-idx3_ico4{ top:40px;}
.s-idx4 .s_title{ position:absolute; top:40px; left:0; transition: all .3s; opacity:0;}

/*解决方案动画效果-------------------------------*/
.animation1 .s_banner h1{ top:160px; opacity:1;}
.animation1 .s_banner p{ top:220px; opacity:1;}
.animation1 .s_banner1{ top:321px; opacity:1;}
.animation1 .s_banner2{ top:346px; opacity:1; transition-delay:.1s;}
.animation1 .s_banner3{ top:346px; opacity:1; transition-delay:.2s;}
.animation1 .s_banner4{ top:392px; opacity:1; transition-delay:.3s;}
.animation1 .s_banner5{ top:392px; opacity:1; transition-delay:.4s;}
.s-idx1.animation .s_title,.s-idx2.animation .s_title{ top:55px; opacity:1;}
.animation .s-idx1_con{ top:204px;}
.animation .s-idx1_con li div{ width:176px; height:176px; margin-left:-101px; top:0; opacity:1; transition-delay:.3s;}
.animation .s-idx1_con li div.s-idx_ico2{ transition-delay:.6s;}
.animation .s-idx1_con li div.s-idx_ico3{ transition-delay:.9s;}
.animation .s-idx1_con li:hover div{ -webkit-transform: rotateY(180deg); /* flip horizontally 180deg*/ -moz-transform: rotateY(180deg); transform: rotateY(180deg); -webkit-transition-delay: 0s; -moz-transition-delay: 0s; transition-delay: 0s;}
.animation .s-idx2_img{ top:284px; opacity:1;}
.animation.s-idx2_con{ top:807px; opacity:1;}
.animation.s-idx3 .s_title{ top:65px; opacity:1;}
.animation li.s-idx3_ico1{ top:0; opacity:1;}
.animation li.s-idx3_ico2{ top:0; opacity:1; transition-delay:.2s;}
.animation li.s-idx3_ico3{ top:0; opacity:1; transition-delay:.4s;}
.animation li.s-idx3_ico4{ top:0; opacity:1; transition-delay:.6s;}
.animation.s-idx4 .s_title{ top:80px; opacity:1;}

/*智管家*/
.zgj-idx1{ position:relative; height:655px;}
.zgj-idx1 .zgj_title{ position:absolute; top:45px; left:0; transition: all .6s; opacity:0;}
.zgj-idx1_img{ width:1200px; position:absolute; top:239px; left:50%; margin-left:-600px; text-align:center; height:416px;}
.zgj_img1{ position:absolute; top:170px; left:50%; margin-left:-239px; z-index:3; transition: all .6s; opacity:0;}
.zgj1_ico1{ position:absolute; top:-60px; right:50%; margin-right:-575px; z-index:4; transition: all .6s; opacity:0;}
.zgj1_ico2{ position:absolute; top:144px; left:50%; margin-left:-492px; z-index:2; transition: all .6s; opacity:0;}
.zgj-idx2 .zgj_title{ position:absolute; top:40px; left:0; transition: all .6s; opacity:0;}
.zgj-idx2_con{ width:1190px; position:absolute; top:267px; left:50%; margin-left:-595px;}
.zgj-idx2_con ul{ position:relative; height:285px;}
.zgj-idx2_li1{ position:absolute; top:0; left:-20px; transition: all .6s; opacity:0;}
.zgj-idx2_li2{ position:absolute; top:0; left:150px; transition: all .6s; opacity:0;}
.zgj-idx2_li3{ position:absolute; top:0; left:320px; transition: all .6s; opacity:0;}
.zgj-idx2_li4{ position:absolute; top:0; left:490px; transition: all .6s; opacity:0;}
.zgj-idx2_li5{ position:absolute; top:0; left:660px; transition: all .6s; opacity:0;}
.zgj-idx2_li6{ position:absolute; top:0; left:830px; transition: all .6s; opacity:0;}
.zgj-idx2_li7{ position:absolute; top:0; left:1000px; transition: all .6s; opacity:0;}
.zgj_alink1{ position:absolute; bottom:-25px; left:50%; margin-left:-95px; transition: all .6s; opacity:0;}
.zgj-idx3 .zgj_title{ position:absolute; top:40px; left:0; transition: all .6s; opacity:0;}
.zgj-idx3_conl{ position:absolute; top:196px; left:50%; margin-left:-428px; transition: all .6s; opacity:0;}
.zgj-idx3_conr{ position:absolute; top:196px; left:50%; margin-left:-17px; transition: all .6s; opacity:0;}
.zgj-idx4{ height:718px; position:relative;}
.zgj-idx4 .zgj_title{ position:absolute; top:45px; left:0; transition: all .6s; opacity:0;}
.zgj-idx4_con{ height:355px; position:absolute; top:250px; transition: all .6s; opacity:0;}
.zgj_con1{ position:absolute; left:-20px; top:0; transition: all .6s; opacity:0;}
.zgj_con2{ position:absolute; right:-20px; top:0; transition: all .6s; opacity:0;}
.zgj_con3{ position:absolute; left:-20px; top:150px; transition: all .6s; opacity:0;}
.zgj_con4{ position:absolute; right:-20px; top:150px; transition: all .6s; opacity:0;}
.zgj-idx5 .zgj_title{ position:absolute; top:30px; left:0; transition: all .6s; opacity:0;}
.zgj-idx5_con{ width:1161px; position:absolute; top:251px; left:50%; margin-left:-580px; transition: all .6s; opacity:0;}
.zgj-idx5_con li img{ display:block; position:absolute; top:-80px; left:50%; margin-left:-131px; transition: all .6s; opacity:0;}

/*智动画效果-------------------------------*/
.zgj-idx1 .animation.zgj_title{ top:85px; opacity:1;}
.animation .zgj_img1{ top:130px; opacity:1;}
.animation .zgj1_ico1{ top:0; margin-right:-515px; opacity:1; transition-delay: .3s;}
.animation .zgj1_ico2{ top:84px; margin-left:-432px; opacity:1; transition-delay: .5s;}
.zgj-idx2 .animation.zgj_title{ top:80px; opacity:1;}
.animation .zgj-idx2_li1{ left:0; opacity:1; transition-delay: .3s;}
.animation .zgj-idx2_li2{ left:170px; opacity:1; transition-delay: .4s;}
.animation .zgj-idx2_li3{ left:340px; opacity:1; transition-delay: .5s;}
.animation .zgj-idx2_li4{ left:510px; opacity:1; transition-delay: .6s;}
.animation .zgj-idx2_li5{ left:680px; opacity:1; transition-delay: .7s;}
.animation .zgj-idx2_li6{ left:850px; opacity:1; transition-delay: .8s;}
.animation .zgj-idx2_li7{ left:1020px; opacity:1; transition-delay: .9s;}
.zgj-idx2 .animation .zgj_alink1{ bottom:-65px; opacity:1;}
.zgj-idx3 .animation.zgj_title{ top:80px; opacity:1;}
.animation.zgj-idx3_conl{ margin-left:-388px; opacity:1;}
.animation.zgj-idx3_conr{ margin-left:-57px; opacity:1;}
.zgj-idx4 .animation.zgj_title{ top:85px; opacity:1;}
.animation.zgj-idx4_con{ opacity:1;}
.animation.zgj_con1{ left:0; opacity:1; transition-delay: .3s;}
.animation.zgj_con2{ right:0; opacity:1; transition-delay: .3s;}
.animation.zgj_con3{ left:0; opacity:1; transition-delay: .5s;}
.animation.zgj_con4{ right:0; opacity:1; transition-delay: .5s;}
.zgj-idx5 .animation.zgj_title{ top:70px; opacity:1;}
.animation.zgj-idx5_con{ top:211px; opacity:1;}
.animation.zgj-idx5_con li img{ top:0; opacity:1;}