.icon { display: inline-block; text-indent: -99999em; vertical-align: middle; background-size: 1489px; background-color: transparent }
.i-section-3-pic-1 { background: url(../images/pg_01.png) no-repeat; background-position: 0 0; width: 1200px; height: 520px }
.i-section-3-title-1 { background: url(../images/z_01.png) no-repeat; width: 248px; height: 65px; left: 150px; top: 100px }
.i-section-3-txt-1 { background: url(../images/z_02.png) no-repeat; width: 363px; height: 233px; left: 300px; top: 200px }
.i-section-4-pic-1 { background: url(../images/pg_02.png) no-repeat; background-position: 0 0; width: 1200px; height: 600px }
.i-section-4-title-1 { background: url(../images/z_03.png) no-repeat; width: 248px; height: 65px; left: 20px; top: 20px }
.i-section-4-txt-1 { background: url(../images/z_04.png) no-repeat; width: 546px; height: 187px; left: 20px; top: 100px; }
img { display: inline }
#zw_container { font: 14px/1.5 Microsoft YaHei, tahoma, arial, 'Hiragino Sans GB', sans-serif; color: #666666; -webkit-font-smoothing: antialiased }
#zw_container a, #zw_container td, #zw_container p, #zw_container span { font-size: inherit; line-height: inherit; font-family: inherit; color: inherit }
#zw_container img { display: block }
.container {
*zoom:1; width: 1200px; padding: 0 0; margin: 0 auto }
.container:before, .container:after { content: " "; display: table }
.container:after { clear: both }
.container:before, .container:after { display: table; content: "" }
.container:after { clear: both }
.container .whole-block { margin-left: 0; margin-right: 0 }
.container .margin-block { margin-left: 0; margin-right: 0 }
input[type="text"], input[type="button"], input[type="password"] { -webkit-appearance: none; outline: none; border: transparent }
input[type="text"], input[type="password"] { background: none }
textarea { padding: 0; resize: none }
*, input, textarea { box-sizing: content-box }
.section { position: relative; z-index: 0; overflow: hidden }
.section .container { position: absolute; z-index: 0; left: 50%; margin-left: -600px; top: 0 }
.section#section_4 { position: relative; z-index: 10; overflow: visible }
.section .icon { position: absolute; z-index: 0 }
.section#section_3 { height: 520px; }
.section#section_3 .section-wrap { position: absolute; z-index: 0; width: 100%; height: 600px; background-color: #f5f5f5 }
.section#section_3 .section-wrap .container { height: 600px }
.section#section_4 { height: 600px }
.section#section_4 .container { height: 600px }
.section .description-wrap { position: absolute; z-index: 0; left: 0; top: 0 }
.section#section_3 .description-wrap { left: 487px; top: 18px }
.section#section_4 .description-wrap { left: 27px; top: 59px }
.section#section_5 { height: 300px; }
.section#section_5 .section-wrap { position: absolute; z-index: 0; width: 100%; height: 300px; background:url(../images/z_05.png) no-repeat center center;}
.i-section-5-txt-1 { background: url(../images/z_06.png) no-repeat; width: 995px; height: 300px; right: 0px; top: 0px; }
 @keyframes section_1_fadeInRight_1 {
0% {
opacity:0;
transform:translate3d(200px, 0, 0)
}
to {
opacity:1;
transform:translate3d(0, 0, 0)
}
}
@keyframes section_1_fadeInRight_2 {
0% {
opacity:0;
transform:translate3d(200px, 0, 0)
}
to {
opacity:1;
transform:translate3d(0, 0, 0)
}
}
@keyframes section_1_zoomIn {
0% {
opacity:0;
transform:scale(.3, .3)
}
100% {
opacity:1;
transform:scale(1, 1)
}
}
#section_2.active .title, #section_4.active .title, #section_2.active .sub-title, #section_4.active .sub-title { animation: section_2_fadeInRight_1 .6s ease 0s 1 normal both }
#section_2.active .description, #section_4.active .description { animation: section_2_fadeInRight_2 .6s ease .6s 1 normal both }
#section_5.active .description { animation: section_3_fadeInRight_1 .6s ease 0s 1 normal both; }


@keyframes section_2_fadeInRight_1 {
0% {
opacity:0;
transform:translate3d(-200px, 0, 0)
}
to {
opacity:1;
transform:translate3d(0, 0, 0)
}
}
@keyframes section_2_fadeInRight_2 {
0% {
opacity:0;
transform:translate3d(-200px, 0, 0)
}
to {
opacity:1;
transform:translate3d(0, 0, 0)
}
}
#section_3.active .title, #section_3.active .sub-title { animation: section_3_fadeInRight_1 .6s ease 0s 1 normal both }
#section_3.active .description { animation: section_3_fadeInRight_2 .6s ease .6s 1 normal both }
@keyframes section_3_fadeInRight_1 {
0% {
opacity:0;
transform:translate3d(200px, 0, 0)
}
to {
opacity:1;
transform:translate3d(0, 0, 0)
}
}
@keyframes section_3_fadeInRight_2 {
0% {
opacity:0;
transform:translate3d(200px, 0, 0)
}
to {
opacity:1;
transform:translate3d(0, 0, 0)
}
}
 @keyframes section_5_zoomIn {
0% {
opacity:0;
transform:scale(3, 1)
}
to {
opacity:1;
transform:scale(1, 1)
}
}
@keyframes section_5_fadeInRight {
0% {
opacity:0;
transform:translate3d(400px, 0, 0)
}
to {
opacity:1;
transform:translate3d(0, 0, 0)
}
}