common.css 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813
  1. @charset "utf-8";
  2. html {
  3. margin: 0;
  4. padding: 0;
  5. }
  6. body {
  7. margin: 0;
  8. padding: 0;
  9. font-size: 14px;
  10. font-family: sans-serif;
  11. font-weight: normal;
  12. font-style: normal;
  13. color: #333;
  14. word-break: break-all;
  15. word-wrap: break-word;
  16. }
  17. h1, h2, h3, h4, h5, h6, p, ul, li, strong, em, i {
  18. margin: 0;
  19. padding: 0;
  20. font-size: 14px;
  21. list-style: none;
  22. font-weight: normal;
  23. font-style: normal;
  24. }
  25. img {
  26. display: block;
  27. margin: 0;
  28. border: 0;
  29. width: 100%;
  30. }
  31. a {
  32. -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  33. -webkit-touch-callout: none;
  34. -webkit-user-select: none;
  35. text-decoration: none;
  36. }
  37. .body_sytle {
  38. overflow: hidden;
  39. background-color: #f2f4f8;
  40. }
  41. .i_h_user_but{
  42. margin:.06rem .15rem 0 0;
  43. float: right;
  44. height: .36rem;
  45. width: .36rem;
  46. background: url(../../img/frontend/icon/user_icon_4.png) no-repeat center center;
  47. background-size: .21rem .21rem;
  48. }
  49. .i_h_search_but{
  50. margin:.06rem .06rem 0 0;
  51. float: right;
  52. height: .36rem;
  53. width: .36rem;
  54. background: url(../../img/frontend/icon/user_icon_3.png) no-repeat center center;
  55. background-size: .21rem .21rem;
  56. }
  57. .i_nav_fixed_box {
  58. height: .49rem;
  59. }
  60. .fixednav .i_nav_box {
  61. position: fixed;
  62. left: 0;
  63. top: 0;
  64. right: 0;
  65. z-index: 999;
  66. }
  67. .i_nav_box {
  68. position: relative;
  69. left: 0;
  70. top: 0;
  71. overflow: hidden;
  72. padding-left: .02rem;
  73. height: .48rem;
  74. background-color: #fff;
  75. }
  76. .i_nav_user_img {
  77. position: absolute;
  78. right: .15rem;
  79. top: 0;
  80. overflow: hidden;
  81. margin: .06rem 0 0;
  82. height: .36rem;
  83. width: .36rem;
  84. background-color: #eff1f6;
  85. border-radius: .36rem;
  86. }
  87. .i_nav_user_img_vip {
  88. position: absolute;
  89. right: .15rem;
  90. top: 0;
  91. padding: 1px;
  92. margin: .06rem 0 0;
  93. height: .36rem;
  94. width: .36rem;
  95. background-color: #eff1f6;
  96. border-radius: .36rem;
  97. border: 1px solid #ffd99e;
  98. box-sizing: border-box;
  99. }
  100. .i_nav_user_img_vip span {
  101. position: absolute;
  102. left: 50%;
  103. bottom: -.02rem;
  104. margin: 0 0 0 -.14rem;
  105. width: .28rem;
  106. height: .12rem;
  107. background: url(/assets/img/frontend/icon/user_vip_3.png) no-repeat center center/100% 100%;
  108. }
  109. .i_nav_user_img img,
  110. .i_nav_user_img_vip img {
  111. height: 100%;
  112. width: 100%;
  113. border-radius: .36rem;
  114. }
  115. .i_nav_list {
  116. overflow: hidden;
  117. height: .48rem;
  118. display: flex;
  119. }
  120. .i_nav_list a {
  121. float: left;
  122. margin: 0 .13rem;
  123. padding: .12rem 0 0;
  124. height: .48rem;
  125. box-sizing: border-box;
  126. }
  127. .i_nav_list a strong {
  128. display: block;
  129. height: .26rem;
  130. font-size: .15rem;
  131. color: #2b2b2a;
  132. text-align: center;
  133. white-space: nowrap;
  134. line-height: .26rem;
  135. }
  136. .i_nav_list a span {
  137. overflow: hidden;
  138. margin: 0 auto;
  139. display: block;
  140. height: .02rem;
  141. width: .6rem;
  142. }
  143. .i_nav_list .hover strong {
  144. color: #80A5D4;
  145. }
  146. .i_nav_list .hover span {
  147. background-color: #80A5D4;
  148. }
  149. .body_sytle_girl .i_nav_list .hover strong {
  150. /*color: #f56451;*/
  151. }
  152. .body_sytle_girl .i_nav_list .hover span {
  153. /*background-color: #f56451;*/
  154. }
  155. .i_module_box {
  156. overflow: hidden;
  157. background-color: #fff;
  158. margin: 0 0.15rem 0.05rem 0.15rem;
  159. }
  160. .i_module_tit {
  161. overflow: hidden;
  162. margin: .08rem .15rem 0;
  163. height: .3rem;
  164. font-size: 0;
  165. display:flex ;
  166. justify-content: space-between;
  167. align-items: center;
  168. }
  169. .i_module_tit h2 {
  170. margin: 0;
  171. height: .3rem;
  172. background-size: .75rem auto;
  173. display: flex;
  174. justify-content: space-between;
  175. align-items: center;
  176. }
  177. .i_module_tit strong {
  178. display: inline-block;
  179. margin: 0;
  180. height: .3rem;
  181. background-size: .75rem auto;
  182. font-size: .16rem;
  183. font-weight: normal;
  184. color: #2b2b2a;
  185. line-height: .3rem;
  186. }
  187. .i_module_list_more{
  188. display: block;
  189. overflow: hidden;
  190. text-align: center;
  191. height: .28rem;
  192. }
  193. .i_module_list_more strong{
  194. display: inline-block;
  195. margin: 0;
  196. padding: 0 .12rem 0 0;
  197. height: .28rem;
  198. background: url(../../img/frontend/icon/arrow.png) no-repeat right center;
  199. background-size: auto .08rem;
  200. font-weight: normal;
  201. font-size: .12rem;
  202. color: #2F2F2F;
  203. line-height: .28rem;
  204. }
  205. .i_m_tit_tab {
  206. overflow: hidden;
  207. margin: 0 auto;
  208. height: .26rem;
  209. width: 2.28rem;
  210. border: 1px solid #27c1a0;
  211. border-radius: .26rem;
  212. box-sizing: border-box;
  213. }
  214. .i_m_tit_tab a {
  215. overflow: hidden;
  216. float: left;
  217. height: 100%;
  218. width: 50%;
  219. font-size: .13rem;
  220. color: #27c1a0;
  221. text-align: center;
  222. line-height: 2;
  223. }
  224. .i_m_tit_tab .hover {
  225. background-color: #27c1a0;
  226. color: #fff;
  227. }
  228. .body_sytle_girl .i_m_tit_tab {
  229. border-color: #f56451;
  230. }
  231. .body_sytle_girl .i_m_tit_tab a {
  232. color: #f56451;
  233. }
  234. .body_sytle_girl .i_m_tit_tab .hover {
  235. background-color: #f56451;
  236. color: #fff;
  237. }
  238. .i_module_tit > a {
  239. float: right;
  240. padding-right: .12rem;
  241. height: .26rem;
  242. background: url(/assets/img/frontend/icon/icon_1.png) no-repeat right center;
  243. background-size: auto .08rem;
  244. font-size: .12rem;
  245. color: #2F2F2F;
  246. line-height: .26rem;
  247. margin-top: 0 !important;
  248. }
  249. .i_images_list {
  250. overflow: hidden;
  251. margin: .08rem .15rem;
  252. }
  253. .i_images_ul {
  254. overflow: hidden;
  255. margin-left: -.1rem;
  256. }
  257. .i_images_ul li {
  258. float: left;
  259. width: 25%;
  260. padding-left: .1rem;
  261. box-sizing: border-box;
  262. }
  263. .i_images_ul a,
  264. .i_images_scroll_ul a {
  265. display: block;
  266. }
  267. .i_images_img {
  268. overflow: hidden;
  269. margin-bottom: .1rem;
  270. }
  271. .i_images_ul h3,
  272. .i_images_scroll_ul h3 {
  273. overflow: hidden;
  274. max-height: .32rem;
  275. font-size: .13rem;
  276. color: #333;
  277. line-height: .16rem;
  278. display: -webkit-box;
  279. -webkit-box-orient: vertical;
  280. -webkit-line-clamp: 2;
  281. }
  282. .i_images_scroll_list {
  283. overflow: hidden;
  284. margin: .1rem .15rem .08rem .06rem;
  285. }
  286. .i_images_scroll_ul {
  287. display: none;
  288. overflow: hidden;
  289. overflow-x: auto;
  290. width: 100%;
  291. white-space: nowrap;
  292. font-size: 0;
  293. }
  294. .i_images_scroll_ul {
  295. -webkit-overflow-scrolling: touch;
  296. }
  297. .i_images_scroll_ul::-webkit-scrollbar {
  298. display: none;
  299. }
  300. .i_images_scroll_ul_hover {
  301. display: block;
  302. }
  303. .i_images_scroll_ul li {
  304. overflow: hidden;
  305. display: inline-block;
  306. margin: 0 0 0 .09rem;
  307. width: .7rem;
  308. vertical-align: top;
  309. }
  310. .i_images_scroll_ul a {
  311. position: relative;
  312. left: 0;
  313. top: 0;
  314. white-space: normal;
  315. width: 100%;
  316. }
  317. .i_images_scroll_ul a span {
  318. position: absolute;
  319. top: .05rem;
  320. left: 0;
  321. width: .17rem;
  322. height: .13rem;
  323. background: url(../../img/frontend/icon/icon_4_2.png) no-repeat 0 0;
  324. background-size: .17rem .13rem;
  325. font-size: .09rem;
  326. text-align: center;
  327. color: #fff;
  328. line-height: .13rem;
  329. }
  330. .i_images_scroll_ul .i_images_img,
  331. .i_images_scroll_ul .i_images_img img {
  332. height: .94rem;
  333. }
  334. .i_images_text_list {
  335. margin: 0 .15rem .08rem;
  336. }
  337. .i_images_text_ul {
  338. overflow: hidden;
  339. }
  340. .i_images_text_ul li {
  341. overflow: hidden;
  342. padding: .05rem 0;
  343. border-bottom: 1px solid #e0e4ea;
  344. }
  345. .i_images_text_ul a {
  346. position: relative;
  347. left: 0;
  348. top: 0;
  349. overflow: hidden;
  350. display: block;
  351. padding: .05rem 0;
  352. }
  353. .i_images_img{
  354. position: relative;
  355. }
  356. .i_images_img img{
  357. border-radius: .03rem;
  358. }
  359. .i_images_text_ul .i_images_img {
  360. position: absolute;
  361. left: 0;
  362. top: .05rem;
  363. margin-bottom: 0;
  364. width: .78rem;
  365. height: 1.04rem;
  366. }
  367. .i_images_img:after,
  368. .r_img:after,
  369. .bd_head_info_img:after{
  370. content: " ";
  371. position: absolute;
  372. top: 0;
  373. left: 0;
  374. width: .1rem;
  375. height: 100%;
  376. background-image: -webkit-gradient(linear,left top,right top,color-stop(0,hsla(0,0%,100%,0)),color-stop(53%,hsla(0,0%,100%,.5)),to(hsla(0,0%,100%,0)));
  377. background-image: -webkit-linear-gradient(left,hsla(0,0%,100%,0),hsla(0,0%,100%,.5) 53%,hsla(0,0%,100%,0));
  378. background-image: linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.5) 53%,hsla(0,0%,100%,0));
  379. }
  380. .i_images_text_ul .i_images_img img {
  381. height: 100%;
  382. }
  383. .i_images_txt_box {
  384. overflow: hidden;
  385. margin: 0 0 0 .90rem;
  386. height: 1.08rem;
  387. }
  388. .i_images_txt_box h3 {
  389. overflow: hidden;
  390. margin-bottom: .1rem;
  391. height: .22rem;
  392. font-size: .14rem;
  393. color: #494a4c;
  394. font-weight: bold;
  395. line-height: .22rem;
  396. white-space: nowrap;
  397. text-overflow: ellipsis;
  398. }
  399. .i_images_txt_box p {
  400. overflow: hidden;
  401. margin-bottom: .10rem;
  402. height: .37rem;
  403. font-size: .12rem;
  404. color: #828786;
  405. line-height: .18rem;
  406. display: -webkit-box;
  407. -webkit-box-orient: vertical;
  408. -webkit-line-clamp: 2;
  409. }
  410. .i_images_txt_other {
  411. position: relative;
  412. height: .19rem;
  413. display: flex;
  414. justify-content: space-between;
  415. align-items: center;
  416. }
  417. .i_images_txt_other strong {
  418. overflow: hidden;
  419. float: left;
  420. height: .19rem;
  421. line-height: .19rem;
  422. }
  423. .i_images_txt_other strong i,
  424. .i_images_txt_other strong b{
  425. float: left;
  426. margin-top: .02rem;
  427. height: .15rem;
  428. font-weight: normal;
  429. font-style: normal;
  430. font-size: .13rem;
  431. line-height: .15rem;
  432. }
  433. .i_images_txt_other strong i{
  434. padding-right: .1rem;
  435. margin-right: .1rem;
  436. border-right: 1px solid #cac4c4;
  437. color: #f7b9a2;
  438. }
  439. .i_images_txt_other strong b{
  440. color: #9a9191;
  441. }
  442. .i_images_txt_other em {
  443. float: right;
  444. padding-left: .2rem;
  445. height: .16rem;
  446. background: url(../../img/frontend/icon/icon_2.png) no-repeat 0 .03rem;
  447. background-size: auto .1rem;
  448. font-size: .12rem;
  449. color: #f56451;
  450. line-height: .16rem;
  451. }
  452. .i_images_text_ul .i_text_a {
  453. position: static;
  454. }
  455. .i_text_a .i_images_txt_box {
  456. margin: 0;
  457. height: auto;
  458. }
  459. .i_text_a .i_images_txt_box p {
  460. margin-bottom: 0;
  461. height: .36rem;
  462. display: -webkit-box;
  463. -webkit-box-orient: vertical;
  464. -webkit-line-clamp: 2;
  465. }
  466. .footer_box {
  467. overflow: hidden;
  468. padding: .15rem 0;
  469. }
  470. .footer_ewm {
  471. margin: 0 auto .18rem;
  472. width: 1.4rem;
  473. height: 1.4rem;
  474. }
  475. .footer_ewm img {
  476. display: block;
  477. height: 100%;
  478. }
  479. .footer_txt {
  480. margin: 0 auto;
  481. overflow: hidden;
  482. width: 2.5rem;
  483. text-align: center;
  484. }
  485. .footer_txt p {
  486. overflow: hidden;
  487. font-size: .13rem;
  488. color: #5d6995;
  489. line-height: .24rem;
  490. }
  491. .content_null_box {
  492. overflow: hidden;
  493. padding: 34px 0;
  494. /*border-top: 1px solid #aeb4ca;*/
  495. background-color: #fff;
  496. }
  497. .content_null_top_border {
  498. border-top: 1px solid #aeb4ca;
  499. }
  500. .content_null_box img {
  501. display: block;
  502. margin: 0 auto .06rem;
  503. }
  504. .content_null_box span {
  505. display: block;
  506. overflow: hidden;
  507. font-size: .13rem;
  508. color: #535756;
  509. text-align: center;
  510. line-height: .18rem;
  511. }
  512. .content_null_but_box {
  513. overflow: hidden;
  514. margin-top: .25rem;
  515. padding: .15rem 0;
  516. }
  517. .content_null_but_box a {
  518. display: block;
  519. margin: 0 auto;
  520. width: 2.1rem;
  521. height: .4rem;
  522. background-color: #27c1a0;
  523. font-size: .17rem;
  524. color: #fff;
  525. text-align: center;
  526. line-height: .4rem;
  527. border-radius: .4rem;
  528. }
  529. .loading_box {
  530. overflow: hidden;
  531. height: .5rem;
  532. background-color: #fff;
  533. border-top: 1px solid #edf0fa;
  534. text-align: center;
  535. line-height: .5rem;
  536. }
  537. .loading_box span {
  538. font-size: .12rem;
  539. color: #7B9DC8;
  540. line-height: .5rem;
  541. }
  542. #console_main {
  543. height: 0;
  544. font-size: 0;
  545. }
  546. .console_box {
  547. position: fixed;
  548. left: 0;
  549. top: 50%;
  550. right: 0;
  551. z-index: 5000;
  552. margin-top: -.23rem;
  553. height: .46rem;
  554. font-size: 0;
  555. text-align: center;
  556. }
  557. .console_box span {
  558. display: inline-block;
  559. *display: inline;
  560. *zoom: 1;
  561. padding: 0 .3rem;
  562. height: .46rem;
  563. background-color: rgba(0, 0, 0, 0.9);
  564. -moz-border-radius: .06rem;
  565. -webkit-border-radius: .06rem;
  566. border-radius: .06rem;
  567. font-size: .14rem;
  568. color: #fff;
  569. text-align: center;
  570. line-height: .46rem;
  571. }
  572. .christmas_popup_box, .camp_popup_box, .mishu_tips_box{
  573. position:fixed;
  574. left:0;
  575. top:0;
  576. right:0;
  577. bottom:0;
  578. z-index:1000;
  579. height:100%;
  580. width:100%;
  581. background-color:rgba(0,0,0,0.4);
  582. overflow:hidden;
  583. text-align:center;
  584. font-size:0;
  585. white-space:nowrap;
  586. }
  587. .christmas_body, .christmas_jgb, .mishu_tips_body{
  588. display:inline-block;
  589. *display:inline;
  590. *zoom:1;
  591. vertical-align:middle;
  592. }
  593. .christmas_jgb{
  594. margin-left:-1px;
  595. height:100%;
  596. width:1px;
  597. overflow:hidden;
  598. }
  599. .christmas_body, .mishu_tips_body{
  600. width:99%;
  601. }
  602. .christmas_main, .mishu_main{
  603. overflow:hidden;
  604. margin:0 10%;
  605. padding-bottom: .4rem;
  606. }
  607. .christmas_main_but, .mishu_tips_but{
  608. clear:both;
  609. display:block;
  610. overflow:hidden;
  611. -webkit-box-border-radius:.06rem;
  612. -moz-box-border-radius:.06rem;
  613. border-radius:.06rem;
  614. }
  615. .christmas_main_but img{
  616. display:block;
  617. width:100%;
  618. border:0;
  619. }
  620. .christmas_close{
  621. position:absolute;
  622. right:.06rem;
  623. top:0;
  624. width:.34rem;
  625. height:.34rem;
  626. background: url(../../img/frontend/christmas_style/christmas_close.png) no-repeat center center;
  627. background-size:cover;
  628. }
  629. .christmas_close_2, .btn_close_2{
  630. float:right;
  631. margin-bottom:.1rem;
  632. width:.3rem;
  633. height:.3rem;
  634. background: url(../../img/frontend/christmas_style/christmas_close.png) no-repeat center center;
  635. background-size:cover;
  636. }
  637. .camp_close_btn{
  638. float:right;
  639. margin-bottom:.1rem;
  640. width:.3rem;
  641. height:.3rem;
  642. background: url(../../img/frontend/christmas_style/christmas_close.png) no-repeat center center;
  643. background-size:cover;
  644. }
  645. .set_top_box{
  646. position: relative;
  647. z-index: 20;
  648. overflow: hidden;
  649. margin: .45rem 1px -.4rem;
  650. height: .4rem;
  651. background-color: #f65356;
  652. font-size: .12rem;
  653. color: #fff;
  654. text-align: center;
  655. line-height: .4rem;
  656. }
  657. .section-data{
  658. cursor: pointer;
  659. }
  660. /** 书籍角标 **/
  661. .pongo_blk{ position: relative}
  662. .pongo_blk em.vip-pay {
  663. position: absolute;
  664. right: 0;
  665. bottom: 0;
  666. height: .16rem;
  667. width: .5rem;
  668. background-repeat: no-repeat;
  669. background-size: .5rem .16rem;
  670. background-position: 0 0;
  671. background-image: url(/assets/img/frontend/icon/vip_pay.png);
  672. }
  673. /**/
  674. .w_dis_tit{
  675. display: flex;
  676. justify-content: flex-start;
  677. align-items: center;
  678. position: relative;
  679. z-index: 1;
  680. }
  681. .w_cre_tit {
  682. overflow: hidden;
  683. height: .3rem;
  684. font-size: .13rem;
  685. font-weight: normal;
  686. color: #80A5D4;
  687. text-align: left;
  688. line-height: .3rem;
  689. display: flex;
  690. justify-content: flex-start;
  691. align-items: center;
  692. margin-left: 0.1rem;
  693. max-width: 170px;
  694. margin-top: 0.02rem;
  695. }
  696. .w_icon_tit{
  697. width: 0.15rem;
  698. height: 0.15rem;
  699. margin-right: 0.05rem;
  700. display: inline-block;
  701. margin-bottom: 0.02rem;
  702. }
  703. /*.w_tips_box{*/
  704. /* display: flex;*/
  705. /* justify-content: flex-start;*/
  706. /* align-items: center;*/
  707. /*}*/
  708. .w_text_tips{
  709. height:0.16rem;
  710. border-radius:0.08rem;
  711. font-size:0.12rem;
  712. font-family:PingFangSC-Regular,PingFang SC;
  713. font-weight:400;
  714. color:rgba(202,196,196,1);
  715. line-height:0.16rem;
  716. text-align: center;
  717. display: inline-block;
  718. border:0.01rem solid rgba(214,214,214,1);
  719. padding:0 0.04rem;
  720. }
  721. .w_text_tips:nth-of-type(1) {
  722. margin-right: 0.02rem;
  723. }