@charset "gb2312";
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin: 0; padding: 0 }
html { color: #000; overflow-y: scroll; overflow: -moz-scrollbars-vertical }
body, button, input, select, textarea { font-size: 12px; font-family: 'Microsoft Yahei', arial, 'Hiragino Sans GB', \5b8b\4f53, Tahoma, Arial, Helvetica, STHeiti }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: 400; }
em { font-style: normal }
small { font-size: 12px }
ul, ol { list-style: none }
a { text-decoration: none }
a:hover { text-decoration: none!important }
p { text-align: justify; text-justify: inter-ideograph; white-space: normal; }
legend { color: #000 }
fieldset, img { border: 0 }
button, input, select, textarea { font-size: 100% }
table { border-collapse: collapse; border-spacing: 0 }
img { -ms-interpolation-mode: bicubic }
textarea { resize: vertical }
.left { float: left }
.right { float: right }
.overflow { overflow: hidden }
.hide { display: none }
.block { display: block }
.inline { display: inline }
.error { color: #F00; font-size: 12px }
label, button { cursor: pointer }
.clearfix:after { content: '\20'; display: block; height: 0; clear: both }
.clearfix { zoom: 1 }
.clear { clear: both; height: 0; line-height: 0; font-size: 0; visibility: hidden; overflow: hidden }
.wordwrap { word-break: break-all; word-wrap: break-word }
pre.wordwrap { white-space: pre-wrap }
/*²àÀ¸-------------------------------------------------------------------------------*/
.guide { position: fixed; _position: absolute; right: 15px; top: 70%; margin-top: -80px; margin-left: 650px; height: 155px; width: 20px; padding-top: 10px; border: 1px solid rgba(0,0,0,.2); border-radius: 50px; }
.guide li { width: 9px; height: 9px; overflow: hidden; cursor: pointer; margin: 0 auto 4px; _margin: 0 auto 4px; border-radius: 50%; background: rgba(0,0,0,.0); border: 1px solid rgba(0,0,0,.2); }
.guide li:hover, .guide li.hover, .guide li.choose { background: rgba(0,0,0,.3); }


/*Çø¿é-------------------------------------------------------------------------------*/
html, body { height: 100%; overflow: hidden; text-align: center; background: #1d1d22; }
.container { position: absolute; width: 100%; height: 100%; left: 0; top: 0 }
.container .banner { background: #0a080c url(../images/banner.png) no-repeat center; }
.container .item-1 { background: url(../images/item1_bg.jpg) no-repeat center; }
.container .item-2 { background: url(../images/item2_bg.jpg) no-repeat center; }
.container .item-3 { background: url(../images/item3_bg.jpg) no-repeat center; }
.container .item-4 { background: url(../images/item4_bg.jpg) no-repeat center; }
.container .item-5 { background: url(../images/item5_bg.jpg) no-repeat center; }
.container .item-6 { background: url(../images/item6_bg.jpg) no-repeat center; }
.container .item-7 { background: url(../images/item7_bg.jpg) no-repeat center; }
.container .item-8 { background: url(../images/item8_bg.jpg) no-repeat center; }
.container .item-9 { background: url(../images/item9_bg.jpg) no-repeat center; }
.container .section { background-size: cover; height: 100%; overflow: hidden; }


.container .inner { width: 1100px; margin: 0 auto; height: 100%; position: relative; color: #fff; }
.transitionAll { transition: all 1.5s; -webkit-transition: all 1.5s; -moz-transition: all 1.5s; }
.transitionAll1 { transition: all 2s; -webkit-transition: all 2s; -moz-transition: all 2s; }
.transitionAll2 { transition: all 1s; -webkit-transition: all 1s; -moz-transition: all 1s; }
.transitionAllh3 { background: url(../images/title.png) no-repeat 0 0; }


/*all btn---------------------------------------------------------------------------------------------------*/
.btn { width: 220px; height: 65px; background: #eb6100; display: block; border-radius: 5px; padding-left: 48px; line-height: 65px; position: relative; font-size: 32px; color: #fff; text-align: left; animation: btn 1s linear infinite alternate; -moz-animation: btn 1s linear infinite alternate; -webkit-animation: btn 1s linear infinite alternate; }
.btn:before { content: ""; width: 33px; height: 33px; background: url(../images/btn_arr.png) no-repeat center; position: absolute; top: 17px; left: 187px; }
.btn-1 { margin: 24px 0 0 86px; }
.btn-2 { margin: 40px 0 0 420px; }
.btn-3, .btn-4, .btn-5, .btn-6 { margin: 35px 0 0 420px; }
.btn-7 { margin-top: 30px;  margin-left:-370px;}
.btn-8 { position: absolute; left: 500px; top: 460px; opacity:0; }
.btn-9 { position: absolute; left: 50%; top: 1180px; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); opacity:0;}
 @keyframes btn { from {
 opacity: 1;
}
to { opacity: 0.4; }
}
@-webkit-keyframes btn { from {
 opacity: 1;
}
to { opacity: 0.4; }
}
@-moz-keyframes btn { from {
 opacity: 1;
}
to { opacity: 0.4; }
}


/*banner----------------------------------------------------------------------------------------------------*/
.banner .light { position: absolute; top: 0; left: -290px; z-index: 22; display: none; pointer-events:none; }
.banner .text { width: 520px; padding-top: 80px; padding-left: 30px; display: none; }



/*item-1---------------------------------------------------------------------------------------------------*/
.item-1 h3 { width: 448px; height: 76px; margin-top: 5%; }
.item-1.show h3{ opacity:0;}

.item-1 .text-1 { font-size: 20px; line-height: 24px; padding: 0 80px 0 90px; margin: 2% 0 10% 0; }
.item-1.show .text-1{opacity:0;}

.item-1 p span { color: #ff0000; }
.item-1 ul { width: 100%; height: 279px; }
.item-1 ul li { width: 219px; height: 275px; border: 2px solid #fff; float: left; margin-right: 69px; text-align: center; position: relative; }
.item-1 ul li h5 { font-size: 24px; margin: 88px 0 18px 0; }
.item-1.show ul li h5{ font-size:0; opacity:0;}


.item-1 ul li p { font-size: 16px; line-height: 24px; padding: 0 20px; }
.item-1.show ul li p {padding: 250px 20px;  opacity:0;}

.item-1 ul li .circle { width: 140px; height: 140px; border-radius: 50%; background: #fff; text-align: center; position: absolute; top: -70px; left: 40px; }
.item-1.show ul li .circle{ -webkit-transform-origin:center; -webkit-transform: rotateX(720deg);transform-origin:center; transform: rotateX(720deg); -ms-transform-origin:center; -ms-transform: rotateX(720deg);}


.circle span { color: #ff0000; font-size: 30px; display: block; padding-top: 30px; }
.circle em { color: #ff0000; font-size: 24px; display: block; }



/*item2----------------------------------------------------------------------------------------------------*/
.item-2 h3 { width: 450px; height: 76px; margin-top: 5%; background-position: 0 -91px; }
.item-2.show h3{ opacity: 0;}


.con .up, .con .down { width: 100%; height: 270px; background: #fff url(../images/item2_1.jpg) no-repeat top left; margin-top: 18px; color: #000005; position: relative; }
.con .down { background: #fff url(../images/item2_2.jpg) no-repeat top left; margin-top: 10px; }
.item-2 .up span { font-size: 14px; position: absolute; top: 58px; left: 388px; line-height: 24px; text-align: left; }
.item-2.show .up span{ opacity: 0; left: 700px;}


.con h4 { font-size: 24px; position: absolute; left: 768px; top: 60px; }
.item-2.show .con h4,.item-3.show .con h4{ opacity: 0; top: -50px;}



.con p { font-size: 16px; position: absolute; left: 768px; top: 100px; padding-right: 60px; line-height: 26px; }
.item-2.show .con p,.item-3.show .con p{ opacity: 0; top: 270px;}

.con p em { font-weight: bold; }



/*item3----------------------------------------------------------------------------------------------------*/
.item-3 .up-left { left: 10px; top: 8px; font-size: 24px; position: absolute;}
.item-3.show .up-left{ opacity: 0;}

.item-3 span { font-size: 16px; position: absolute; padding-left: 26px; left: 30px; top: 50px; }
.item-3.show span{ opacity: 0; top:35px;}


.item-3 .two { left: 215px; top: 25px; }
.item-3 .three { left: 380px; top: 50px; }
.item-3 .four { left: 536px; top: 25px; }
.item-3 span:before { width: 19px; height: 19px; content: ""; background: url(../images/item3-up.png) no-repeat 0 0; position: absolute; top: 0; left: 0; }
.item-3 .two:before { background-position: -22px 0; }
.item-3 .three:before { background-position: -44px 0; }
.item-3 .four:before { background-position: -66px 0; }



/*item-4---------------------------------------------------------------------------------------------------*/
.item-4 h3 { width: 418px; height: 76px; background-position: 0 -185px; margin-top: 5%; }
.item-4.show h3{opacity: 0;}


.item-4 p { font-size: 20px; padding-left: 90px; line-height: 24px; margin: 20px 0 30px 0; }
.item-4.show p{opacity: 0;}


.item-4 p em{color: #e60012;}
.item-4 .con4 { width: 100%; height: 379px; background: url(../images/item4-1.jpg) no-repeat left top; }
.con4-t, .con4-c, .con4-b { width: 820px; height: 105px; background: url(../images/item4-2.png) no-repeat 0 0; position: relative; margin-left: 280px;  overflow:hidden;}
.item-4.show .con4-t,.item-4.show .con4-c,.item-4.show .con4-b{ width:0; opacity:0;}

.con4-t { top: -15px; }
.con4-c { margin-top: 20px; background-position: 0 -136px; }
.con4-b { margin-top: 40px; background-position: 0 -288px; }
.item-4 .con4 p { position: absolute; font-size: 20px; top: 25px; left: 470px; padding: 0; margin: 0; white-space:nowrap;}



/*item-5---------------------------------------------------------------------------------------------------*/
.item-5 h3 { width: 480px; height: 76px; background-position: 0 -279px; margin: 5% 0 30px 0; }
.item-5.show h3{ opacity:0;}


.item-5 .con5 { width: 100%; height: 438px; }
.item-5 .con5 li { width: 360px; height: 210px; border: 2px solid #fff; float: left; margin: 0 4px 4px 0; background: url(../images/item5-1.jpg) no-repeat center; position: relative; cursor:pointer;}
.item-5 .con5 li .text5 { width: 100%; height: 68px; position: absolute; left: 0; bottom: 0;; background: rgba(0,0,0,.7); overflow:hidden; opacity:0}
.item-5.show .con5 li .text5{  opacity:1;}

.item-5 .con5 li .text5 p { font-size: 16px; padding: 15px 0 0 80px; }
.item-5 .con5 li .text5 span { width: 58px; height: 58px; background: rgba(0,0,0,.7); position: absolute; left: 0; bottom: 0; z-index: 22; display: block; font-size: 24px; text-align: left; padding: 10px 0 0 10px; line-height: 25px; }



/*item-6---------------------------------------------------------------------------------------------------*/
.item-6 h3 { width: 333px; height: 76px; background-position: 0 -366px; margin: 5% 0 60px 0; }
.item-6.show h3{ opacity:0;}


.item-6 .title6 { width: 896px; height: 37px; margin: 0 auto 14px; }
.item-6 .title6 h6 { background: url(../images/title.png) no-repeat -482px 0; width: 130px; height: 37px; display: none; }
.scroll { width: 896px; height: 349px; position: relative; overflow: hidden; margin: 0 auto; }
.left, .right { width: 43px; height: 80px; position: absolute; top: 300px; z-index: 1; cursor: pointer; background: url(../images/title.png) no-repeat; }
.left { left: 0; background-position: -435px -369px; }
.left:hover { background-position: -370px -369px; }
.right { right: 0; background-position: -568px -369px; }
.right:hover { background-position: -501px -369px; }
.scroll-in { width: 700%; position: relative; }
.scroll ul { position: absolute; top: 0; left: 0; }
.scroll-in li { float: left; width: 896px; height: 407px; }



/*item-7---------------------------------------------------------------------------------------------------*/
.item-7 h3 { width: 333px; height: 76px; background-position: 0 -450px; margin: 5% 0 40px 0; }
.item-7.show h3{ opacity:0;}


.item-7 .con7 { width: 100%; height: 530px; }
.item-7 .con7 .text7 { width: 460px; height: 100%; float: left; text-align: left; overflow:hidden;}
.item-7 .con7 .text7 h5 { font-size: 23px; padding-left: 110px; margin-left:-380px;}
.item-7 .con7 .text7 h6 { font-size: 18px; padding-left: 0px; margin:20px 0px;}

.item-7 .con7 .text7 .zj { margin-top: 50px; position: relative; margin-left:-380px;}
.item-7 .con7 .text7 .zj:before { width: 102px; height: 36px; background: url(../images/title.png) no-repeat -510px -192px; position: absolute; top: -6px; left: 0; content: ""; }
.item-7 .con7 .text7 .zj:after { content: ""; position: absolute; width: 1px; height: 32px; background: #fff; top: -6px; left: 106px; }
.item-7 .con7 .text7 p { font-size: 20px; padding-left: 12px; position: relative; margin-left:-380px;}
.item-7 .con7 .text7 p:before { width: 7px; height: 7px; position: absolute; content: ""; top: 12px; left: 0; background: #ff0000; }
.item-7 .con7 .pic7 { width: 571px; height: 100%; float: right; }
.item-7.show .con7 .pic7{ opacity:0;}



/*item-8---------------------------------------------------------------------------------------------------*/
.item-8 .con8 { width: 100%; height:100%;}
.item-8 .con8 .pic8 { float: left; width: 570px; height: 100%; position: relative; }
.item-8 .pic8 .pic8-t { width: 473px; height: 279px; position: absolute; top: 40px; left: 87px; z-index: 10;}
.item-8.show .pic8 .pic8-t{ top:220px; transform:rotate(-8deg); left:20px; }

.item-8 .pic8 .pic8-c { width: 484px; height: 311px; position: absolute; top: 220px; left: 0; z-index: 11;  }
.item-8.show .pic8 .pic8-c{  transform:rotate(9deg);}


.item-8 .pic8 .pic8-b { width: 457px; height: 248px; position: absolute; top: 450px; left: 80px; z-index: 12;}
.item-8.show .pic8 .pic8-b{ transform:rotate(-1deg);top:220px; left:20px;}

.item-8 .con8 .text8 { width: 488px; float: right; text-align: left; height: 100%; position: relative; overflow:hidden;}
.item-8 .text8 h5 { width: 130px; height: 34px; background: url(../images/title.png) no-repeat -482px -251px; position: absolute; left: 500px; top: 200px;}
.item-8 .text8 .text8-title { position: absolute; left: 500px; top: 257px; font-size: 24px;}
.item-8 .text8 .text8-con { position: absolute; left: 500px; top: 300px; font-size: 16px; line-height: 26px; white-space:nowrap;}



/*item-9---------------------------------------------------------------------------------------------------*/
.item-9 h3 { width: 241px; height: 59px; background: url(../images/title.png) no-repeat -371px -466px; position: absolute; left: 50%; top: 950px; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); opacity:0;}
.item-9 p { font-size: 16px; position: absolute; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); width: 100%; text-align: center; }



/*Í·²¿---------------------------------------------------------------------------------------------------*/
#header {width:100%;height:66px; background-color:#1d1d1d;}
#header  h1 {width:282px;height:29px;float:left;margin-left:20px;margin-top:20px;display:inline;}
#header  h1 a {display:block;width:185px;height:29px; }
#header  ul {width:660px;height:24px;float:left;margin-left:15px;margin-top:23px;display:inline;}
#header  ul li {float:left;height:27px;line-height:27px;color:#fff;font-size:12px;margin-right:25px;display:inline;}
#header  ul li span {width:27px;height:27px;display:inline-block;float:left;margin-right:6px;margin-left:10px;display:inline;}
#header .fhsy {display:block;width:77px;height:22px;float:left;margin-top:25px;display:table;  }


/*β²¿---------------------------------------------------------------------------------------------------*/
#footer { height: 170px; width: 100%;  position: absolute; left: 0; bottom: 0; z-index: 22; }
.footer_wrap { width: 1190px; height: 170px; margin: 0 auto; }
.footerlogo { width: 91px; height: 93px; float: left; margin-top: 18px; margin-left: 20px; display: inline; }
.border { border-left: 1px dashed #383838; height: 111px; float: left; margin-top: 11px; margin-left: 17px; display: inline; }
.footer_secicon { float: left; height: 100px; margin-top: 35px; }
.footer_secicon li { width: 85px; height: 100px; float: left; margin-left: 15px; margin-right: 12px; display: inline; }
.footer_secicon li i { cursor: pointer; display: block; float: left; height: 48px; margin-left: 18px; width: 48px; }
.footer_secicon li i a { cursor: pointer; display: block; height: 48px; width: 48px; }
.footer_secicon li span { color: #A7A7A7; float: left; font-size: 16px; height: 40px; line-height: 40px; text-align: center; width: 100%; }
.footer_copyright { float: left; color: #A7A7A7; font-size: 12px; height: 35px; line-height: 35px; text-align: center; width: 100%; }
.footerWx { float: left; width: 111px; height: 111px; margin-top: 12px; margin-left: 25px; display: inline; }