.child_banner{ height:586px; background:#00a9ea;}

/* 透明度变化 */
@-webkit-keyframes pb_show {
    from { opacity: 0;}
    to { opacity: 1 ;}
}

@keyframes pb_show {
    from { opacity:0;}
    to { opacity: 1;}
}

/* 上往下运动 */
@-webkit-keyframes pb_banner {
    from { opacity: 0; -webkit-transform: translate3d(0,-20px,0); transform: translate3d(0,-20px,0)}
    to { opacity: 1 ; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0)}
}

@keyframes pb_banner {
    from { opacity: 0; -webkit-transform: translate3d(0,-20px,0); transform: translate3d(0,-20px,0)}
    to { opacity: 1 ; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0)}
}

/* 下往上运动 */
@-webkit-keyframes pb_banner2 {
    from { opacity: 0; -webkit-transform: translate3d(0,20px,0); transform: translate3d(0,20px,0)}
    to { opacity: 1 ; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0)}
}

@keyframes pb_banner2 {
    from { opacity: 0; -webkit-transform: translate3d(0,20px,0); transform: translate3d(0,20px,0)}
    to { opacity: 1 ; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0)}
}

/* 遮罩层*/
@-webkit-keyframes widthshort{
	0%{ width:100%;}
	100%{ width:0;}
}
@-moz-keyframes widthshort{
	0%{ width:100%;}
	100%{ width:0;}
}
@-o-keyframes widthshort{
	0%{ width:100%;}
	100%{ width:0;}
}
@keyframes widthshort{
	0%{ width:100%;}
	100%{ width:0;}
}

/* 缩放效果 */
@-webkit-keyframes ani_scale{
	from{-webkit-transform:scale(0.1);-moz-transform:scale(0.1);-o-transform:scale(0.1);transform:scale(0.1);opacity:0;}
	to{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);opacity:1;}
}
@-moz-keyframes ani_scale{
	from{-webkit-transform:scale(0.1);-moz-transform:scale(0.1);-o-transform:scale(0.1);transform:scale(0.1);opacity:0;}
	to{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);opacity:1;}
}
@keyframes ani_scale{
	from{-webkit-transform:scale(0.1);-moz-transform:scale(0.1);-o-transform:scale(0.1);transform:scale(0.1);opacity:0;}
	to{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);opacity:1;}
}

/* 旋转效果 */
@-webkit-keyframes ani_rotate{
	from{ -webkit-transform:rotate(-90deg); opacity:0;}
	to{ -webkit-transform:rotate(0deg); opacity:1;}
}


/*child_case_banner*/
	.child_case_banner{ position:relative;}
	.child_case_banner h3{ height:80px; line-height:80px; text-align:center; font-size:36px; padding-top:15px; color:#fff;}
	.c_case_icon{ width:124px; margin:0 auto;}
		.c_case_icon a{ width:36px; height:45px; float:right; display:block;}
			.c_case_icon a img{ width:100%; height:100%;}
		.c_case_icon a:first-child{ float:left;}
	.child_case_banner span{ display:block; height:46px; line-height:46px; text-align:center; color:#fff;}
		.case_move_icon a{ position:absolute; display:block;}
			.case_move_icon a img{ width:100%; height:100%;}
			.case_move_icon .move_computer{ opacity:0; width:480px; height:344px; left:360px; top:200px; z-index:10;}

			.move_line{ width:1060px; height:260px; background:url(../images/child_banner_line2.png) no-repeat; left:76px; top:180px;}
			.move_box{ z-index:1; background:url(../images/point.jpg) repeat 0 0; width:396px; height:264px; left:0px; top:180px;}
			.move_box1{ z-index:1; background:url(../images/point.jpg) repeat 0 0; width:396px; height:264px; right:0px; top:180px;}

			.case_move_icon .move_icon{ width:48px; height:48px;}
			.move_pos{ left:1028px; top:272px; opacity:0;}
			.move_pos1{ left:1112px; top:190px; opacity:0;}
			.move_pos2{ left:886px; top:440px; opacity:0;}
			.move_pos3{ left:154px; top:140px; opacity:0;}
			.move_pos4{ left:54px; top:259px; opacity:0;}
			.move_pos5{ left:156px; top:419px; opacity:0;}

.move_box{
	-webkit-animation: widthshort 1.5s .8s 1 ease forwards;
	-moz-animation: widthshort 1.5s .8s 1 ease forwards;
	-o-animation: widthshort 1.5s .8s 1 ease forwards;
	animation: widthshort 1.5s .8s 1 ease forwards;
}
.move_box1{
	-webkit-animation: widthshort 1.5s .8s 1 ease forwards;
	-moz-animation: widthshort 1.5s .8s 1 ease forwards;
	-o-animation: widthshort 1.5s .8s 1 ease forwards;
	animation: widthshort 1.5s .8s 1 ease forwards;
}
.move_computer{
	-webkit-animation:ani_scale 1s .5s 1 ease forwards;
	-moz-animation:ani_scale 1s .5s 1 ease forwards;
	-o-animation:ani_scale 1s .5s 1 ease forwards;
	animation:ani_scale 1s .5s 1 ease forwards;
}
.move_pos, .move_pos1, .move_pos2, .move_pos3, .move_pos4, .move_pos5{
	-webkit-animation:ani_rotate 1s 2s 1 ease forwards;
	-moz-animation:ani_rotate 1s 2s 1 ease forwards;
	-o-animation:ani_rotate 1s 2s 1 ease forwards;
	animation:ani_rotate 1s 2s 1 ease forwards;
}

/*child_phone_banner */
.child_phone{ background:#1acc72;}
.child_phone_banner{ position:relative; height:586px;}
.child_phone_banner h3{ height:80px; line-height:80px; text-align:center; font-size:36px; padding-top:15px; color:#fff;}
.pb_profile{ position:absolute; width:440px; height:68px; line-height:34px; color:#fff; font-size:14px; right:20px; top:114px;}
.pb_pos a{ display:block; position:absolute;}
.pb_pos a img{ width:100%; height:100%;}
.pb_pos .phone_hand{ left:376px; bottom:0; width:423px; height:470px; opacity:0;}
.pb_pos .pb_icon{ left:290px; top:118px; opacity:0; width:177px; height:259px;}
.pb_pos .pb_circle{right:0; top:255px; opacity:0; width:466px; height:133px;}
.pb_pos .pb_icon1{ left:466px; top:174px; opacity:0; width:58px; height:27px;}
.pb_pos .pb_icon2{ left:72px; top:118px; opacity:0; width:174px; height:102px;}

.child_phone_banner h3{
    -webkit-animation: pb_banner 1s 1 forwards;
    animation: pb_banner 1s 1 forwards;
    -webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
    animation-timing-function:cubic-bezier(.01, 1, .21, .99);
}
.pb_profile{
    -webkit-animation: pb_banner 1s 1s 1 forwards;
    animation: pb_banner 1s 1s 1 forwards;
    -webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
    animation-timing-function:cubic-bezier(.01, 1, .21, .99);
}
.pb_icon1{
    -webkit-animation: pb_banner .5s 1.5s 1 forwards;
    animation: pb_banner .5s 1.5s 1 forwards;
    -webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
    animation-timing-function:cubic-bezier(.01, 1, .21, .99);
}
.pb_icon{
    -webkit-animation: pb_banner .5s 2s 1 forwards;
    animation: pb_banner .5s 2s 1 forwards;
    -webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
    animation-timing-function:cubic-bezier(.01, 1, .21, .99);
}
.pb_icon2, .pb_circle{
    -webkit-animation: pb_banner .5s 2.5s 1 forwards;
    animation: pb_banner .5s 2.5s 1 forwards;
    -webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
    animation-timing-function:cubic-bezier(.01, 1, .21, .99);
}


@-webkit-keyframes pb_ani{
    0%{ -webkit-transform:scale(0.1); transform:scale(0.1); opacity:0;}
    100%{ -webkit-transform:scale(1); transform:scale(1); opacity:1;}
}
@keyframes pb_ani{
    0%{ -webkit-transform:scale(0.1); transform:scale(0.1); opacity:0;}
    100%{ -webkit-transform:scale(1); transform:scale(1); opacity:1;}
}

.phone_hand{
    -webkit-animation:pb_ani .5s 1s 1 ease forwards;
    animation:pb_ani .5s 1s 1 ease forwards;
}

/* child_case2_banner */
.case2-bg-color{background:#41E0ED;}
    .case2-bg{width:1170px;height:415px;background:url("/Static/images/case/animation-bg.png") no-repeat;position:absolute;z-index:9;}
	.case2-box1{width:495px;height:355px; position:absolute;background:#41E0ED;top:60px;left:0px;z-index:10}
	.case2-box2{width:495px;height:355px; position:absolute;background:#41E0ED;top:60px;right:0px;z-index:10;}
    .case2-computer{width:480px;height:345px;position:absolute;z-index:99;top:60px;left:370px;opacity:0;}
    .case2-keyboard{width:360px;height:134px;position:absolute;z-index:99;top:400px;left:428px;opacity:0;}
    .case2-icon1,.case2-icon2,.case2-icon3,.case2-icon4,.case2-txt1,.case2-txt2{widht:75px;height:75px; position:absolute;z-index:99;opacity:0;}
    .case2-icon1{top:60px;left:100px;opacity:0;}
    .case2-icon2{top:270px;left:140px;opacity:0;}
    .case2-icon3{top:120px;left:1100px;opacity:0;}
    .case2-icon4{top:400px;left:880px;opacity:0;}
	.case2-txt1{top:95px;left:540px;opacity:0;}
	.case2-txt2{top:155px;left:405px;opacity:0;}
	

.case2-computer{
	-webkit-animation:pb_banner 1s 0.5s 1 forwards;
	animation:pb_banner 1s 0.5s 1 forwards;
	-webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	animation-timing-function:cubic-bezier(.01, 1, .21, .99);
}
.case2-keyboard{
	-webkit-animation:pb_banner2 1s 1s 1 forwards;
	animation:pb_banner2 1s 2s 1 forwards;
	-webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	animation-timing-function:cubic-bezier(.01, 1, .21, .99);
}

.case2-box1{
	-webkit-animation: widthshort 1.5s 2.5s 1 ease forwards;
	-moz-animation:    widthshort 1.5s 2.5s 1 ease forwards;
	-o-animation:      widthshort 1.5s 2.5s 1 ease forwards;
	animation:         widthshort 1.5s 2.5s 1 ease forwards;
}
.case2-box2{
	-webkit-animation: widthshort 2s 2.5s 1 ease forwards;
	-moz-animation:    widthshort 2s 2.5s 1 ease forwards;
	-o-animation:      widthshort 2s 2.5s 1 ease forwards;
	animation:         widthshort 2s 2.5s 1 ease forwards;
}
.case2-txt1{
	-webkit-animation:pb_banner 1s 2s 1 forwards;
	animation:pb_banner 1s 2s 1 forwards;
	-webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	animation-timing-function:cubic-bezier(.01, 1, .21, .99);
}
.case2-txt2{
	-webkit-animation:pb_show 3s 2.5s 1 forwards;
	animation:pb_show 3s 3s 1 forwards;
	-webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	animation-timing-function:cubic-bezier(.01, 1, .21, .99);
}
.case2-icon1,.case2-icon2,.case2-icon3,.case2-icon4{
	-webkit-animation:pb_show 0.5s 4s 1 forwards;
	animation:pb_show 0.5s 4s 1 forwards;
	-webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	animation-timing-function:cubic-bezier(.01, 1, .21, .99);
}

/*child_news_banner*/

.news_banner{ background:#c70000;}
.child_news_banner{ position:relative;}

.nb_title{ position:absolute; height:30px; width:1200px; text-align:center; color:#fff; font-size:32px; top:30px;}
.child_news_icon li, .other_icon a{ display:block; position:absolute;}
.other_icon .head{ left:50%; margin-left:-118px; top:370px; width:236px; height:270px;}
.other_icon .nline{ left:156px; top:240px; width:975px; height:285px; opacity:0;}

.child_news_icon .n_5{ left:74px; top:498px; width:90px; height:90px; }
.child_news_icon .n_1{ left:160px; top:270px; width:58px; height:58px;}
.child_news_icon .n_4{ left:350px; top:340px; width:106px; height:106px;}
.child_news_icon .n_2{ left:550px; top:210px; width:58px; height:58px;}
.child_news_icon .n_7{ left:830px; top:210px; width:106px; height:106px;}
.child_news_icon .n_3{ left:965px; top:390px; width:58px; height:58px;}
.child_news_icon .n_6{ left:1115px; top:430px; width:90px; height:90px;}																														    .child_news_icon li{opacity:0;}
.child_news_banner a img{ width:100%;}
.child_news_word span{ color:#fff; font-size:16px; position:absolute; display:block;}
.child_news_word .w_5{ left:85px; top:594px; opacity:0;}
.child_news_word .w_1{ left:160px; top:240px; opacity:0;}
.child_news_word .w_4{ left:370px; top:450px; opacity:0;}
.child_news_word .w_2{ left:545px; top:270px; opacity:0;}
.child_news_word .w_7{ left:852px; top:182px; opacity:0;}
.child_news_word .w_3{ left:965px; top:450px; opacity:0;}
.child_news_word .w_6{ left:1130px; top:405px; opacity:0;}

.head{
    -webkit-animation:ani_scale  1s 1 ease forwards;
    -moz-animation:ani_scale  1s 1 ease forwards;
    -o-animation:ani_scale  1s 1 ease forwards;
    animation:ani_scale  1s 1 ease forwards;
}

.nline{
    -webkit-animation:banner_1 1s 1s 1 ease forwards;
    -moz-animation:banner_1 1s 1s 1 ease forwards;
    -o-animation:banner_1 1s 1s 1 ease forwards;
    animation:banner_1 1s 1s 1 ease forwards;
}

.n_2, .n_6, .w_2, .w_6{
    -webkit-animation:ani_3d 1s 2s 1 ease forwards;
    -moz-animation:ani_3d 1s 2s 1 ease forwards;
    -o-animation:ani_3d 1s 2s 1 ease forwards;
    animation:ani_3d 1s 2s 1 ease forwards;
}
.n_4, .n_3, .n_7, .w_4, .w_3, .w_7{
    -webkit-animation:ani_3d 1s 2.5s 1 ease forwards;
    -moz-animation:ani_3d 1s 2.5s 1 ease forwards;
    -o-animation:ani_3d 1s 2.5s 1 ease forwards;
    animation:ani_3d 1s 2.5s 1 ease forwards;
}

.n_1, .n_5, .w_1, .w_5{
    -webkit-animation:ani_3d 1s 3s 1 ease forwards;
    -moz-animation:ani_3d 1s 3s 1 ease forwards;
    -o-animation:ani_3d 1s 3s 1 ease forwards;
    animation:ani_3d 1s 3s 1 ease forwards;
}

@-webkit-keyframes banner_1 {
    from { opacity: 0; -webkit-transform: translate3d(0,-20px,0); transform: translate3d(0,20px,0)}
    to { opacity: 1 ; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0)}
}
@keyframes banner_1 {
    from { opacity: 0; -webkit-transform: translate3d(0,-20px,0); transform: translate3d(0,-20px,0)}
    to { opacity: 1 ; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0)}
}

@-webkit-keyframes ani_3d {
    from { opacity: 0; -webkit-transform: rotateY(0); transform: rotateY(0);}
    to { opacity: 1 ; -webkit-transform: rotateY(360deg); transform: rotateY(360deg);}
}
@keyframes ani_3d {
    from { opacity: 0; -webkit-transform: rotateY(0); transform: rotateY(0);}
    to { opacity: 1 ; -webkit-transform: rotateY(360deg); transform: rotateY(360deg);}
}
/*child_news_banner end*/