insurance.css 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389
  1. #app{
  2. width: 1920px!important;
  3. height: 1080px!important;
  4. background-size: 100% 100%;
  5. background-image: url(../images/insurance-bg.png);
  6. }
  7. .btn.focus,
  8. .btn:focus,
  9. .btn:hover {
  10. color: #fff
  11. }
  12. .btn-default.active,
  13. .btn-default:active,
  14. .btn-default:focus,
  15. .btn-default:hover,
  16. .open .dropdown-toggle.btn-default {
  17. background-color: #009DFE;
  18. border-color: #009DFE;
  19. }
  20. .btn-default:hover,
  21. .btn-default.active:hover {
  22. color: #fff;
  23. background-color: #009DFE;
  24. border-color: #009DFE;
  25. }
  26. .btn-default {
  27. background: #051829;
  28. border-color: #009DFE;
  29. color: #009DFE;
  30. }
  31. .btn.focus,
  32. .btn:focus,
  33. .btn:hover {
  34. color: #fff
  35. }
  36. .text-right{
  37. text-align: right;
  38. }
  39. .mb-20{
  40. margin-bottom: 20px;
  41. }
  42. .mt-20{
  43. margin-top: 20px;
  44. }
  45. .w-210{
  46. width: 210px;
  47. }
  48. .w-120{
  49. width: 120px;
  50. }
  51. .w-110{
  52. width: 110px;
  53. }
  54. .div-header {
  55. background: url(../images/yibao-header-bg.png) no-repeat;
  56. width: 10rem;
  57. height: 0.39rem;
  58. background-size: 10rem 0.39rem;
  59. z-index: 50;
  60. position: relative;
  61. top: 0;
  62. }
  63. .div-title {
  64. height: 0.271rem;
  65. line-height: 0.271rem;
  66. text-align: center;
  67. font-size: .104167rem;
  68. color: #fff;
  69. width: 1.453125rem;
  70. background: url(../images/dashujuyingyongfuwupingtai.png) no-repeat;
  71. background-size: 100% 100%;
  72. position: relative;
  73. z-index: 99;
  74. cursor: pointer;
  75. }
  76. .div-skip {
  77. width: 0;
  78. height: 0;
  79. opacity: 0;
  80. overflow: hidden;
  81. background-image: url("../images/tc1.png");
  82. background-size: 100% 100%;
  83. position: fixed;
  84. top: 0.271rem;
  85. z-index: 5;
  86. transition: all .5s cubic-bezier(0.68, -0.55, 0.27, 1.55)
  87. }
  88. .div-skip-active {
  89. height: .9375rem;
  90. opacity: 1;
  91. top: 0.35rem;
  92. /*margin-left: 0.1rem;*/
  93. width: 1.458333rem;
  94. }
  95. .div-skip div {
  96. height: .3125rem;
  97. line-height: .3125rem;
  98. color: rgb(179, 223, 251);
  99. text-align: center;
  100. font-size: 0.1rem;
  101. }
  102. .div-skip div a{
  103. color: rgba(213, 230, 255)
  104. }
  105. .div-skip div a:hover {
  106. color:rgb(4, 128, 211);
  107. }
  108. .sanjiao {
  109. position: absolute;
  110. left: 0;
  111. right: 0;
  112. top: 0;
  113. bottom: 0;
  114. width: 100%;
  115. height: 100%;
  116. opacity: 0;
  117. cursor: pointer;
  118. }
  119. .sanjiao:checked~img {
  120. transform: rotate(180deg)
  121. }
  122. #app>.left{
  123. width: 444px;
  124. margin: 0 20px 0 20px;
  125. height: 500px;
  126. float: left;
  127. }
  128. #app>.middle{
  129. width: 950px;
  130. float: left;
  131. height: 500px;
  132. color: rgba(213, 230, 255);
  133. }
  134. #app>.right{
  135. width: 444px;
  136. margin-right: 16px;
  137. /* background-color: #f00; */
  138. height: 500px;
  139. float: right;
  140. }
  141. #app>.left>.chart{
  142. width: 444px;
  143. height: 317px;
  144. background-size: 100% 100%;
  145. background-image: url(../images/mjzrcdibu-1.png);
  146. position: relative;
  147. }
  148. #app>.middle{
  149. width: 950px;
  150. height: 983px;
  151. background-size: 100% 100%;
  152. background-image: url(../images/middle-bg.png);
  153. position: relative;
  154. }
  155. .dropdown-menu {
  156. background: rgba(5,31,51, 0.6);
  157. border: 1px solid #009dfe;
  158. }
  159. .open .dropdown-toggle.btn-default {
  160. background-color: #009DFE;
  161. border-color: #009DFE;
  162. }
  163. .Mapselect {
  164. position: absolute;
  165. top: .114583rem;
  166. width: .677083rem;
  167. left: 0.46875rem;
  168. }
  169. .diqu-label{
  170. position: absolute;
  171. top: 0.135rem;
  172. left: -0.21rem;
  173. font-size: 0.073rem;
  174. }
  175. .el-cascader,.el-date-editor--month{
  176. margin-top: 15px;
  177. height: 34px;line-height: 34px;
  178. }
  179. .el-input--suffix{
  180. height: 34px;line-height: 34px;
  181. }
  182. .el-input__inner {
  183. background-color:transparent;
  184. background: url(../images/mjzfwqktoubukuang.png) center center / 100% 100% no-repeat;
  185. height: 34px;
  186. padding: 6px 35px;
  187. color: rgba(213, 230, 255);
  188. border: solid 1px #009dfe;
  189. }
  190. .el-cascader__label{
  191. color: rgba(213, 230, 255);
  192. }
  193. #time{
  194. background: url(../images/mjzfwqktoubukuang.png) center center / 100% 100% no-repeat;
  195. height: 34px;
  196. padding: 6px 35px;
  197. margin-top: 0.1rem;
  198. width: 130px;
  199. border: none;
  200. }
  201. .pick-time{
  202. position: absolute;
  203. top: .114583rem;
  204. left: 1.46875rem;
  205. }
  206. .pick-time .caret{
  207. position: absolute;
  208. right: 20px;
  209. top: 35px;
  210. }
  211. #app>.middle>.shuju{
  212. width: 810px;margin:112px auto 0;
  213. }
  214. #app>.middle>.shuju>div{
  215. width: 237px;
  216. height: 98px;
  217. background-size: 100% 100%;
  218. }
  219. #app>.middle>.shuju>div p{
  220. text-align: center;width: 100%;
  221. }
  222. #app>.middle>.shuju>div p span{
  223. font-size: 36px;
  224. }
  225. #app>.middle>.shuju>div:nth-of-type(1){
  226. background-image: url(../images/shuju-1.png);
  227. color: #19e0f2;
  228. }
  229. #app>.middle>.shuju>div:nth-of-type(2){
  230. background-image: url(../images/shuju-2.png);
  231. color: #ffba11;
  232. }
  233. #app>.middle>.shuju>div:nth-of-type(3){
  234. background-image: url(../images/shuju-3.png);
  235. color: #f61d06;
  236. }
  237. #app>.middle>.map{
  238. height: 680px;
  239. position: relative;
  240. }
  241. .el-picker-panel{
  242. background-color: rgba(5,31,51, 0.6);
  243. border: none;
  244. /* color: #b5e1fc; */
  245. }
  246. .el-date-picker__header button,.el-date-picker__header span{
  247. color: rgba(213, 230, 255)!important;
  248. }
  249. .el-month-table td .cell{
  250. color: #b5e1fc;
  251. }
  252. .el-month-table .disabled a{
  253. background-color: transparent!important;
  254. }
  255. .el-year-table td .cell{
  256. color: #b5e1fc;
  257. }
  258. .el-year-table .disabled a{
  259. background-color: transparent!important;
  260. }
  261. .chart-legend{
  262. width: 444px;
  263. height: 317px;
  264. position: absolute;
  265. top: 0;
  266. left: 0;
  267. text-align: center;
  268. font-size: 14px;
  269. color: #b5e1fc;
  270. line-height: 28px;
  271. }
  272. .right .table1{
  273. width: 444px;
  274. height: 473px;
  275. position: relative;
  276. margin-top: 58px;
  277. }
  278. .right .table2{
  279. width: 444px;
  280. height: 380px;
  281. position: relative;
  282. margin-top: 30px;
  283. }
  284. .right .boxTitle {
  285. width: 100%;
  286. background: url(../images/icon_biaoti.png) no-repeat;
  287. background-size: 100% 100%;
  288. height: .260417rem;
  289. color: #fff;
  290. font-weight: bold;
  291. line-height: 0.198rem;
  292. font-size: 0.104rem;
  293. position: absolute;
  294. top: -0.4375rem;
  295. left: -0.1302rem;
  296. }
  297. .right thead{
  298. height: 40px;
  299. line-height: 40px;
  300. color: #b5e1fc;
  301. font-size: 16px;
  302. background-size: 100% 100%;
  303. background-image: url("../images/mjzfwqktoubukuang.png");
  304. }
  305. .right thead th{
  306. font-weight: 200;
  307. box-sizing: border-box;
  308. padding-left: 15px;
  309. padding-right: 15px;
  310. border-right: 1px solid #009DFE;
  311. }
  312. .right .tbody{
  313. overflow-y:scroll;
  314. height: 380px;
  315. display: block;
  316. box-sizing: border-box;
  317. width: 444px;
  318. }
  319. .right tbody tr:nth-of-type(1) td{
  320. border-top: none;
  321. }
  322. .right tbody td{
  323. background-color: #041829;
  324. font-size: 14px;
  325. color: #b5e1fc;
  326. box-sizing: border-box;
  327. height: 40px;
  328. border: solid 1px #009dfe;
  329. line-height: 20px;
  330. padding: 10px 15px;
  331. }
  332. .right tbody td:nth-of-type(3){
  333. padding-left: 0;
  334. }
  335. .el-cascader-menu{
  336. background-color: rgba(5,31,51, 0.6);
  337. }
  338. .el-cascader-menus{
  339. border: solid 1px #009dfe;background-color: transparent;
  340. }
  341. .el-cascader-menu__item{
  342. color: rgba(213, 230, 255);
  343. }
  344. .el-cascader-menu__item:hover{
  345. background-color: #f5f5f5;
  346. color: rgba(5,31,51, 0.6);;
  347. }
  348. .chart-no-data{
  349. text-align: center;color: #b5e1fc;
  350. }
  351. .chart-no-data p{
  352. font-size: .083333rem;padding-top: .052083rem;font-weight: bold;
  353. }
  354. .chart-no-data img{
  355. display: block;margin: .408333rem auto .078125rem;
  356. }
  357. .div-mask-layer{
  358. width: 100%;height: 1080px;background: black;opacity: 0.5;position: absolute;z-index: 200;overflow: hidden;
  359. }
  360. .ibox-content{
  361. position: absolute;top:50%;margin-top: -117.5px;background-color: transparent;left: 50%;margin-left: -45px;border: 0;
  362. }
  363. .tableNoData{
  364. height: 317px;border: 1px solid #009dfe;
  365. width: 441px;
  366. }
  367. .tableNoData .chart-no-data img{
  368. margin-top: 0;
  369. }
  370. .set_all_city{
  371. top: .10833rem;
  372. }
  373. #full{
  374. position:absolute;
  375. display: block;
  376. right: 23px;
  377. top: 27px;
  378. width: 36px;
  379. height: 60px;
  380. /* background-color: #f00; */
  381. z-index: 999;
  382. cursor:pointer
  383. }