抖音b端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

432 lines
6.9 KiB

  1. @import "../../iconfont.ttss";
  2. /* .top {
  3. position: fixed;
  4. top: 0;
  5. left: 0;
  6. right: 0;
  7. z-index: 10 80;
  8. padding-bottom: 200rpx;
  9. } */
  10. page {
  11. background: #f8f8fa;
  12. }
  13. .img{
  14. display: block;
  15. width: 160rpx;
  16. margin: 0 auto;
  17. }
  18. @font-face {
  19. font-family: 'iconfont'; /* project id 1353693 */
  20. src: url('//at.alicdn.com/t/font_1353693_mi95v4vvx8n.eot');
  21. src: url('//at.alicdn.com/t/font_1353693_mi95v4vvx8n.eot?#iefix') format('embedded-opentype'),
  22. url('//at.alicdn.com/t/font_1353693_mi95v4vvx8n.woff2') format('woff2'),
  23. url('//at.alicdn.com/t/font_1353693_mi95v4vvx8n.woff') format('woff'),
  24. url('//at.alicdn.com/t/font_1353693_mi95v4vvx8n.ttf') format('truetype'),
  25. url('//at.alicdn.com/t/font_1353693_mi95v4vvx8n.svg#iconfont') format('svg');
  26. }
  27. .iconfonts {
  28. display: inline-block;
  29. vertical-align: middle;
  30. width: 40rpx;
  31. height: 40rpx;
  32. margin-top: -7rpx;
  33. margin-right: -26rpx;
  34. }
  35. .firstPage {
  36. width: 100%;
  37. height: 100%;
  38. }
  39. .location {
  40. position: relative;
  41. width: 100%;
  42. font-size: 30rpx;
  43. text-align: left;
  44. color: #fff;
  45. }
  46. .fix image {
  47. position: absolute;
  48. top: 0;
  49. width: 100%;
  50. height: 168rpx;
  51. left: 0;
  52. right: 0;
  53. z-index: 10;
  54. }
  55. .location image {
  56. position: absolute;
  57. top: 0;
  58. width: 100%;
  59. height: 168rpx;
  60. left: 0;
  61. right: 0;
  62. z-index: 10;
  63. }
  64. .location text {
  65. display: block;
  66. text-align: left;
  67. position: relative;
  68. z-index: 100;
  69. font-size: 30rpx;
  70. color: #000;
  71. letter-spacing: 1.16rpx;
  72. }
  73. .fix{
  74. margin-bottom: 10rpx;
  75. }
  76. .writeOff {
  77. width: 100%;
  78. height: 24.5%;
  79. margin-top: 10rpx;
  80. }
  81. .writeOff>text {
  82. width: 92%;
  83. height: 50rpx;
  84. display: block;
  85. font-size: 30rpx;
  86. font-weight: bold;
  87. padding-top: 1.4%;
  88. margin: 0 auto;
  89. }
  90. .topBox{
  91. position: relative;
  92. z-index: 1000;
  93. background: #fff;
  94. width: 570rpx;
  95. margin: 20rpx auto 0;
  96. border-top: 1px solid #f6f5f5;
  97. padding: 30rpx 70rpx;
  98. box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.05);
  99. color: #000;
  100. border-radius:32rpx;
  101. }
  102. .topBox view{
  103. display: flex;
  104. flex-direction: column;
  105. text-align: center;
  106. }
  107. .topBox2{
  108. position: relative;
  109. z-index: 1000;
  110. background: #fff;
  111. height: 240rpx;
  112. width: 710rpx;
  113. margin: 20rpx auto;
  114. color: #000099;
  115. display: flex;
  116. flex-direction: column;
  117. text-align: center;
  118. border-radius:32rpx;
  119. }
  120. .imgBox{
  121. width: 120rpx;
  122. height: 120rpx;
  123. margin: 20rpx auto;
  124. }
  125. .topBox2 image{
  126. width: 120rpx;
  127. height: 120rpx;
  128. margin: 20rpx auto;
  129. }
  130. .name{
  131. font-size: 30rpx;
  132. text-align: center;
  133. height: 60rpx;
  134. line-height: 60rpx;
  135. }
  136. .left>text:nth-child(2), .right>text:nth-child(2){
  137. font-size: 80rpx;
  138. margin: 10rpx 0;
  139. color:#FD782D;
  140. }
  141. .left>text,.right>text{
  142. width: 255rpx;
  143. overflow: hidden;
  144. text-overflow:ellipsis;
  145. white-space: nowrap;
  146. color: #475669;
  147. }
  148. .left>text:nth-child(3),.right>text:nth-child(3){
  149. color:#475669;
  150. }
  151. .classification {
  152. position: relative;
  153. z-index: 1000;
  154. width: 710rpx;
  155. margin: 0 auto;
  156. display: flex;
  157. flex-wrap: wrap;
  158. }
  159. .classification>view {
  160. background: #FFF;
  161. text-align: center;
  162. width: 19.5%;
  163. border: .1rpx #eee solid;
  164. display: flex;
  165. flex-direction: column;
  166. padding-bottom: 30rpx ;
  167. border-left: none!important;
  168. }
  169. .classification>view:nth-child(1) {
  170. border-radius: 16rpx 0 0 0;
  171. }
  172. .classification>view:nth-child(6) {
  173. border-radius:0 0 0 16rpx;
  174. border-top: none!important;
  175. }
  176. .classification>view:nth-child(7),.classification>view:nth-child(8) {
  177. border-top: none!important;
  178. }
  179. .classification>view:nth-child(5) {
  180. border-right: none!important;
  181. border-radius:0 16rpx 0 0;
  182. }
  183. .classification>view:nth-child(10) {
  184. border-top: none!important;
  185. border-right: none!important;
  186. border-radius:0 0 16rpx 0;
  187. }
  188. .classification>view>view {
  189. width: 110rpx;
  190. height: 110rpx;
  191. border-radius: 50%;
  192. text-align: center;
  193. margin: 0 auto;
  194. line-height:110rpx;
  195. }
  196. .icon-shoufukuan{
  197. color: rgb(91, 115, 255);
  198. }
  199. .icon-hexiao{
  200. color: #EEAF5C;
  201. }
  202. .icon-shouye1{
  203. color: #FF3A1D;
  204. }
  205. .icon-shouyintai1{
  206. color: rgb(33, 158, 214);
  207. }
  208. .icon-jifen{
  209. color: #00cd00;
  210. }
  211. .icon-quan{
  212. color: #FF5183;
  213. }
  214. .icon-jiesuan{
  215. color:#1296db;
  216. }
  217. .icon-lingquanzhongxin{
  218. color: #EEAF5C;
  219. }
  220. .icon-wuliu{
  221. color:#1296db;
  222. font-size: 72rpx !important;
  223. }
  224. .active {
  225. opacity: 0.6;
  226. }
  227. .actives {
  228. opacity: 0.6;
  229. }
  230. .classification>view>view icon {
  231. font-size: 60rpx;
  232. }
  233. .classification>view>text {
  234. font-size: 24rpx;
  235. color: #475669;
  236. letter-spacing: 2rpx;
  237. line-height: 26rpx;
  238. }
  239. .transaction {
  240. position: relative;
  241. height:280rpx;
  242. }
  243. .reportForm {
  244. background: #fff;
  245. }
  246. .toTransaction {
  247. width: 92%;
  248. height: 87rpx;
  249. display: flex;
  250. justify-content: space-between;
  251. padding: 0 4% 20rpx;
  252. line-height: 87rpx;
  253. background: #fff;
  254. }
  255. .toTransaction>view:nth-child(1) text {
  256. font-size: 30rpx;
  257. color: #000;
  258. letter-spacing: 1.16rpx;
  259. }
  260. .toTransaction>view:nth-child(2) {
  261. font-size: 28rpx;
  262. color: #919191;
  263. text-align: right;
  264. }
  265. .reportForm {
  266. position: relative;
  267. width: 100%;
  268. height: 245rpx;
  269. }
  270. .Fill {
  271. color: #fff;
  272. background: #fff;
  273. }
  274. .jiaoyi {
  275. position: relative;
  276. z-index: 1;
  277. width: 710rpx;
  278. margin: 0 auto;
  279. border-radius: 16rpx;
  280. margin-top: 30rpx;
  281. overflow: hidden;
  282. margin-bottom: 30rpx;
  283. background:#fff;
  284. padding-bottom: 30rpx;
  285. box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.05);
  286. }
  287. .swiper_container {
  288. position: relative;
  289. z-index: 100;
  290. height: 80rpx;
  291. line-height: 80rpx;
  292. width: 100%;
  293. }
  294. .swiper_item {
  295. position: relative;
  296. z-index: 1000;
  297. font-size: 28rpx;
  298. overflow: hidden;
  299. text-overflow: ellipsis;
  300. white-space: nowrap;
  301. letter-spacing: 2px;
  302. color: #fff;
  303. }
  304. .swiper_item text {
  305. display: inline-block;
  306. text-align: left;
  307. }
  308. .title {
  309. height: 80rpx;
  310. line-height: 80rpx;
  311. text-indent: 0.5em;
  312. font-size: 28rpx;
  313. color: #fff;
  314. background: #52a0fd;
  315. }
  316. .number {
  317. color: red;
  318. }
  319. .message {
  320. position: absolute;
  321. z-index: 1000;
  322. left: 20rpx;
  323. top: 0;
  324. bottom: 0;
  325. margin: auto;
  326. width: 40rpx;
  327. height: 40rpx;
  328. }
  329. .message text {
  330. font-size: 26rpx;
  331. display: block;
  332. height: 40rpx;
  333. line-height: 36rpx;
  334. width: 100%;
  335. text-align: center !important;
  336. position: relative;
  337. z-index: 10;
  338. text-indent: 0 !important;
  339. color: #FFF;
  340. }
  341. .message image {
  342. position: absolute��important;
  343. z-index: 1;
  344. top: 0;
  345. left: 0;
  346. bottom: 0;
  347. right: 0;
  348. margin: auto;
  349. }
  350. .state1 {
  351. color: red !important;
  352. margin-left: 80rpx;
  353. margin-right: 10rpx;
  354. }
  355. .state2 {
  356. color: #ffce00 !important;
  357. margin-left: 80rpx;
  358. margin-right: 10rpx;
  359. }
  360. .billtype {
  361. margin-right: 10rpx;
  362. }
  363. .nothave{
  364. text-align: center;
  365. color: #afd9eb;
  366. font-size: 30rpx;
  367. margin-top: 15rpx;
  368. }
  369. .nothave1{
  370. font-size: 30rpx;
  371. color: #ffc3c2;
  372. text-align: center;
  373. margin-top: 15rpx;
  374. }
  375. .nothave2{
  376. font-size: 30rpx;
  377. color: #FFCE00;
  378. text-align: center;
  379. margin-top: 15rpx;
  380. }
  381. .container{
  382. width: 100%;
  383. height: 240rpx;
  384. position: relative;
  385. }
  386. #mychart-pament {
  387. position: absolute;
  388. top: 0;
  389. height: 100%;
  390. left: 0;
  391. right: 0;
  392. }
  393. /* .fix{
  394. position: fixed;
  395. top: 0;
  396. left: 0;
  397. right: 0;
  398. z-index: 10;
  399. } */
  400. .jiaoyi2{
  401. /* margin-top: 333rpx; */
  402. position: relative;
  403. z-index: 1;
  404. }