sub.css 7.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470
  1. /*通用类*/
  2. * {
  3. margin:0;
  4. padding:0;
  5. }
  6. /*兼容老设备的rem-px基准*/
  7. html {
  8. font-size:42.6667px;
  9. }
  10. @media screen and (max-width:320px) {
  11. html {
  12. font-size:42.6667px;
  13. }
  14. }@media screen and (min-width:321px) and (max-width:360px) {
  15. html {
  16. font-size:48px;
  17. }
  18. }@media screen and (min-width:361px) and (max-width:375px) {
  19. html {
  20. font-size:50px;
  21. }
  22. }@media screen and (min-width:376px) and (max-width:414px) {
  23. html {
  24. font-size:55px;
  25. }
  26. }@media screen and (min-width:415px) and (max-width:484px) {
  27. html {
  28. font-size:64px;
  29. }
  30. }@media screen and (min-width:485px) and (max-width:720px) {
  31. html {
  32. font-size:96px;
  33. }
  34. }@media screen and (min-width:721px) and (max-width:768px) {
  35. html {
  36. font-size:102px;
  37. }
  38. }@media screen and (min-width:769px) and (max-width:1080px) {
  39. html {
  40. font-size:144px;
  41. }
  42. }@media screen and (min-width:1080px) {
  43. html {
  44. font-size:144px;
  45. }
  46. }/*新设备的rem-vw标准*/
  47. html {
  48. overflow-x:hidden;
  49. font-size:13.3333333333vw;
  50. /*一便rem.js失效,这里起作用*/
  51. }
  52. body {
  53. width:100%;
  54. min-width:320px;
  55. min-height:100vh;
  56. margin:0 auto;
  57. font-family:PingFang SC,Hiragino Sans GB,Microsoft YaHei UI,Microsoft YaHei,Source Han Sans CN,sans-serif;
  58. background:#ffffff;
  59. overflow-x:hidden;
  60. text-align:left;
  61. position:relative;
  62. font-size:0.36rem;
  63. color:#000;
  64. }
  65. img {
  66. border:none;
  67. }
  68. h1,h2,h3 {
  69. font-weight:normal;
  70. }
  71. a {
  72. color:#000;
  73. text-decoration:none;
  74. -webkit-tap-highlight-color:rgba(0,0,0,0);
  75. -webkit-tap-highlight-color:transparent;
  76. outline:none;
  77. }
  78. p{
  79. margin-top:17px;
  80. }
  81. input,textarea,select {
  82. font-family:PingFang SC,Hiragino Sans GB,Microsoft YaHei UI,Microsoft YaHei,Source Han Sans CN,sans-serif;
  83. font-size:1em;
  84. outline:none;
  85. margin:0;
  86. padding:0;
  87. }
  88. input::-webkit-input-placeholder {
  89. color:#a0a0a0 !important;
  90. }
  91. textarea::-webkit-input-placeholder {
  92. color:#a0a0a0 !important;
  93. }
  94. input[type='button'],input[type='text'],input[type='search'],input[type='submit'],input[type='reset'],input[type='date'],input[type='time'],input[type='number'] {
  95. -webkit-appearance:none;
  96. }
  97. select {
  98. -webkit-appearance:none;
  99. }
  100. textarea {
  101. -webkit-appearance:none;
  102. }
  103. input::-webkit-outer-spin-button,input::-webkit-inner-spin-button {
  104. -webkit-appearance:none !important;
  105. margin:0;
  106. }
  107. ul,ol {
  108. padding:0;
  109. list-style-type:none;
  110. }
  111. em {
  112. font-style:normal;
  113. }
  114. .lt {
  115. float:left;
  116. }
  117. .rt {
  118. float:right;
  119. }
  120. input.sub,label {
  121. border:none;
  122. cursor:pointer;
  123. }
  124. input,textarea {
  125. font-family:PingFang SC,Hiragino Sans GB,Microsoft YaHei UI,Microsoft YaHei,Source Han Sans CN,sans-serif;
  126. outline:none;
  127. margin:0;
  128. padding:0;
  129. }
  130. table {
  131. border-collapse:collapse;
  132. }
  133. td,th {
  134. padding:0;
  135. }
  136. div.clear {
  137. font:0px Arial;
  138. line-height:0;
  139. height:0;
  140. overflow:hidden;
  141. clear:both;
  142. }
  143. .cm_photo {
  144. display:block;
  145. position:relative;
  146. overflow:hidden;
  147. }
  148. .cm_photo .thumb {
  149. display:block;
  150. width:100%;
  151. height:100%;
  152. position:absolute;
  153. left:0;
  154. top:0;
  155. z-index:10;
  156. }
  157. .cm_photo .zw {
  158. display:block;
  159. height:auto;
  160. width:100%;
  161. }
  162. .ar_title {
  163. padding: .26666667rem .2rem;
  164. text-align:center;
  165. font-weight:bold;
  166. display:flex;
  167. justify-content:space-around;
  168. }
  169. .ar_title img{
  170. width: 100%;
  171. height: 100%;
  172. border-radius: .13333333rem;
  173. }
  174. .ar_t2 {
  175. text-align:center;
  176. line-height:2;
  177. }
  178. .ar_cnt {
  179. line-height:0.57rem;
  180. font-size:0.35rem;
  181. margin:0 auto;
  182. text-align:justify;
  183. padding:0 .28rem;
  184. }
  185. .ar_dx .tp {
  186. text-align:center;
  187. font-weight:bold;
  188. color:#000;
  189. line-height:2;
  190. }
  191. .ar_dx .red {
  192. color:#c00;
  193. }
  194. .ar_dx .bt {
  195. line-height:1.6;
  196. padding:0.2rem 3%;
  197. }
  198. .ar_gif {
  199. display:block;
  200. width:100%;
  201. height:auto;
  202. }
  203. .ar_wx {
  204. height:1rem;
  205. background:#ffffff;
  206. padding:0 3%;
  207. margin-top:17px;
  208. }
  209. .ar_wx .face {
  210. float:left;
  211. width:0.6rem;
  212. height:0.6rem;
  213. border-radius:100%;
  214. position:relative;
  215. overflow:hidden;
  216. margin:0.2rem 0.2rem 0 0;
  217. }
  218. .ar_wx .face img {
  219. display:block;
  220. width:100%;
  221. height:100%;
  222. object-fit:cover;
  223. }
  224. .ar_wx .name {
  225. float:left;
  226. font-size:0.28rem;
  227. line-height:1rem;
  228. }
  229. .ar_wx .btn {
  230. float:right;
  231. width:1.4rem;
  232. height:0.6rem;
  233. border-radius:0.3rem;
  234. background:#f85959;
  235. line-height:0.6rem;
  236. color:#fff;
  237. text-align:center;
  238. font-size:0.28rem;
  239. margin:0.2rem 0 0 0;
  240. }
  241. .ar_bt {
  242. text-align:center;
  243. font-size:0.24rem;
  244. background:#f2f2f2;
  245. height:0.8rem;
  246. color:#69768c;
  247. line-height:0.8rem;
  248. }
  249. .alert_flog {
  250. width:100%;
  251. height:100%;
  252. position:fixed;
  253. left:0;
  254. top:0;
  255. z-index:200;
  256. background:rgba(0,0,0,0.5);
  257. display:none;
  258. }
  259. .tip_win {
  260. width:4.8rem;
  261. height:4rem;
  262. position:fixed;
  263. left:50%;
  264. top:50%;
  265. z-index:220;
  266. background:#fff;
  267. border-radius:0.1rem;
  268. -webkit-transform:translate(-50%,-50%);
  269. -ms-transform:translate(-50%,-50%);
  270. -o-transform:translate(-50%,-50%);
  271. transform:translate(-50%,-50%);
  272. box-sizing:border-box;
  273. padding-top:0.28rem;
  274. text-align:center;
  275. display:none;
  276. }
  277. .tip_win .ico {
  278. display:block;
  279. width:0.8rem;
  280. height:0.8rem;
  281. margin:0 auto;
  282. }
  283. .tip_win .t1 {
  284. font-size:0.3rem;
  285. line-height:3;
  286. }
  287. .tip_win p {
  288. width:90%;
  289. margin:0 auto;
  290. font-size:0.24rem;
  291. line-height:1.8;
  292. }
  293. .tip_win .ctrl {
  294. padding-top:0.2rem;
  295. }
  296. .tip_win .cancle {
  297. display:inline-block;
  298. width:1.4rem;
  299. height:0.6rem;
  300. line-height:0.6rem;
  301. border:1px solid #ababab;
  302. font-size:0.28rem;
  303. border-radius:0.3rem;
  304. color:#ababab;
  305. margin:0 0.1rem;
  306. }
  307. .tip_win .ok {
  308. display:inline-block;
  309. width:1.4rem;
  310. height:0.6rem;
  311. line-height:0.6rem;
  312. border:1px solid #00d48c;
  313. font-size:0.28rem;
  314. border-radius:0.3rem;
  315. color:#00d48c;
  316. margin:0 0.1rem;
  317. }
  318. .nad {
  319. width:100%;
  320. height:5.24rem;
  321. background:url('../images/nadbg.jpg') no-repeat top center;
  322. background-size:100% 100%;
  323. position:relative;
  324. }
  325. .nad .t1 {
  326. height:0.86rem;
  327. line-height:0.86rem;
  328. position:absolute;
  329. top:0.15rem;
  330. left:1.42rem;
  331. font-size:0.32rem;
  332. }
  333. .nad .t2 {
  334. height:0.9rem;
  335. line-height:0.9rem;
  336. position:absolute;
  337. left:0.34rem;
  338. top:2.08rem;
  339. font-size:0.32rem;
  340. color:#4fab35;
  341. }
  342. .nad .t2 span {
  343. color:#000;
  344. }
  345. .nad .inf {
  346. height:2.1rem;
  347. position:absolute;
  348. bottom:0;
  349. left:0.32rem;
  350. }
  351. .nad .face {
  352. float:left;
  353. width:1.2rem;
  354. height:1.2rem;
  355. border-radius:100%;
  356. position:relative;
  357. overflow:hidden;
  358. margin-top:0.1rem;
  359. }
  360. .nad .face img {
  361. display:block;
  362. width:100%;
  363. height:100%;
  364. object-fit:cover;
  365. }
  366. .nad .intro {
  367. width:5.12rem;
  368. float:left;
  369. padding-left:0.25rem;
  370. }
  371. .nad .name {
  372. height:0.52rem;
  373. line-height:0.52rem;
  374. color:#090909;
  375. font-size:0.3rem;
  376. }
  377. .nad .tip {
  378. line-height:0.4rem;
  379. font-size:0.28rem;
  380. color:#7d7d7d;
  381. display:-webkit-box;
  382. -webkit-box-orient:vertical;
  383. overflow:hidden;
  384. text-overflow:ellipsis;
  385. -webkit-line-clamp:2;
  386. }
  387. .nad .ed {
  388. height:0.6rem;
  389. line-height:0.6rem;
  390. font-size:0.28rem;
  391. color:#999;
  392. }
  393. .nad .ed span {
  394. color:#4fab35;
  395. }
  396. .alert {
  397. position: fixed;
  398. }
  399. .alert, .alert .mask {
  400. top: 0;
  401. left: 0;
  402. right: 0;
  403. bottom: 0;
  404. }
  405. .alert .mask {
  406. position: absolute;
  407. background: rgba(0, 0, 0, 0.5);
  408. z-index: 1;
  409. }
  410. .alert .alert-box {
  411. position: relative;
  412. left: 5vw;
  413. top: 50%;
  414. margin-top: -25vw;
  415. width: 90vw;
  416. height: 60vw;
  417. background: #fff;
  418. border-radius: 0.3333333rem;
  419. z-index: 2;
  420. -ms-flex-direction: column;
  421. flex-direction: column;
  422. }
  423. .alert .alert-box, .alert .alert-box .alert-body {
  424. display: -webkit-box;
  425. display: -ms-flexbox;
  426. display: flex;
  427. -webkit-box-orient: vertical;
  428. -webkit-box-direction: normal;
  429. }
  430. .alert .alert-box .alert-body {
  431. -webkit-box-flex: 1;
  432. -ms-flex: 1;
  433. flex: 1;
  434. color: #000;
  435. text-align: center;
  436. padding: 0.53333333rem 0.53333333rem 0.3333333rem;
  437. font-size: 0.48rem;
  438. -ms-flex-direction: column;
  439. flex-direction: column;
  440. -webkit-box-align: center;
  441. -ms-flex-align: center;
  442. align-items: center;
  443. -webkit-box-pack: center;
  444. -ms-flex-pack: center;
  445. justify-content: center;
  446. }
  447. .alert .alert-box .alert-body .title {
  448. font-weight: 700;
  449. }
  450. .alert .alert-box .alert-body .message {
  451. margin-top: 0.13333333rem;
  452. }
  453. .alert .alert-box .open-wx-btn {
  454. height: 1.06666667rem;
  455. background: #f54343;
  456. margin: 0.233333rem 0.53333333rem 0.53333333rem;
  457. display: -webkit-box;
  458. display: -ms-flexbox;
  459. display: flex;
  460. -webkit-box-align: center;
  461. -ms-flex-align: center;
  462. align-items: center;
  463. -webkit-box-pack: center;
  464. -ms-flex-pack: center;
  465. justify-content: center;
  466. font-size: 0.48rem;
  467. border-radius: 0.53333333rem;
  468. color: #fff;
  469. text-decoration: none;
  470. }