class.less 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535
  1. .clearfix {
  2. overflow: hidden;
  3. }
  4. .clearfix_2::after {
  5. content: '';
  6. display: block;
  7. height: 0;
  8. visibility: hidden;
  9. clear: both;
  10. }
  11. .hiddenColor {
  12. visibility: hidden;
  13. }
  14. .hand {
  15. cursor: pointer;
  16. }
  17. .dot1 {
  18. display: block;
  19. word-break: keep-all;
  20. white-space: nowrap;
  21. overflow: hidden;
  22. text-overflow: ellipsis;
  23. }
  24. .dot2 {
  25. overflow: hidden;
  26. display: -webkit-box !important;
  27. -webkit-box-orient: vertical;
  28. -webkit-line-clamp: 2;
  29. }
  30. .dot3 {
  31. overflow: hidden;
  32. display: -webkit-box !important;
  33. -webkit-box-orient: vertical;
  34. -webkit-line-clamp: 3;
  35. }
  36. /*input,img{border:none;width:100%;height:100%;}*/
  37. .cover100 img {
  38. display: block;
  39. width: 100%;
  40. height: 100%;
  41. }
  42. .back100 {
  43. background-size: 100% 100%;
  44. background-repeat: no-repeat;
  45. }
  46. article,
  47. aside,
  48. footer,
  49. header,
  50. time,
  51. video,
  52. top,
  53. main,
  54. nav,
  55. h4,
  56. h3,
  57. section {
  58. display: block;
  59. }
  60. .index_2_left :deep(.el-tabs__header) {
  61. height: 45px;
  62. display: block;
  63. width: 100%;
  64. margin-bottom: 40px;
  65. background: url(@/public/img/2.png) left center;
  66. background-repeat: repeat-x;
  67. background-size: auto 10px;
  68. }
  69. .index_2_left :deep(.el-tabs__item) {
  70. float: left;
  71. height: 45px;
  72. line-height: 45px;
  73. color: #999;
  74. font-size: 34px;
  75. font-weight: bold;
  76. background: #fff;
  77. padding: 0px 28px 0px 0px !important;
  78. }
  79. .index_2_left :deep(.is-active) {
  80. color: #333;
  81. padding-right: 28px;
  82. }
  83. .index_2_left :deep(.el-tabs__active-bar) {
  84. display: none;
  85. }
  86. .index_2_left :deep(.el-tabs__nav-wrap)::after {
  87. display: none;
  88. }
  89. .index_2_left_h3_a {
  90. float: left;
  91. height: 45px;
  92. line-height: 45px;
  93. color: #999;
  94. font-size: 34px;
  95. font-weight: bold;
  96. padding-right: 28px;
  97. background: #fff;
  98. }
  99. .index_2_left_h3_a_only {
  100. color: #333;
  101. }
  102. .index_2_left_h3 {
  103. height: 45px;
  104. display: block;
  105. width: 100%;
  106. margin-bottom: 40px;
  107. background: url(@/public/img/2.png) left center;
  108. background-repeat: repeat-x;
  109. background-size: auto 10px;
  110. }
  111. .slow_6 {
  112. -webkit-transition: all .6s;
  113. -moz-transition: all .6s;
  114. -ms-transition: all .6s;
  115. -o-transition: all .6s;
  116. transition: all .6s;
  117. }
  118. .index_main {
  119. margin: 0 auto;
  120. width: 1200px;
  121. }
  122. .index_nav {
  123. margin-top: 20px;
  124. border-bottom: solid 1px #D9D9D9;
  125. .index_nav_a {
  126. float: left;
  127. color: #333;
  128. font-size: 16px;
  129. margin: 0px 36px;
  130. height: 88px;
  131. line-height: 88px;
  132. font-weight: bold;
  133. border-bottom: solid 3px #fff;
  134. box-sizing: border-box;
  135. position: relative;
  136. }
  137. .index_nav_a:hover {
  138. color: #D2600F;
  139. // border-bottom: solid 3px #D2600F;
  140. }
  141. .index_nav_a_only {
  142. border-bottom: solid 3px #D2600F;
  143. }
  144. .index_nav_a::after {
  145. content: '';
  146. display: block;
  147. position: absolute;
  148. width: 2px;
  149. height: 12px;
  150. background: #DBDBDB;
  151. right: -38px;
  152. top: 39px;
  153. }
  154. .index_nav_a:nth-last-of-type(1) {
  155. overflow: hidden;
  156. }
  157. .index_nav_a:nth-of-type(1) {
  158. overflow: hidden;
  159. height: 56px;
  160. line-height: 56px;
  161. color: #fff;
  162. font-size: 18px;
  163. font-weight: bold;
  164. width: 153px;
  165. margin: 14px 30px 0px 0px;
  166. text-indent: 46px;
  167. background: url(../public/img/3.png) no-repeat left top;
  168. background-size: 100% 100%;
  169. }
  170. }
  171. .index_1 {
  172. margin-top: 40px;
  173. height: 410px;
  174. }
  175. .index_1_left {
  176. float: left;
  177. width: 720px;
  178. }
  179. .index_1_right {
  180. float: right;
  181. width: 450px;
  182. }
  183. .roll_1_box {
  184. width: 100%;
  185. height: 405px;
  186. }
  187. .index_1_color_box {
  188. background: #FAFAFA;
  189. width: 100%;
  190. box-sizing: border-box;
  191. border: solid 1px #FAFAFA;
  192. border-left: solid 15px #FAFAFA;
  193. border-right: solid 15px #FAFAFA;
  194. padding: 0px 15px 20px;
  195. }
  196. .index_1_head_h3 {
  197. margin-top: 20px;
  198. display: block;
  199. height: 30px;
  200. margin-bottom: 10px;
  201. .index_1_head_a {
  202. float: left;
  203. color: #333;
  204. font-size: 20px;
  205. font-weight: bold;
  206. }
  207. }
  208. .index_1_ul_2 {
  209. margin: -8px 0px 8px 0px;
  210. }
  211. .index_1_ul_a {
  212. width: 100%;
  213. position: relative;
  214. height: 48px;
  215. line-height: 48px;
  216. color: #333;
  217. font-size: 18px;
  218. text-indent: 18px;
  219. }
  220. .index_1_ul_a:hover {
  221. color: #D2600F;
  222. }
  223. .index_1_ul_a::after {
  224. content: '';
  225. display: block;
  226. width: 8px;
  227. height: 8px;
  228. background: #D9D9D9;
  229. position: absolute;
  230. border-radius: 50%;
  231. left: 0px;
  232. top: 20px;
  233. }
  234. .index_2 {
  235. margin-top: 40px;
  236. }
  237. .index_2_left {
  238. float: left;
  239. width: 900px;
  240. }
  241. .index_2_right {
  242. float: right;
  243. width: 270px;
  244. }
  245. .index_2_left_img_out {
  246. width: 410px;
  247. float: left;
  248. }
  249. .index_2_big_img_li {
  250. margin-bottom: 30px;
  251. .index_2_big_img_li_a img {
  252. display: block;
  253. width: 100%;
  254. height: 260px;
  255. }
  256. }
  257. .index_2_img_li {
  258. width: 195px;
  259. .index_2_img_li_a img {
  260. display: block;
  261. height: 117px;
  262. width: 100%;
  263. }
  264. }
  265. .index_2_img_li:nth-of-type(odd) {
  266. float: left;
  267. }
  268. .index_2_img_li:nth-of-type(even) {
  269. float: right;
  270. }
  271. .index_2_img_li_dot1 {
  272. height: 24px;
  273. line-height: 24px;
  274. color: #000;
  275. font-size: 18px;
  276. margin-top: 17px;
  277. }
  278. .index_2_img_li_dot1:hover {
  279. color: #D2600F;
  280. }
  281. .index_2_left_ul_box {
  282. width: 460px;
  283. float: right;
  284. }
  285. .index_2_left_ul {
  286. width: 100%;
  287. }
  288. .index_2_left_ul_group_6 .index_2_left_ul_li:nth-of-type(6n) {
  289. margin-bottom: 44px;
  290. }
  291. .index_2_left_ul_group_6 .index_2_left_ul_li:nth-of-type(6n-5) .index_2_left_ul_li_a_text {
  292. font-weight: bold;
  293. }
  294. .index_2_left_ul_group_5 .index_2_left_ul_li:nth-of-type(5n) {
  295. margin-bottom: 35px;
  296. }
  297. .index_2_left_ul_group_5 .index_2_left_ul_li:nth-of-type(5n-4) .index_2_left_ul_li_a_text {
  298. font-weight: bold;
  299. }
  300. .index_2_left_ul_li {
  301. height: 24px;
  302. line-height: 24px;
  303. margin: 0px 0 20px;
  304. display: flex;
  305. .index_2_left_ul_li_a_name {
  306. height: 15px;
  307. line-height: 15px;
  308. color: #999;
  309. font-size: 18px;
  310. margin: 6px 10px 0px 0px;
  311. padding-right: 10px;
  312. border-right: solid 1px #D46F05;
  313. }
  314. .index_2_left_ul_li_a_name:hover {
  315. color: #D2600F;
  316. }
  317. .index_2_left_ul_li_a_text {
  318. height: 24px;
  319. line-height: 24px;
  320. color: #333;
  321. font-size: 18px;
  322. width: 100%;
  323. display: block;
  324. word-break: keep-all;
  325. white-space: nowrap;
  326. overflow: hidden;
  327. text-overflow: ellipsis;
  328. }
  329. .index_2_left_ul_li_a_text:hover {
  330. color: #D2600F;
  331. }
  332. }
  333. .index_2_right_head {
  334. height: 45px;
  335. display: block;
  336. margin-bottom: 44px;
  337. .index_2_right_head_a {
  338. float: left;
  339. height: 45px;
  340. line-height: 45px;
  341. color: #333;
  342. font-size: 24px;
  343. }
  344. }
  345. .index_2_right_img_li {
  346. margin-bottom: 20px;
  347. }
  348. .index_2_right_img_li_a {
  349. display: flex;
  350. }
  351. .index_2_right_img_li_a_img_box {
  352. width: 120px;
  353. height: 80px;
  354. margin-right: 10px;
  355. display: block;
  356. }
  357. .index_3_img_li_in {
  358. width: 100%;
  359. }
  360. .index_2_right_img_li img {
  361. width: 120px;
  362. height: 80px;
  363. display: block;
  364. }
  365. .index_2_right_img_li_dot3 {
  366. height: 63px;
  367. line-height: 21px;
  368. color: #333;
  369. font-size: 18px;
  370. width: 100%;
  371. }
  372. .index_2_right_img_li_dot3:hover {
  373. color: #D2600F;
  374. }
  375. .index_3 {
  376. margin-top: 40px;
  377. height: 555px;
  378. }
  379. .index_3_img_li {
  380. margin-bottom: 35px;
  381. .index_3_img_li_a {
  382. display: flex;
  383. }
  384. .index_3_img_li_img_box {
  385. float: left;
  386. width: 180px;
  387. height: 120px;
  388. margin-right: 15px;
  389. }
  390. .index_3_img_li_a img {
  391. display: block;
  392. width: 180px;
  393. height: 120px;
  394. }
  395. .index_3_img_li_dot3 {
  396. height: 66px;
  397. line-height: 22px;
  398. color: #333;
  399. font-size: 18px;
  400. font-weight: bold;
  401. margin-top: 8px;
  402. }
  403. .index_3_img_li_dot3:hover {
  404. color: #D2600F;
  405. }
  406. .index_3_img_li_tag {
  407. float: left;
  408. height: 28px;
  409. line-height: 28px;
  410. color: #999;
  411. font-size: 14px;
  412. background: #F5F5F7;
  413. padding: 0px 5px;
  414. margin-top: 10px;
  415. }
  416. }
  417. .index_3_num_li {
  418. border-bottom: solid 1px #E4E4E4;
  419. box-sizing: border-box;
  420. height: 66px;
  421. line-height: 66px;
  422. .index_3_num_li_tag {
  423. float: left;
  424. font-style: italic;
  425. color: #D9D9D9;
  426. font-size: 20px;
  427. height: 100%;
  428. line-height: 66px;
  429. margin-right: 13px;
  430. }
  431. .index_3_num_li_dot1 {
  432. color: #333;
  433. font-size: 18px;
  434. height: 100%;
  435. line-height: 66px;
  436. }
  437. .index_3_num_li_dot1:hover {
  438. color: #D2600F;
  439. }
  440. }
  441. .index_3_num_li:nth-of-type(1) {
  442. margin-top: -26px;
  443. }
  444. .index_3_num_li:nth-of-type(-n+3) .index_3_num_li_tag {
  445. color: #DD7D18;
  446. }