css.css 32 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478
  1. /* CSS Document */
  2. @charset "utf-8";
  3. body{ margin:0; padding:0; font-family:"Arial"; font-size:12px; color:#333333; background:#FFF;}
  4. ul,li,dl,dt,dd{ list-style:none; margin:0; padding:0; outline:none;}
  5. a{ text-decoration:none; color:#333333; margin:0; padding:0; border:0; outline:none;}
  6. p,h2,h3,h4,img,div{ border:0; margin:0; padding:0; outline:none;}
  7. input,textarea{ border:0; outline:none; outline:none;}
  8. img{ display:block; max-width:100%; max-height:100%; outline:none;}
  9. .clear{ clear:both;}
  10. .w1200{ width:1200px; margin:0 auto;}
  11. header .top1{ width:100%; height:20px; background:#e50012; font:normal 14px/20px "Arial"; color:#FFF; padding:10px 0;}
  12. header .top1 img{ display:inline-block; vertical-align:top; margin-right:8px;}
  13. header .top1 .yy{ float:right;}
  14. header .top1 .yy a{ color:#FFF; padding-left:8px;}
  15. header .top1 .tel{ float:right; margin-right:20px;}
  16. header .top2{ width:100%; height:60px; padding:20px 0 10px;}
  17. header .top2 .logo{ float:left;}
  18. header .top2 .menu{ float:right;}
  19. header .top2 .menu>ul{ float:left;}
  20. header .top2 .menu>ul>li{ float:left; padding:11px 30px 4px; position:relative;}
  21. header .top2 .menu>ul>li>a{ display:block; height:40px; font:normal 16px/40px "Arial";}
  22. header .top2 .menu>ul>li.on>a{ color:#de0011; border-bottom:4px solid #de0011;}
  23. header .top2 .menu>ul>li.on:after{ content:''; width:0; height:0; position:absolute; z-index:1; left: calc(50% - 5px); top:41px; border-style:solid; border-width:5px; border-color:transparent transparent #de0011 transparent;}
  24. header .top2 .menu>ul>li>ul{ position:absolute; z-index:99; width:100px; padding:10px; background:rgba(247,18,36,0.75); left:50%; top:55px; transform:translateX(-50%); display:none;}
  25. header .top2 .menu>ul>li>ul>li>a{ display:block; width:100%; height:35px; text-align:center; font:normal 14px/35px "Arial"; border-bottom:1px dashed #ff6471; color:#FFF;}
  26. header .top2 .menu>ul>li:hover>ul{ display:block;}
  27. header .top2 .menu .search{ float:left; height:25px; margin:17px 0 0;}
  28. /*手机*/
  29. .phone_menu_trigger {display:none;position:absolute;right:10px;top:50%;z-index:10;transform:translateY(-50%);transition:all 0.4s ease-in-out;}
  30. .phone_menu_trigger > div {width:24px;height:2px;cursor:pointer;background:#333;transition:all 0.4s ease-in-out;}
  31. .phone_menu_trigger > div:not(:last-child) { margin-bottom:5px;}
  32. .phone_menu_trigger.on div:nth-child(1) { transform:rotateZ(45deg) translateY(5px);}
  33. .phone_menu_trigger.on div:nth-child(2) { transform:rotateZ(-45deg) translateY(-5px);}
  34. .phone_menu_trigger.on div:nth-child(3) { height:0px;}
  35. /*手机导航内容*/
  36. .phone_menu {display:none;position:fixed;top:0;left:0; z-index:9; overflow:scroll; background:#fff;padding:0 0 41px;width:100%;height:calc(100% - 80px);margin-top:50px;}
  37. .phone_menu > li {font:normal 18px/54px "微软雅黑";color:#000;border-bottom:dashed 1px #ccc;}
  38. .phone_menu > li > a {display:block;color:#333;padding-left:15px;font-size:16px;position:relative;}
  39. .phone_menu > li > .phone_menu_tab {padding-left:30px;display:none;}
  40. .phone_menu > li > .phone_menu_tab > li {position:relative; font:normal 15px/36px "微软雅黑";}
  41. .phone_menu > li > .phone_menu_tab > li > a {color:#000000;padding-left:15px;}
  42. .phone_menu > li > .phone_menu_tab > li:before {content:'';display:block;width:5px;height:5px;position:absolute;top:50%;left:0;transform:translateY(-50%);border-radius:50%;background:#e50012;}
  43. .phone_menu > .MpNav > a:after {content:'';transition:all 0.4s ease-in-out;display:block;position:absolute;top:50%;right:10px;transform:translateY(-50%);border-style:solid solid none solid;border-width:8px;border-color:#e50012 transparent transparent transparent;}
  44. .phone_menu > .MpNav > a.open:after {transform:rotate(-180deg);}
  45. .phone_menu > .yy{ text-align:center; font:normal 16px/50px "微软雅黑";}
  46. .phone_menu > .yy a{ padding:0 15px;}
  47. .phone_menu > .yy img{ display:inline-block; vertical-align:middle; margin-right:5px;}
  48. .ind_tit1{ text-align:center; padding:60px 0 35px;}
  49. .ind_tit1 h3{ font:bold 30px/30px "Arial"; padding-top:50px; background:url(../images/index_23.jpg) no-repeat center top; margin-bottom:20px;}
  50. .ind_tit1 p{ display:inline-block; width:67%; height:10px; border-bottom:1px solid #dedfe3; font:normal 20px/20px "Arial"; color:#999999;}
  51. .ind_tit1 p span{ display:inline-block; background:#FFF; padding:0 10px;}
  52. .ind_tit2{ text-align:center; padding:70px 0 50px;}
  53. .ind_tit2 h3{ font:bold 30px/30px "Arial"; padding:0 0 20px;}
  54. .ind_tit2 p{ display:inline-block; width:67%; height:10px; border-bottom:1px solid #dedfe3; font:normal 20px/20px "Arial"; color:#999999;}
  55. .ind_tit2 p span{ display:inline-block; background:#FFF; padding:0 35px; position:relative;}
  56. .ind_tit2 p span:before{ content:''; width:20px; height:20px; position:absolute; left:0; top:0; background:url(../images/index_48.png) no-repeat center top;}
  57. .ind_tit2 p span:after{ content:''; width:20px; height:20px; position:absolute; right:0; top:0; background:url(../images/index_49.png) no-repeat center top;}
  58. .ind_box1 ul{ overflow:hidden; padding-bottom:100px;}
  59. .ind_box1 ul li{ width:210px; float:left; text-align:center; margin:0 15px;}
  60. .ind_box1 ul li div{ padding:5px 0;}
  61. .ind_box1 ul li div img{ display:inline-block;}
  62. .ind_box1 ul li h3{ font:bold 24px/34px "Arial";}
  63. .ind_box1 ul li h3 span{ display:inline-block; font:bold 14px/20px "Arial"; vertical-align:top;}
  64. .ind_box1 ul li p{ font:normal 14px/26px "Arial"; color:#666666;}
  65. .ind_box2{ width:100%; overflow:hidden; background:url(../images/index_46.jpg) no-repeat right top;}
  66. .ind_box2 .l{ width:50%; float:left;}
  67. .ind_box2 .l video{ margin:0; padding:0; display:block;}
  68. .ind_box2 .r{ width:50%; float:right;}
  69. .ind_box2 .r ul{ overflow:hidden;/* margin:70px 0 0 80px;*/}
  70. .ind_box2 .r ul li{ width:100%; overflow:hidden; margin-bottom:21px;margin-top: 20px;}
  71. .ind_box2 .r ul li span{ margin-left: 5px; display:inline-block; float:left; width:139px; height:87px; text-align:center; font:bold 24px/82px "Arial"; color:#e70012; background:#FFF; border-radius:50%;}
  72. .ind_box2 .r ul li div{ display:inline-block; float:left; width:450px; margin:0 28px; font:normal 17px/19px "Arial"; color:#FFF;width: 93%;}
  73. .ind_box2 .r ul>a{ display:block; width:112px; height:32px; border:1px solid #FFF; border-radius:5px; text-align:center; font:normal 14px/33px "Arial"; color:#FFF;margin-left: 33px;}
  74. .ind_box3{ width:100%; overflow:hidden; background:#fafafa;}
  75. .ind_box3 .ind_tit2 p span{ background:#fafafa;}
  76. .ind_box3 .w1200{ position:relative;}
  77. .ind_box3 .w1200 .swbp2{ background:url(../images/index_55.jpg); width:17px; height:25px; left:-20px;}
  78. .ind_box3 .w1200 .swbn2{ background:url(../images/index_56.jpg); width:17px; height:25px; right:-20px;}
  79. .ind_box3 .w1200 .swbp2:hover{ background:url(../images/index_57.jpg);}
  80. .ind_box3 .w1200 .swbn2:hover{ background:url(../images/index_58.jpg);}
  81. .ind_box3 .w1200 .swiper-slide h3{ position:absolute; left:0; bottom:0; width:100%; font:normal 16px/34px "Arial"; background:rgba(231,0,18,0.9); text-align:center; color:#FFF; display:none;}
  82. .ind_box3 .w1200 .swiper-slide:hover h3{ display:block;}
  83. .ind_box3 .w1200 .more{ display:block; width:140px; height:40px; border:1px solid #ccc; border-radius:5px; text-align:center; font:normal 14px/40px "Arial"; color:#666; margin:40px auto 50px;}
  84. .ind_box4 .lm{ text-align:center; margin:0 0 40px;}
  85. .ind_box4 .lm li{ width:115px; height:30px; border:1px solid #ccc; border-radius:5px; display:inline-block; padding:8px 15px; font:normal 16px/30px "Arial"; margin:0 15px;}
  86. .ind_box4 .lm li img{ display:inline-block; vertical-align:top; margin-right:8px;}
  87. .ind_box4 .lm li span{ display:inline-block; vertical-align:top; width:30px; height:30px; overflow:hidden; position:relative; margin-right:10px;}
  88. .ind_box4 .lm li span>span{ display:block; width:30px; height:30px; position:absolute; left:-30px; filter:drop-shadow(rgb(177, 177, 177) 30px 0px);}
  89. .ind_box4 .lm li:hover{ background:#e70012;}
  90. .ind_box4 .lm li:hover a{ color:#FFF;}
  91. .ind_box4 .lm li:hover span>span{ filter:drop-shadow(rgb(255, 255, 255) 30px 0px);}
  92. .ind_box4 .list{ overflow:hidden;}
  93. .ind_box4 .list .l{ width:565px; float:left; position:relative;}
  94. .ind_box4 .list .l>div{ padding:5px; border:1px solid #f1f1f1; border-radius:5px;}
  95. .ind_box4 .list .l>h3{ width:calc(100% - 32px); height:40px; padding:0 10px; position:absolute; z-index:2; left:6px; bottom:6px; font:normal 18px/40px "Arial"; background:rgba(255,255,255,0.95);}
  96. .ind_box4 .list .l>h3 span{ float:right; color:#666666;}
  97. .ind_box4 .list .r{ width:590px; float:right;}
  98. .ind_box4 .list .r>div{ overflow:hidden; margin-bottom:8px;}
  99. .ind_box4 .list .r>div div{ width:205px; float:left; padding:5px; border:1px solid #f1f1f1; border-radius:5px; margin-right:16px;}
  100. .ind_box4 .list .r>div h3{ font:normal 16px/36px "Arial"; color:#e70012a1;}
  101. .ind_box4 .list .r>div h3:hover{color:#e70012;}
  102. .ind_box4 .list .r>div span{ display:block; font:normal 14px/26px "Arial"; color:#aaaaaa;}
  103. .ind_box4 .list .r>div span img{ display:inline-block; vertical-align:middle; margin-right:8px;}
  104. .ind_box4 .list .r>div p{ font:normal 14px/26px "Arial"; color:#888888;}
  105. .ind_box4 .list .r ul li{ overflow:hidden; padding:14px 0; font:normal 16px/24px "Arial"; border-bottom:1px dashed #cccccc;}
  106. .ind_box4 .list .r ul li a:hover{color:#e70012}
  107. .ind_box4 .list .r ul li span{ color:#aaaaaa; float:right;}
  108. .ind_box4 .list .r ul li em{ display:block; width:8px; height:8px; background:#cccccc; float:left; margin:8px 14px 8px 2px;}
  109. .ind_box4 .list .r .more{ display:block; width:140px; height:40px; border:1px solid #ccc; border-radius:5px; text-align:center; font:normal 14px/40px "Arial"; color:#666; margin:30px 0 0;}
  110. .ind_box5{ width:100%; height:190px; background:url(../images/index_80.jpg) no-repeat center top;/* margin-top:60px;*/}
  111. .ind_box5>div>div{ padding:30px 0 0 36px; font:bold 35px/50px "Arial"; color:#e70012;}
  112. .ind_box5>div>h3{ font:normal 22px/32px "Arial"; color:#FFF; background:#e70012; width:600px; text-align:center; margin:0 0 0 36px;}
  113. .ind_box5>div>p{ font:normal 30px/44px "Arial"; margin:0 0 0 36px;}
  114. .ind_box6{ overflow:hidden;}
  115. .ind_box6 ul{ height:146px; border-bottom:3px solid #dddddd; margin-bottom:156px; position:relative;}
  116. .ind_box6 ul:after{ content:''; width:0; height:0; border-style:solid; border-width:11px 14px; border-color:transparent transparent transparent #dddddd; position:absolute; right:-16px; bottom:-12px;}
  117. .ind_box6 ul li{ width:118px; float:left; text-align:center; margin:0 41px;}
  118. .ind_box6 ul li div{ height:118px; position:relative;}
  119. .ind_box6 ul li div:before{ content:''; width:0; height:0; border-style:solid; border-width:14px 11px; border-color:#e70012 transparent transparent transparent; position:absolute; z-index:1; left: calc(50% - 11px); top:120px;}
  120. .ind_box6 ul li div:after{ content:''; width:12px; height:12px; border-radius:50%; background:#e70012; position:absolute; z-index:1; left: calc(50% - 6px); top:141px;}
  121. .ind_box6 ul li p{ font-size:20px; margin-top:54px;}
  122. .ind_box7{ width:100%; height:590px; background:url(../images/index_90.jpg) no-repeat center top;}
  123. .ind_box7 .msg{ padding:0 134px; box-sizing:border-box;}
  124. .ind_box7 .msg h3{ text-align:center; font:bold 48px/60px "Arial"; color:#FFF; padding:50px 0 36px;}
  125. .ind_box7 .msg h3 p{ font:bold 24px/36px "Arial";}
  126. .ind_box7 .msg ul{ overflow:hidden;}
  127. .ind_box7 .msg ul li{ width:100%; float:left; margin-bottom:22px;}
  128. .ind_box7 .msg ul li.rename{ width:380px; float:left;}
  129. .ind_box7 .msg ul li.tel{ width:380px; float:right;}
  130. .ind_box7 .msg ul li span{ display:inline-block; vertical-align:top; width:90px; text-align:right; font:normal 16px/36px "Arial"; text-align:right; color:#FFF;}
  131. .ind_box7 .msg ul li input{ width:246px;padding-left: 8px; height:36px; border-radius:5px; background:#fbf3f4;}
  132. .ind_box7 .msg ul li em{ display:inline-block; width:35px; text-align:center; color:#FFF;}
  133. .ind_box7 .msg ul li select{ width:254px; height:36px; border:0; border-radius:5px; background:#fbf3f4; margin-right:17px;}
  134. .ind_box7 .msg ul li textarea{ width:802px; height:72px; border-radius:5px; background:#fbf3f4;}
  135. .ind_box7 .msg ul li button{ display:block; width:192px; height:46px; margin:28px auto; border:0; border-radius:8px; background:#202020; font:bold 20px/46px "Arial"; color:#FFF;}
  136. footer{ background:url(../images/index_110.jpg) no-repeat center top;; overflow:hidden;}
  137. footer .ewm{ width:160px; float:left; margin:107px 0 0 61px; font:normal 16px/48px "Arial"; color:#FFF; text-align:center;}
  138. footer .menu{ float:right; padding:50px 80px;}
  139. footer .menu dl{ width:100px; float:left; margin-right:64px; color:#FFF;}
  140. footer .menu dl:last-child{ margin-right:0;}
  141. footer .menu dl dt{ height:60px; border-bottom:1px solid #acacac; font:normal 17px/60px "Arial"; margin-bottom:15px;}
  142. footer .menu dl dd a{ font:normal 15px/30px "Arial"; color:#FFF;}
  143. footer .links{ overflow:hidden; font:normal 14px/30px "Arial"; color:#FFF;}
  144. footer .links span{ display:inline-block;}
  145. footer .links a{ padding:5px; color:#FFF;}
  146. footer .copyright{ text-align:center; border-top:1px solid #606060; padding:13px 0; font:normal 14px/30px "Arial"; color:#FFF;}
  147. footer .copyright a{ color:#FFF;}
  148. footer .copyright img{ display:inline-block;}
  149. .ny_main{ overflow:hidden; padding:35px 0 65px;}
  150. .ny_main .l{ width:280px; float:left;}
  151. .ny_main .l .box{ margin-bottom:22px;}
  152. .ny_main .l .box .tit{ height:69px; background:url(../images/about_05.jpg) no-repeat center top; font:bold 18px/69px "Arial"; color:#FFF; padding-left:28px;}
  153. .ny_main .l .box .bor{ padding:10px; border:1px solid #ebebeb;}
  154. .ny_main .l .box .bor .lm li{ margin-bottom:10px;}
  155. .ny_main .l .box .bor .lm li:last-child{ margin-bottom:0;}
  156. .ny_main .l .box .bor .lm li a{ display:block; width:100%; height:38px; background:#fafafa; font:normal 15px/38px "Arial";}
  157. .ny_main .l .box .bor .lm li a span{ display:inline-block; width:40px; height:38px; text-align:center; font:normal 12px/38px Impact; color:#b4b4b4;}
  158. .ny_main .l .box .bor .lm li a:hover{ background:#e50012; color:#FFF;}
  159. .ny_main .l .box .bor .lm li a:hover span{ color:#FFF;}
  160. .ny_main .l .box .bor .lm li.on a{ background:#e50012; color:#FFF;}
  161. .ny_main .l .box .bor .lm li.on a span{ color:#FFF;}
  162. .ny_main .l .box .con{ font:normal 15px/30px "Arial";}
  163. .ny_main .l .box .con img{ display:inline-block; vertical-align:middle; margin-right:10px;}
  164. .ny_main .l .box .con .ewm{ text-align:center; margin:10px auto;}
  165. .ny_main .r{ width:890px; float:right;}
  166. .ny_main .r .tit{ height:50px; margin-top:10px; border-bottom:1px solid #ccc;}
  167. .ny_main .r .tit .lj{ float:right; font:normal 14px/50px "Arial"; color:#999999;}
  168. .ny_main .r .tit .lj a{color:#999999;}
  169. .ny_main .r .tit .lj a:hover{color:#e50012;}
  170. .ny_main .r .tit .lj>span{color:#e50012;}
  171. .ny_main .r .tit>span{ display:inline-block; font:bold 18px/48px "Arial"; border-bottom:5px solid #e50012;}
  172. .ny_main .r>.con{ font:normal 16px/32px "Arial"; padding-top:40px;}
  173. .ny_main .r>.con .vid{ padding:20px 50px 30px;}
  174. .ny_honor .ny_tit{ text-align:center; padding:0px 0 30px;}
  175. .ny_honor .ny_tit h3{ font:bold 30px/30px "Arial"; padding:0 0 20px;}
  176. .ny_honor .ny_tit p{ display:inline-block; width:90%; height:10px; border-bottom:1px solid #dedfe3; font:normal 20px/20px "Arial"; color:#999999;}
  177. .ny_honor .ny_tit p span{ display:inline-block; background:#FFF; padding:0 35px; position:relative;}
  178. .ny_honor .ny_tit p span:before{ content:''; width:20px; height:20px; position:absolute; left:0; top:0; background:url(../images/index_48.png) no-repeat center top;}
  179. .ny_honor .ny_tit p span:after{ content:''; width:20px; height:20px; position:absolute; right:0; top:0; background:url(../images/index_49.png) no-repeat center top;}
  180. .ny_honor .sw1{ margin-bottom:50px;}
  181. .ny_honor .sw1 .swiper-slide p{ margin-top:20px; font:normal 15px/30px "Arial"; text-align:center;}
  182. .ny_honor .sw2{ margin-bottom:50px;}
  183. .ny_honor .sw3 .swiper-slide p{ margin-top:20px; font:normal 15px/30px "Arial"; text-align:center;}
  184. .ny_history ul{ position:relative; margin:60px 0 0;}
  185. .ny_history ul:after{ content:''; width:2px; height:78%; background:#e60012; position:absolute; left: calc(50% - 1px); top:0;}
  186. .ny_history ul:before{ content:''; width:33px; height:48px; background:url(../images/about5_03.jpg); position:absolute; left: calc(50% - 16.5px); top:-60px;}
  187. .ny_history ul li{ overflow:hidden; position:relative; padding-bottom:34px;}
  188. .ny_history ul li:after{ content:''; width:18px; height:18px; background:url(../images/about5_04.png); position:absolute; z-index:3; right: calc(50% - 9px); top:33px;}
  189. .ny_history ul li:before{ content:''; width:30%; height:1px; background:#ff818b; position:absolute; z-index:2; right:50%; top:42px;}
  190. .ny_history ul li .img{ width:400px; float:left; margin:26px 0 0 10px; position:relative; z-index:3;}
  191. .ny_history ul li .con{ width:400px; float:right; margin:26px 10px 0 0;}
  192. .ny_history ul li .con>h3{ font:normal 24px/40px "Arial";}
  193. .ny_history ul li .con>h3 span{ font-weight:bold; color:#e60012; margin-right:10px;}
  194. .ny_history ul li .con>h3 p{ font:normal 18px/30px "Arial";}
  195. .ny_history ul li .con>div>h4{ font:bold 24px/40px "Arial"; margin-top:20px;}
  196. .ny_history ul li .con>div>p{ font:normal 14px/30px "Arial";}
  197. .ny_history ul li:nth-child(2n):before{ left:50%; right:auto;}
  198. .ny_history ul li:nth-child(2n) .img{ float:right; margin:26px 10px 0 0;}
  199. .ny_history ul li:nth-child(2n) .con{ float:left; margin:26px 0 0 10px; text-align:right;}
  200. .ny_network>ul{ overflow:hidden; margin-top:25px;}
  201. .ny_network>ul>li{ width:288px; height:216px; float:left; margin:0 13px 30px 0; position:relative;}
  202. .ny_network>ul>li h3{ position:absolute; left:0; bottom:0; width:100%; font:normal 16px/34px "Arial"; background:rgba(231,0,18,0.9); text-align:center; color:#FFF; display:none;}
  203. .ny_network>ul>li:nth-child(3n){ margin:0 0 30px 0;}
  204. .ny_network>ul>li:hover h3{ display:block;}
  205. .ny_pages{ text-align:center;}
  206. .ny_pages img{ display:inline-block;}
  207. .ny_video>ul li{ width:286px; float:left; margin:0 16px 20px 0;}
  208. .ny_video>ul li:nth-child(3n){ margin:0 0 20px 0;}
  209. .ny_video>ul li div{ height:210px; position:relative;}
  210. .ny_video>ul li div span{ display:block; width:100%; height:100%; position:absolute; z-index:2; left:0; top:0;}
  211. .ny_video>ul li h3{ font:normal 15px/50px "Arial"; text-align:center;}
  212. .ny_news ul li{ overflow:hidden; margin-bottom:30px;}
  213. .ny_news ul li>div{ width:260px; float:left; padding:5px; border:1px solid #f1f1f1; border-radius:5px; margin-right:35px;}
  214. .ny_news ul li>h3{ font:normal 20px/40px "Arial"; margin-bottom:10px;}
  215. .ny_news ul li>span{ display:block; font:normal 14px/20px "Arial"; color:#888888;}
  216. .ny_news ul li>span img{ display:inline-block; vertical-align:middle; margin-right:8px;}
  217. .ny_news ul li>p{ font:normal 14px/26px "Arial"; margin-bottom:20px;}
  218. .ny_news ul li>a{ display:inline-block; width:126px; height:40px; border:1px solid #ececec; text-align:center; font:normal 14px/40px "Arial"; color:#888888;}
  219. .ny_news ul li>h3 a:hover{ color:#e70012;}
  220. .ny_news ul li>a:hover{ color:#e70012;}
  221. .ny_news_detail>h3{ font:bold 20px/30px "Arial"; text-align:center;}
  222. .ny_news_detail .infos{ font:normal 14px/24px "Arial"; color:#999999; padding:36px 0 40px; text-align:center;}
  223. .ny_news_detail .infos span{ display:inline-block; padding:0 25px;}
  224. .ny_news_detail .infos span img{ display:inline-block; vertical-align:middle;}
  225. .ny_news_detail .con{ font:normal 16px/30px "Arial";}
  226. .ny_news_detail .prev_next{ margin:20px 0 0; padding:10px 0; border-top:1px solid #ccc; font:normal 16px/40px "Arial";}
  227. .ny_news_detail .prev_next a:hover{ color:#e60012;}
  228. .ny_join{ width:100%; overflow:hidden;}
  229. .ny_join .box{ position:relative; left:50%;}
  230. .ny_join .box img{ max-width:1920px; transform:translateX(-50%);}
  231. .ny_join .msg{ padding:0 134px; box-sizing:border-box; position:absolute; z-index:5; top:0; transform: translateX(-50%);}
  232. .ny_join .msg h3{ text-align:center; font:bold 48px/60px "Arial"; color:#e70012; padding:50px 0 36px;}
  233. .ny_join .msg h3 p{ font:bold 24px/36px "Arial"; color:#151515;}
  234. .ny_join .msg ul{ overflow:hidden;}
  235. .ny_join .msg ul li{ width:100%; float:left; margin-bottom:22px;}
  236. .ny_join .msg ul li.rename{ width:380px; float:left;}
  237. .ny_join .msg ul li.tel{ width:380px; float:right;}
  238. .ny_join .msg ul li span{ display:inline-block; vertical-align:top; width:90px; text-align:right; font:normal 16px/36px "Arial"; text-align:right; color:#333;}
  239. .ny_join .msg ul li input{ width:254px; height:36px; border-radius:5px; background:rgba(255,255,255,0.95);}
  240. .ny_join .msg ul li em{ display:inline-block; width:35px; text-align:center; color:#FFF;}
  241. .ny_join .msg ul li select{ width:254px; height:36px; border:0; border-radius:5px; background:rgba(255,255,255,0.95); margin-right:17px;}
  242. .ny_join .msg ul li textarea{ width:802px; height:72px; border-radius:5px; background:rgba(255,255,255,0.95);}
  243. .ny_join .msg ul li button{ display:block; width:192px; height:46px; margin:28px auto; border:0; border-radius:8px; background:#202020; font:bold 20px/46px "Arial"; color:#FFF;}
  244. .ny_join2 ul{ width:100%; position:relative;}
  245. .ny_join2 ul li{ width:270px; position:absolute; font:normal 20px/30px "Arial";}
  246. .ny_join2 ul li div{ width:78px; height:78px; font:bold 36px/78px "Arial"; color:#e50012; text-align:center; background:#FFF; border:1px solid #ccc; border-radius:50%;}
  247. .ny_join2 ul li h3{ font:normal 20px/30px "Arial"; margin:10px 0;}
  248. .ny_join2 ul li:nth-child(1){ z-index:2; left:10px; top:380px; text-align:right;}
  249. .ny_join2 ul li:nth-child(1) div{ float:right; margin-left:10px;}
  250. .ny_join2 ul li:nth-child(2){ z-index:2; left:60px; top:200px; text-align:right;}
  251. .ny_join2 ul li:nth-child(2) div{ float:right; margin-left:10px;}
  252. .ny_join2 ul li:nth-child(3){ z-index:2; left:330px; top:50px; text-align:center; width:200px;}
  253. .ny_join2 ul li:nth-child(3) div{ margin:0 auto;}
  254. .ny_join2 ul li:nth-child(3) h3{ width:100%;}
  255. .ny_join2 ul li:nth-child(4){ z-index:2; right:70px; top:200px;}
  256. .ny_join2 ul li:nth-child(4) div{ float:left; margin-right:10px;}
  257. .ny_join2 ul li:nth-child(5){ z-index:2; right:30px; top:380px;}
  258. .ny_join2 ul li:nth-child(5) div{ float:left; margin-right:10px;}
  259. .ny_join3 ul{ padding:77px 0 100px 45px; background:url(../images/join3_03.jpg) no-repeat left top;}
  260. .ny_join3 ul h3{ font:bold 48px/50px "Arial"; margin-bottom:45px;}
  261. .ny_join3 ul h3 span{ color:#e50012;}
  262. .ny_join3 ul li{ width:390px; overflow:hidden; margin-bottom:30px;}
  263. .ny_join3 ul li div{ width:82px; height:82px; text-align:center; font:bold 36px/82px Impact; color:#FFF; background:#e50012; border-radius:50%; margin-right:18px; float:left;}
  264. .ny_join3 ul li p{ font:normal 16px/24px "Arial";s}
  265. .ny_join4 ul{ position:relative; overflow:hidden;}
  266. .ny_join4 ul h3{ font:bold 48px/50px "Arial"; position:absolute; left:40px; top:70px;}
  267. .ny_join4 ul h3 span{ color:#e50012;}
  268. .ny_join4 ul li{ width:102px; text-align:center; position:absolute; z-index:2;}
  269. .ny_join4 ul li div{ width:92px; height:92px; background:#FFF; border-radius:50%; box-shadow:0 0 20px #ececec; overflow:hidden; margin:0 auto;}
  270. .ny_join4 ul li div img{ width:86px; height:86px; border-radius:50%; margin:3px;}
  271. .ny_join4 ul li p{ font:normal 15px/30px "Arial";}
  272. .ny_join4 ul li span img{ display:inline-block;}
  273. .ny_join4 ul li:nth-child(2){ left:14px; top:290px;}
  274. .ny_join4 ul li:nth-child(3){ left:180px; top:262px;}
  275. .ny_join4 ul li:nth-child(4){ left:320px; top:210px;}
  276. .ny_join4 ul li:nth-child(5){ left:478px; top:183px;}
  277. .ny_join4 ul li:nth-child(6){ left:603px; top:170px;}
  278. .ny_join4 ul li:nth-child(7){ left:740px; top:72px;}
  279. .ny_join5{ position:relative;}
  280. .ny_join5 ul{ position:absolute; overflow:hidden; right:60px; top:130px; width:550px;}
  281. .ny_join5 ul h3{ font:bold 48px/50px "Arial"; text-align:center; margin-bottom:50px;}
  282. .ny_join5 ul h3 span{ color:#e50012;}
  283. .ny_join5 ul li{ width:236px; height:58px; text-align:center; background:#e50012; border-radius:29px; font:bold 20px/58px "Arial"; color:#FFF; float:left; margin:12px 15px;}
  284. .ny_join6 dl{ overflow:hidden; margin-bottom:20px;}
  285. .ny_join6 dl dt{ height:56px; border:1px solid #f1f1f1; border-radius:28px; font:normal 18px/56px "Arial";}
  286. .ny_join6 dl dt div{ float:right; width:20px; height:20px; margin:18px 20px; position:relative;}
  287. .ny_join6 dl dt div:after{ content:''; position:absolute; z-index:2; left:0; top:8.5px; width:20px; height:3px; background:#333;}
  288. .ny_join6 dl dt div:before{ content:''; position:absolute; z-index:2; left:8.5px; top:0px; width:3px; height:20px; background:#333; transition:all 0.5s;}
  289. .ny_join6 dl dt span{ display:block; width:56px; height:56px; border:3px solid #f1f1f1; box-sizing:border-box; border-radius:50%; float:left; margin-right:15px; font:bold 25px/56px "Arial"; color:#e50012; text-align:center;}
  290. .ny_join6 dl dd{ padding:0 30px; font:normal 16px/36px "Arial"; height:0; overflow:hidden; transition:all 0.5s;}
  291. .ny_join6 dl.on dt div:before{ width:0;}
  292. .ny_join6 dl.on dd{ height:auto; padding:40px 30px 50px;}
  293. .ny_join7{ background:url(../images/join7_03.jpg) no-repeat center 40px;}
  294. .ny_join7 ul{ width:600px; margin:0 auto;}
  295. .ny_join7 ul h3{ text-align:center; font:bold 48px/66px "Arial"; color:#e50012; padding:22px 0 54px;}
  296. .ny_join7 ul h3 p{ font:normal 30px/44px "Arial"; color:#333;}
  297. .ny_join7 ul li{ font:normal 14px/45px "Arial"; margin-bottom:30px;}
  298. .ny_join7 ul li input{ width:570px; height:45px; padding:0 15px; background:#fff; color:#b4b3b3;}
  299. .ny_join7 ul li select{ width:290px; height:45px; padding:0 10px 0 15px; background:#fff; border:0; color:#757575; outline:none;}
  300. .ny_join7 ul li select:nth-child(2){ float:right;}
  301. .ny_join7 ul li textarea{ width:570px; height:135px; padding:0 15px; font:normal 14px/45px "Arial"; margin-bottom:30px;}
  302. .ny_join7 ul button{ width:100%; height:50px; background:#333; font:normal 18px/50px "Arial"; color:#FFF; border:0; margin-bottom:90px; outline:none;}
  303. .ny_product ul{ overflow:hidden; padding-bottom:20px;}
  304. .ny_product ul li{ width:285px; float:left; margin:0 17.5px 20px 0;}
  305. .ny_product ul li:nth-child(3n){ margin:0 0 20px 0;}
  306. .ny_product ul li div{ height:236px; border:1px solid #f1f1f1;}
  307. .ny_product ul li h3{ padding:8px 10px 0; font:normal 18px/26px "Arial";}
  308. .ny_product ul li p{ padding:0 10px; font:normal 14px/30px "Arial"; color:#999999;}
  309. .ny_school2 ul{ overflow:hidden; margin:40px auto 0;}
  310. .ny_school2 ul li{ width:25%; float:left; text-align:center;}
  311. .ny_school2 ul li img{ display:inline-block;}
  312. .ny_school2 ul li p{ font:normal 14px/46px "Arial";}
  313. .ny_school3 ul{ overflow:hidden;}
  314. .ny_school3 ul li{ width:200px; float:left; margin:0 30px 20px 0;}
  315. .ny_school3 ul li:nth-child(4n){ margin:0 0 20px 0;}
  316. .ny_school3 ul li div{ height:230px; margin-bottom:10px;}
  317. .ny_school3 ul li h3{ font:normal 15px/26px "Arial"; padding:0 5px;}
  318. .ny_school3 ul li p{ font:normal 12px/24px "Arial"; padding:0 5px; color:#888888;}
  319. .ny_school5 ul{ width:100%; border-top:1px solid #ebebeb; border-left:1px solid #ebebeb; box-sizing:border-box; overflow:hidden; margin-top:45px; text-align:center;}
  320. .ny_school5 ul h3{ font:bold 24px/65px "Arial"; color:#e50012; border-bottom:1px solid #ebebeb; border-right:1px solid #ebebeb;}
  321. .ny_school5 ul li{ font:normal 16px/45px "Arial"; border-bottom:1px solid #ebebeb; border-right:1px solid #ebebeb; overflow:hidden;}
  322. .ny_school5 ul li div:nth-child(1){ width:35%; float:left;}
  323. .ny_school5 ul li div:nth-child(2){ width:35%; float:left;}
  324. .ny_school5 ul li div:nth-child(3){ width:25%; float:left;}
  325. .ny_school5 ul li p:nth-child(1){ width:35%; float:left;}
  326. .ny_school5 ul li p:nth-child(2){ width:35%; float:left;}
  327. .ny_school5 ul li p:nth-child(3){ width:25%; float:left;}
  328. .ny_school5 ul li:nth-child(2n){ background:#fafafa;}
  329. .ny_school6>ul{ overflow:hidden; margin-bottom:40px;}
  330. .ny_school6>ul li{ border-bottom:1px dashed #ebebeb; padding:10px 0 15px;}
  331. .ny_school6>ul li h3{ font:normal 20px/40px "Arial";}
  332. .ny_school6>ul li h3 span{ font:normal 12px/40px "Arial"; color:#888888; margin:0 10px 0 0;}
  333. .ny_school6>ul li div{ font:normal 14px/24px "Arial"; color:#888888;}
  334. .ny_school6>ul li h3:hover a{ color:#e50012;}
  335. .ny_school7>ul{ margin-bottom:20px;}
  336. .ny_school7>ul li{ overflow:hidden; padding-bottom:30px;}
  337. .ny_school7>ul li div{ width:262px; height:174px; padding:5px; border:1px solid #f1f1f1; float:left; margin-right:30px;}
  338. .ny_school7>ul li h3{ width:580px; float:right; font:normal 20px/40px "Arial";}
  339. .ny_school7>ul li span{ display:block; width:560px; height:34px; float:right; background:#fafafa; padding:0 10px; margin-bottom:5px;}
  340. .ny_school7>ul li p{ width:580px; float:right; font:normal 14px/22px "Arial"; color:#888888;}
  341. .ny_school7>ul li p em{ font:normal 16px/30px "Arial"; color:#333;}
  342. .ny_contact{ font:normal 16px/36px "Arial";}
  343. .ny_contact .drive{ width:430px; float:right;}
  344. .ny_contact h3{ font:normal 24px/36px "Arial";}
  345. .ny_contact h3 p{ font:normal 14px/24px "Arial"; color:#999999;}
  346. .ny_contact img{ display:inline-block; vertical-align:middle; margin-right:10px;}
  347. .ny_contact .map{ border:1px solid #f9f9f9; padding:5px; margin-top:40px;}
  348. .ny_jobs{ font:normal 16px/30px "Arial";}
  349. .ny_jobs h3{ font:bold 16px/50px "Arial"; color:#e50012}
  350. .ny_jobs2>ul{ overflow:hidden;}
  351. .ny_jobs2>ul li{ width:286px; float:left; margin:0 16px 20px 0;}
  352. .ny_jobs2>ul li div{ height:210px;}
  353. .ny_jobs2>ul li h3{ text-align:center; font:normal 15px/50px "Arial";}
  354. .ny_jobs2>ul li:nth-child(3n){ margin:0 0 20px 0;}
  355. @media only screen and (max-width: 1170px) {
  356. .w1200{ width:100%;}
  357. header .top1{ padding:5px 10px; width:calc(100% - 20px); height:auto; font:normal 12px/20px "Arial";}
  358. header .top1 .yy{ display:none;}
  359. header .top1 .tel{ display:none;}
  360. header .top2{ padding:5px 0; position:relative;}
  361. header .top2 .logo{ height:50px; margin-left:10px;}
  362. header .top2 .menu{ display:none;}
  363. .phone_menu_trigger{ display:block;}
  364. .ind_ban .swbp1{ display:none;}
  365. .ind_ban .swbn1{ display:none;}
  366. .ind_tit1{ padding:10px;}
  367. .ind_tit1 p{ width:100%; font:normal 12px/20px "Arial";}
  368. .ind_box2{ padding:10px; box-sizing:border-box; background-size:cover;}
  369. .ind_box2 .l{ width:100%;}
  370. .ind_box2 .r{ width:100%; padding:10px 0;}
  371. .ind_box2 .r ul{ margin:0;}
  372. .ind_box2 .r ul li{ margin:0 0 10px;}
  373. .ind_box2 .r ul li div{ width:100%; margin:0; float:right; font:normal 14px/20px "Arial";}
  374. .ind_box2 .r ul>a{ margin:0 auto;}
  375. .ind_tit2{ padding:20px 0 10px;}
  376. .ind_tit2 h3{ padding:0 0 10px;}
  377. .ind_tit2 p{ width:90%; font:normal 12px/20px "Arial";}
  378. .ind_box3{ padding:0 10px; box-sizing:border-box;}
  379. .ind_box3 .w1200 .swbp2{ display:none;}
  380. .ind_box3 .w1200 .swbn2{ display:none;}
  381. .ind_box3 .w1200 .more{ margin:10px auto 20px;}
  382. .ind_box3 .w1200 .swiper-slide h3{ font:normal 12px/20px Arial;}
  383. .ind_box5{ margin-top:0px; padding:20px 10px 0; box-sizing:border-box;}
  384. .ind_box5>div>div{ padding:0; font:bold 20px/30px "Arial";}
  385. .ind_box5>div>h3{ width:100%; margin:15px 0; font:normal 12px/32px "Arial";}
  386. .ind_box5>div>p{ margin:0; font:normal 26px/30px "Arial";}
  387. footer{ padding:0 10px; box-sizing:border-box;}
  388. footer .ewm{ display:none;}
  389. footer .menu{ display:none;}
  390. footer .links{ font:normal 14px/24px "Arial"; padding:10px 0;}
  391. footer .copyright{ padding:10px 0; font:normal 12px/20px "Arial";}
  392. .ny_main{ padding:10px 10px 20px; box-sizing:border-box;}
  393. .ny_main .l{ display:none;}
  394. .ny_main .r{ width:100%;}
  395. .ny_main .r .tit{ margin-top:0;}
  396. .ny_main .r .tit>span{ font:bold 16px/48px "Arial";}
  397. .ny_main .r .tit .lj{ font:normal 12px/50px "Arial";}
  398. .ny_main .r>.con{ padding-top:20px; font:normal 12px/30px "Arial";}
  399. .ny_video>ul li{ width:32%; height:auto; margin:0 2% 15px 0;}
  400. .ny_video>ul li:nth-child(3n){ margin:0 0 15px 0;}
  401. .ny_video>ul li div{ height:auto;}
  402. .ny_video>ul li h3{ height:40px; overflow:hidden; font:normal 12px/20px "Arial";}
  403. .ny_network>ul>li{ width:32%; height:auto; margin:0 2% 15px 0;}
  404. .ny_network>ul>li:nth-child(3n){ margin:0 0 15px 0;}
  405. .ny_network>ul>li h3{ font:normal 12px/20px "Arial";}
  406. .ny_history ul li{ padding-bottom:20px;}
  407. .ny_history ul li .img{ width:45%; margin:0;}
  408. .ny_history ul li .con{ width:45%; margin:0;}
  409. .ny_history ul li .con>h3{ font:bold 13px/24px "Arial";}
  410. .ny_history ul li .con>h3 p{ font:normal 12px/20px "Arial";}
  411. .ny_history ul li .con>div>h4{ font:bold 14px/20px "Arial";}
  412. .ny_history ul li .con>div>p{ font:normal 12px/20px "Arial";}
  413. .ny_history ul li:nth-child(2n) .img{ margin:0;}
  414. .ny_history ul li:nth-child(2n) .con{ margin:0;}
  415. .ny_news_detail .infos{ font:normal 12px/24px "Arial"; padding:10px 0;}
  416. .ny_news_detail .infos span{ padding:0 5px;}
  417. .ny_news_detail .prev_next{ margin:0; font:normal 12px/30px "Arial";}
  418. .ny_contact .le{ width:100%;}
  419. .ny_contact .le h3{ font:normal 20px/36px "Arial";}
  420. .ny_contact .drive{ width:100%;}
  421. .ny_contact .map #dituContent{ width:100%!important; height:250px!important;}
  422. .ny_contact .map{ margin-top:0;}
  423. }