fanwe_ui.css 32 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182
  1. @CHARSET "UTF-8";
  2. /*······按钮·······*/
  3. button.btn{
  4. border: 0;
  5. }
  6. /*----------------弹框----------------*/
  7. .marker.active{
  8. display: block;
  9. position: fixed;
  10. z-index:100000;
  11. left: 0;
  12. top: 0;
  13. width: 100%;
  14. height: 100%;
  15. background-color: transparent;
  16. background-color: rgba(0, 0, 0, 0.5);
  17. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#000000, endColorstr=#000000);
  18. -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#000,endColorstr=#000)";
  19. }
  20. .marker{
  21. display: none;
  22. }
  23. .marker .warp{
  24. position: relative;
  25. }
  26. .markerbox{
  27. position: absolute;
  28. top:-2220px;
  29. left:415px;
  30. width: 370px;
  31. min-height: 100px;
  32. background: #fff;
  33. transition: all 0.5s;
  34. -moz-transition: all 0.5s;
  35. -webkit-transition: all 0.5s;
  36. -o-transition: all 0.5s;
  37. }
  38. .marker.active .markerbox{
  39. position: absolute;
  40. top:20px;
  41. transition: all 0.5s;
  42. -moz-transition: all 0.5s;
  43. -webkit-transition: all 0.5s;
  44. -o-transition: all 0.5s;
  45. }
  46. .marker .markercon{
  47. padding: 35px 20px;
  48. text-align: center;
  49. }
  50. .marker .markercon p{
  51. line-height: 30px;
  52. font-size: 15px;
  53. }
  54. .marker .markercon .ml1{
  55. font-weight: bold;
  56. padding-bottom: 10px;
  57. }
  58. .marker .markercon .ml2{
  59. font-weight: bold;
  60. }
  61. .marker .markercon .btn{
  62. margin: 0 5px;
  63. margin-top: 20px;
  64. min-width: 120px;
  65. }
  66. .marker .zclose{
  67. position: absolute;
  68. right: -8px;
  69. top: -15px;
  70. color: #e47470;
  71. line-height: 1;
  72. }
  73. .marker .zclose i{
  74. font-size:34px;
  75. }
  76. /*-----------------多选框--------------*/
  77. .checkbox{
  78. display: inline-block;
  79. width: 16px;
  80. height: 16px;
  81. border: 1px solid #ddd;
  82. -webkit-border-radius: 2px;
  83. -moz-border-radius: 2px;
  84. border-radius: 2px;
  85. background-color: #FFF;
  86. position: relative;
  87. cursor: pointer;
  88. }
  89. .checkbox input{
  90. width: 100%;
  91. height: 100%;
  92. position: absolute;
  93. left: 0;
  94. top: 0;
  95. opacity: 0;
  96. z-index: 2;
  97. cursor: pointer;
  98. }
  99. .checkbox i{
  100. width: 100%;
  101. height: 100%;
  102. line-height: 100%;
  103. text-align: center;
  104. position: absolute;
  105. left: 0;
  106. top: 0;
  107. z-index: 1;
  108. font-size: 12px;
  109. color: #e47470;
  110. opacity: 0;
  111. transform:scale(0);
  112. }
  113. .checkbox.checked i{
  114. opacity: 1;
  115. transform:scale(1);
  116. }
  117. .checkbox i::before{
  118. content: "\e62d";
  119. }
  120. /*········下拉框···········*/
  121. .selectbox {
  122. padding: 11px 0;
  123. border: 1px solid #ddd;
  124. -webkit-border-radius: 2px;
  125. -moz-border-radius: 2px;
  126. border-radius: 2px;
  127. background-color: #FFF;
  128. position: relative;
  129. width: 145px;
  130. }
  131. .selectbox select{
  132. border:0;
  133. height: 20px;
  134. line-height: 20px;
  135. width: 100%;
  136. }
  137. .selectbox select:focus{
  138. border:0;
  139. }
  140. .dropdown{
  141. width: 135px;
  142. height: 40px;
  143. border: 1px solid #ddd;
  144. -webkit-border-radius: 2px;
  145. -moz-border-radius: 2px;
  146. border-radius: 2px;
  147. background-color: #FFF;
  148. position: relative;
  149. }
  150. .dropdown i.iconfont.xia:before{
  151. content: "\e60c";
  152. }
  153. .dropdown i.iconfont.xia{
  154. position: absolute;
  155. top: 12px;
  156. font-size: 15px;
  157. right:8px;
  158. transition: all 0.3s ease-in-out 0s;
  159. -moz-transition: all 0.3s ease-in-out 0s;
  160. -webkit-transition: all 0.3s ease-in-out 0s;
  161. -o-transition: all 0.3s ease-in-out 0s;
  162. }
  163. .dropdown.focus i.iconfont.xia{
  164. transform: rotate(-180deg);
  165. -ms-transform: rotate(-180deg);
  166. -webkit-transform: rotate(-180deg);
  167. -o-transform: rotate(-180deg);
  168. -moz-transform: rotate(-180deg);
  169. }
  170. .dropdown.focus{
  171. outline: 3px auto #90b2e9;
  172. -webkit-box-shadow:0 0 6px #90b2e9;
  173. -moz-box-shadow:0 0 6px #90b2e9;
  174. box-shadow:0 0 6px #90b2e9;
  175. webkit-transition: border .2s cubic-bezier(0.645, 0.045, 0.355, 1), background .2s cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow .2s cubic-bezier(0.645, 0.045, 0.355, 1);
  176. transition: border .2s cubic-bezier(0.645, 0.045, 0.355, 1), background .2s cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow .2s cubic-bezier(0.645, 0.045, 0.355, 1);
  177. }
  178. .dropdown span{
  179. display: block;
  180. line-height: 40px;
  181. padding:0 10px ;
  182. text-align: left;
  183. cursor: pointer;
  184. }
  185. .dropdown ul{
  186. display: none;
  187. position: absolute;
  188. border: 1px solid #ddd;
  189. -webkit-border-radius: 2px;
  190. -moz-border-radius: 2px;
  191. border-radius: 2px;
  192. background-color: #FFF;
  193. min-width: 135px;
  194. z-index: 99;
  195. top: 42px;
  196. left: 0;
  197. padding:5px 0;
  198. /* max-height: 400px;*/
  199. overflow-y:scroll;
  200. }
  201. .dropdown ul li{
  202. white-space:nowrap;
  203. }
  204. .dropdown ul li{
  205. cursor: pointer;
  206. display: block;
  207. line-height: 30px;
  208. text-align: left;
  209. width: 100%;
  210. padding: 0 8px;
  211. }
  212. .dropdown ul li:hover{
  213. background: #d5f1fd;
  214. }
  215. /*···开关switch·····*/
  216. .ui-switch{
  217. display: inline-block;
  218. width: 60px;
  219. height: 30px;
  220. line-height: 30px;
  221. position: relative;
  222. background: #bcbcbc;
  223. cursor: pointer;
  224. -webkit-border-radius: 15px;
  225. -moz-border-radius: 15px;
  226. border-radius: 15px;
  227. }
  228. .ui-switch.hover{
  229. background: #4cacdf;
  230. }
  231. .ui-switch.hover i.iconfont.yuan{
  232. left:32px;
  233. transition: all 0.3s ease-in-out 0s;
  234. -moz-transition: all 0.3s ease-in-out 0s;
  235. -webkit-transition: all 0.3s ease-in-out 0s;
  236. -o-transition: all 0.3s ease-in-out 0s;
  237. }
  238. .ui-switch i.iconfont.yuan{
  239. position: absolute;
  240. width:26px;
  241. height:26px;
  242. display: block;
  243. -webkit-border-radius: 50%;
  244. -moz-border-radius: 50%;
  245. border-radius: 50%;
  246. background: #fff;
  247. top:2px;
  248. left: 2px;
  249. font-size: 29px;
  250. color: #fff;
  251. transition: all 0.3s ease-in-out 0s;
  252. -moz-transition: all 0.3s ease-in-out 0s;
  253. -webkit-transition: all 0.3s ease-in-out 0s;
  254. -o-transition: all 0.3s ease-in-out 0s;
  255. }
  256. .ui-switch i.iconfont.yuan:before{
  257. content: "";
  258. }
  259. /*输入框*/
  260. .input-wrap {
  261. padding: 5px 10px;
  262. border: 1px solid #ddd;
  263. -webkit-border-radius: 2px;
  264. -moz-border-radius: 2px;
  265. border-radius: 2px;
  266. background-color: #FFF;
  267. position: relative;
  268. }
  269. .input-wrap span.holder-tip{
  270. position: absolute;
  271. left: 10px;
  272. top: 5px;
  273. color: #9a9a9a;
  274. line-height: 25px;
  275. }
  276. .input-wrap input.W-input{
  277. height: 25px;
  278. line-height: 25px;
  279. border: 0;
  280. box-shadow: none;
  281. float: left;
  282. }
  283. .input-wrap:after{
  284. content: "";
  285. display: block;
  286. clear: both;
  287. }
  288. .input-wrap textarea.W-input{
  289. height: 80px;
  290. }
  291. .input-wrap .W-input {
  292. border: 0;
  293. box-shadow: none;
  294. color: #222;
  295. width: 100%;
  296. outline:none;
  297. border-style: none;
  298. }
  299. .input-wrap i.iconfont{
  300. position: absolute;
  301. right: 5px;
  302. top: 0px;
  303. line-height: 35px;
  304. color: transparent;
  305. font-size: 16px;
  306. }
  307. .input-wrap.icon {
  308. padding-left: 40px;
  309. }
  310. .input-wrap.icon i.iconfont.left {
  311. left: 0;
  312. color: #a7a7a7;
  313. font-size: 22px;
  314. width: 40px;
  315. text-align: center;
  316. }
  317. .input-wrap.icon span.holder-tip {
  318. left: 40px;
  319. }
  320. /*选中效果*/
  321. .input-wrap.input-wrap-focus .W-input{
  322. color: #222;
  323. }
  324. .input-wrap.input-wrap-focus span.holder-tip{
  325. display: none;
  326. }
  327. .input-wrap.input-wrap-focus{
  328. border: 1px solid #90b2e9;
  329. outline: 1px auto #90b2e9;
  330. -webkit-box-shadow:0 0 3px #90b2e9;
  331. -moz-box-shadow:0 0 3px #90b2e9;
  332. box-shadow:0 0 3px #90b2e9;
  333. webkit-transition: border .2s cubic-bezier(0.645, 0.045, 0.355, 1), background .2s cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow .2s cubic-bezier(0.645, 0.045, 0.355, 1);
  334. transition: border .2s cubic-bezier(0.645, 0.045, 0.355, 1), background .2s cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow .2s cubic-bezier(0.645, 0.045, 0.355, 1);
  335. }
  336. /*成功*/
  337. .input-wrap.input-wrap-success i.iconfont{
  338. color: #87D068;
  339. }
  340. .input-wrap.input-wrap-success i.iconfont:before{
  341. content: "\e618";
  342. }
  343. /*报错*/
  344. .input-wrap.input-wrap-error{
  345. border: 1px solid #f50;
  346. -webkit-box-shadow:0 0 2px #ffddcc;
  347. -moz-box-shadow:0 0 2px #ffddcc;
  348. box-shadow:0 0 2px #ffddcc;
  349. webkit-transition: border .2s cubic-bezier(0.645, 0.045, 0.355, 1), background .2s cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow .2s cubic-bezier(0.645, 0.045, 0.355, 1);
  350. transition: border .2s cubic-bezier(0.645, 0.045, 0.355, 1), background .2s cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow .2s cubic-bezier(0.645, 0.045, 0.355, 1);
  351. }
  352. .input-wrap.input-wrap-error i.iconfont{
  353. color: #f50;
  354. }
  355. .input-wrap.input-wrap-error i.iconfont:before{
  356. content: "\e619";
  357. }
  358. .input-wrap.input-wrap-error .W-input{
  359. color: #f50;
  360. }
  361. /*···········提示框 ··········*/
  362. .m-tip{
  363. position: fixed;
  364. top: -50px;
  365. left: 0;
  366. width: 100%;
  367. z-index: 9999;
  368. }
  369. .m-tip.hover{
  370. top: 0;
  371. }
  372. .m-tip .wp{
  373. width: 1px;
  374. height: 0;
  375. margin: 0 auto;
  376. position: relative;
  377. }
  378. .m-tip .wp .tip{
  379. position: absolute;
  380. top: 0;
  381. left: -230px;
  382. min-width: 460px;
  383. height: 50px;
  384. background: #fff;
  385. border: 1px solid #ddd;
  386. border-radius: 5px;
  387. -moz-border-radius: 5px;
  388. -webkit-border-radius: 5px;
  389. text-align: center;
  390. -webkit-box-shadow: 0 2px 30px rgba(0,0,0,0.1);
  391. box-shadow: 0 2px 30px rgba(0,0,0,0.1);
  392. -webkit-transform: translate3d(0, -2px, 0);
  393. transform: translate3d(0, -2px, 0);
  394. }
  395. .m-tip .wp .tip span{
  396. line-height: 50px;
  397. font-size: 15px;
  398. display: inline-block;
  399. vertical-align: middle;
  400. }
  401. .m-tip .wp .tip i.iconfont{
  402. font-size: 30px;
  403. line-height: 50px;
  404. display: inline-block;
  405. vertical-align: middle;
  406. }
  407. .m-tip.success .wp .tip i.iconfont{
  408. color:#87D068;
  409. }
  410. .m-tip.success .wp .tip i.iconfont:before {
  411. content: "\e619";
  412. }
  413. .m-tip.fail .wp .tip i.iconfont{
  414. color: #c03231;
  415. }
  416. .m-tip.fail .wp .tip i.iconfont:before {
  417. content: "\e61a";
  418. }
  419. .m-tip.hint .wp .tip i.iconfont{
  420. color:#FF5500;
  421. }
  422. .m-tip.hint .wp .tip i.iconfont:before {
  423. content: "\e61b";
  424. }
  425. /* 日期获取控件 */
  426. .u-datepicker{
  427. display: inline-block;
  428. }
  429. .w500 .u-datepicker .input-wrap{
  430. width: 280px;
  431. }
  432. .u-datepicker .input-wrap{
  433. width: 120px;
  434. }
  435. .u-datepicker .input-wrap i.iconfont{
  436. color: #888;
  437. font-size: 20px;
  438. }
  439. .u-datepicker .input-wrap i.iconfont:before{
  440. content: "\e624";
  441. }
  442. .date_picker {
  443. width: 226px;
  444. background: #fefefe;
  445. border: 1px solid #bbb;
  446. font-size: 12px;
  447. color: #333;
  448. padding: 7px;
  449. border-radius: 3px;
  450. }
  451. .date_selector, .date_selector * {
  452. width: auto;
  453. height: auto;
  454. border: none;
  455. background: none;
  456. margin: 0;
  457. padding: 0;
  458. text-align: left;
  459. text-decoration: none;
  460. }.date_selector.foucs th, .date_selector.foucs td {
  461. height: 2em;
  462. transition: all 0.3s ease-in-out 0s;
  463. -moz-transition: all 0.3s ease-in-out 0s;
  464. -webkit-transition: all 0.3s ease-in-out 0s;
  465. -o-transition: all 0.3s ease-in-out 0s;
  466. }
  467. .date_selector {
  468. height:0px;
  469. padding: 0 10px;
  470. overflow: hidden;
  471. opacity:0;
  472. transform:translateY(-40px);
  473. -ms-transform:translateY(-40px);
  474. -moz-transform:translateY(-40px);
  475. -webkit-transform:translateY(-40px);
  476. -o-transform:translateY(-40px);
  477. transition: all 0.3s ease-in-out 0s;
  478. -moz-transition: all 0.3s ease-in-out 0s;
  479. -webkit-transition: all 0.3s ease-in-out 0s;
  480. -o-transition: all 0.3s ease-in-out 0s;
  481. top:37px;
  482. left: 0;
  483. background: #fbfbfb;
  484. margin: 0;
  485. margin-top: -1px;
  486. position: absolute;
  487. z-index: 100000;
  488. width: 278px;
  489. border-style: solid;
  490. border-width: 0px;
  491. border-color: transparent;
  492. }
  493. .date_selector.foucs{
  494. height: auto;
  495. padding: 10px;
  496. opacity: 1;
  497. border-radius: 3px;
  498. border: 1px solid #ccc;
  499. box-shadow: 0 0 5px #aaa;
  500. box-shadow: 0 2px 2px #ccc;
  501. transform:translateY(0px);
  502. -ms-transform:translateY(0px);
  503. -moz-transform:translateY(0px);
  504. -webkit-transform:translateY(0px);
  505. -o-transform:translateY(0px);
  506. transition: all 0.3s ease-in-out 0s;
  507. -moz-transition: all 0.3s ease-in-out 0s;
  508. -webkit-transition: all 0.3s ease-in-out 0s;
  509. -o-transition: all 0.3s ease-in-out 0s;
  510. }
  511. .date_selector_ieframe {
  512. position: absolute;
  513. z-index: 99999;
  514. display: none;
  515. }
  516. .date_selector .nav {
  517. width: 17.5em;
  518. }
  519. .date_selector .nav p {
  520. clear: none;
  521. }
  522. .date_selector .month_nav, .date_selector .year_nav {
  523. margin: 0 0 3px 0;
  524. padding: 0;
  525. display: block;
  526. position: relative;
  527. text-align: center;
  528. }
  529. .date_selector .month_nav {
  530. float: left;
  531. width: 55%;
  532. }
  533. .date_selector .year_nav {
  534. float: right;
  535. width: 42%;
  536. margin-right: -8px;
  537. }
  538. .date_selector .month_name, .date_selector .year_name {
  539. font-weight: bold;
  540. line-height: 20px;
  541. }
  542. .date_selector .button {
  543. display: block;
  544. position: absolute;
  545. top: 0;
  546. width: 18px;
  547. height: 18px;
  548. line-height: 16px;
  549. font-weight: bold;
  550. color: #5985c7;
  551. text-align: center;
  552. font-size: 12px;
  553. overflow: hidden;
  554. border: 1px solid #ccc;
  555. border-radius: 2px;
  556. }
  557. .date_selector .button:hover, .date_selector .button.hover {
  558. background: #5985c7;
  559. color: #fff;
  560. cursor: pointer;
  561. border-color: #3a930d;
  562. }
  563. .date_selector .prev {
  564. left: 0;
  565. }
  566. .date_selector .next {
  567. right: 0;
  568. }
  569. .date_selector table {
  570. border-spacing: 0;
  571. border-collapse: collapse;
  572. clear: both;
  573. margin: 0;
  574. width: 255px;
  575. }
  576. .date_selector th, .date_selector td {
  577. width: 2.5em;
  578. height: 1em;
  579. padding: 0 !important;
  580. text-align: center !important;
  581. color: #666;
  582. font-weight: normal;
  583. transition: all 0.3s ease-in-out 0s;
  584. -moz-transition: all 0.3s ease-in-out 0s;
  585. -webkit-transition: all 0.3s ease-in-out 0s;
  586. -o-transition: all 0.3s ease-in-out 0s;
  587. }
  588. .date_selector th {
  589. font-size: 12px;
  590. }
  591. .date_selector td {
  592. border: 1px solid #f1f1f1;
  593. line-height: 2em;
  594. text-align: center;
  595. white-space: nowrap;
  596. color: #5985c7;
  597. background: #fff;
  598. }
  599. .date_selector td.today {
  600. background: #eee;
  601. }
  602. .date_selector td.unselected_month {
  603. color: #ccc;
  604. }
  605. .date_selector td.selectable_day {
  606. cursor: pointer;
  607. }
  608. .date_selector td.selected {
  609. background: #2b579a;
  610. color: #fff;
  611. font-weight: bold;
  612. }
  613. .date_selector td.selectable_day:hover, .date_selector td.selectable_day.hover {
  614. background: #5985c7;
  615. color: #fff;
  616. }
  617. /*---------------------------------------日期获取控件 end--------------------------------------------*/
  618. /*········地区选择········*/
  619. .citychoose .input-wrap i.iconfont{
  620. position: absolute;
  621. top: 12px;
  622. font-size: 15px;
  623. right: 8px;
  624. color: #555;
  625. line-height: normal;
  626. }
  627. .citychoose .input-wrap.input-wrap-focus i.iconfont{
  628. transform: rotate(-180deg);
  629. -ms-transform: rotate(-180deg);
  630. -webkit-transform: rotate(-180deg);
  631. -o-transform: rotate(-180deg);
  632. -moz-transform: rotate(-180deg);
  633. }
  634. .citychoose .input-wrap i.iconfont:before {
  635. content: "\e61a";
  636. }
  637. .privinces,
  638. .citys,
  639. .countys {
  640. position: absolute;
  641. border: 1px solid #ddd;
  642. -webkit-border-radius: 2px;
  643. -moz-border-radius: 2px;
  644. border-radius: 2px;
  645. background-color: #FFF;
  646. min-width: 135px;
  647. max-width: 300px;
  648. z-index: 99;
  649. top: 42px;
  650. left: 0;
  651. padding:10px;
  652. /* max-height: 400px; */
  653. overflow-y: scroll;
  654. }
  655. .privinces .a,.citys .a,.countys .a {
  656. font-size: 13px; color: #333;
  657. text-decoration: none; display: block; float: left;
  658. *display: inline-block; _display: inline; zoom: 1; *float: none;
  659. padding: 3px 5px;
  660. }
  661. .privinces a:hover,.citys .a:hover,.countys .a:hover {
  662. background:#5985c7; color: #fff;
  663. }
  664. .hidden{
  665. display:none;
  666. }
  667. /*·····················下拉框····························*/
  668. .select2-container {
  669. min-width: 145px;
  670. box-sizing: border-box;
  671. display: inline-block;
  672. margin: 0;
  673. position: relative;
  674. vertical-align: middle; }
  675. .select2-container .select2-selection--single {
  676. box-sizing: border-box;
  677. cursor: pointer;
  678. display: block;
  679. height:37px;
  680. user-select: none;
  681. -webkit-user-select: none; }
  682. .select2-container .select2-selection--single .select2-selection__rendered {
  683. display: block;
  684. padding-left: 8px;
  685. padding-right: 20px;
  686. overflow: hidden;
  687. text-overflow: ellipsis;
  688. white-space: nowrap; }
  689. .select2-container .select2-selection--single .select2-selection__clear {
  690. position: relative; }
  691. .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
  692. padding-right: 8px;
  693. padding-left: 20px; }
  694. .select2-container .select2-selection--multiple {
  695. box-sizing: border-box;
  696. cursor: pointer;
  697. display: block;
  698. min-height: 37px;
  699. user-select: none;
  700. -webkit-user-select: none; }
  701. .select2-container .select2-selection--multiple .select2-selection__rendered {
  702. display: inline-block;
  703. overflow: hidden;
  704. padding-left: 8px;
  705. text-overflow: ellipsis;
  706. white-space: nowrap; }
  707. .select2-container .select2-search--inline {
  708. float: left; }
  709. .select2-container .select2-search--inline .select2-search__field {
  710. box-sizing: border-box;
  711. border: none;
  712. font-size: 100%;
  713. margin-top: 5px;
  714. padding: 0; }
  715. .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {
  716. -webkit-appearance: none; }
  717. .select2-dropdown {
  718. background-color: white;
  719. border: 1px solid #aaa;
  720. border-radius: 2px;
  721. box-sizing: border-box;
  722. display: block;
  723. position: absolute;
  724. left: -100000px;
  725. width: 100%;
  726. z-index: 1051; }
  727. .select2-results {
  728. display: block; }
  729. .select2-results__options {
  730. list-style: none;
  731. margin: 0;
  732. padding: 0; }
  733. .select2-results__option {
  734. padding: 6px;
  735. user-select: none;
  736. -webkit-user-select: none; }
  737. .select2-results__option[aria-selected] {
  738. cursor: pointer; }
  739. .select2-container--open .select2-dropdown {
  740. left: 0; }
  741. .select2-container--open .select2-dropdown--above {
  742. border-bottom: none;
  743. border-bottom-left-radius: 0;
  744. border-bottom-right-radius: 0; }
  745. .select2-container--open .select2-dropdown--below {
  746. border-top: none;
  747. border-top-left-radius: 0;
  748. border-top-right-radius: 0; }
  749. .select2-search--dropdown {
  750. display: block;
  751. padding: 2px; }
  752. .select2-search--dropdown .select2-search__field {
  753. padding: 2px;
  754. width: 100%;
  755. *width: 94%;
  756. box-sizing: border-box; }
  757. .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {
  758. -webkit-appearance: none; }
  759. .select2-search--dropdown.select2-search--hide {
  760. display: none; }
  761. .select2-close-mask {
  762. border: 0;
  763. margin: 0;
  764. padding: 0;
  765. display: block;
  766. position: fixed;
  767. left: 0;
  768. top: 0;
  769. min-height: 100%;
  770. min-width: 100%;
  771. height: auto;
  772. width: auto;
  773. opacity: 0;
  774. z-index: 99;
  775. background-color: #fff;
  776. filter: alpha(opacity=0); }
  777. .select2-hidden-accessible {
  778. border: 0 !important;
  779. clip: rect(0 0 0 0) !important;
  780. height: 1px !important;
  781. margin: -1px !important;
  782. overflow: hidden !important;
  783. padding: 0 !important;
  784. position: absolute !important;
  785. width: 1px !important; }
  786. .select2-container--default .select2-selection--single {
  787. background-color: #fff;
  788. border: 1px solid #ddd;
  789. border-radius: 2px; }
  790. .select2-container--default .select2-selection--single .select2-selection__rendered {
  791. color: #444;
  792. line-height: 35px; }
  793. .select2-container--default .select2-selection--single .select2-selection__clear {
  794. cursor: pointer;
  795. float: right;
  796. font-weight: bold; }
  797. .select2-container--default .select2-selection--single .select2-selection__placeholder {
  798. color: #999; }
  799. .select2-container--default .select2-selection--single .select2-selection__arrow {
  800. height: 35px;
  801. position: absolute;
  802. top: 1px;
  803. right: 1px;
  804. width: 20px; }
  805. .select2-container--default .select2-selection--single .select2-selection__arrow b {
  806. border-color: #888 transparent transparent transparent;
  807. border-style: solid;
  808. border-width: 5px 4px 0 4px;
  809. height: 0;
  810. left: 50%;
  811. margin-left: -2px;
  812. margin-top: -2px;
  813. position: absolute;
  814. top: 50%;
  815. width: 0; }
  816. .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear {
  817. float: left; }
  818. .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow {
  819. left: 1px;
  820. right: auto; }
  821. .select2-container--default.select2-container--disabled .select2-selection--single {
  822. background-color: #eee;
  823. cursor: default; }
  824. .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {
  825. display: none; }
  826. .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  827. border-color: transparent transparent #888 transparent;
  828. border-width: 0 4px 5px 4px; }
  829. .select2-container--default .select2-selection--multiple {
  830. background-color: white;
  831. border: 1px solid #ddd;
  832. border-radius: 2px;
  833. cursor: text; }
  834. .select2-container--default .select2-selection--multiple .select2-selection__rendered {
  835. box-sizing: border-box;
  836. list-style: none;
  837. margin: 0;
  838. padding: 0 5px;
  839. width: 100%; }
  840. .select2-container--default .select2-selection--multiple .select2-selection__placeholder {
  841. color: #999;
  842. margin-top: 5px;
  843. float: left; }
  844. .select2-container--default .select2-selection--multiple .select2-selection__clear {
  845. cursor: pointer;
  846. float: right;
  847. font-weight: bold;
  848. margin-top: 5px;
  849. margin-right: 10px; }
  850. .select2-container--default .select2-selection--multiple .select2-selection__choice {
  851. background-color: #e4e4e4;
  852. border: 1px solid #aaa;
  853. border-radius: 2px;
  854. cursor: default;
  855. float: left;
  856. margin-right: 5px;
  857. margin-top: 5px;
  858. padding: 0 5px; }
  859. .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  860. color: #999;
  861. cursor: pointer;
  862. display: inline-block;
  863. font-weight: bold;
  864. margin-right: 2px; }
  865. .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
  866. color: #333; }
  867. .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline {
  868. float: right; }
  869. .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
  870. margin-left: 5px;
  871. margin-right: auto; }
  872. .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
  873. margin-left: 2px;
  874. margin-right: auto; }
  875. .select2-container--default.select2-container--focus .select2-selection--multiple {
  876. border: solid black 1px;
  877. outline: 0; }
  878. .select2-container--default.select2-container--disabled .select2-selection--multiple {
  879. background-color: #eee;
  880. cursor: default; }
  881. .select2-container--default.select2-container--disabled .select2-selection__choice__remove {
  882. display: none; }
  883. .select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {
  884. border-top-left-radius: 0;
  885. border-top-right-radius: 0; }
  886. .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
  887. border-bottom-left-radius: 0;
  888. border-bottom-right-radius: 0; }
  889. .select2-container--default .select2-search--dropdown .select2-search__field {
  890. border: 1px solid #aaa; }
  891. .select2-container--default .select2-search--inline .select2-search__field {
  892. background: transparent;
  893. border: none;
  894. outline: 0;
  895. box-shadow: none;
  896. -webkit-appearance: textfield; }
  897. .select2-container--default .select2-results > .select2-results__options {
  898. max-height: 200px;
  899. overflow-y: auto; }
  900. .select2-container--default .select2-results__option[role=group] {
  901. padding: 0; }
  902. .select2-container--default .select2-results__option[aria-disabled=true] {
  903. color: #999; }
  904. .select2-container--default .select2-results__option[aria-selected=true] {
  905. background-color: #ddd; }
  906. .select2-container--default .select2-results__option .select2-results__option {
  907. padding-left: 1em; }
  908. .select2-container--default .select2-results__option .select2-results__option .select2-results__group {
  909. padding-left: 0; }
  910. .select2-container--default .select2-results__option .select2-results__option .select2-results__option {
  911. margin-left: -1em;
  912. padding-left: 2em; }
  913. .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
  914. margin-left: -2em;
  915. padding-left: 3em; }
  916. .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
  917. margin-left: -3em;
  918. padding-left: 4em; }
  919. .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
  920. margin-left: -4em;
  921. padding-left: 5em; }
  922. .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
  923. margin-left: -5em;
  924. padding-left: 6em; }
  925. .select2-container--default .select2-results__option--highlighted[aria-selected] {
  926. background-color: #389ee1;
  927. color: white; }
  928. .select2-container--default .select2-results__group {
  929. cursor: default;
  930. display: block;
  931. padding: 6px; }
  932. .select2-container--classic .select2-selection--single {
  933. background-color: #f7f7f7;
  934. border: 1px solid #aaa;
  935. border-radius: 2px;
  936. outline: 0;
  937. background-image: -webkit-linear-gradient(top, white 50%, #eeeeee 100%);
  938. background-image: -o-linear-gradient(top, white 50%, #eeeeee 100%);
  939. background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%);
  940. background-repeat: repeat-x;
  941. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); }
  942. .select2-container--classic .select2-selection--single:focus {
  943. border: 1px solid #389ee1; }
  944. .select2-container--classic .select2-selection--single .select2-selection__rendered {
  945. color: #444;
  946. line-height: 28px; }
  947. .select2-container--classic .select2-selection--single .select2-selection__clear {
  948. cursor: pointer;
  949. float: right;
  950. font-weight: bold;
  951. margin-right: 10px; }
  952. .select2-container--classic .select2-selection--single .select2-selection__placeholder {
  953. color: #999; }
  954. .select2-container--classic .select2-selection--single .select2-selection__arrow {
  955. background-color: #ddd;
  956. border: none;
  957. border-left: 1px solid #aaa;
  958. border-top-right-radius: 2px;
  959. border-bottom-right-radius: 2px;
  960. height: 26px;
  961. position: absolute;
  962. top: 1px;
  963. right: 1px;
  964. width: 20px;
  965. background-image: -webkit-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
  966. background-image: -o-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
  967. background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%);
  968. background-repeat: repeat-x;
  969. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); }
  970. .select2-container--classic .select2-selection--single .select2-selection__arrow b {
  971. border-color: #888 transparent transparent transparent;
  972. border-style: solid;
  973. border-width: 5px 4px 0 2px;
  974. height: 0;
  975. left: 50%;
  976. margin-left: -2px;
  977. margin-top: -2px;
  978. position: absolute;
  979. top: 50%;
  980. width: 0; }
  981. .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear {
  982. float: left; }
  983. .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow {
  984. border: none;
  985. border-right: 1px solid #aaa;
  986. border-radius: 0;
  987. border-top-left-radius: 2px;
  988. border-bottom-left-radius: 2px;
  989. left: 1px;
  990. right: auto; }
  991. .select2-container--classic.select2-container--open .select2-selection--single {
  992. border: 1px solid #389ee1; }
  993. .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow {
  994. background: transparent;
  995. border: none; }
  996. .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b {
  997. border-color: transparent transparent #888 transparent;
  998. border-width: 0 4px 5px 4px; }
  999. .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single {
  1000. border-top: none;
  1001. border-top-left-radius: 0;
  1002. border-top-right-radius: 0;
  1003. background-image: -webkit-linear-gradient(top, white 0%, #eeeeee 50%);
  1004. background-image: -o-linear-gradient(top, white 0%, #eeeeee 50%);
  1005. background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%);
  1006. background-repeat: repeat-x;
  1007. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); }
  1008. .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single {
  1009. border-bottom: none;
  1010. border-bottom-left-radius: 0;
  1011. border-bottom-right-radius: 0;
  1012. background-image: -webkit-linear-gradient(top, #eeeeee 50%, white 100%);
  1013. background-image: -o-linear-gradient(top, #eeeeee 50%, white 100%);
  1014. background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%);
  1015. background-repeat: repeat-x;
  1016. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); }
  1017. .select2-container--classic .select2-selection--multiple {
  1018. background-color: white;
  1019. border: 1px solid #aaa;
  1020. border-radius: 2px;
  1021. cursor: text;
  1022. outline: 0; }
  1023. .select2-container--classic .select2-selection--multiple:focus {
  1024. border: 1px solid #389ee1; }
  1025. .select2-container--classic .select2-selection--multiple .select2-selection__rendered {
  1026. list-style: none;
  1027. margin: 0;
  1028. padding: 0 5px; }
  1029. .select2-container--classic .select2-selection--multiple .select2-selection__clear {
  1030. display: none; }
  1031. .select2-container--classic .select2-selection--multiple .select2-selection__choice {
  1032. background-color: #e4e4e4;
  1033. border: 1px solid #aaa;
  1034. border-radius: 2px;
  1035. cursor: default;
  1036. float: left;
  1037. margin-right: 5px;
  1038. margin-top: 5px;
  1039. padding: 0 5px; }
  1040. .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
  1041. color: #888;
  1042. cursor: pointer;
  1043. display: inline-block;
  1044. font-weight: bold;
  1045. margin-right: 2px; }
  1046. .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover {
  1047. color: #555; }
  1048. .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
  1049. float: right; }
  1050. .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
  1051. margin-left: 5px;
  1052. margin-right: auto; }
  1053. .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
  1054. margin-left: 2px;
  1055. margin-right: auto; }
  1056. .select2-container--classic.select2-container--open .select2-selection--multiple {
  1057. border: 1px solid #389ee1; }
  1058. .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple {
  1059. border-top: none;
  1060. border-top-left-radius: 0;
  1061. border-top-right-radius: 0; }
  1062. .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple {
  1063. border-bottom: none;
  1064. border-bottom-left-radius: 0;
  1065. border-bottom-right-radius: 0; }
  1066. .select2-container--classic .select2-search--dropdown .select2-search__field {
  1067. border: 1px solid #aaa;
  1068. outline: 0; }
  1069. .select2-container--classic .select2-search--inline .select2-search__field {
  1070. outline: 0;
  1071. box-shadow: none; }
  1072. .select2-container--classic .select2-dropdown {
  1073. background-color: white;
  1074. border: 1px solid transparent; }
  1075. .select2-container--classic .select2-dropdown--above {
  1076. border-bottom: none; }
  1077. .select2-container--classic .select2-dropdown--below {
  1078. border-top: none; }
  1079. .select2-container--classic .select2-results > .select2-results__options {
  1080. max-height: 200px;
  1081. overflow-y: auto; }
  1082. .select2-container--classic .select2-results__option[role=group] {
  1083. padding: 0; }
  1084. .select2-container--classic .select2-results__option[aria-disabled=true] {
  1085. color: grey; }
  1086. .select2-container--classic .select2-results__option--highlighted[aria-selected] {
  1087. background-color: #3875d7;
  1088. color: white; }
  1089. .select2-container--classic .select2-results__group {
  1090. cursor: default;
  1091. display: block;
  1092. padding: 6px; }
  1093. .select2-container--classic.select2-container--open .select2-dropdown {
  1094. border-color: #389ee1; }
  1095. /*·························下拉框 end·································*/