achievement.css 15 KB

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