feature.css 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491
  1. *{ box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
  2. .img-qrcode-wechat, .img-qrcode-mobile{ width:120px; height:120px;}
  3. .part-one-bg{
  4. background-size: 100% 100%;
  5. width: 100%;
  6. height: 345px;
  7. margin:0px 0px 50px 0px;
  8. }
  9. .part-two{
  10. width: 1200px;
  11. margin: 0 auto;
  12. /* height: 62%;*/
  13. }
  14. #div2 {
  15. width: 200px;
  16. height: 400px;
  17. background: green;
  18. position: absolute;
  19. left: 166px;
  20. top: 200px;
  21. }
  22. a{color:white}
  23. .leftmenu{
  24. width:14%;
  25. height:auto;
  26. background:#c0c0c0;
  27. background-color: #ffebed;
  28. float:left;
  29. }
  30. .li-header{
  31. color: white;
  32. text-align: center;
  33. line-height: 40px;
  34. font-size: 18px;
  35. font-family: "Microsoft YaHei";
  36. }
  37. .leftmenuone{
  38. background-color: #ed7746;
  39. border-bottom: 0.2px solid #ed7746;
  40. }
  41. .leftmenutwo{
  42. background-color: #dd4250;
  43. border-bottom: 0.2px solid #dd4250;
  44. }
  45. .leftmenuone .li-content{
  46. background-color: #fff2ec;
  47. }
  48. .leftmenuone .li-content :hover{
  49. color:#ed7746;
  50. }
  51. .oneactive{
  52. color:#ed7746;
  53. font-size:19px;
  54. }
  55. .twoactive{
  56. color:#dd4250;
  57. font-size:19px;
  58. }
  59. .leftmenutwo .li-content{
  60. background-color: #ffebed;
  61. }
  62. .leftmenutwo .li-content :hover{
  63. color:#dd4250;
  64. }
  65. .li-content{
  66. margin: 1px 1px 1px 1px;
  67. text-align: center;
  68. line-height: 42px;
  69. font-size: 16px;
  70. font-family: "Microsoft YaHei";
  71. cursor: pointer;
  72. }
  73. .right-content{
  74. width: 84%;
  75. margin-left: 1%;
  76. /* margin: 0%; */
  77. float: right;
  78. /* background-color: #F0FFF0;*/
  79. height: 100%;
  80. }
  81. .right-content .right-content-ul{
  82. width: 98%;
  83. margin: 0% 1%;
  84. }
  85. .right-content-li{
  86. width: 23.78%;
  87. height: 395px;
  88. /* background-color: #CAE1FF;*/
  89. float: left;
  90. margin: 0% 0.3% 1% 0.8%;
  91. border: 1px solid #ebebeb;
  92. }
  93. .right-content-images{
  94. width: 94%;
  95. height: 56%;
  96. /* background-color: yellow;*/
  97. margin: 7% 3% 3% 3%;
  98. }
  99. .right-content-images img{
  100. width: 100%;
  101. height: 100%;
  102. }
  103. .right-content-infomation{
  104. margin: 3%;
  105. }
  106. .right-content-infomation p{
  107. /* display: -webkit-box;
  108. -webkit-box-orient: vertical;
  109. -webkit-line-clamp: 3;
  110. overflow: hidden;
  111. text-overflow:ellipsis;
  112. -o-text-overflow:ellipsis;
  113. -icab-text-overflow: ellipsis;
  114. -khtml-text-overflow: ellipsis;
  115. -moz-text-overflow: ellipsis;
  116. -webkit-text-overflow: ellipsis;
  117. display:block;
  118. white-space: nowrap;
  119. width: 100%;
  120. display: -webkit-box;*/
  121. /* IE6 需要定义宽度 */
  122. }
  123. .feature-title{
  124. font-size: 14px;
  125. font-family: "Microsoft YaHei";
  126. padding: 0;
  127. }
  128. .part-two .list_empty_group{
  129. display:none;
  130. }
  131. .leftpart{
  132. width: 235px;
  133. min-height: 526px;
  134. background-color: white;
  135. float: left;
  136. border: 1px solid #ebebeb;
  137. padding: 15px 15px 30px 15px;
  138. }
  139. .leftpart img{
  140. width:204px;
  141. height:170px;
  142. }
  143. .leftpart h3{
  144. padding:10px 0px;
  145. }
  146. .post-title{
  147. font-size: 14px;
  148. font-family: "Microsoft YaHei";
  149. padding:0px 0px 6px 0px;
  150. }
  151. .leftpart-information{
  152. padding: 10px;
  153. }
  154. .leftpart .content{
  155. font-family: "Microsoft YaHei";
  156. line-height: 25px;
  157. }
  158. .rightpart{
  159. width: 920px;
  160. float: right;
  161. min-height: 526px;
  162. border: 1px solid #ebebeb;
  163. }
  164. .rightpart .info-title{
  165. font-size: 22px;
  166. font-family: "Microsoft YaHei";
  167. text-align: center;
  168. font-weight: bold;
  169. padding: 30px 0px;
  170. }
  171. .rightpart hr{
  172. border: 1px dashed #ebebeb;
  173. height: 1px;
  174. width: 880px;
  175. margin-left: 20px;
  176. }
  177. .info-content{
  178. width: 880px;
  179. margin-left: 20px;
  180. margin-top: 15px;
  181. line-height: 25px;
  182. text-indent: 27px;
  183. }
  184. .info-p-content{
  185. font-size: 16px;
  186. text-indent: 39px;
  187. line-height: 28px;
  188. }
  189. .info-tip{
  190. margin-left: 340px;
  191. margin-bottom: 8px;
  192. }
  193. .info-tip span{
  194. color:#bfbfbf;
  195. }
  196. .show-time{
  197. width: 33.5px;
  198. margin-bottom: -5px;
  199. margin-right: 2px;
  200. }
  201. .show-read{
  202. width: 24px;
  203. margin-bottom: -7.4px;
  204. margin-left: 40px;
  205. margin-right: 8px;
  206. }
  207. .ul-bottom{
  208. border: 0.8px solid #ebebeb;
  209. margin: 15px 0px;
  210. width: 974px;
  211. margin-left: 17px;
  212. }
  213. .info-title-left{
  214. float:left;
  215. margin-left:18px;
  216. height: 34px;
  217. }
  218. .info-title-right{
  219. float: right;
  220. margin-right: 18px;
  221. }
  222. .questionbtn{
  223. height: 30px;
  224. width: 72px;
  225. color: white;
  226. text-align: center;
  227. border-radius: 7px;
  228. line-height: 35px;
  229. margin-left: 56px;
  230. margin-top: 8px;
  231. outline: none;
  232. box-shadow: none;
  233. -webkit-box-shadow: none;
  234. -moz-box-shadow: none;
  235. text-shadow: none;
  236. border: none;
  237. font-family: "Microsoft YaHei";
  238. font-size: 14px;
  239. background: #dd4250;
  240. }
  241. .leftpart-information button:hover{
  242. cursor:pointer;
  243. background: #f95f6d;
  244. }
  245. .mienbg{
  246. background-image: url(../../images/rcfc-bg-s.png);
  247. }
  248. .mien-title .title-o{
  249. text-align: center;
  250. padding-top: 160px;
  251. color: white;
  252. font-size: 32px;
  253. font-family: "Microsoft YaHei";
  254. }
  255. .mien-title .title-w{
  256. text-align: center;
  257. color: black;
  258. font-size: 27px;
  259. width: 262px;
  260. padding: 18px 18px 18px 18px;
  261. margin: 20px auto 0px auto;
  262. font-family: "Microsoft YaHei";
  263. }
  264. .mien-title .title-w p{
  265. display:inline;
  266. }
  267. /*边框转动效果*/
  268. .mkeBody { background: #121212; }
  269. .mkeHeadBox { padding: 30px 10px; text-overflow: ellipsis; white-space: nowrap; margin: 0; color: #fff; text-align: center; overflow: hidden; border-bottom: 3px solid #666; box-shadow: inset 0 -2px 3px #000000; letter-spacing: 1px; font: 26px/26px "微软雅黑"; }
  270. .mkeFooterBox { padding: 25px 10px; text-overflow: ellipsis; margin: 0; color: #fff; font-size: 14px; line-height: 24px; text-align: center; overflow: hidden; border-top: 3px solid #666; box-shadow: inset 0 2px 3px #000000; }
  271. .mkeContentBox { background: white; padding:20px 0 }
  272. .mkeContentBox:after { height: 0; clear: both; }
  273. .mkeFooterBox p, .mkeFooterBox div { padding: 0; margin: 0; line-height: 26px; font-size: 14px; }
  274. .mkeFooterBox a { color: #fff; white-space: nowrap }
  275. .mkeButton { background: #F36; display: inline-block; text-decoration: none; width: 102px; border-radius: 0.3em; transition: all 0.3s ease }
  276. .mkeButton:hover { background: #FF1550; }
  277. .mkeURL { font-size: 24px; }
  278. .mkeFooterBox .mKeBannerAD { width: 728px; height: 90px; margin: 18px auto 0; }
  279. .mkeFooterBox .mSmallKeBannerAD { display: none; }
  280. @media only screen and (max-width:900px) {
  281. .mkeButton { display: block; margin: 8px auto 0; }
  282. }
  283. @media only screen and (max-width:767px) {
  284. .mkeHeadBox { font-size: 18px; padding: 15px 10px; }
  285. .mkeFooterBox p, .mkeFooterBox div { line-height: 24px; font-size: 12px; }
  286. .mkeURL { font-size: 22px; }
  287. .mkeFooterBox .mKeBannerAD { display: none; }
  288. .mkeFooterBox .mSmallKeBannerAD { width: 300px; height: 250px; margin: 18px auto 0; display: block; }
  289. }
  290. *, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
  291. .clearfix:before, .clearfix:after { content: ''; display: table; }
  292. .clearfix:after { clear: both; }
  293. a { color: #95a5a6; text-decoration: none; outline: none; }
  294. .codrops-header { margin: 0 auto; padding: 2em; text-align: center; }
  295. .codrops-header h1 { margin: 0; font-weight: 300; font-size: 2.5em; }
  296. .codrops-header h1 span { display: block; padding: 0 0 0.6em 0.1em; font-size: 0.6em; opacity: 0.7; }
  297. /* To Navigation Style */
  298. .codrops-top { width: 100%; text-transform: uppercase; font-weight: 700; font-size: 0.69em; line-height: 2.2; }
  299. .codrops-top a { display: inline-block; padding: 0 1em; text-decoration: none; letter-spacing: 1px; }
  300. .codrops-top span.right { float: right; }
  301. .codrops-top span.right a { display: block; float: left; }
  302. .codrops-icon:before { margin: 0 4px; text-transform: none; font-weight: normal; font-style: normal; font-variant: normal; font-family: 'codropsicons'; line-height: 1; speak: none; -webkit-font-smoothing: antialiased; }
  303. .codrops-icon-drop:before { content: "\e001"; }
  304. .codrops-icon-prev:before { content: "\e004"; }
  305. section { padding: 2em; text-align: center; }
  306. section h2 { font-weight: 300; font-size: 2em; padding: 0; }
  307. .codrops-header + section { padding-top: 1.5em; }
  308. .related p { font-size: 1.5em; }
  309. .related > a { background: rgba(0,0,0,0.05); display: inline-block; text-align: center; margin: 20px 10px; padding: 25px; -webkit-transition: color 0.3s, background-color 0.3s; transition: color 0.3s, background-color 0.3s; }
  310. .related a:hover { background-color: rgba(0,0,0,0.4); }
  311. .related a img { max-width: 100%; opacity: 0.8; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; }
  312. .related a:hover img, .related a:active img { opacity: 1; }
  313. .related a h3 { margin: 0; padding: 0.5em 0 0.3em; max-width: 300px; text-align: left; }
  314. @media screen and (max-width: 25em) {
  315. .codrops-icon span { display: none; }
  316. }
  317. .box {
  318. position: relative;
  319. background: rgba(255,255,255,1);
  320. display: inline-block;
  321. cursor: pointer;
  322. /* color: #2c3e50; */
  323. box-shadow: inset 0 0 0 1px #dd4250;
  324. -webkit-transition: background 0.4s 0.5s;
  325. transition: background 0.4s 0.5s;
  326. }
  327. .box:hover {
  328. background: rgba(255,255,255,0);
  329. -webkit-transition-delay: 0s;
  330. transition-delay: 0s;
  331. }
  332. .box svg {
  333. position: absolute;
  334. top: 0;
  335. left: 0;
  336. }
  337. .box svg line {
  338. stroke: #ebebeb;
  339. fill: none;
  340. -webkit-transition: all .5s ease-in-out;
  341. transition: all .5s ease-in-out;
  342. }
  343. .box:hover svg line {
  344. -webkit-transition-delay: 0s;
  345. transition-delay: 0s;
  346. stroke-width: 1;
  347. }
  348. .box svg line.top,
  349. .box svg line.bottom {
  350. stroke-dasharray: 330 240;
  351. stroke-width: 1;
  352. }
  353. .box svg line.left,
  354. .box svg line.right {
  355. stroke-dasharray: 490 400;
  356. stroke-width: 1;
  357. }
  358. .box:hover svg line.top {
  359. -webkit-transform: translateX(-600px);
  360. transform: translateX(-600px);
  361. stroke-width: 1;
  362. }
  363. .box:hover svg line.bottom {
  364. -webkit-transform: translateX(600px);
  365. transform: translateX(600px);
  366. stroke-width: 1;
  367. }
  368. .box:hover svg line.left {
  369. -webkit-transform: translateY(920px);
  370. transform: translateY(920px);
  371. stroke-width: 1;
  372. }
  373. .box:hover svg line.right {
  374. -webkit-transform: translateY(-920px);
  375. transform: translateY(-920px);
  376. stroke-width: 1;
  377. }
  378. .right-content-images img {
  379. width: 219px;
  380. height: 216px;
  381. }
  382. /*创业帮手内页弹窗样式*/
  383. .black_overlay{
  384. display: none;
  385. position: absolute;
  386. top: 0%;
  387. left: 0%;
  388. width: 100%;
  389. height: 100%;
  390. background-color: black;
  391. z-index:1001;
  392. -moz-opacity: 0.8;
  393. opacity:.30;
  394. filter: alpha(opacity=80);
  395. }
  396. .white_content {
  397. display: none;
  398. left: 57.4%;
  399. top: 50%;
  400. margin-left: -125px;
  401. margin-top: -75px;
  402. position: fixed;
  403. _top: expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/ document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);
  404. border: 2px solid #ebebeb;
  405. background-color: white;
  406. border-radius: 3px;
  407. z-index: 1002;
  408. height: 150px;
  409. width: 250px;
  410. overflow: auto;
  411. }
  412. .white_content_small {
  413. display: none;
  414. position: absolute;
  415. top: 20%;
  416. left: 30%;
  417. width: 40%;
  418. height: 60%;
  419. border: 16px solid lightblue;
  420. background-color: white;
  421. z-index:1002;
  422. overflow: auto;
  423. }
  424. .divclose{margin-right:10px;float:right;cursor: pointer;font-size: 23px;margin-top: -2px;}
  425. .divtitle{margin-left:10px;float:left;font-size:16px;font-family: "Microsoft Yahei";margin-top: 6px}
  426. .MyDiv-header{background: #ebebeb;height: 35px;}
  427. .MyDiv-header span{height: 35px;}
  428. .MyDiv-info{padding: 18.5px 0px 0px 16.8px;font-size: 14px;font-family: "Microsoft Yahei";}
  429. .MyDiv-info p{margin-bottom: 21px;}
  430. .border_all{padding:0px;}