dataCenterZWTJ.wxss 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405
  1. /* pages/dataCenterZWTJ/dataCenterZWTJ.wxss */
  2. page {
  3. /* height: 100%; */
  4. width: 100%;
  5. background-color: #F5F5F5;
  6. }
  7. .box {
  8. margin-top: 25rpx;
  9. width: 95%;
  10. background: #fff;
  11. border-radius: 10rpx;
  12. margin: 25rpx auto 0 auto;
  13. box-shadow: 0px 2rpx 12rpx 0px rgba(153, 153, 153, 0.17);
  14. border-radius: 10px;
  15. padding-top: 20rpx;
  16. }
  17. .crossline {
  18. width: 80%;
  19. height: 2rpx;
  20. background: #CFCFCF;
  21. margin: 0 auto;
  22. margin-bottom: 30rpx;
  23. }
  24. .verticalbar {
  25. width: 2rpx;
  26. height: 60%;
  27. float: left;
  28. background: #CFCFCF;
  29. }
  30. .bgitem {
  31. width: 100%;
  32. height: 200rpx;
  33. margin-left: 40rpx;
  34. }
  35. .title {
  36. height: 40rpx;
  37. line-height: 40rpx;
  38. }
  39. .title text {
  40. height: 40rpx;
  41. line-height: 40rpx;
  42. }
  43. .titileicon {
  44. width: 40rpx;
  45. height: 40rpx;
  46. margin-top: 5rpx;
  47. float: left;
  48. margin-right: 15rpx;
  49. }
  50. .line {
  51. margin-top: 40rpx;
  52. height: 120rpx;
  53. }
  54. .lineicon {
  55. width: 80rpx;
  56. height: 80rpx;
  57. float: left;
  58. border-radius: 140rpx;
  59. }
  60. .lineTextGroups {
  61. width: 80%;
  62. height: 120rpx;
  63. float: left;
  64. }
  65. .lineTextGroup {
  66. width: 184rpx;
  67. height: 120rpx;
  68. float: left;
  69. }
  70. .lineTextGroup text {
  71. display: block;
  72. width: 184rpx;
  73. height: 40rpx;
  74. line-height: 40rpx;
  75. text-align: center;
  76. font-size: 26rpx;
  77. }
  78. .box2Title {
  79. width: 100%;
  80. height: 70rpx;
  81. margin-left: 40rpx;
  82. }
  83. .box2TitleIcon {
  84. width: 40rpx;
  85. height: 40rpx;
  86. margin-top: 5rpx;
  87. float: left;
  88. margin-right: 15rpx;
  89. }
  90. .box2Title text {
  91. font-size: 32rpx;
  92. font-family: DOUYU;
  93. font-weight: normal;
  94. color: #333333;
  95. line-height: 60rpx;
  96. }
  97. .box2ItemTitle {
  98. margin-top: 10rpx;
  99. margin-bottom: 10rpx;
  100. width: 100%;
  101. height: 50rpx;
  102. margin-left: 30rpx;
  103. }
  104. .dot {
  105. width: 15rpx;
  106. height: 15rpx;
  107. background-color: #F7C86A;
  108. border-radius: 20rpx;
  109. float: left;
  110. margin-top: 20rpx;
  111. margin-right: 10rpx;
  112. }
  113. .box2ItemTitle text {
  114. font-size: 28rpx;
  115. font-family: PingFang SC;
  116. font-weight: 500;
  117. color: #333333;
  118. float: left;
  119. height: 50rpx;
  120. line-height: 60rpx;
  121. }
  122. .box2ItemContent {
  123. width: 100%;
  124. height: 200rpx;
  125. background-repeat: no-repeat;
  126. background-size: 90%;
  127. background-position: center center;
  128. }
  129. .countGroup {
  130. width: 80%;
  131. /* background: #000; */
  132. height: 100rpx;
  133. margin: 0 auto;
  134. }
  135. .countbox {
  136. width: 28%;
  137. float: left;
  138. margin-left: 20rpx;
  139. height: 100rpx;
  140. }
  141. .box2Crossline {
  142. width: 100%;
  143. height: 2rpx;
  144. background: #C5C5C5;
  145. }
  146. .one {
  147. text-align: center;
  148. }
  149. .two {
  150. line-height: 100rpx;
  151. }
  152. .three {
  153. text-align: right;
  154. line-height: 140rpx;
  155. }
  156. .unitName {
  157. width: 90%;
  158. height: 80rpx;
  159. margin-top: -20rpx;
  160. margin: -20rpx auto 0 auto;
  161. }
  162. .namebox {
  163. width: 30%;
  164. height: 70rpx;
  165. float: left;
  166. text-align: center;
  167. font-size: 25rpx;
  168. margin-left: 5rpx;
  169. margin-right: 5rpx;
  170. overflow:hidden;
  171. }
  172. .nameone {
  173. margin-left: 20rpx;
  174. }
  175. .namethree {
  176. margin-left: 25rpx;
  177. }
  178. .chuangBoxGourps {
  179. width: 90%;
  180. height: 300rpx;
  181. padding-left: 50rpx;
  182. padding-top: 10rpx;
  183. padding-bottom: 10rpx;
  184. }
  185. .chuangbox {
  186. /* margin: 10rpx auto; */
  187. width: 45%;
  188. height: 130rpx;
  189. /* background-color: #333333; */
  190. float: left;
  191. margin: 10rpx 10rpx 10rpx 10rpx;
  192. background-repeat: no-repeat;
  193. background-size: 100%;
  194. }
  195. .chuangboxtext1 {
  196. color: #FFFFFF;
  197. font-size: 27rpx;
  198. width: 150rpx;
  199. text-align: left;
  200. margin-top: 20rpx;
  201. margin-left: 25rpx;
  202. }
  203. .chuangboxtext2 {
  204. color: #FFFFFF;
  205. font-weight: bold;
  206. width: 150rpx;
  207. text-align: center;
  208. }
  209. .sbboxcontent {
  210. width: 100%;
  211. height: 400rpx;
  212. margin: auto 0;
  213. }
  214. .sbboxleft {
  215. width: 380rpx;
  216. height: 380rpx;
  217. float: left;
  218. }
  219. .sbboxright {
  220. margin-top: 80rpx;
  221. width: 150rpx;
  222. float: left;
  223. }
  224. .sbboxright .item1 {
  225. background-repeat: no-repeat;
  226. width: 314rpx;
  227. height: 93rpx;
  228. background-size: 100%;
  229. }
  230. .oneThing {
  231. margin-left: 20rpx;
  232. line-height: 93rpx;
  233. font-size: 24rpx;
  234. font-weight: 500;
  235. color: #0B868E;
  236. float: left;
  237. }
  238. .evaluate {
  239. width: 200rpx;
  240. height: 50rpx;
  241. background: #F2F7FF;
  242. border: 1rpx solid #508FF4;
  243. border-radius: 10rpx;
  244. font-weight: 500;
  245. color: #508FF4;
  246. font-size: 24rpx;
  247. line-height: 50rpx;
  248. text-align: center;
  249. margin-bottom: 20rpx;
  250. }
  251. .matters {
  252. width: 85rpx;
  253. height: 110rpx;
  254. background: #F2F7FF;
  255. border: 1rpx solid #508FF4;
  256. border-radius: 12rpx;
  257. font-size: 58rpx;
  258. font-weight: 500;
  259. color: #508FF4;
  260. line-height: 110rpx;
  261. text-align: center;
  262. margin-right: 10rpx;
  263. }
  264. /* 南岸区政务服务事项总数 */
  265. .matters.default {
  266. color: #D1DFF5;
  267. }
  268. /* 一件事情一次办左上部文本 */
  269. .oneThing-left-top {
  270. position: absolute;
  271. top: 82rpx;
  272. left: 50%;
  273. font-size: 28rpx;
  274. color: #72A1DC;
  275. transform: translate(-50%, 0);
  276. }
  277. /* 一件事情一次办左下部文本 */
  278. .oneThing-left-bottom {
  279. position: absolute;
  280. display: flex;
  281. left: 50%;
  282. transform: translate(-50%, 0);
  283. top: 127rpx;
  284. color: #1E71D2;
  285. font-size: 46rpx;
  286. }
  287. .triangles {
  288. width: 0;
  289. height: 0;
  290. position: relative;
  291. left: 20rpx;
  292. top: 50%;
  293. transform: translate(0, -50%);
  294. line-height: 93rpx;
  295. border-bottom: 18rpx solid transparent;
  296. border-left: 18rpx solid #0B868E;
  297. border-top: 18rpx solid transparent;
  298. }
  299. .table {
  300. height: 600rpx;
  301. overflow: hidden;
  302. }
  303. .tableHaed {
  304. background: #DBDBDB;
  305. height: 57rpx;
  306. position: relative;
  307. z-index: 99;
  308. }
  309. .tableHaed view {
  310. height: 57rpx;
  311. line-height: 57rpx;
  312. float: left;
  313. text-align: left;
  314. font-size: 23rpx;
  315. }
  316. .tableContent {
  317. background: #fff;
  318. height: 57rpx;
  319. }
  320. .tableContent view {
  321. height: 90rpx;
  322. float: left;
  323. text-align: left;
  324. font-size: 23rpx;
  325. /* display: flex; */
  326. justify-content: center;
  327. align-items: center;
  328. }
  329. .foot {
  330. height: 60rpx;
  331. }
  332. .box2-detail {
  333. position: relative;
  334. animation: detail 8s linear 0s infinite normal both
  335. }
  336. @keyframes detail{
  337. 0%{
  338. bottom: 0;
  339. }
  340. 50%{
  341. bottom: 30%;
  342. }
  343. 100%{
  344. bottom: 60%;
  345. }
  346. }
  347. /* overflow:hidden; */