timeaxis.css 45 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955295629572958295929602961296229632964296529662967296829692970297129722973297429752976297729782979298029812982298329842985298629872988298929902991299229932994299529962997299829993000300130023003300430053006300730083009301030113012301330143015301630173018301930203021302230233024302530263027302830293030303130323033303430353036303730383039304030413042304330443045304630473048304930503051305230533054305530563057305830593060306130623063306430653066306730683069307030713072307330743075307630773078307930803081308230833084308530863087308830893090309130923093309430953096309730983099310031013102310331043105310631073108310931103111311231133114311531163117311831193120312131223123312431253126312731283129313031313132313331343135313631373138313931403141314231433144314531463147314831493150315131523153315431553156315731583159316031613162316331643165316631673168316931703171317231733174317531763177317831793180318131823183318431853186318731883189319031913192319331943195319631973198319932003201320232033204320532063207320832093210321132123213321432153216321732183219322032213222322332243225322632273228322932303231323232333234323532363237323832393240324132423243324432453246324732483249325032513252325332543255325632573258325932603261326232633264326532663267326832693270327132723273327432753276327732783279328032813282328332843285328632873288328932903291329232933294329532963297329832993300330133023303330433053306330733083309331033113312331333143315331633173318331933203321332233233324332533263327332833293330333133323333333433353336333733383339334033413342334333443345334633473348334933503351335233533354335533563357335833593360336133623363336433653366336733683369337033713372337333743375337633773378337933803381338233833384338533863387338833893390339133923393339433953396339733983399340034013402340334043405340634073408340934103411341234133414341534163417341834193420342134223423342434253426342734283429343034313432343334343435343634373438343934403441344234433444344534463447344834493450345134523453345434553456345734583459346034613462346334643465346634673468346934703471347234733474347534763477347834793480348134823483348434853486348734883489349034913492349334943495349634973498349935003501350235033504350535063507350835093510351135123513351435153516351735183519352035213522352335243525352635273528352935303531353235333534353535363537353835393540354135423543354435453546354735483549355035513552355335543555355635573558355935603561356235633564356535663567356835693570357135723573357435753576357735783579358035813582358335843585358635873588358935903591359235933594359535963597359835993600360136023603360436053606360736083609361036113612361336143615361636173618361936203621362236233624362536263627362836293630363136323633363436353636363736383639364036413642364336443645364636473648364936503651365236533654365536563657365836593660366136623663366436653666366736683669367036713672367336743675367636773678367936803681368236833684368536863687368836893690369136923693369436953696369736983699370037013702370337043705370637073708370937103711371237133714371537163717371837193720372137223723372437253726372737283729373037313732373337343735373637373738373937403741374237433744374537463747374837493750375137523753375437553756375737583759376037613762376337643765376637673768376937703771377237733774377537763777377837793780378137823783378437853786378737883789379037913792379337943795379637973798379938003801380238033804380538063807380838093810381138123813381438153816381738183819382038213822382338243825382638273828382938303831383238333834383538363837383838393840384138423843384438453846384738483849385038513852385338543855385638573858385938603861386238633864386538663867386838693870387138723873387438753876387738783879388038813882388338843885388638873888388938903891389238933894389538963897389838993900390139023903390439053906390739083909391039113912391339143915391639173918391939203921392239233924392539263927392839293930393139323933393439353936393739383939394039413942394339443945394639473948394939503951395239533954395539563957395839593960396139623963396439653966396739683969397039713972397339743975397639773978397939803981398239833984398539863987398839893990399139923993399439953996399739983999400040014002400340044005400640074008400940104011401240134014401540164017401840194020402140224023402440254026402740284029403040314032403340344035403640374038403940404041404240434044404540464047404840494050405140524053405440554056405740584059406040614062406340644065406640674068406940704071407240734074407540764077407840794080408140824083408440854086408740884089409040914092409340944095409640974098409941004101410241034104410541064107410841094110411141124113411441154116411741184119412041214122412341244125412641274128412941304131413241334134413541364137413841394140414141424143414441454146414741484149415041514152415341544155415641574158415941604161416241634164416541664167416841694170417141724173417441754176417741784179418041814182418341844185418641874188418941904191419241934194419541964197419841994200420142024203420442054206420742084209421042114212421342144215421642174218421942204221422242234224422542264227422842294230423142324233423442354236423742384239424042414242424342444245424642474248424942504251425242534254425542564257425842594260426142624263426442654266426742684269427042714272427342744275427642774278427942804281428242834284428542864287428842894290429142924293429442954296429742984299430043014302430343044305430643074308430943104311431243134314431543164317431843194320432143224323432443254326432743284329433043314332433343344335433643374338433943404341
  1. a:hover {
  2. text-decoration: inherit;
  3. }
  4. img {
  5. -ms-interpolation-mode: bicubic;
  6. border: 0;
  7. vertical-align: bottom;
  8. max-width: 100%;
  9. }
  10. #week_nav {
  11. position: relative;
  12. top: 0;
  13. z-index: 15;
  14. width: 100%;
  15. height: 60px;
  16. }
  17. .wk_index_main {
  18. margin-top: -60px;
  19. width: 100%;
  20. }
  21. #superContainer {
  22. height: 100%;
  23. position: relative;
  24. -ms-touch-action: none;
  25. touch-action: none;
  26. }
  27. .fp-section {
  28. position: relative;
  29. -webkit-box-sizing: border-box;
  30. -moz-box-sizing: border-box;
  31. box-sizing: border-box;
  32. }
  33. .fp-slide {
  34. float: left;
  35. }
  36. .fp-slide, .fp-slidesContainer {
  37. display: block;
  38. height: 100%;
  39. }
  40. .fp-slides {
  41. z-index: 1;
  42. height: 100%;
  43. overflow: hidden;
  44. position: relative;
  45. -webkit-transition: all 0.3s ease-out;
  46. transition: all 0.3s ease-out;
  47. }
  48. .fp-section.fp-table, .fp-slide.fp-table {
  49. display: table;
  50. width: 100%;
  51. table-layout: fixed;
  52. }
  53. .fp-tableCell {
  54. display: table-cell;
  55. width: 100%;
  56. height: 100%;
  57. vertical-align: middle;
  58. }
  59. .fp-slidesContainer {
  60. position: relative;
  61. float: left;
  62. }
  63. .fp-controlArrow {
  64. position: absolute;
  65. top: 50%;
  66. z-index: 4;
  67. margin-top: -38px;
  68. width: 0;
  69. height: 0;
  70. border-style: solid;
  71. cursor: pointer;
  72. -webkit-transform: translate3d(0, 0, 0);
  73. transform: translate3d(0, 0, 0);
  74. -ms-transform: translate3d(0, 0, 0);
  75. }
  76. .fp-controlArrow.fp-prev {
  77. left: 15px;
  78. width: 0;
  79. border-color: transparent #fff transparent transparent;
  80. border-width: 38.5px 34px 38.5px 0;
  81. }
  82. .fp-controlArrow.fp-next {
  83. right: 15px;
  84. border-color: transparent transparent transparent #fff;
  85. border-width: 38.5px 0 38.5px 34px;
  86. }
  87. .fp-scrollable {
  88. overflow: scroll;
  89. }
  90. .fp-notransition {
  91. -webkit-transition: none!important;
  92. transition: none!important;
  93. }
  94. #dn-nav {
  95. position: fixed;
  96. top: 50%;
  97. z-index: 100;
  98. margin-top: -32px;
  99. opacity: 1;
  100. -webkit-transform: translate3d(0, 0, 0);
  101. }
  102. #dn-nav.right {
  103. left: 17px;
  104. }
  105. #dn-nav ul {
  106. margin: 0;
  107. padding: 0;
  108. }
  109. #dn-nav ul li {
  110. position: relative;
  111. display: block;
  112. margin: 7px;
  113. width: 15px;
  114. height: 15px;
  115. }
  116. #dn-nav ul li a {
  117. position: relative;
  118. z-index: 1;
  119. display: block;
  120. width: 100%;
  121. height: 100%;
  122. text-decoration: none;
  123. cursor: pointer;
  124. }
  125. #dn-nav ul li a span {
  126. position: absolute;
  127. top: 50%;
  128. left: 50%;
  129. z-index: 1;
  130. margin: -3px 0 0 -3px;
  131. width: 7px;
  132. height: 7px;
  133. border: 0;
  134. border-radius: 50%;
  135. background: #cfcfd1;
  136. -webkit-transition: all .2s ease-in-out;
  137. -moz-transition: all .2s ease-in-out;
  138. -o-transition: all .2s ease-in-out;
  139. transition: all .2s ease-in-out;
  140. }
  141. #dn-nav ul li a.active span, #dn-nav ul li:hover a.active span {
  142. margin: -7px 0 0 -7px;
  143. width: 15px;
  144. height: 15px;
  145. border-radius: 100%;
  146. background: #90C42F;
  147. }
  148. .fp-auto-height .fp-slide, .fp-auto-height .fp-tableCell, .fp-auto-height.fp-section {
  149. height: auto!important;
  150. }
  151. .section {
  152. position: relative;
  153. overflow: hidden;
  154. }
  155. .page1 {
  156. background: #000;
  157. width: 100%;
  158. }
  159. .wk_slide-wrap {
  160. position: relative;
  161. width: 100%;
  162. height: 100%;
  163. }
  164. .wk_slide-wrap ul {
  165. width: 100%;
  166. height: 100%;
  167. }
  168. .wk_slide-wrap li {
  169. position: absolute;
  170. top: 0;
  171. right: 0;
  172. bottom: 0;
  173. left: 0;
  174. overflow: hidden;
  175. width: 100%;
  176. height: 100%;
  177. text-align: center;
  178. }
  179. .wk_slide-wrap li .img {
  180. position: relative;
  181. z-index: 9;
  182. -webkit-transition: all 1s;
  183. -moz-transition: all 1s;
  184. transition: all 1s;
  185. -ms-transition: all 1s;
  186. }
  187. .wk_slide-wrap li.wk_selected .img {
  188. -webkit-transform: translate3d(0, 0, 0)!important;
  189. transform: translate3d(0, 0, 0)!important;
  190. -ms-transform: translate3d(0, 0, 0)!important;
  191. }
  192. .wk_slide-wrap li .text {
  193. position: relative;
  194. z-index: 9;
  195. margin-top: 25px;
  196. color: #fff;
  197. font-size: 20px;
  198. -webkit-transition: all .5s;
  199. -moz-transition: all .5s;
  200. transition: all .5s;
  201. -ms-transition: all .5s;
  202. }
  203. .wk_slide-wrap .wk_banner {
  204. position: absolute;
  205. top: 0;
  206. left: 0;
  207. z-index: 0;
  208. height: 100%;
  209. min-width: 100%;
  210. }
  211. .wk_slide-wrap li#wk_s1 .wk_banner {
  212. background: url(../images/banner11.jpg) no-repeat center;
  213. background-size: cover;
  214. -webkit-background-size: cover;
  215. -moz-background-size: cover;
  216. }
  217. .wk_slide-wrap li#wk_s1.wk_selected .wk_banner {
  218. opacity: 1;
  219. -webkit-opacity: 1;
  220. -ms-opacity: 1;
  221. -moz-opacity: 1;
  222. }
  223. .wk_slide-wrap li#wk_s1 .wk_wrap {
  224. position: absolute;
  225. top: 45%;
  226. left: 50%;
  227. margin-top: -175px;
  228. margin-left: -375px;
  229. width: 750px;
  230. height: 350px;
  231. }
  232. .wk_slide-wrap li#wk_s1 .wk_banner12 img {
  233. position: absolute;
  234. top: 50%;
  235. left: 50%;
  236. margin-top: -5px;
  237. margin-left: -12px;
  238. width: 24px;
  239. height: 11px;
  240. opacity: 0;
  241. -webkit-transition: all 1s ease 0s;
  242. -moz-transition: all 1s ease 0s;
  243. transition: all 1s ease 0s;
  244. -ms-transition: all 1s ease 0s;
  245. }
  246. .page1.active .wk_slide-wrap li#wk_s1.wk_selected .wk_banner12 img {
  247. margin-top: -137px;
  248. margin-left: -300px;
  249. width: 600px;
  250. height: 275px;
  251. opacity: 1;
  252. -webkit-opacity: 1;
  253. -ms-opacity: 1;
  254. -moz-opacity: 1;
  255. }
  256. .wk_slide-wrap li#wk_s1 .wk_banner13 {
  257. position: absolute;
  258. top: 0;
  259. left: -125px;
  260. opacity: 0;
  261. -webkit-transition: all 1s ease 0s;
  262. -moz-transition: all 1s ease 0s;
  263. transition: all 1s ease 0s;
  264. -webkit-opacity: 0;
  265. -moz-opacity: 0;
  266. -ms-transition: all 1s ease 0s;
  267. }
  268. .page1.active .wk_slide-wrap li#wk_s1.wk_selected .wk_banner13 {
  269. left: 0;
  270. opacity: 1;
  271. -webkit-transition-delay: 800ms;
  272. -moz-transition-delay: 800ms;
  273. transition-delay: 800ms;
  274. -webkit-opacity: 1;
  275. -ms-opacity: 1;
  276. -moz-opacity: 1;
  277. }
  278. .wk_slide-wrap li#wk_s1 .wk_banner14 {
  279. position: absolute;
  280. top: 0;
  281. right: -200px;
  282. opacity: 0;
  283. -webkit-transition: all 1s ease 0s;
  284. -moz-transition: all 1s ease 0s;
  285. transition: all 1s ease 0s;
  286. -webkit-opacity: 0;
  287. -moz-opacity: 0;
  288. -ms-transition: all 1s ease 0s;
  289. }
  290. .page1.active .wk_slide-wrap li#wk_s1.wk_selected .wk_banner14 {
  291. right: 0;
  292. opacity: 1;
  293. -webkit-transition-delay: 800ms;
  294. -moz-transition-delay: 800ms;
  295. transition-delay: 800ms;
  296. -webkit-opacity: 1;
  297. -ms-opacity: 1;
  298. -moz-opacity: 1;
  299. }
  300. .wk_slide-wrap li#wk_s2 .wk_wrap {
  301. position: absolute;
  302. top: 45%;
  303. left: 50%;
  304. margin-top: -155px;
  305. margin-left: -372px;
  306. width: 745px;
  307. height: 310px;
  308. }
  309. .wk_slide-wrap li#wk_s2 .wk_banner {
  310. background: url(../images/banner21.jpg) no-repeat center;
  311. background-size: cover;
  312. opacity: 0;
  313. -webkit-transition: all 1s;
  314. -moz-transition: all 1s;
  315. -o-transition: all 1s;
  316. transition: all 1s;
  317. -webkit-opacity: 0;
  318. -ms-opacity: 0;
  319. -moz-opacity: 0;
  320. -webkit-background-size: cover;
  321. -moz-background-size: cover;
  322. }
  323. .wk_slide-wrap li#wk_s2.wk_selected .wk_banner {
  324. opacity: 1;
  325. -webkit-opacity: 1;
  326. -ms-opacity: 1;
  327. -moz-opacity: 1;
  328. }
  329. .wk_slide-wrap li#wk_s2 .wk_banner22 {
  330. position: absolute;
  331. top: 0;
  332. left: -200px;
  333. opacity: 0;
  334. -webkit-transition: all 1s ease 0s;
  335. -moz-transition: all 1s ease 0s;
  336. transition: all 1s ease 0s;
  337. -ms-transition: all 1s ease 0s;
  338. }
  339. .page1.active .wk_slide-wrap li#wk_s2.wk_selected .wk_banner22 {
  340. left: 0;
  341. opacity: 1;
  342. -webkit-opacity: 1;
  343. -ms-opacity: 1;
  344. -moz-opacity: 1;
  345. }
  346. .wk_slide-wrap li#wk_s2 .wk_banner23 {
  347. position: absolute;
  348. top: 130px;
  349. right: -150px;
  350. opacity: 0;
  351. -webkit-transition: all 1s ease 0s;
  352. -moz-transition: all 1s ease 0s;
  353. transition: all 1s ease 0s;
  354. -ms-transition: all 1s ease 0s;
  355. }
  356. .page1.active .wk_slide-wrap li#wk_s2.wk_selected .wk_banner23 {
  357. right: 50px;
  358. opacity: 1;
  359. -webkit-opacity: 1;
  360. -ms-opacity: 1;
  361. -moz-opacity: 1;
  362. }
  363. .wk_slide-wrap li#wk_s2 .wk_banner24 {
  364. position: absolute;
  365. bottom: -200px;
  366. left: 50%;
  367. z-index: 10;
  368. margin-left: -80px;
  369. width: 160px;
  370. height: 38px;
  371. opacity: 0;
  372. -webkit-transition: all 1s ease 0s;
  373. -moz-transition: all 1s ease 0s;
  374. transition: all 1s ease 0s;
  375. -webkit-opacity: 0;
  376. -moz-opacity: 0;
  377. -ms-transition: all 1s ease 0s;
  378. }
  379. .wk_slide-wrap li#wk_s2 .wk_banner24 a {
  380. display: block;
  381. width: 158px;
  382. border: 1px solid #fff;
  383. color: #fff;
  384. text-align: center;
  385. font-size: 17px;
  386. line-height: 36px;
  387. cursor: pointer;
  388. }
  389. .page1.active .wk_slide-wrap li#wk_s2.wk_selected .wk_banner24 {
  390. bottom: 0;
  391. opacity: 1;
  392. -webkit-transition-delay: 600ms;
  393. -moz-transition-delay: 600ms;
  394. transition-delay: 600ms;
  395. -webkit-opacity: 1;
  396. -moz-opacity: 1;
  397. }
  398. .wk_slide-wrap li#wk_s3 .wk_wrap {
  399. position: absolute;
  400. top: 45%;
  401. left: 50%;
  402. margin-top: -140px;
  403. margin-left: -332px;
  404. width: 665px;
  405. height: 280px;
  406. }
  407. .wk_slide-wrap li#wk_s3 .wk_banner {
  408. background: url(../images/banner31.jpg) no-repeat center;
  409. background-size: cover;
  410. opacity: 0;
  411. -webkit-transition: all 1s;
  412. -moz-transition: all 1s;
  413. -o-transition: all 1s;
  414. transition: all 1s;
  415. -webkit-opacity: 0;
  416. -ms-opacity: 0;
  417. -moz-opacity: 0;
  418. -webkit-background-size: cover;
  419. -moz-background-size: cover;
  420. }
  421. .wk_slide-wrap li#wk_s3.wk_selected .wk_banner {
  422. opacity: 1;
  423. -webkit-opacity: 1;
  424. -ms-opacity: 1;
  425. -moz-opacity: 1;
  426. }
  427. .wk_slide-wrap li#wk_s3 .wk_banner32 {
  428. position: absolute;
  429. top: -200px;
  430. left: 50%;
  431. margin-left: -332px;
  432. opacity: 0;
  433. -webkit-transition: all 1s ease 0s;
  434. -moz-transition: all 1s ease 0s;
  435. transition: all 1s ease 0s;
  436. -ms-transition: all 1s ease 0s;
  437. }
  438. .page1.active .wk_slide-wrap li#wk_s3.wk_selected .wk_banner32 {
  439. top: 0;
  440. opacity: 1;
  441. -webkit-opacity: 1;
  442. -ms-opacity: 1;
  443. -moz-opacity: 1;
  444. }
  445. .wk_slide-wrap li#wk_s3 .wk_banner33 {
  446. position: absolute;
  447. bottom: -200px;
  448. left: 50%;
  449. margin-left: -332px;
  450. opacity: 0;
  451. -webkit-transition: all 1s ease 0s;
  452. -moz-transition: all 1s ease 0s;
  453. transition: all 1s ease 0s;
  454. -ms-transition: all 1s ease 0s;
  455. }
  456. .page1.active .wk_slide-wrap li#wk_s3.wk_selected .wk_banner33 {
  457. bottom: 0;
  458. opacity: 1;
  459. -webkit-opacity: 1;
  460. -ms-opacity: 1;
  461. -moz-opacity: 1;
  462. }
  463. .page1 .wk_arrow {
  464. position: absolute;
  465. bottom: 140px;
  466. left: 50%;
  467. z-index: 20;
  468. display: block;
  469. margin-left: -44px;
  470. width: 87px;
  471. height: 87px;
  472. -webkit-border-radius: 50%;
  473. -moz-border-radius: 50%;
  474. border-radius: 50%;
  475. text-align: center;
  476. line-height: 87px;
  477. cursor: pointer;
  478. }
  479. .page1 .wk_arrow img {
  480. position: relative;
  481. top: 26px;
  482. }
  483. .page1 .wk_arrow:after, .page1 .wk_arrow:before {
  484. position: absolute;
  485. top: 0;
  486. left: 0;
  487. -webkit-border-radius: 50%;
  488. -moz-border-radius: 50%;
  489. border-radius: 50%;
  490. content: '';
  491. pointer-events: none;
  492. }
  493. .page1 .wk_arrow:before {
  494. width: 88px;
  495. height: 88px;
  496. border: 1px solid #fff;
  497. -webkit-transition: all .8s cubic-bezier(.455, .03, .515, .955);
  498. -moz-transition: all .8s cubic-bezier(.455, .03, .515, .955);
  499. -o-transition: all .8s cubic-bezier(.455, .03, .515, .955);
  500. transition: all .8s cubic-bezier(.455, .03, .515, .955);
  501. }
  502. .page1 .wk_arrow:after {
  503. width: 86px;
  504. height: 86px;
  505. border: 2px solid #fff;
  506. background-color: rgba(255,255,255,.1);
  507. opacity: 0;
  508. -webkit-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  509. -moz-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  510. -o-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  511. transition: all .8s cubic-bezier(.77, 0, .175, 1);
  512. -webkit-transform: scale(.5, .5);
  513. -moz-transform: scale(.5, .5);
  514. transform: scale(.5, .5);
  515. -ms-transform: scale(.5, .5);
  516. }
  517. .page1 .wk_arrow:hover:before {
  518. opacity: 0;
  519. -webkit-transition: all .8s cubic-bezier(.25, .46, .45, .94);
  520. -moz-transition: all .8s cubic-bezier(.25, .46, .45, .94);
  521. -o-transition: all .8s cubic-bezier(.25, .46, .45, .94);
  522. transition: all .8s cubic-bezier(.25, .46, .45, .94);
  523. -webkit-transform: scale(1.5, 1.5);
  524. -moz-transform: scale(1.5, 1.5);
  525. transform: scale(1.5, 1.5);
  526. -ms-transform: scale(1.5, 1.5);
  527. }
  528. .page1 .wk_arrow:hover:after {
  529. opacity: 1;
  530. -webkit-transform: scale(1, 1);
  531. -moz-transform: scale(1, 1);
  532. transform: scale(1, 1);
  533. -ms-transform: scale(1, 1);
  534. }
  535. .wk_slide-nav-wrap {
  536. position: absolute;
  537. bottom: 35px;
  538. left: 0;
  539. z-index: 8;
  540. overflow: hidden;
  541. margin-bottom: -22px;
  542. padding-top: 25px;
  543. width: 100%;
  544. height: 84px;
  545. opacity: 1;
  546. -webkit-transform: translateY(100%);
  547. -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
  548. -moz-transform: translateY(100%);
  549. -moz-transform: matrix(1, 0, 0, 1, 0, 0);
  550. transform: translateY(100%);
  551. transform: matrix(1, 0, 0, 1, 0, 0);
  552. -webkit-opacity: 1;
  553. -ms-opacity: 1;
  554. -moz-opacity: 1;
  555. -ms-transform: translateY(100%);
  556. -ms-transform: matrix(1, 0, 0, 1, 0, 0);
  557. }
  558. #wk_slide-nav {
  559. position: relative;
  560. z-index: 10;
  561. margin: auto;
  562. width: 620px;
  563. height: 26px;
  564. -webkit-transform: translateX(90px);
  565. -moz-transform: translateX(90px);
  566. transform: translateX(90px);
  567. -ms-transform: translateX(90px);
  568. }
  569. .wk_nav-line {
  570. position: relative;
  571. top: 13px;
  572. float: left;
  573. width: 90px;
  574. height: 1px;
  575. }
  576. .wk_nav-line:after {
  577. position: absolute;
  578. top: 0;
  579. width: 90px;
  580. height: 100%;
  581. background-color: #fff;
  582. content: '';
  583. -webkit-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  584. -moz-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  585. -o-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  586. transition: all .8s cubic-bezier(.77, 0, .175, 1);
  587. }
  588. .wk_nav-line.small:after {
  589. width: 78px;
  590. }
  591. .wk_nav-line.x-small:after {
  592. width: 63px;
  593. -webkit-transition: all 1s cubic-bezier(.77, 0, .175, 1);
  594. -moz-transition: all 1s cubic-bezier(.77, 0, .175, 1);
  595. -o-transition: all 1s cubic-bezier(.77, 0, .175, 1);
  596. transition: all 1s cubic-bezier(.77, 0, .175, 1);
  597. }
  598. .wk_nav-line.prev:after {
  599. left: 0;
  600. }
  601. .wk_nav-line.next:after {
  602. right: 0;
  603. }
  604. .wk_nav-line:first-child:before, .wk_nav-line:last-child:before {
  605. position: absolute;
  606. top: 0;
  607. width: 8000px;
  608. height: 1px;
  609. background-color: #fff;
  610. content: '';
  611. -moz-backface-visibility: hidden;
  612. -webkit-backface-visibility: hidden;
  613. backface-visibility: hidden;
  614. }
  615. .wk_nav-line:first-child:before {
  616. left: -8000px;
  617. }
  618. .wk_nav-line:last-child:before {
  619. right: -8000px;
  620. }
  621. .wk_nav-bullet-container {
  622. position: relative;
  623. float: left;
  624. width: 26px;
  625. height: 26px;
  626. -webkit-border-radius: 50%;
  627. -moz-border-radius: 50%;
  628. border-radius: 50%;
  629. }
  630. .wk_nav-bullet-container:nth-child(1) {
  631. margin-left: 100px;
  632. }
  633. .wk_nav-bullet-container:before {
  634. position: absolute;
  635. top: -15px;
  636. left: 8px;
  637. width: 0;
  638. height: 0;
  639. border-color: #fff transparent transparent transparent;
  640. border-style: solid;
  641. border-width: 6px 5px 0 5px;
  642. content: '';
  643. opacity: 0;
  644. -webkit-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  645. -moz-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  646. -o-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  647. transition: all .8s cubic-bezier(.77, 0, .175, 1);
  648. -webkit-transform: translateY(-10px);
  649. -moz-transform: translateY(-10px);
  650. transform: translateY(-10px);
  651. pointer-events: none;
  652. -ms-transform: translateY(-10px);
  653. -moz-backface-visibility: hidden;
  654. -webkit-backface-visibility: hidden;
  655. backface-visibility: hidden;
  656. }
  657. #wk_slide-nav .wk_nav-bullet-container:hover:before {
  658. opacity: 1;
  659. -webkit-transform: translateY(0);
  660. -moz-transform: translateY(0);
  661. transform: translateY(0);
  662. -ms-transform: translateY(0);
  663. }
  664. #wk_slide-nav .wk_nav-bullet-container:hover .nav-link:before {
  665. opacity: 0;
  666. -webkit-transition: all .8s cubic-bezier(.25, .46, .45, .94);
  667. -moz-transition: all .8s cubic-bezier(.25, .46, .45, .94);
  668. -o-transition: all .8s cubic-bezier(.25, .46, .45, .94);
  669. transition: all .8s cubic-bezier(.25, .46, .45, .94);
  670. -webkit-transform: scale(2, 2);
  671. -moz-transform: scale(2, 2);
  672. transform: scale(2, 2);
  673. -ms-transform: scale(2, 2);
  674. }
  675. #wk_slide-nav .wk_nav-bullet-container:hover .nav-link:after {
  676. opacity: .2;
  677. -webkit-transform: scale(3.3, 3.3);
  678. -moz-transform: scale(3.3, 3.3);
  679. transform: scale(3.3, 3.3);
  680. -ms-transform: scale(3.3, 3.3);
  681. }
  682. #wk_slide-nav .wk_nav-bullet-container:hover .nav-bullet {
  683. opacity: 1;
  684. -webkit-transform: scale(1, 1);
  685. -moz-transform: scale(1, 1);
  686. transform: scale(1, 1);
  687. -ms-transform: scale(1, 1);
  688. }
  689. #wk_slide-nav .wk_nav-bullet-container:hover .nav-text {
  690. opacity: 1;
  691. -webkit-transform: translateY(0);
  692. -moz-transform: translateY(0);
  693. transform: translateY(0);
  694. -ms-transform: translateY(0);
  695. }
  696. .wk_nav-bullet-container.active .nav-link:after {
  697. opacity: 1;
  698. }
  699. .nav-link {
  700. position: relative;
  701. display: block;
  702. width: 100%;
  703. height: 100%;
  704. color: #fff;
  705. }
  706. .nav-link:before {
  707. position: absolute;
  708. top: 5px;
  709. left: 5px;
  710. width: 14px;
  711. height: 14px;
  712. border: 1px solid #fff;
  713. -webkit-border-radius: 50%;
  714. -moz-border-radius: 50%;
  715. border-radius: 50%;
  716. content: '';
  717. opacity: 1;
  718. -webkit-transition: all .8s cubic-bezier(.455, .03, .515, .955);
  719. -moz-transition: all .8s cubic-bezier(.455, .03, .515, .955);
  720. -o-transition: all .8s cubic-bezier(.455, .03, .515, .955);
  721. transition: all .8s cubic-bezier(.455, .03, .515, .955);
  722. }
  723. .nav-link:after {
  724. position: absolute;
  725. top: 9px;
  726. left: 9px;
  727. width: 8px;
  728. height: 8px;
  729. -webkit-border-radius: 50%;
  730. -moz-border-radius: 50%;
  731. border-radius: 50%;
  732. background-color: #fff;
  733. content: '';
  734. opacity: 1;
  735. -webkit-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  736. -moz-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  737. -o-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  738. transition: all .8s cubic-bezier(.77, 0, .175, 1);
  739. -moz-backface-visibility: hidden;
  740. -webkit-backface-visibility: hidden;
  741. backface-visibility: hidden;
  742. }
  743. .nav-bullet {
  744. position: absolute;
  745. top: 9px;
  746. left: 9px;
  747. width: 8px;
  748. height: 8px;
  749. -webkit-border-radius: 50%;
  750. -moz-border-radius: 50%;
  751. border-radius: 50%;
  752. background-color: #fff;
  753. opacity: 0;
  754. -webkit-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  755. -moz-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  756. -o-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  757. transition: all .8s cubic-bezier(.77, 0, .175, 1);
  758. -webkit-transform: scale(0, 0);
  759. -moz-transform: scale(0, 0);
  760. transform: scale(0, 0);
  761. -ms-transform: scale(0, 0);
  762. }
  763. .nav-text {
  764. position: absolute;
  765. bottom: -22px;
  766. left: -44px;
  767. width: 113px;
  768. color: #fff;
  769. text-align: center;
  770. font-size: 12px;
  771. opacity: 0;
  772. -webkit-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  773. -moz-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  774. -o-transition: all .8s cubic-bezier(.77, 0, .175, 1);
  775. transition: all .8s cubic-bezier(.77, 0, .175, 1);
  776. -webkit-transform: translateY(10px);
  777. -moz-transform: translateY(10px);
  778. transform: translateY(10px);
  779. pointer-events: none;
  780. -ms-transform: translateY(10px);
  781. }
  782. @media(max-width:1500px) {
  783. .section {
  784. width: 100%;
  785. min-width: 1080px;
  786. }
  787. .wk_slide-wrap li#wk_s1 .wk_wrap {
  788. top: 50%;
  789. }
  790. .wk_slide-wrap li#wk_s2 .wk_wrap {
  791. top: 50%;
  792. }
  793. .wk_slide-wrap li#wk_s2 .wk_banner22 img {
  794. width: 90%;
  795. }
  796. .wk_slide-wrap li#wk_s3 .wk_wrap {
  797. top: 50%;
  798. }
  799. .wk_slide-wrap li#wk_s3 .wk_banner32 img {
  800. width: 90%;
  801. }
  802. .page1 .wk_arrow {
  803. display: none;
  804. }
  805. .wk_slide-nav-wrap {
  806. bottom: 5px;
  807. }
  808. }
  809. @media(max-width:1150px) {
  810. .page1 .wk_arrow {
  811. display: none;
  812. }
  813. .wk_slide-nav-wrap {
  814. bottom: 5px;
  815. }
  816. .section {
  817. width: 100%;
  818. min-width: 920px;
  819. }
  820. .wk_slide-wrap li#wk_s1 .wk_wrap {
  821. top: 50%;
  822. }
  823. .wk_slide-wrap li#wk_s2 .wk_wrap {
  824. top: 50%;
  825. }
  826. .wk_slide-wrap li#wk_s2 .wk_banner22 img {
  827. width: 90%;
  828. }
  829. .wk_slide-wrap li#wk_s3 .wk_wrap {
  830. top: 50%;
  831. }
  832. .wk_slide-wrap li#wk_s3 .wk_banner32 img {
  833. width: 90%;
  834. }
  835. }
  836. .ie8 .wk_slide-wrap #wk_s1, .ie8 .wk_slide-wrap #wk_s2, .ie8 .wk_arrow, .ie8 .wk_slide-nav-wrap {
  837. display: none;
  838. }
  839. .ie8 .wk_slide-wrap li#wk_s3 .wk_banner32 {
  840. top: 0;
  841. }
  842. .ie8 .wk_slide-wrap li#wk_s3 .wk_banner33 {
  843. bottom: 0;
  844. }
  845. .page2 {
  846. background: url(../images/bg2.jpg) no-repeat center;
  847. background-size: cover;
  848. -webkit-background-size: cover;
  849. -moz-background-size: cover;
  850. }
  851. .wk_fwxm {
  852. position: relative;
  853. margin: 0 auto;
  854. width: 1200px;
  855. height: 100%;
  856. }
  857. .wk_fwxm ul {
  858. width: 100%;
  859. height: 100%;
  860. }
  861. .wk_fwxm li {
  862. position: relative;
  863. float: left;
  864. width: 25%;
  865. height: 100%;
  866. color: #fff;
  867. text-align: center;
  868. opacity: 0;
  869. -webkit-transition: all 1s;
  870. -moz-transition: all 1s;
  871. -o-transition: all 1s;
  872. transition: all 1s;
  873. -webkit-opacity: 0;
  874. -moz-opacity: 0;
  875. }
  876. .wk_fwxm li .wk_fwxm_bg {
  877. position: absolute;
  878. right: 0;
  879. bottom: 0;
  880. left: 0;
  881. height: 0;
  882. -webkit-transition: all .5s;
  883. -moz-transition: all .5s;
  884. -o-transition: all .5s;
  885. transition: all .5s;
  886. }
  887. .wk_fwxm li.wk_li1 .wk_fwxm_bg {
  888. background: #ba292e;
  889. }
  890. .wk_fwxm li.wk_li2 .wk_fwxm_bg {
  891. background: #1599a5;
  892. }
  893. .wk_fwxm li.wk_li3 .wk_fwxm_bg {
  894. background: #5e904d;
  895. }
  896. .wk_fwxm li.wk_li4 .wk_fwxm_bg {
  897. background: #5d4378;
  898. }
  899. .wk_fwxm li:hover .wk_fwxm_bg {
  900. height: 100%;
  901. }
  902. .wk_fwxm li .wk_fwxm_main {
  903. position: absolute;
  904. top: 50%;
  905. right: 25px;
  906. left: 25px;
  907. margin-top: -145px;
  908. }
  909. .wk_fwxm li .wk_ljzx {
  910. margin: 35px auto 0 auto;
  911. width: 145px;
  912. height: 35px;
  913. }
  914. .wk_fwxm li .wk_ljzx a {
  915. display: none;
  916. width: 143px;
  917. height: 33px;
  918. border: 1px solid #fff;
  919. -webkit-border-radius: 5px;
  920. -moz-border-radius: 5px;
  921. border-radius: 5px;
  922. color: #fff;
  923. text-align: center;
  924. font-size: 17px;
  925. line-height: 33px;
  926. -webkit-transition: all .3s;
  927. -moz-transition: all .3s;
  928. -o-transition: all .3s;
  929. transition: all .3s;
  930. -webkit-transition-delay: 400ms;
  931. -moz-transition-delay: 400ms;
  932. transition-delay: 400ms;
  933. }
  934. .wk_fwxm li:hover .wk_ljzx a {
  935. display: block;
  936. -webkit-transition: all .3s;
  937. -moz-transition: all .3s;
  938. -o-transition: all .3s;
  939. transition: all .3s;
  940. }
  941. .wk_fwxm li.wk_li1:hover .wk_ljzx a:hover {
  942. background: #fff;
  943. color: #ba292e;
  944. }
  945. .wk_fwxm li.wk_li2:hover .wk_ljzx a:hover {
  946. background: #fff;
  947. color: #1599a5;
  948. }
  949. .wk_fwxm li.wk_li3:hover .wk_ljzx a:hover {
  950. background: #fff;
  951. color: #5e904d;
  952. }
  953. .wk_fwxm li.wk_li4:hover .wk_ljzx a:hover {
  954. background: #fff;
  955. color: #5d4378;
  956. }
  957. .wk_fwxm li .wk_fwxm_ico {
  958. overflow: hidden;
  959. margin: 0 auto;
  960. width: 110px;
  961. height: 110px;
  962. -webkit-border-radius: 110px;
  963. -moz-border-radius: 110px;
  964. border-radius: 110px;
  965. -webkit-transition: all .3s;
  966. -moz-transition: all .3s;
  967. transition: all .3s;
  968. -webkit-transition-delay: 400ms;
  969. -moz-transition-delay: 400ms;
  970. transition-delay: 400ms;
  971. }
  972. .wk_fwxm li.wk_li1 .wk_fwxm_ico {
  973. background: url(../images/fwxm_img1.png) no-repeat;
  974. }
  975. .wk_fwxm li.wk_li1:hover .wk_fwxm_ico {
  976. background: url(../images/fwxm_img1.png) no-repeat 0 -110px;
  977. }
  978. .wk_fwxm li.wk_li2 .wk_fwxm_ico {
  979. background: url(../images/fwxm_img2.png) no-repeat;
  980. }
  981. .wk_fwxm li.wk_li2:hover .wk_fwxm_ico {
  982. background: url(../images/fwxm_img2.png) no-repeat 0 -110px;
  983. }
  984. .wk_fwxm li.wk_li3 .wk_fwxm_ico {
  985. background: url(../images/fwxm_img3.png) no-repeat;
  986. }
  987. .wk_fwxm li.wk_li3:hover .wk_fwxm_ico {
  988. background: url(../images/fwxm_img3.png) no-repeat 0 -110px;
  989. }
  990. .wk_fwxm li.wk_li4 .wk_fwxm_ico {
  991. background: url(../images/fwxm_img4.png) no-repeat;
  992. }
  993. .wk_fwxm li.wk_li4:hover .wk_fwxm_ico {
  994. background: url(../images/fwxm_img4.png) no-repeat 0 -110px;
  995. }
  996. .wk_fwxm li h2 {
  997. margin-top: 16px;
  998. font-weight: 400;
  999. font-size: 19px;
  1000. line-height: 44px;
  1001. }
  1002. .wk_fwxm li p {
  1003. font-size: 15px;
  1004. line-height: 30px;
  1005. }
  1006. .wk_fwxm li .wk_fwxm_des {
  1007. margin-top: 20px;
  1008. font-size: 13px;
  1009. line-height: 26px;
  1010. }
  1011. .page2 li.wk_li1 {
  1012. -webkit-transform: translate3d(-600px, 0, 0);
  1013. -moz-transform: translate3d(-600px, 0, 0);
  1014. transform: translate3d(-600px, 0, 0);
  1015. -ms-transform: translate3d(-600px, 0, 0);
  1016. }
  1017. .page2 li.wk_li2 {
  1018. -webkit-transform: translate3d(-300px, 0, 0);
  1019. -moz-transform: translate3d(-300px, 0, 0);
  1020. transform: translate3d(-300px, 0, 0);
  1021. -ms-transform: translate3d(-300px, 0, 0);
  1022. }
  1023. .page2 li.wk_li3 {
  1024. -webkit-transform: translate3d(300px, 0, 0);
  1025. -moz-transform: translate3d(300px, 0, 0);
  1026. transform: translate3d(300px, 0, 0);
  1027. -ms-transform: translate3d(300px, 0, 0);
  1028. }
  1029. .page2 li.wk_li4 {
  1030. -webkit-transform: translate3d(600px, 0, 0);
  1031. -moz-transform: translate3d(600px, 0, 0);
  1032. transform: translate3d(600px, 0, 0);
  1033. -ms-transform: translate3d(600px, 0, 0);
  1034. }
  1035. .page2.active li {
  1036. opacity: 1;
  1037. -webkit-transform: translate3d(0, 0, 0);
  1038. -moz-transform: translate3d(0, 0, 0);
  1039. transform: translate3d(0, 0, 0);
  1040. -ms-transform: translate3d(0, 0, 0);
  1041. -webkit-opacity: 1;
  1042. -moz-opacity: 1;
  1043. }
  1044. @media(max-width:1500px) {
  1045. .wk_fwxm {
  1046. position: relative;
  1047. margin: 0 auto;
  1048. width: 1160px;
  1049. height: 100%;
  1050. }
  1051. .wk_fwxm li .wk_fwxm_des {
  1052. font-size: 12px;
  1053. }
  1054. }
  1055. @media(max-width:1150px) {
  1056. .wk_fwxm {
  1057. position: relative;
  1058. margin: 0 auto;
  1059. width: 1000px;
  1060. height: 100%;
  1061. }
  1062. .wk_fwxm li h2 {
  1063. font-size: 17px;
  1064. }
  1065. .wk_fwxm li .wk_fwxm_main {
  1066. right: 15px;
  1067. left: 15px;
  1068. }
  1069. .wk_fwxm li .wk_fwxm_des {
  1070. font-size: 12px;
  1071. }
  1072. }
  1073. .page3 {
  1074. background: url(../images/bg3.jpg) no-repeat center;
  1075. background-size: cover;
  1076. -webkit-background-size: cover;
  1077. -moz-background-size: cover;
  1078. }
  1079. .case {
  1080. position: absolute;
  1081. top: 50%;
  1082. left: 50%;
  1083. overflow: hidden;
  1084. margin-top: -235px;
  1085. margin-left: -580px;
  1086. width: 1160px;
  1087. }
  1088. .case h2 {
  1089. position: relative;
  1090. top: 0;
  1091. left: -400px;
  1092. width: auto;
  1093. -webkit-transition: all 1s ease 0s;
  1094. transition: all 1s ease 0s;
  1095. -ms-transition: all 1s ease 0s;
  1096. }
  1097. .page3.active .case h2 {
  1098. left: 0;
  1099. }
  1100. .case h2.wk_h2 {
  1101. display: none;
  1102. }
  1103. .wk_btndiv {
  1104. position: absolute;
  1105. top: 45px;
  1106. right: -400px;
  1107. width: 100px;
  1108. height: 30px;
  1109. -webkit-transition: all 1s ease 0s;
  1110. transition: all 1s ease 0s;
  1111. -ms-transition: all 1s ease 0s;
  1112. }
  1113. .page3.active .wk_btndiv {
  1114. right: 0;
  1115. }
  1116. .wk_btndiv a.abtn {
  1117. position: absolute;
  1118. display: block;
  1119. overflow: hidden;
  1120. width: 45px;
  1121. height: 30px;
  1122. outline: 0;
  1123. background: url(../images/btn.png) no-repeat;
  1124. }
  1125. .wk_btndiv a.aleft {
  1126. right: 55px;
  1127. background-position: 0 -30px;
  1128. }
  1129. .wk_btndiv a.agrayleft {
  1130. background-position: 0 0;
  1131. cursor: default;
  1132. }
  1133. .wk_btndiv a.aright {
  1134. right: 0;
  1135. background-position: -45px 0;
  1136. }
  1137. .wk_btndiv a.agrayright {
  1138. background-position: -45px -30px;
  1139. cursor: default;
  1140. }
  1141. .wk_scrollcontainer {
  1142. position: relative;
  1143. overflow: hidden;
  1144. margin: 38px auto 0 auto;
  1145. width: 1180px;
  1146. height: 400px;
  1147. }
  1148. .wk_scrollcontainer ul {
  1149. position: absolute;
  1150. top: 0;
  1151. left: 0;
  1152. width: 1000%;
  1153. }
  1154. .wk_scrollcontainer li {
  1155. float: left;
  1156. overflow: hidden;
  1157. margin-left: 0;
  1158. width: 1180px;
  1159. }
  1160. .case .wk_case_list {
  1161. position: relative;
  1162. float: left;
  1163. overflow: hidden;
  1164. margin: 0 20px 20px 0;
  1165. width: 275px;
  1166. height: 190px;
  1167. opacity: 0;
  1168. -webkit-transition: all 1s;
  1169. -moz-transition: all 1s;
  1170. -o-transition: all 1s;
  1171. transition: all 1s;
  1172. -webkit-transform: translate3d(0, 100px, 0);
  1173. transform: translate3d(0, 100px, 0);
  1174. -webkit-opacity: 0;
  1175. -moz-opacity: 0;
  1176. -ms-transform: translate3d(0, 100px, 0);
  1177. }
  1178. .page3.active .case div.wk_case_list {
  1179. opacity: 1;
  1180. -webkit-transform: translate3d(0, 0, 0);
  1181. transform: translate3d(0, 0, 0);
  1182. -webkit-opacity: 1;
  1183. -moz-opacity: 1;
  1184. -ms-transform: translate3d(0, 0, 0);
  1185. }
  1186. .page3.active .case div.wk_case_list:nth-child(2) {
  1187. -webkit-transition-delay: 100ms;
  1188. -moz-transition-delay: 100ms;
  1189. transition-delay: 100ms;
  1190. }
  1191. .page3.active .case div.wk_case_list:nth-child(3) {
  1192. -webkit-transition-delay: 200ms;
  1193. -moz-transition-delay: 200ms;
  1194. transition-delay: 200ms;
  1195. }
  1196. .page3.active .case div.wk_case_list:nth-child(4) {
  1197. -webkit-transition-delay: 300ms;
  1198. -moz-transition-delay: 300ms;
  1199. transition-delay: 300ms;
  1200. }
  1201. .page3.active .case div.wk_case_list:nth-child(5) {
  1202. -webkit-transition-delay: 400ms;
  1203. -moz-transition-delay: 400ms;
  1204. transition-delay: 400ms;
  1205. }
  1206. .page3.active .case div.wk_case_list:nth-child(6) {
  1207. -webkit-transition-delay: 500ms;
  1208. -moz-transition-delay: 500ms;
  1209. transition-delay: 500ms;
  1210. }
  1211. .page3.active .case div.wk_case_list:nth-child(7) {
  1212. -webkit-transition-delay: 600ms;
  1213. -moz-transition-delay: 600ms;
  1214. transition-delay: 600ms;
  1215. }
  1216. .page3.active .case div.wk_case_list:nth-child(8) {
  1217. -webkit-transition-delay: 700ms;
  1218. -moz-transition-delay: 700ms;
  1219. transition-delay: 700ms;
  1220. }
  1221. .case .wk_case_list .wk_case_img {
  1222. position: relative;
  1223. width: 275px;
  1224. height: 190px;
  1225. }
  1226. .case .wk_case_list .wk_case_img img {
  1227. width: 275px;
  1228. height: 190px;
  1229. }
  1230. .case .wk_case_list .wk_case_ico {
  1231. position: absolute;
  1232. top: 0;
  1233. left: 0;
  1234. width: 275px;
  1235. height: 190px;
  1236. background: url(../images/case_ico.png) no-repeat center;
  1237. opacity: 0;
  1238. -webkit-transition: all .3s;
  1239. -moz-transition: all .3s;
  1240. -o-transition: all .3s;
  1241. transition: all .3s;
  1242. -webkit-opacity: 0;
  1243. -moz-opacity: 0;
  1244. }
  1245. .case .wk_case_list:hover .wk_case_ico {
  1246. opacity: 1;
  1247. -webkit-opacity: 1;
  1248. -moz-opacity: 1;
  1249. }
  1250. .case .wk_case_list .wk_case_xian {
  1251. position: absolute;
  1252. top: 22px;
  1253. left: 22px;
  1254. width: 241px;
  1255. height: 146px;
  1256. }
  1257. .case .wk_case_list span {
  1258. position: absolute;
  1259. background: #0ddfba;
  1260. -webkit-transition: all .3s cubic-bezier(.25, .46, .45, .94);
  1261. -moz-transition: all .3s cubic-bezier(.25, .46, .45, .94);
  1262. -o-transition: all .3s cubic-bezier(.25, .46, .45, .94);
  1263. transition: all .3s cubic-bezier(.25, .46, .45, .94);
  1264. }
  1265. .case .wk_case_list .wk_span_1 {
  1266. top: 0;
  1267. left: 0;
  1268. width: 0;
  1269. height: 2px;
  1270. }
  1271. .case .wk_case_list .wk_span_2 {
  1272. top: 0;
  1273. right: 0;
  1274. width: 2px;
  1275. height: 0;
  1276. }
  1277. .case .wk_case_list .wk_span_3 {
  1278. right: 0;
  1279. bottom: 0;
  1280. width: 0;
  1281. height: 2px;
  1282. }
  1283. .case .wk_case_list .wk_span_4 {
  1284. bottom: 0;
  1285. left: 0;
  1286. width: 2px;
  1287. height: 0;
  1288. }
  1289. .case .wk_case_list:hover .wk_span_1, .case .wk_case_list:hover .wk_span_3 {
  1290. width: 100%;
  1291. }
  1292. .case .wk_case_list:hover .wk_span_2, .case .wk_case_list:hover .wk_span_4 {
  1293. height: 100%;
  1294. }
  1295. .page4 {
  1296. background: url(../images/bg4.jpg) no-repeat center;
  1297. background-size: cover;
  1298. -webkit-background-size: cover;
  1299. -moz-background-size: cover;
  1300. }
  1301. .wk_about {
  1302. position: absolute;
  1303. top: 50%;
  1304. left: 50%;
  1305. margin-top: -185px;
  1306. margin-left: -600px;
  1307. width: 1200px;
  1308. }
  1309. .wk_about h2 {
  1310. position: relative;
  1311. top: 0;
  1312. left: -400px;
  1313. width: auto;
  1314. -webkit-transition: all 1s ease 0s;
  1315. transition: all 1s ease 0s;
  1316. -ms-transition: all 1s ease 0s;
  1317. }
  1318. .page4.active .wk_about h2 {
  1319. left: 0;
  1320. }
  1321. .wk_about h2.wk_h2 {
  1322. display: none;
  1323. }
  1324. .wk_about_menu {
  1325. position: absolute;
  1326. top: 33px;
  1327. right: -400px;
  1328. -webkit-transition: all 1s ease 0s;
  1329. transition: all 1s ease 0s;
  1330. -ms-transition: all 1s ease 0s;
  1331. }
  1332. .wk_about_menu a {
  1333. float: left;
  1334. display: block;
  1335. margin-left: 2px;
  1336. width: 80px;
  1337. height: 42px;
  1338. background: #263551;
  1339. color: #fff;
  1340. text-align: center;
  1341. font-size: 16px;
  1342. line-height: 42px;
  1343. cursor: pointer;
  1344. -webkit-transition: all .3s;
  1345. -moz-transition: all .3s;
  1346. -o-transition: all .3s;
  1347. transition: all .3s;
  1348. }
  1349. .wk_about_menu a.active {
  1350. background: #334871;
  1351. }
  1352. .page4.active .wk_about_menu {
  1353. right: 0;
  1354. }
  1355. .wk_about_div {
  1356. position: relative;
  1357. z-index: 1;
  1358. overflow: hidden;
  1359. margin: 400px auto 0 auto;
  1360. width: 100%;
  1361. -webkit-transition: all 1s ease 0s;
  1362. transition: all 1s ease 0s;
  1363. -ms-transition: all 1s ease 0s;
  1364. }
  1365. .page4.active .wk_about_div {
  1366. margin: 70px auto 0 auto;
  1367. }
  1368. .wk_about_main {
  1369. position: relative;
  1370. margin: 0 auto;
  1371. }
  1372. .wk_about_left {
  1373. position: relative;
  1374. float: left;
  1375. width: auto;
  1376. }
  1377. .wk_about_right {
  1378. position: relative;
  1379. float: right;
  1380. width: 615px;
  1381. }
  1382. .wk_about_top {
  1383. margin: 0 auto;
  1384. padding-top: 20px;
  1385. }
  1386. .wk_about_top a {
  1387. float: left;
  1388. margin-right: 58px;
  1389. width: 110px;
  1390. height: 118px;
  1391. }
  1392. .wk_about_des {
  1393. margin-top: 23px;
  1394. color: #fff;
  1395. font-size: 15px;
  1396. line-height: 26px;
  1397. }
  1398. .wk_about_sec {
  1399. margin-top: 15px;
  1400. }
  1401. .wk_news_list {
  1402. position: relative;
  1403. margin: 0 auto;
  1404. padding-top: 15px;
  1405. }
  1406. .wk_news_list li {
  1407. float: left;
  1408. overflow: hidden;
  1409. margin-left: 36px;
  1410. width: 250px;
  1411. }
  1412. .wk_news_list li:first-child {
  1413. margin-left: 0;
  1414. }
  1415. .wk_news_list li dl {
  1416. margin: 0;
  1417. padding: 5px 10px;
  1418. width: 110px;
  1419. height: 28px;
  1420. border: 1px solid #fff;
  1421. -webkit-border-radius: 5px;
  1422. -moz-border-radius: 5px;
  1423. border-radius: 5px;
  1424. color: #fff;
  1425. text-align: center;
  1426. }
  1427. .wk_news_list li dl dt {
  1428. font-size: 16px;
  1429. line-height: 28px;
  1430. }
  1431. .wk_news_list li h4 {
  1432. margin-top: 7px;
  1433. font-weight: 500;
  1434. font-size: 18px;
  1435. line-height: 62px;
  1436. height: 62px;
  1437. overflow: hidden;
  1438. }
  1439. .wk_news_list li h4 a {
  1440. color: #fff;
  1441. }
  1442. .wk_news_list li .wk_news_des {
  1443. overflow: hidden;
  1444. height: 104px;
  1445. color: #fff;
  1446. font-size: 13px;
  1447. line-height: 26px;
  1448. }
  1449. .wk_news_list li .wk_news_more {
  1450. margin-top: 38px;
  1451. height: 37px;
  1452. }
  1453. .wk_news_list li .wk_news_more a {
  1454. display: block;
  1455. width: 37px;
  1456. height: 37px;
  1457. background: url(../images/news_more.png) no-repeat;
  1458. -webkit-transition: all .3s;
  1459. -moz-transition: all .3s;
  1460. transition: all .3s;
  1461. }
  1462. .wk_news_list li .wk_news_more a:hover {
  1463. background: url(../images/news_more.png) no-repeat 0 -37px;
  1464. }
  1465. .wk_history {
  1466. padding-top: 25px;
  1467. background: url(../images/time_x.png) no-repeat left 9px;
  1468. }
  1469. .wk_blk_18 {
  1470. overflow: hidden;
  1471. width: 1200px;
  1472. zoom: 1;
  1473. }
  1474. .wk_blk_18 .wk_pcont {
  1475. float: left;
  1476. overflow: hidden;
  1477. margin-left: 16px;
  1478. width: 1098px;
  1479. }
  1480. .wk_blk_18 .ScrCont {
  1481. margin-left: 0;
  1482. width: 100000%;
  1483. zoom: 1;
  1484. }
  1485. .wk_blk_18 #List1_1, .wk_blk_18 #List2_1 {
  1486. float: left;
  1487. }
  1488. .wk_blk_18 .LeftBotton {
  1489. float: left;
  1490. margin-top: 150px;
  1491. margin-left: 0;
  1492. width: 35px;
  1493. height: 35px;
  1494. background: url(../images/left_btn.png) no-repeat center;
  1495. }
  1496. .wk_blk_18 .RightBotton {
  1497. float: right;
  1498. margin-top: 150px;
  1499. margin-right: 0;
  1500. width: 35px;
  1501. height: 35px;
  1502. background: url(../images/right_btn.png) no-repeat center;
  1503. }
  1504. .wk_fzlc_b {
  1505. float: left;
  1506. margin: 0 33px;
  1507. width: 300px;
  1508. height: 294px;
  1509. }
  1510. .wk_fzlc_b h4 {
  1511. margin: 0 auto;
  1512. width: 300px;
  1513. color: #fff;
  1514. text-align: center;
  1515. font-weight: 400;
  1516. font-size: 18px;
  1517. line-height: 54px;
  1518. }
  1519. .wk_his_ico {
  1520. margin: 5px auto 0 auto;
  1521. width: 300px;
  1522. height: 11px;
  1523. background: url(../images/history_ico.png) no-repeat center bottom;
  1524. }
  1525. .wk_fzlc_b dl {
  1526. margin: 0 auto;
  1527. padding: 15px 15px 0;
  1528. width: 268px;
  1529. height: 207px;
  1530. border: 1px solid #fff;
  1531. border-top: none;
  1532. }
  1533. .wk_fzlc_b dl dt, .wk_fzlc_b dl dt img {
  1534. margin: 0 auto;
  1535. width: 268px;
  1536. height: 115px;
  1537. }
  1538. .wk_fzlc_b dl dd {
  1539. margin: 10px auto 0 auto;
  1540. width: 268px;
  1541. color: #fff;
  1542. font-size: 14px;
  1543. line-height: 24px;
  1544. }
  1545. .wk_fzlc_s {
  1546. float: left;
  1547. margin: 0 33px;
  1548. width: 300px;
  1549. height: 200px;
  1550. }
  1551. .wk_fzlc_s h4 {
  1552. margin: 0 auto;
  1553. width: 300px;
  1554. color: #fff;
  1555. text-align: center;
  1556. font-weight: 400;
  1557. font-size: 18px;
  1558. line-height: 54px;
  1559. }
  1560. .wk_fzlc_s dl {
  1561. margin: 0 auto;
  1562. padding: 15px 15px 0;
  1563. width: 268px;
  1564. height: 114px;
  1565. border: 1px solid #fff;
  1566. border-top: none;
  1567. }
  1568. .wk_fzlc_s dl dt, .wk_fzlc_s dl dt img {
  1569. float: left;
  1570. width: 100px;
  1571. height: 100px;
  1572. }
  1573. .wk_fzlc_s dl dd {
  1574. float: right;
  1575. width: 155px;
  1576. color: #fff;
  1577. font-size: 14px;
  1578. line-height: 24px;
  1579. }
  1580. @media(max-width:1500px) {
  1581. .wk_about {
  1582. margin-top: -170px;
  1583. margin-left: -540px;
  1584. width: 1080px;
  1585. }
  1586. .wk_about h2 {
  1587. display: none;
  1588. }
  1589. .wk_about h2.wk_h2 {
  1590. position: relative;
  1591. top: 0;
  1592. left: -200px;
  1593. display: block;
  1594. width: auto;
  1595. -webkit-transition: all 1s ease 0s;
  1596. transition: all 1s ease 0s;
  1597. -ms-transition: all 1s ease 0s;
  1598. }
  1599. .page4.active .wk_about h2.wk_h2 {
  1600. left: 0;
  1601. }
  1602. .wk_about_menu {
  1603. top: 0;
  1604. }
  1605. .page4.active .wk_about_div {
  1606. margin: 35px auto 0 auto;
  1607. }
  1608. .wk_about_left img {
  1609. width: 92%;
  1610. }
  1611. .wk_about_right {
  1612. width: 575px;
  1613. }
  1614. .wk_about_top {
  1615. padding-top: 5px;
  1616. }
  1617. .wk_about_top a {
  1618. margin-right: 45px;
  1619. }
  1620. .wk_about_des {
  1621. margin-top: 20px;
  1622. font-size: 14px;
  1623. }
  1624. .wk_about_sec {
  1625. margin-top: 10px;
  1626. }
  1627. .wk_news_list li {
  1628. margin-left: 26px;
  1629. }
  1630. .wk_history {
  1631. padding-top: 25px;
  1632. background: url(../images/time_x1.png) no-repeat center 9px;
  1633. }
  1634. .wk_blk_18 {
  1635. width: 1080px;
  1636. }
  1637. .wk_blk_18 .wk_pcont {
  1638. margin-left: 16px;
  1639. width: 978px;
  1640. }
  1641. .wk_fzlc_b {
  1642. float: left;
  1643. margin: 0 13px;
  1644. width: 300px;
  1645. height: 294px;
  1646. }
  1647. .wk_fzlc_s {
  1648. float: left;
  1649. margin: 0 13px;
  1650. width: 300px;
  1651. height: 200px;
  1652. }
  1653. }
  1654. @media(max-width:1150px) {
  1655. .wk_about {
  1656. margin-top: -170px;
  1657. margin-left: -460px;
  1658. width: 920px;
  1659. }
  1660. .wk_about h2 {
  1661. display: none;
  1662. }
  1663. .wk_about h2.wk_h2 {
  1664. position: relative;
  1665. top: 0;
  1666. left: -200px;
  1667. display: block;
  1668. width: auto;
  1669. -webkit-transition: all 1s ease 0s;
  1670. transition: all 1s ease 0s;
  1671. -ms-transition: all 1s ease 0s;
  1672. }
  1673. .wk_about h2.wk_h2 img {
  1674. width: 70%;
  1675. }
  1676. .page4.active .wk_about h2.wk_h2 {
  1677. left: 0;
  1678. }
  1679. .wk_about_menu {
  1680. top: 0;
  1681. }
  1682. .page4.active .wk_about_div {
  1683. margin: 35px auto 0 auto;
  1684. }
  1685. .wk_about_left {
  1686. width: 370px;
  1687. }
  1688. .wk_about_left img {
  1689. width: 370px;
  1690. }
  1691. .wk_about_right {
  1692. width: 515px;
  1693. }
  1694. .wk_about_top {
  1695. padding-top: 5px;
  1696. }
  1697. .wk_about_top a {
  1698. margin-right: 37px;
  1699. width: 100px;
  1700. }
  1701. .wk_about_top a img {
  1702. width: 100px;
  1703. }
  1704. .wk_about_des {
  1705. margin-top: 10px;
  1706. font-size: 12px;
  1707. }
  1708. .wk_about_sec {
  1709. margin-top: 0;
  1710. }
  1711. .wk_news_list li {
  1712. margin-left: 20px;
  1713. width: 215px;
  1714. }
  1715. .wk_news_list li h4 {
  1716. font-size: 16px;
  1717. }
  1718. .wk_news_list li .wk_news_des {
  1719. font-size: 12px;
  1720. }
  1721. .wk_news_list li .wk_news_more {
  1722. margin-top: 18px;
  1723. }
  1724. .wk_history {
  1725. padding-top: 25px;
  1726. background: url(../images/time_x2.png) no-repeat center 9px;
  1727. }
  1728. .wk_blk_18 {
  1729. width: 920px;
  1730. }
  1731. .wk_blk_18 .wk_pcont {
  1732. margin-left: 34px;
  1733. width: 732px;
  1734. }
  1735. .wk_blk_18 .LeftBotton {
  1736. margin-left: 25px;
  1737. }
  1738. .wk_blk_18 .RightBotton {
  1739. margin-right: 25px;
  1740. }
  1741. .wk_fzlc_b {
  1742. float: left;
  1743. margin: 0 33px;
  1744. width: 300px;
  1745. height: 294px;
  1746. }
  1747. .wk_fzlc_s {
  1748. float: left;
  1749. margin: 0 33px;
  1750. width: 300px;
  1751. height: 200px;
  1752. }
  1753. }
  1754. .page5 {
  1755. background: url(../images/bg5.jpg) no-repeat center;
  1756. background-size: cover;
  1757. -webkit-background-size: cover;
  1758. -moz-background-size: cover;
  1759. }
  1760. .wk_service {
  1761. position: absolute;
  1762. top: 50%;
  1763. left: 50%;
  1764. margin-top: -230px;
  1765. margin-left: -600px;
  1766. width: 1200px;
  1767. }
  1768. .wk_service h2 {
  1769. position: relative;
  1770. top: 0;
  1771. left: 50%;
  1772. margin-left: -145px;
  1773. width: auto;
  1774. -webkit-transition: all 1s ease 0s;
  1775. transition: all 1s ease 0s;
  1776. -ms-transition: all 1s ease 0s;
  1777. }
  1778. .page5.active .wk_service h2 {
  1779. left: 50%;
  1780. margin-left: -245px;
  1781. }
  1782. .wk_service h2.wk_h2 {
  1783. display: none;
  1784. }
  1785. .wk_service_xian {
  1786. position: relative;
  1787. margin-top: 28px;
  1788. width: 0;
  1789. height: 3px;
  1790. background: #0ddfba;
  1791. -webkit-transition: all 1s ease 0s;
  1792. -moz-transition: all 1s ease 0s;
  1793. transition: all 1s ease 0s;
  1794. -ms-transition: all 1s ease 0s;
  1795. }
  1796. .page5.active .wk_service_xian {
  1797. width: 100%;
  1798. }
  1799. .wk_service_main {
  1800. position: relative;
  1801. top: 200px;
  1802. margin: 0 auto;
  1803. padding: 22px 0;
  1804. width: 1160px;
  1805. background: url(../images/service_main_bj.png) repeat left top;
  1806. opacity: 0;
  1807. -webkit-transition: all 1s ease 0s;
  1808. transition: all 1s ease 0s;
  1809. -webkit-opacity: 0;
  1810. -moz-opacity: 0;
  1811. -ms-transition: all 1s ease 0s;
  1812. }
  1813. .page5.active .wk_service_main {
  1814. top: 0;
  1815. opacity: 1;
  1816. -webkit-opacity: 1;
  1817. -moz-opacity: 1;
  1818. }
  1819. .wk_service_main ul {
  1820. overflow: hidden;
  1821. }
  1822. .wk_service_main ul li {
  1823. position: relative;
  1824. float: left;
  1825. overflow: hidden;
  1826. margin: 0 31px 22px;
  1827. width: 170px;
  1828. height: 100px;
  1829. }
  1830. .wk_service_main li span {
  1831. position: absolute;
  1832. background: #0ddfba;
  1833. -webkit-transition: all .3s cubic-bezier(.25, .46, .45, .94);
  1834. -moz-transition: all .3s cubic-bezier(.25, .46, .45, .94);
  1835. -o-transition: all .3s cubic-bezier(.25, .46, .45, .94);
  1836. transition: all .3s cubic-bezier(.25, .46, .45, .94);
  1837. }
  1838. .wk_service_main li .wk_span_1 {
  1839. top: 0;
  1840. left: 0;
  1841. width: 0;
  1842. height: 2px;
  1843. }
  1844. .wk_service_main li .wk_span_2 {
  1845. top: 0;
  1846. right: 0;
  1847. width: 2px;
  1848. height: 0;
  1849. }
  1850. .wk_service_main li .wk_span_3 {
  1851. right: 0;
  1852. bottom: 0;
  1853. width: 0;
  1854. height: 2px;
  1855. }
  1856. .wk_service_main li .wk_span_4 {
  1857. bottom: 0;
  1858. left: 0;
  1859. width: 2px;
  1860. height: 0;
  1861. }
  1862. .wk_service_main li:hover .wk_span_1, .wk_service_main li:hover .wk_span_3 {
  1863. width: 100%;
  1864. }
  1865. .wk_service_main li:hover .wk_span_2, .wk_service_main li:hover .wk_span_4 {
  1866. height: 100%;
  1867. }
  1868. @media(max-width:1500px) {
  1869. .wk_service {
  1870. margin-top: -180px;
  1871. margin-left: -540px;
  1872. width: 1080px;
  1873. }
  1874. .wk_service h2 {
  1875. display: none;
  1876. }
  1877. .wk_service h2.wk_h2 {
  1878. position: relative;
  1879. top: 0;
  1880. left: 0;
  1881. display: block;
  1882. margin-left: -100px;
  1883. width: auto;
  1884. -webkit-transition: all 1s ease 0s;
  1885. transition: all 1s ease 0s;
  1886. -ms-transition: all 1s ease 0s;
  1887. }
  1888. .page5.active .wk_service h2.wk_h2 {
  1889. left: 0;
  1890. margin-left: 0;
  1891. }
  1892. .wk_service_xian {
  1893. margin-top: 20px;
  1894. }
  1895. .wk_service_main {
  1896. padding: 20px 0;
  1897. width: 1060px;
  1898. }
  1899. .wk_service_main ul li {
  1900. margin: 0 21px 10px;
  1901. }
  1902. }
  1903. @media(max-width:1150px) {
  1904. .wk_service {
  1905. margin-top: -190px;
  1906. margin-left: -460px;
  1907. width: 920px;
  1908. }
  1909. .wk_service h2 {
  1910. display: none;
  1911. }
  1912. .wk_service h2.wk_h2 {
  1913. position: relative;
  1914. top: 0;
  1915. left: 0;
  1916. display: block;
  1917. margin-left: -100px;
  1918. width: auto;
  1919. -webkit-transition: all 1s ease 0s;
  1920. transition: all 1s ease 0s;
  1921. -ms-transition: all 1s ease 0s;
  1922. }
  1923. .wk_service h2.wk_h2 img {
  1924. width: 70%;
  1925. }
  1926. .page5.active .wk_service h2.wk_h2 {
  1927. left: 0;
  1928. margin-left: 0;
  1929. }
  1930. .wk_service_xian {
  1931. margin-top: 20px;
  1932. }
  1933. .wk_service_main {
  1934. padding: 20px 0;
  1935. width: 900px;
  1936. }
  1937. .wk_service_main ul li {
  1938. margin: 0 5px 10px;
  1939. }
  1940. }
  1941. .page6 {
  1942. background: url(../images/bg6.jpg) no-repeat center;
  1943. background-size: cover;
  1944. -webkit-background-size: cover;
  1945. -moz-background-size: cover;
  1946. }
  1947. .wk_contact {
  1948. position: absolute;
  1949. top: 50%;
  1950. left: 50%;
  1951. margin-top: -210px;
  1952. margin-left: -600px;
  1953. width: 1200px;
  1954. }
  1955. .wk_contact_left {
  1956. position: absolute;
  1957. top: 0;
  1958. left: -100px;
  1959. -webkit-transition: all 1s ease 0s;
  1960. -moz-transition: all 1s ease 0s;
  1961. transition: all 1s ease 0s;
  1962. -ms-transition: all 1s ease 0s;
  1963. }
  1964. .page6.active .wk_contact_left {
  1965. left: 85px;
  1966. }
  1967. .wk_contact.active .wk_contact_left {
  1968. left: 85px;
  1969. }
  1970. .wk_contact_left1 {
  1971. display: none;
  1972. }
  1973. .wk_contact_right {
  1974. position: absolute;
  1975. top: 30px;
  1976. right: -100px;
  1977. width: 540px;
  1978. -webkit-transition: all 1s ease 0s;
  1979. transition: all 1s ease 0s;
  1980. -ms-transition: all 1s ease 0s;
  1981. }
  1982. .wk_cont_div {
  1983. margin: 0 auto;
  1984. padding-top: 8px;
  1985. width: 540px;
  1986. }
  1987. .wk_cont_div li {
  1988. margin-top: 24px;
  1989. height: 44px;
  1990. color: #ccc;
  1991. font-size: 18px;
  1992. line-height: 44px;
  1993. }
  1994. .wk_cont_div li a {
  1995. color: #ccc;
  1996. }
  1997. .wk_cont_div span {
  1998. float: left;
  1999. display: block;
  2000. margin-right: 21px;
  2001. width: 44px;
  2002. height: 44px;
  2003. cursor: pointer;
  2004. -webkit-transition: all .2s;
  2005. transition: all .2s;
  2006. }
  2007. .wk_cont_div li span.wk_cont_b {
  2008. background: url(../images/cont_b.png) no-repeat;
  2009. }
  2010. .wk_cont_div li:hover span.wk_cont_b {
  2011. background: url(../images/cont_b.png) no-repeat 0 -44px;
  2012. }
  2013. .wk_cont_div li span.wk_cont_c {
  2014. background: url(../images/cont_c.png) no-repeat;
  2015. }
  2016. .wk_cont_div li:hover span.wk_cont_c {
  2017. background: url(../images/cont_c.png) no-repeat 0 -44px;
  2018. }
  2019. .wk_cont_div li span.wk_cont_d {
  2020. background: url(../images/cont_d.png) no-repeat;
  2021. }
  2022. .wk_cont_div li:hover span.wk_cont_d {
  2023. background: url(../images/cont_d.png) no-repeat 0 -44px;
  2024. }
  2025. .wk_serve-ico-kf:hover .wk_cont_a {
  2026. display: block;
  2027. color: #ed5736;
  2028. -webkit-animation: gWelHealth .8s ease-in-out;
  2029. -moz-animation: gWelHealth .8s ease-in-out;
  2030. -o-animation: gWelHealth .8s ease-in-out;
  2031. -ms-animation: gWelHealth .8s ease-in-out;
  2032. animation: gWelHealth .8s ease-in-out;
  2033. }
  2034. .page6.active .wk_contact_right {
  2035. right: 55px;
  2036. }
  2037. .wk_contact.active .wk_contact_right {
  2038. right: 55px;
  2039. }
  2040. @media(max-width:1500px) {
  2041. .wk_contact {
  2042. margin-top: -155px;
  2043. margin-left: -540px;
  2044. width: 1080px;
  2045. }
  2046. .wk_contact_left {
  2047. display: none;
  2048. }
  2049. .wk_contact_left1 {
  2050. position: absolute;
  2051. top: 0;
  2052. left: -50px;
  2053. display: block;
  2054. -webkit-transition: all 1s ease 0s;
  2055. -moz-transition: all 1s ease 0s;
  2056. transition: all 1s ease 0s;
  2057. -ms-transition: all 1s ease 0s;
  2058. }
  2059. .page6.active .wk_contact_left1 {
  2060. left: 55px;
  2061. }
  2062. .wk_contact.active .wk_contact_left1 {
  2063. left: 55px;
  2064. }
  2065. .wk_contact_right {
  2066. top: 20px;
  2067. }
  2068. .page6.active .wk_contact_right {
  2069. right: 25px;
  2070. }
  2071. .wk_contact.active .wk_contact_right {
  2072. right: 25px;
  2073. }
  2074. .wk_cont_div {
  2075. padding-top: 18px;
  2076. }
  2077. .wk_cont_div li {
  2078. margin-top: 15px;
  2079. }
  2080. }
  2081. @media(max-width:1150px) {
  2082. .wk_contact {
  2083. margin-top: -155px;
  2084. margin-left: -460px;
  2085. width: 920px;
  2086. }
  2087. .wk_contact_left {
  2088. display: none;
  2089. }
  2090. .wk_contact_left1 {
  2091. position: absolute;
  2092. top: 0;
  2093. left: -50px;
  2094. display: block;
  2095. -webkit-transition: all 1s ease 0s;
  2096. -moz-transition: all 1s ease 0s;
  2097. transition: all 1s ease 0s;
  2098. -ms-transition: all 1s ease 0s;
  2099. }
  2100. .page6.active .wk_contact_left1 {
  2101. left: 0;
  2102. }
  2103. .wk_contact.active .wk_contact_left1 {
  2104. left: 0;
  2105. }
  2106. .wk_contact_right {
  2107. top: 20px;
  2108. width: 500px;
  2109. }
  2110. .page6.active .wk_contact_right {
  2111. right: 0;
  2112. }
  2113. .wk_contact.active .wk_contact_right {
  2114. right: 0;
  2115. }
  2116. .wk_cont_div {
  2117. padding-top: 18px;
  2118. }
  2119. .wk_cont_div li {
  2120. margin-top: 15px;
  2121. }
  2122. }
  2123. .fp-auto-height .wk_footer_side {
  2124. padding: 26px 0;
  2125. background: #0e0e0e;
  2126. opacity: 0;
  2127. -webkit-transition: all 1s ease 0s;
  2128. -moz-transition: all 1s ease 0s;
  2129. transition: all 1s ease 0s;
  2130. -webkit-opacity: 0;
  2131. -moz-opacity: 0;
  2132. -ms-transition: all 1s ease 0s;
  2133. }
  2134. .fp-auto-height.active .wk_footer_side {
  2135. padding: 26px 0;
  2136. background: #0e0e0e;
  2137. opacity: 1;
  2138. -webkit-opacity: 1;
  2139. -moz-opacity: 1;
  2140. }
  2141. .wk_footer {
  2142. margin: 0 auto;
  2143. width: 1200px;
  2144. background: url(../images/footer_logo.png) no-repeat right center;
  2145. color: #b6b3b3;
  2146. line-height: 26px;
  2147. }
  2148. .wk_footer a {
  2149. color: #b6b3b3;
  2150. }
  2151. @media(max-width:1500px) {
  2152. .wk_footer_side {
  2153. padding: 10px 0;
  2154. width: 100%;
  2155. min-width: 1080px;
  2156. }
  2157. .wk_footer {
  2158. width: 1160px;
  2159. }
  2160. }
  2161. @media(max-width:1150px) {
  2162. .wk_footer_side {
  2163. padding: 10px 0;
  2164. width: 100%;
  2165. min-width: 920px;
  2166. }
  2167. .wk_footer {
  2168. width: 1000px;
  2169. }
  2170. }