achievement.css 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752
  1. /*
  2. @update:2018/06/06
  3. */
  4. /* 最新发布 */
  5. .newRelease{
  6. clear: both;
  7. text-align: center;
  8. }
  9. .newRelease>div{
  10. width:270px;
  11. height: 60px;
  12. background: url(../../../img/newMenu/achievement_1.jpg) no-repeat;
  13. background-size: 100% 100%;
  14. margin: 24px auto 30px;
  15. }
  16. .blur{
  17. color: #f68704;
  18. }
  19. .orange{
  20. color: #ff6d0b;
  21. }
  22. .newRelease ul{
  23. display: flex;
  24. display: -webkit-flex;
  25. justify-content: space-between;
  26. }
  27. .newRelease ul li{
  28. width: 204px;
  29. height: 253px;
  30. transition: all .5s ease-in;
  31. box-shadow: 0 0 4px #ccc;
  32. }
  33. .newRelease ul li img{
  34. width: 204px;
  35. height: 185px;
  36. display: inline-block;
  37. }
  38. .newRelease ul li div{
  39. padding:10px 10px;
  40. background: #f9f9f9;
  41. }
  42. .newRelease ul li div p {
  43. text-align: left;
  44. overflow: hidden;
  45. white-space:nowrap;
  46. text-overflow:ellipsis;
  47. -o-text-overflow:ellipsis;
  48. color: #333;
  49. line-height: 24px;
  50. height: 24px;
  51. }
  52. .newRelease ul li div p span{
  53. font-size: 12px;
  54. }
  55. .newRelease ul li div p .orange{
  56. display: inline-block;
  57. margin-right: 12px;
  58. }
  59. .newRelease>a{
  60. color: #7a7878;
  61. display: inline-block;
  62. padding: 22px 0px 55px;
  63. }
  64. .newRelease>a:hover{
  65. color: #f68704;
  66. }
  67. /* 热门关注 */
  68. .achievementHot>div{
  69. width: 140px;
  70. height:22px;
  71. background: url(../../../img/newMenu/achievement_7.jpg) no-repeat;
  72. background-size:100% 100%;
  73. float: left;
  74. vertical-align: top;
  75. margin-top: -2px;
  76. margin-right: 12px;
  77. }
  78. .achievementHot ol{
  79. float: left;
  80. }
  81. .achievementHot ol li{
  82. color: #393838;
  83. float: left;
  84. margin: 0 7px;
  85. }
  86. .achievementHot{
  87. clear: both;
  88. overflow: hidden;
  89. margin-bottom: 6px;
  90. }
  91. .achievementHot ol li a:hover{
  92. color: #f68704;
  93. }
  94. .achievementHot a{
  95. float: right;
  96. font-size: 14px;
  97. color: #7a7878;
  98. }
  99. .achievementHot a:hover{
  100. color:#f68704;
  101. }
  102. .achievementHot-list{
  103. clear: both;
  104. overflow: hidden;
  105. }
  106. .achievementHot-list .row{
  107. margin: 0;
  108. }
  109. .achievementHot-list ul li div{
  110. overflow: hidden;
  111. width: 385px;
  112. box-shadow: 0 0 4px #ccc;
  113. }
  114. .achievementHot-list .col-sm-4{
  115. padding: 0
  116. }
  117. .achievementHot-list ul li{
  118. margin-bottom: 18px;
  119. }
  120. .achievementHot-list ul li div img {
  121. float: left;
  122. width: 112px;
  123. height: 112px;
  124. }
  125. .achievementHot-list ul li div div{
  126. width: 273px;
  127. height: 112px;
  128. float: left;
  129. }
  130. .achievementHot-list ul li div div h4{
  131. font-weight: normal;
  132. font-size: 14px;
  133. color: #1f1f1f;
  134. overflow: hidden;
  135. white-space:nowrap;
  136. text-overflow:ellipsis;
  137. -o-text-overflow:ellipsis;
  138. border-bottom: 1px double #ccc;
  139. height: 42px;
  140. line-height: 42px;
  141. padding-left: 20px;
  142. }
  143. hr{
  144. clear: both;
  145. margin: 10px 0 18px;
  146. border:2px solid #ff6113;
  147. }
  148. .achievementHot-list ul li div div p{
  149. padding-left: 20px;
  150. margin: 8px 0;
  151. }
  152. .achievementHot-list ul li div div p .orange{
  153. font-size: 12px;margin-right: 30px;
  154. display: inline-block;
  155. }
  156. .achievementHot-list ul li div div p .blur{
  157. font-size: 12px;
  158. display: inline-block;
  159. }
  160. .achievementHot-list ul li div div p .technology{
  161. float: right;
  162. display: inline-block;
  163. width: 100px;
  164. height: 24px;
  165. line-height: 22px;
  166. text-align: center;
  167. border: 1px solid #ff6113;
  168. color: #ff6113;
  169. }
  170. .achievementHot-list ul li div div p .follow{
  171. float: right;
  172. display: inline-block;
  173. width: 50px;
  174. height: 24px;
  175. line-height: 22px;
  176. text-align: center;
  177. background: #ff6113;
  178. color: #ffffff;
  179. border-radius: 12px;
  180. margin:0 12px;
  181. }
  182. .achievementHot-list ul li:hover div h4{
  183. color: #0a7dd4;
  184. }
  185. .study {
  186. padding: 50px 0 30px;
  187. }
  188. .study h4 {
  189. font-weight: normal;
  190. font-size: 22px;
  191. color: #1f1f1f;
  192. }
  193. .study h4 a {
  194. display: inline-block;
  195. color: #cacaca;
  196. font-size: 12px;
  197. margin-left: 24px;
  198. }
  199. .study h4 a:hover{
  200. color: #f68704;
  201. }
  202. .patent{
  203. width: 100%;
  204. height: 204px;
  205. position: relative;
  206. }
  207. .patent .imgPatent{
  208. position: absolute;
  209. top: 0;
  210. left: 0;
  211. width: 100%;
  212. height: 204px;
  213. background: url(../../../img/newMenu/achievement_9.png) no-repeat;
  214. background-size:100% 100%;
  215. z-index: 200;
  216. }
  217. .patent a{
  218. position: absolute;
  219. width: 210px;
  220. height: 54px;
  221. display: inline-block;
  222. background: url(../../../img/newMenu/demandPat.png)no-repeat;
  223. background-size:100% 100%;
  224. bottom: 20px;
  225. right: 72px;
  226. z-index:400;
  227. transition: all .2s ease-in-out;
  228. }
  229. .patent a:hover{
  230. background: url(../../../img/newMenu/demandPatHover.png)no-repeat;
  231. background-size:100% 100%;
  232. right: 65px;
  233. transition: all .2s ease-in
  234. }
  235. .patentList{
  236. padding-top: 46px;
  237. }
  238. .patentList .col-sm-4>img{
  239. width: 100%;
  240. height: 213px;
  241. }
  242. .patentList .col-sm-4 div>img{
  243. height: 210px;
  244. display: inline-block;
  245. }
  246. .patentList>.row>.col-sm-4 img:first-child{
  247. margin-bottom: 14px;
  248. }
  249. .patentList ul li img{
  250. width: 100%;
  251. }
  252. .patentList ul li div{
  253. width: 242px;
  254. }
  255. .patentList ul li div p{
  256. height: 40px;
  257. line-height: 40px;
  258. overflow: hidden;
  259. white-space:nowrap;
  260. text-overflow:ellipsis;
  261. -o-text-overflow:ellipsis;
  262. }
  263. .patentList .demandAdviser,.patentList .demandDeclare{
  264. width: 380px;
  265. height: 240px;
  266. position: relative;
  267. }
  268. .patentList .demandAdviser{
  269. margin-bottom: 20px;
  270. }
  271. .demandAdviser a{
  272. cursor: pointer;
  273. position: absolute;
  274. bottom:-10px;
  275. right: 5px;
  276. width: 100px;
  277. height:50px;
  278. display: inline-block;
  279. background: url(../../../img//newMenu/achievementLJ.png) no-repeat;
  280. background-size:100% 100%;
  281. }
  282. .demandDeclare a{
  283. cursor: pointer;
  284. position: absolute;
  285. bottom: 0px;
  286. right: 5px;
  287. width: 100px;
  288. height: 50px;
  289. display: inline-block;
  290. background: url(../../../img//newMenu/achievementZX.png) no-repeat;
  291. background-size:100% 100%;
  292. }
  293. .demandDeclare a:hover{
  294. background: url(../../../img//newMenu/achievementZXhover.png) no-repeat;
  295. background-size:100% 100%;
  296. }
  297. .demandAdviser a:hover{
  298. background: url(../../../img//newMenu/achievementLJhover.png) no-repeat;
  299. background-size:100% 100%;
  300. }
  301. .patentList .demandAdviser img,.patentList .demandDeclare img{
  302. width: 100%;
  303. height:250px!important;
  304. position: absolute;
  305. left: 0;
  306. top: 0;
  307. }
  308. .achieveBj img{
  309. margin-top: 16px;
  310. width: 100%;
  311. height: 90px;
  312. }
  313. /* 实用技术 */
  314. .practical {
  315. clear: both;
  316. }
  317. .practical .practicalLeft{
  318. float: left;
  319. width: 940px;
  320. }
  321. .practicalLeft ul li {
  322. cursor: pointer;
  323. width: 170px;
  324. margin-right: 30px;
  325. float: left;
  326. padding-left: 28px;
  327. border-left: 1px solid #dfdfdf;
  328. }
  329. .practicalLeft ul li .imgBj{
  330. position: relative;
  331. width: 100%;
  332. height: 130px;
  333. }
  334. .practicalLeft ul li .imgBj img{
  335. width: 100%;
  336. height: 100%;
  337. }
  338. .practicalLeft ul li .imgBj span{
  339. position: absolute;
  340. top: 0;
  341. left: 0;
  342. width: 44px;
  343. height: 40px;
  344. display: inline-block;
  345. background: url(../../../img/newMenu/achievement_26.png) no-repeat;
  346. background-size:100% 100%;
  347. }
  348. .practicalLeft ul li .txts h5,.practicalGrounpTxt .txts h5{
  349. font-weight: normal;
  350. font-size: 14px;
  351. color: #1f1f1f;
  352. overflow: hidden;
  353. white-space:nowrap;
  354. text-overflow:ellipsis;
  355. -o-text-overflow:ellipsis;
  356. padding: 10px 2px;
  357. }
  358. .practicalLeft ul li .txts p span,.practicalGrounpTxt .txts p span {
  359. color: #7a7878;
  360. font-size: 12px;
  361. display: inline-block;
  362. margin-right: 5px;
  363. }
  364. .practicalLeft ul li .txts .hotImg,.practicalGrounpTxt .txts .hotImg{
  365. float: right;
  366. margin-right: 0px;
  367. height: 18px;
  368. width: 32px;
  369. display: inline-block;
  370. background:url(../../../img/newMenu/achievement_hot.jpg) no-repeat;
  371. background-size:100% 100%;
  372. }
  373. .practicalLeft ul li:first-child{
  374. width: 140px;
  375. border: none;
  376. padding-left:0;
  377. }
  378. .practicalLeft ul li:last-child{
  379. margin-right: 0px;
  380. }
  381. .practicalLeft ul li .hr,.practicalGrounpTxt .hr{
  382. width: 100%;
  383. height: 18px;
  384. background: url(../../../img/newMenu/achievement_27.jpg) no-repeat;
  385. background-size:100% 100%;
  386. margin: 4px 0px;
  387. }
  388. .practicalLeft .btnTxt span,.practicalGrounpTxt .btnTxt span {
  389. width: 64px;
  390. height: 24px;
  391. display: inline-block;
  392. text-align: center;
  393. font-size: 14px;
  394. color: #ff6600;
  395. border: 1px solid #ff6600;
  396. line-height: 21px;
  397. margin: 0 3px;
  398. overflow: hidden;
  399. text-overflow: ellipsis;
  400. white-space: nowrap;
  401. -o-text-overflow: ellipsis;
  402. }
  403. .practical .practicalRight{
  404. float: right;
  405. margin-top: 0px;
  406. width: 230px;
  407. height: 390px;
  408. background: url(../../../img/newMenu/achievement_jishu.jpg)no-repeat;
  409. background-size:100% 100%;
  410. }
  411. .practicalGrounp {
  412. padding-top: 16px;
  413. clear: both;
  414. overflow: hidden;
  415. }
  416. .practicalGrounp ol li{
  417. float: left;
  418. width: 33.00%;
  419. margin-left: 4px;
  420. cursor: pointer;
  421. }
  422. .practicalGrounp ol li img{
  423. width: 146px;
  424. height: 136px;
  425. display: inline-block;
  426. float: left;
  427. }
  428. .practicalGrounp ol li:first-child{
  429. margin-left: 0;
  430. }
  431. .practicalGrounp .practicalGrounpTxt{
  432. float: left;
  433. margin: 10px;
  434. width: 144px;
  435. }
  436. .practicalGrounpTxt .hr{
  437. margin-bottom: 15px;
  438. }
  439. .studyT {
  440. clear: both;
  441. padding: 50px 0 36px;
  442. }
  443. .studyT h4 {
  444. font-weight: normal;
  445. font-size: 22px;
  446. color: #1f1f1f;
  447. }
  448. .studyT h4 a {
  449. display: inline-block;
  450. color: #cacaca;
  451. font-size: 12px;
  452. margin-left: 24px;
  453. }
  454. .studyT h4 a:hover{
  455. color: #f68704;
  456. }
  457. .practicalRight {
  458. margin-top: -20px
  459. }
  460. .practicalRight h4{
  461. text-align: center;
  462. font-size: 18px;
  463. font-weight: normal;
  464. }
  465. .practicalRight ul li{
  466. cursor: pointer;
  467. overflow: hidden;
  468. padding: 10px 0px;
  469. }
  470. .practicalRight ul li img{
  471. float: left;
  472. }
  473. .practicalRight ul li div{
  474. float: left;
  475. padding-left:12px;
  476. width: 110px;
  477. }
  478. .practicalRight ul li div p{
  479. font-size: 12px;
  480. height: 24px;
  481. line-height: 24px;
  482. color: #757575;
  483. margin-top: 10px;
  484. overflow: hidden;
  485. white-space:nowrap;
  486. text-overflow:ellipsis;
  487. -o-text-overflow:ellipsis;
  488. }
  489. .practicalRight ul li div hr{
  490. width: 146px;
  491. border: 0.5px solid #e7e7e7;
  492. }
  493. .practicalRight ul li img{
  494. width: 58px;
  495. height: 58px;
  496. }
  497. .practicalRight a{
  498. color: #7a7878;
  499. }
  500. .practicalRight a:hover{
  501. color: #f68704;
  502. }
  503. /* 知识产权交易政策 */
  504. .transaction .transactionImg{
  505. float: left;
  506. width: 680px;
  507. padding-top: 30px;
  508. }
  509. .transaction .transactionImg .img{
  510. width: 330px;
  511. overflow: hidden;
  512. }
  513. .transaction .transactionImg>img{
  514. float: left;
  515. width: 330px;
  516. }
  517. .transaction .transactionImg div{
  518. float: left;
  519. width: 330px;
  520. padding: 15px 0px 0 20px ;
  521. }
  522. .transaction .transactionImg div address{
  523. color: #8c8c8c;
  524. font-size: 16px;
  525. margin-bottom: 22px;
  526. }
  527. .introduce address{
  528. margin-bottom: 10px!important;
  529. }
  530. .introduce address span {
  531. color: #333;
  532. }
  533. .transaction .transactionImg div address span{
  534. margin: 0 10px;
  535. display: inline-block;
  536. }
  537. .transaction .transactionImg div time{
  538. color: #8c8c8c;
  539. font-size: 16px;
  540. }
  541. .transaction .transactionImg div h5{
  542. font-weight: normal;
  543. font-size: 16px;
  544. color: #191919;
  545. padding-bottom: 21px;
  546. }
  547. .transaction .transactionImg div p{
  548. font-size: 14px;
  549. color: #7a7878;
  550. line-height: 24px;
  551. padding-bottom: 16px;
  552. }
  553. .transaction .transactionImg div a{
  554. color: #7a7878;
  555. }
  556. .transaction .transactionImg div a:hover{
  557. color: #f68704;
  558. }
  559. .transaction ul li {
  560. height: 100px;
  561. width: 470px;
  562. margin-bottom: 30px;
  563. }
  564. .transaction ul li .time,.transactionList ol li .time{
  565. width: 84px;
  566. text-align: center;
  567. padding:10px;
  568. background: #f9f9f9;
  569. float: left;
  570. }
  571. .transaction ul li .time p,.transactionList ol li .time p{
  572. font-size: 30px;
  573. color: #1f1f1f;
  574. }
  575. .transaction ul li .time span,.transactionList ol li .time span{
  576. font-size: 14px;
  577. color: #8c8c8c;
  578. }
  579. .transaction ul li .time hr,.transactionList ol li .time hr{
  580. height: 1px;
  581. width: 65px;
  582. border: none;
  583. display: inline-block;
  584. background: url(../../../img/newMenu/achievement_dotted.jpg)no-repeat;
  585. background-size:100% 100%;
  586. margin: 11px 0px ;
  587. }
  588. .transaction ul li .introduce,.transactionList ol li .introduce{
  589. float: left;
  590. width: 386px;
  591. padding: 12px;
  592. }
  593. .transaction .introduce address,.transactionList .introduce address,{
  594. margin-bottom: 10px;
  595. }
  596. .transaction .introduce img,.transactionList .introduce img{
  597. margin-right: 8px;
  598. }
  599. .transaction .introduce .title,.transactionList .introduce .title{
  600. margin-left: 10px;
  601. font-size: 16px;
  602. color:#191919;
  603. }
  604. .transaction .introduce p,.transactionList .introduce p{
  605. color: #7a7878;
  606. font-size: 14px;
  607. line-height: 24px;
  608. }
  609. .transaction ul{
  610. float: right;
  611. }
  612. .transactionList,.transactionList ol{
  613. clear: both;
  614. overflow: hidden;
  615. }
  616. .transactionList ol li{
  617. overflow: hidden;
  618. width: 50%;
  619. }
  620. .transactionList ol li:first-child{
  621. float: left;
  622. }
  623. .transactionList ol li:last-child{
  624. width: 470px;
  625. float: right;
  626. }
  627. /*特效*/
  628. .transactionList ol li:hover .time,.transaction ul li:hover .time{
  629. background: #0a7dd4;
  630. }
  631. .transactionList ol li:hover .introduce .title,.transaction ul li:hover .introduce .title{
  632. color: #0a7dd4;
  633. }
  634. .transactionList ol li:hover .time p,.transactionList ol li:hover .time span,.transaction ul li:hover .time span,.transaction ul li:hover .time p {
  635. color: #ffffff;
  636. }
  637. .transactionList ol li:hover address span,.transaction ul li:hover address span {
  638. color: #0a7dd4;
  639. }
  640. .transaction .transactionImg:hover div h5{
  641. color: #0a7dd4
  642. }
  643. .newRelease ul li:hover{
  644. box-shadow: 0 3px 5px #ccc;
  645. margin-top: -5px;
  646. transition: all .2s ease-in;
  647. cursor: pointer;
  648. }
  649. .achievementHot-list ul li:hover div img{
  650. opacity: .8;
  651. cursor: pointer;
  652. }
  653. .patentList ul {
  654. margin-left: 0;
  655. }
  656. .achieveBj{
  657. clear: both;
  658. }
  659. .patentList ul li{
  660. width: 242px;
  661. margin: 0 10px 10px;;
  662. padding: 0;
  663. transition: all .2s ease-in-out;
  664. box-shadow: 0 0 4px #ccc;
  665. }
  666. .patentList ul li:hover{
  667. box-shadow: 0 4px 10px #ccc;
  668. transition: all .2s ease-out;
  669. cursor: pointer;
  670. }
  671. .patentList ul li p{
  672. color: #333333;
  673. padding: 0 10px;
  674. overflow: hidden;
  675. white-space:nowrap;
  676. text-overflow:ellipsis;
  677. -o-text-overflow:ellipsis;
  678. }
  679. .patentList ul li:hover p{
  680. color: #0a7dd4
  681. }
  682. .practicalLeft ul li:hover img,.practicalGrounp ol li:hover img{
  683. opacity: .7;
  684. }
  685. .practicalLeft ul li:hover .txts h5,.practicalGrounp ol li:hover .txts h5{
  686. color: #ff6600;
  687. }
  688. .practicalRight ul li:hover{
  689. margin-left: -5px;
  690. transition: all .5s;
  691. }
  692. .practicalRight ul li:hover p{
  693. color: #ff6600;
  694. }
  695. .carousel{
  696. width: 100%!important;
  697. }
  698. .bannerList .carousel .left, .bannerList .carousel .right ,.carousel-control.left,.carousel-control.right{
  699. line-height: 475px;
  700. font-size: 60px;
  701. }