Sin descripción

fund_h5_api.css 9.5KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549
  1. html {
  2. font-size: 100px;
  3. background-color: #F2F2F2;
  4. }
  5. nav {
  6. font-size: 0rem;
  7. height: 0.44rem;
  8. width: 100%;
  9. background-color: #5d7dff;
  10. position: fixed;
  11. top: 0;
  12. }
  13. nav i {
  14. /*display: inline-block;
  15. width: 0.16rem;
  16. height: 0.16rem;
  17. line-height: 0.44rem;
  18. margin-left: 0.1rem;
  19. background-image: url(../img/back.png);
  20. background-repeat: no-repeat;
  21. background-size: 100% auto;*/
  22. display: inline-block;
  23. width: 0.16rem;
  24. height: 0.16rem;
  25. line-height: 0.44rem;
  26. background-image: url(../img/back.png);
  27. background-repeat: no-repeat;
  28. background-size: 100% auto;
  29. position: absolute;
  30. top: 0;
  31. bottom: 0;
  32. margin: auto;
  33. margin-left: 0.1rem;
  34. }
  35. nav .qiehuan{
  36. font-size: 0.13rem;
  37. padding-right: 0.13rem;
  38. float: right;
  39. line-height: 0.44rem;
  40. color: #fff;
  41. }
  42. nav .qiehuan a{
  43. color: #FFFFFF;
  44. }
  45. nav p {
  46. /*display: inline-block;
  47. width: 90%;
  48. text-align: center;
  49. line-height: 0.44rem;
  50. color: #fff;
  51. font-size: 0.17rem;*/
  52. display: inline-block;
  53. text-align: center;
  54. line-height: 0.44rem;
  55. color: #fff;
  56. font-size: 0.17rem;
  57. position: absolute;
  58. left: 0;
  59. right: 0;
  60. margin: auto;
  61. width: 55%;
  62. }
  63. nav p em{
  64. border: 0.08rem solid transparent;
  65. border-top: 0.08rem solid #fff;
  66. width: 0;
  67. height: 0;
  68. position: relative;
  69. top: 0.15rem;
  70. right: 0;
  71. margin-left: 0.06rem;
  72. }
  73. nav p span{
  74. display: inline-block;
  75. max-width: 81%;
  76. height: 0.44rem;
  77. white-space: nowrap;
  78. overflow: hidden;
  79. text-overflow: ellipsis;
  80. }
  81. .container {
  82. width: 100%;
  83. height: 100%;
  84. /*background-image: url(../img/bg_blue.png);*/
  85. background-repeat: no-repeat;
  86. background-size: 100% auto;
  87. margin-top: 0.44rem;
  88. padding-top: 1px;
  89. }
  90. .header-wrapper {
  91. width: 100%;
  92. height: 0.32rem;
  93. }
  94. .choose-city {
  95. width: 100%;
  96. margin-top: 0.08rem;
  97. font-size: 0;
  98. }
  99. .location {
  100. display: inline-block;
  101. background-image: url(../img/location1.png);
  102. background-size: 100%;
  103. width: 0.26rem;
  104. height: 0.26rem;
  105. margin-left: 0.10rem;
  106. }
  107. .city-name {
  108. margin-left: 0.04rem;
  109. font-size: 0.14rem;
  110. color: #fff;
  111. }
  112. .login-wrapper {
  113. font-size: 0;
  114. background-color: #fff;
  115. /*margin: 0 0.10rem 0.12rem;*/
  116. border-radius: 4px;
  117. overflow: hidden;
  118. }
  119. .tab-tab-wrapper {
  120. font-size: 0;
  121. }
  122. .tab-tab {
  123. display: inline-block;
  124. font-size: 0.16rem;
  125. width: 50%;
  126. margin: 0.16rem 0;
  127. margin-bottom: 0.06rem;
  128. color: #666;
  129. text-align: center;
  130. }
  131. .tab-tab-active {
  132. font-weight: bold;
  133. color: #222;
  134. }
  135. .hr-active {
  136. display: inline-block;
  137. width: 0.16rem;
  138. height: 0.03rem;
  139. margin-top: 0.14rem;
  140. }
  141. .tab-tab-active .hr-active {
  142. background-color: #5d7dff;
  143. margin-top: 0.14rem;
  144. }
  145. .tab-tab-active .tab-title{
  146. color: #5D7DFF;
  147. }
  148. .tab-content-wrapper {
  149. margin: 0 0.20rem;
  150. }
  151. .input-wrapper {
  152. border-bottom: 0.5px solid #d8d8d8;
  153. padding-bottom: 0.14rem;
  154. padding-top: 0.26rem;
  155. font-size: 0;
  156. }
  157. .input-wrapper:last-of-type{
  158. border-bottom: none;
  159. }
  160. .input-wrapper label {
  161. display: inline-block;
  162. width: 0.90rem;
  163. font-size: 0.16rem;
  164. color: #222;
  165. text-align:justify;
  166. }
  167. .input-wrapper input {
  168. color: #222;
  169. font-size: 0.16rem;
  170. border: none;
  171. outline: none;
  172. width: 2rem;
  173. }
  174. .input-wrapper input::-webkit-input-placeholder{
  175. color: #aaa;
  176. }
  177. .agreement-wrapper {
  178. margin-top: 0.1rem;
  179. color: #888;
  180. font-size: 0.12rem;
  181. margin-left: 0.2rem;
  182. }
  183. .check {
  184. vertical-align: text-bottom;
  185. display: inline-block;
  186. width: 0.16rem;
  187. height: 0.16rem;
  188. margin-right: 0.06rem;
  189. background-image: url(../img/check_fale.png);
  190. background-size: 100%;
  191. }
  192. .check-active {
  193. background-image: url(../img/check_true.png);
  194. }
  195. .agreement-wrapper a {
  196. color: #5d7dff;
  197. }
  198. .button-wrapper {
  199. margin: 0.36rem 0;
  200. text-align: center;
  201. font-size: 0.15rem;
  202. }
  203. .button-wrapper input {
  204. width: 3rem;
  205. height: 0.4rem;
  206. border: none;
  207. outline: none;
  208. color: #fff;
  209. border-radius: 0.2rem;
  210. font-size: 0.2rem;
  211. }
  212. .disable-commit {
  213. background-color: #ccc;
  214. }
  215. .enable-commit {
  216. background-color: #5d7dff;
  217. box-shadow: 0 0 6px 0 rgba(93, 125, 255, 0.7);
  218. -webkit-box-shadow: 0 0 6px 0 rgba(93, 125, 255, 0.7);
  219. }
  220. .tips {
  221. margin: 0.12rem 0.10rem 0;
  222. }
  223. .tips p {
  224. font-size: 0.12rem;
  225. color: #888;
  226. line-height: 0.16rem;
  227. }
  228. .mask {
  229. position: absolute;
  230. top: 0;
  231. right: 0;
  232. width: 100%;
  233. height: 100%;
  234. background-color: rgba(0, 0, 0, 0.5);
  235. }
  236. .dialog-wrapper {
  237. width: 2.9rem;
  238. /* height: 2.38rem; */
  239. text-align: center;
  240. margin: auto;
  241. margin-top: 1.50rem;
  242. background-color: #fff;
  243. font-size: 0;
  244. padding-bottom: 0.14rem;
  245. border-radius: 0.12rem;
  246. }
  247. .dialog-wrapper img {
  248. height: 0.60rem;
  249. width: auto;
  250. margin-top: 0.30rem;
  251. margin-bottom: 0.20rem;
  252. }
  253. .dialog-wrapper p {
  254. line-height: 0.20rem;
  255. font-size: 0.14rem;
  256. color: #888;
  257. padding: 0 0.15rem;
  258. text-align: left;
  259. }
  260. .dialog-wrapper input{
  261. margin-top: 0.14rem;
  262. padding-top: 0.16rem;
  263. width: 100%;
  264. border: none;
  265. border-radius: 0;
  266. border-top: 0.01rem solid #D8D8D8;
  267. outline: none;
  268. color: #5D7DFF;
  269. font-size: 0.18rem;
  270. background: transparent;
  271. }
  272. .alert-info {
  273. position: absolute;
  274. top: 1.74rem;
  275. right: 0;
  276. left: 0;
  277. bottom: 0;
  278. text-align: center;
  279. z-index: 99;
  280. }
  281. .alert-info p {
  282. display: inline-block;
  283. height: 0.38rem;
  284. color: #fff;
  285. font-size: 0.14rem;
  286. line-height: 0.38rem;
  287. padding: 0 0.10rem;
  288. background-color: rgba(0, 0, 0, 0.7);
  289. border-radius: 5px;
  290. }
  291. .loading-wrapper {
  292. width: 100%;
  293. height: 100%;
  294. }
  295. .loading-wrapper img {
  296. position: absolute;
  297. top: 1.68rem;
  298. left: 50%;
  299. transform: translateX(-50%);
  300. clip: rect(0px, 400px, 120px, 0px);
  301. height: 2.04rem;
  302. width: auto;
  303. }
  304. .loading-wrapper p {
  305. position: absolute;
  306. top: 3.72rem;
  307. color: #222;
  308. font-size: 0.14rem;
  309. display: block;
  310. left: 50%;
  311. transform: translateX(-50%);
  312. }
  313. .process {
  314. font-size: 0.17rem;
  315. font-weight: bold;
  316. }
  317. .bg-white {
  318. background-color: #fff;
  319. }
  320. /*酷炫*/
  321. .inputForget{
  322. position: relative;
  323. }
  324. .inputForget .forget{
  325. position: absolute;
  326. top: 0.25rem;
  327. line-height: 0.20rem;
  328. font-size: .12rem;
  329. right: 0;
  330. color: #5D7DFF;
  331. padding-left: 0.11rem;
  332. border-left: 0.01rem solid #D8D8D8;
  333. }
  334. .tishi{
  335. font-size: 0.18rem;
  336. color: #444444;
  337. line-height: 0.25rem;
  338. padding: 0.17rem;
  339. }
  340. .obtainPwd {
  341. text-align: center;
  342. color: #999999;
  343. font-size: 0.12rem;
  344. line-height: 0.17rem;
  345. margin: 0.12rem 0;
  346. }
  347. .obtainPwd a{
  348. color: #5D7DFF;
  349. font-size: 0.15rem;
  350. }
  351. /*贷款推荐位*/
  352. /*.loan_recommendation{
  353. padding-top: 0.1rem;
  354. }
  355. .loan_recommendation .bannerTop{
  356. color: #FF9759;
  357. font-size: 0.1rem;
  358. line-height: 0.14rem;
  359. text-align: center;
  360. }
  361. .loan_recommendation .bannerTop span{
  362. position: relative;
  363. }
  364. .loan_recommendation .bannerTop span:after,.loan_recommendation .bannerTop span:before{
  365. content: "";
  366. display: inline-block;
  367. width: 0.2rem;
  368. height: 0.005rem;
  369. background: #888888;
  370. position: absolute;
  371. }
  372. .loan_recommendation .bannerTop span:after{
  373. right: -0.26rem;
  374. top: 0;
  375. bottom: 0;
  376. margin: auto;
  377. }
  378. .loan_recommendation .bannerTop span:before{
  379. left: -0.26rem;
  380. top: 0;
  381. bottom: 0;
  382. margin: auto;
  383. }*/
  384. /*swiper*/
  385. /*.swiper-container {
  386. width: 100%;
  387. margin-top: 0.15rem;
  388. }
  389. .swiper-slide .mySwiper{
  390. font-size: 18px;
  391. background: #fff;
  392. display: -webkit-box;
  393. display: -ms-flexbox;
  394. display: -webkit-flex;
  395. display: flex;
  396. align-items: center;
  397. justify-content: space-between;
  398. }
  399. .swiper-container{
  400. height: 1.2rem;
  401. }
  402. .swiper-wrapper{
  403. z-index: 20 !important;
  404. }
  405. .swiper-slide-active .mySwiper{
  406. width: 3rem;
  407. margin: auto;
  408. border-radius: 0.16rem;
  409. height: 0.86rem !important;
  410. box-shadow: 0 0.04rem 0.02rem rgba(137,160,255,0.24);
  411. }
  412. .swiper-slide-prev{
  413. height: 0.7rem !important;
  414. right: -0.22rem ;
  415. top: 0.08rem;
  416. border-radius: 0.11rem;
  417. }
  418. .swiper-slide-next{
  419. height: 0.7rem !important;
  420. left: -0.22rem;
  421. top: 0.08rem;
  422. border-radius: 0.11rem;
  423. }
  424. .swiper-slide-prev .mySwiper,.swiper-slide-next .mySwiper{
  425. border-radius: 0.11rem;
  426. height: 100%;
  427. }
  428. .swiper-pagination-bullet{
  429. width: 0.14rem !important;
  430. height: 0.07rem !important;
  431. background: #FFFFFF !important;
  432. border-radius: 0.04rem !important;
  433. opacity:1 !important;
  434. }
  435. .swiper-pagination-bullet-active{
  436. background: #A1B3FF !important;
  437. }
  438. .swiper-container-horizontal>.swiper-pagination-bullets{
  439. bottom: 0rem !important;
  440. }
  441. .swiper-slide .img{
  442. width: 0.45rem;
  443. height: 0.45rem;
  444. margin-left: 0.12rem;
  445. }
  446. .swiper-slide .con h3{
  447. font-size: 0.14rem;
  448. color: #333333;
  449. line-height: 0.2rem;
  450. }
  451. .swiper-slide .con p{
  452. width: 1.5rem;
  453. font-size: 0.12rem;
  454. line-height: 0.17rem;
  455. color: #888888;
  456. overflow: hidden;
  457. text-overflow:ellipsis;
  458. white-space: nowrap;
  459. }
  460. .swiper-slide .button{
  461. width: 0.64rem;
  462. height: 0.18rem;
  463. border-radius: 0.09rem;
  464. border: 0.01rem solid #404CF8;
  465. color: #4158FA;
  466. font-size: 0.1rem;
  467. background: #ffffff;
  468. margin-right: 0.1rem;
  469. text-align: center;
  470. line-height: 0.18rem;
  471. }*/
  472. .loan_recommendation .data{
  473. font-size: 0.12rem;
  474. line-height: 0.16rem;
  475. color: #747474;
  476. vertical-align: middle;
  477. margin-top: 0.35rem;
  478. text-align: center;
  479. }
  480. .loan_recommendation .data icon{
  481. display: inline-block;
  482. width: 0.11rem;
  483. height: 0.14rem;
  484. background: url(../img/security.png) no-repeat;
  485. background-size:100% ;
  486. margin-right: 0.05rem;
  487. vertical-align: middle;
  488. }
  489. .loan_recommendation{
  490. padding-top: 0.1rem;
  491. }
  492. .mySwiper{
  493. width: 100%;
  494. height: 0.8rem;
  495. }
  496. .mySwiper img{
  497. width: 100%;
  498. }