chapter.css 32 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743
  1. @charset "utf-8";
  2. * {
  3. font-family: \\5FAE\8F6F\96C5\9ED1, microsoft yahei;
  4. border: 0;
  5. margin: 0;
  6. padding: 0;
  7. background: transparent;
  8. font-weight: normal;
  9. font-style: normal;
  10. word-break: break-all;
  11. word-wrap: break-word;
  12. text-decoration: none;
  13. list-style: none;
  14. outline: none;
  15. -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  16. }
  17. body {
  18. font-size: 14px;
  19. text-align: justify;
  20. }
  21. a {
  22. -webkit-tap-highlight-color: transparent;
  23. -webkit-touch-callout: none;
  24. -webkit-user-select: none;
  25. }
  26. select, input, textarea {
  27. border: none;
  28. font-size: 14px;
  29. display: block;
  30. width: 100%;
  31. box-sizing: border-box;
  32. -webkit-box-sizing: border-box;
  33. appearance: none;
  34. -webkit-appearance: none;
  35. background: none;
  36. color: #666;
  37. resize: none;
  38. }
  39. input[type="button"], input[type="submit"], input[type="reset"], input[type="number"] {
  40. -webkit-appearance: none;
  41. -moz-appearance: none;
  42. appearance: none;
  43. }
  44. ::-webkit-input-placeholder {
  45. color: #d2d2d2;
  46. }
  47. :-moz-placeholder {
  48. color: #d2d2d2;
  49. }
  50. ::-moz-placeholder {
  51. color: #d2d2d2;
  52. }
  53. :-ms-input-placeholder {
  54. color: #d2d2d2;
  55. }
  56. input::-webkit-outer-spin-button,
  57. input::-webkit-inner-spin-button {
  58. -webkit-appearance: none !important;
  59. margin: 0;
  60. }
  61. html{
  62. height: 100%;
  63. }
  64. body{
  65. min-height: 100%;
  66. background-color:#eee;
  67. }
  68. /*内容页可点击*/
  69. .menu_position_101 {
  70. position: relative;
  71. left: 0;
  72. top: 0;
  73. z-index: 101;
  74. }
  75. /**/
  76. .read_tit_box {
  77. padding-top: 15px;
  78. }
  79. .read_tit_box a{
  80. float: right;
  81. padding: 0 6px;
  82. height: 33px;
  83. font-size: 14px;
  84. color: #4ab0fe;
  85. line-height: 33px;
  86. }
  87. .menu_box {
  88. display: none;
  89. overflow: hidden;
  90. position: fixed;
  91. left: 0;
  92. top: 0;
  93. right: 0;
  94. bottom: 0;
  95. z-index: 1000;
  96. }
  97. .menu_box i {
  98. position: absolute;
  99. left: 0;
  100. top: 0;
  101. right: 0;
  102. bottom: 0;
  103. }
  104. .menu_head {
  105. position: absolute;
  106. left: 0;
  107. top: 0;
  108. right: 0;
  109. height: 46px;
  110. background-color: #24242b;
  111. }
  112. .menu_head_but {
  113. height: 46px;
  114. }
  115. .return_page {
  116. float: left;
  117. height: 46px;
  118. width: 46px;
  119. background: url(/assets/img/frontend/icon/return_icon_1.png) no-repeat center center;
  120. background-size: 10px auto;
  121. }
  122. .menu_h_more {
  123. float: right;
  124. height: 46px;
  125. width: 46px;
  126. background: url(/assets/img/frontend/icon/more_icon_1.png) no-repeat center center;
  127. background-size: 21px auto;
  128. }
  129. .menu_h_reading {
  130. float: right;
  131. height: 46px;
  132. width: 46px;
  133. background: url(/assets/img/frontend/icon/more_icon_2.png) no-repeat center center;
  134. background-size: 21px auto;
  135. }
  136. .menu_h_more_list {
  137. overflow: hidden;
  138. position: absolute;
  139. padding: 8px 0;
  140. right: 0;
  141. top: 46px;
  142. width: 120px;
  143. background-color: rgba(36, 36, 43, 0.9);
  144. -webkit-transition: -webkit-transform 0.15s;
  145. transition: transform 0.15s;
  146. -webkit-transform: translateX(100%);
  147. transform: translateX(100%);
  148. }
  149. .menu_list_show {
  150. -webkit-transform: translateX(0);
  151. transform: translateX(0);
  152. }
  153. .menu_h_more_list a {
  154. margin: 3px 0;
  155. display: block;
  156. height: 34px;
  157. font-size: 14px;
  158. color: #fff;
  159. text-align: center;
  160. line-height: 34px;
  161. }
  162. .menu_footer {
  163. position: absolute;
  164. left: 0;
  165. right: 0;
  166. bottom: 0;
  167. height: 50px;
  168. }
  169. .menu_footer_but .m_f_day{
  170. display: none;
  171. }
  172. .m_f_prev {
  173. background-image: url(/assets/img/frontend/icon/menu_icon_1.png);
  174. }
  175. .m_f_catalog {
  176. background-image: url(/assets/img/frontend/icon/menu_icon_2.png);
  177. }
  178. .m_f_set {
  179. background-image: url(/assets/img/frontend/icon/menu_icon_3.png);
  180. }
  181. .m_f_day {
  182. background-size:.26rem;
  183. background-image: url(/assets/img/frontend/chapter/icon-night-1.png);
  184. }
  185. .m_f_night {
  186. background-size:.26rem;
  187. background-image: url(/assets/img/frontend/chapter/icon-night-0.png);
  188. }
  189. .m_f_next {
  190. background-image: url(/assets/img/frontend/icon/menu_icon_5.png);
  191. }
  192. .m_f_set_box {
  193. position: absolute;
  194. left: 0;
  195. right: 0;
  196. bottom: 50px;
  197. padding: 8px 8px 0;
  198. overflow: hidden;
  199. background-color: rgba(36, 36, 43, 0.9);
  200. -webkit-transition: -webkit-transform 0.15s;
  201. transition: transform 0.15s;
  202. -webkit-transform: translateY(200%);
  203. transform: translateY(200%);
  204. }
  205. .menu_set_show {
  206. -webkit-transform: translateY(0);
  207. transform: translateY(0);
  208. }
  209. .m_f_set_fontsize {
  210. margin-bottom: 16px;
  211. overflow: hidden;
  212. position: relative;
  213. left: 0;
  214. top: 0;
  215. }
  216. .m_f_font_min,
  217. .m_f_font_max {
  218. position: absolute;
  219. top: 0;
  220. height: 30px;
  221. width: 50px;
  222. text-align: center;
  223. color: #fff;
  224. font-size: 16px;
  225. line-height: 30px;
  226. }
  227. .m_f_font_min {
  228. left: 0;
  229. }
  230. .m_f_font_max {
  231. right: 0;
  232. }
  233. .m_f_font_range_box {
  234. position: relative;
  235. left: 0;
  236. top: 0;
  237. margin: 0 54px;
  238. height: 30px;
  239. }
  240. .m_f_font_rage {
  241. position: absolute;
  242. left: 0;
  243. top: 14px;
  244. right: 0;
  245. z-index: 100;
  246. height: 2px;
  247. border-left: 0 solid #ed424b;
  248. background-color: rgba(225, 225, 225, 0.2);
  249. }
  250. .m_f_font_rage span {
  251. position: absolute;
  252. left: 0px;
  253. top: -5px;
  254. margin-left: -6px;
  255. height: 12px;
  256. width: 12px;
  257. background-color: #fff;
  258. -moz-border-radius: 12px;
  259. -webkit-border-radius: 12px;
  260. border-radius: 12px;
  261. }
  262. .m_f_font_rage .m_f_font_left_1 {
  263. left: 0;
  264. }
  265. .m_f_font_rage .m_f_font_left_2 {
  266. left: 25%;
  267. }
  268. .m_f_font_rage .m_f_font_left_3 {
  269. left: 50%;
  270. }
  271. .m_f_font_rage .m_f_font_left_4 {
  272. left: 75%;
  273. }
  274. .m_f_font_rage .m_f_font_left_5 {
  275. left: 100%;
  276. }
  277. .m_f_input_range {
  278. display: block;
  279. position: absolute;
  280. left: 0;
  281. right: 0;
  282. top: 8px;
  283. z-index: 200;
  284. height: 14px;
  285. opacity: 0;
  286. filter: alpha(opacity=0);
  287. }
  288. .m_f_set_bg_box {
  289. overflow: hidden;
  290. margin: 0 0 16px;
  291. }
  292. .m_f_set_font_main {
  293. margin-top: 10px;
  294. }
  295. .m_f_set_font_main a {
  296. background-color: #eee;
  297. }
  298. .m_f_set_bg_but_1 {
  299. background-color: #eee;
  300. }
  301. .m_f_set_bg_but_2 {
  302. background-color: #dfedd6;
  303. }
  304. .m_f_set_bg_but_3 {
  305. background-color: #f8ceda;
  306. }
  307. .m_f_set_bg_but_4,
  308. .read_theme_4 .read_recharge_tit_annotation span,
  309. .read_theme_4 .read_recharge_tit_null span {
  310. background-color: #f3cb9d;
  311. }
  312. .read_theme_1,
  313. .read_theme_1 .read_fiexd_tit h1,
  314. .read_theme_1 .read_recharge_tit_annotation span,
  315. .read_theme_1 .read_recharge_tit_null span {
  316. background-color: #dfedd6;
  317. }
  318. .read_theme_2,
  319. .read_theme_2 .read_fiexd_tit h1,
  320. .read_theme_2 .read_recharge_tit_annotation span,
  321. .read_theme_2 .read_recharge_tit_null span {
  322. background-color: #f8ceda;
  323. }
  324. .read_theme_3,
  325. .read_theme_3 .read_fiexd_tit h1,
  326. .read_theme_3 .read_recharge_tit_annotation span,
  327. .read_theme_3 .read_recharge_tit_null span {
  328. background-color: #f3cb9d;
  329. }
  330. .read_theme_4 {
  331. background: url(/assets/img/frontend/banner/read_theme_4.jpg) repeat-y center center;
  332. background-size: 100% auto;
  333. }
  334. .read_theme_4 .read_fiexd_tit h1 {
  335. background: url(/assets/img/frontend/banner/read_theme_4.jpg) repeat-y center center;
  336. background-size: 100% auto;
  337. }
  338. .read_theme_4 .read_recharge_tit_annotation,
  339. .read_theme_4 .read_recharge_tit_null {
  340. background-image: url(/assets/img/frontend/icon/border_icon_3.png);
  341. }
  342. .read_theme_4 .read_recharge_tit_annotation span,
  343. .read_theme_4 .read_recharge_tit_null span,
  344. .read_theme_4 .read_chapter_price strong,
  345. .read_theme_4 .read_chapter_price em,
  346. .read_theme_4 .read_chapter_price i,
  347. .read_theme_4 .read_fiexd_tit h1,
  348. .read_theme_4 .read_charge_null_price strong {
  349. color: #533722;
  350. }
  351. .read_theme_4 .read_recharge_more_but_1 {
  352. border-color: #c1ae98;
  353. }
  354. .read_theme_4 .read_recharge_tit_annotation span,
  355. .read_theme_4 .read_recharge_tit_null span {
  356. background: url(/assets/img/frontend/banner/read_theme_4.jpg) repeat-y center center;
  357. background-size: auto 286px;
  358. }
  359. .read_theme_3 .read_recharge_but_list a {
  360. background-color: rgba(255, 255, 255, 0.2);
  361. border-color: #e8c6cf;
  362. }
  363. .read_theme_4 .read_recharge_but_list a {
  364. background-color: rgba(255, 255, 255, 0.2);
  365. border-color: #c1ae98;
  366. }
  367. .read_theme_3 .read_recharge_but_select a,
  368. .read_theme_4 .read_recharge_but_select a {
  369. background-image: url(/assets/img/frontend/icon/elect_icon_1.png);
  370. border-color: #44bbff;
  371. }
  372. .read_theme_3 .read_recharge_sms_input {
  373. background-image: url(/assets/img/frontend/icon/sms_icon_3.png);
  374. background-color: #ebdde1;
  375. border-color: #e9cad3;
  376. }
  377. .read_theme_4 .read_recharge_sms_input {
  378. background-image: url(/assets/img/frontend/icon/sms_icon_2.png);
  379. background-color: #dbcebc;
  380. border-color: #c4b19c;
  381. }
  382. .read_theme_3 ::-webkit-input-placeholder {
  383. color: #c3a1ab;
  384. }
  385. .read_theme_3 :-moz-placeholder {
  386. color: #c3a1ab;
  387. }
  388. .read_theme_3 ::-moz-placeholder {
  389. color: #c3a1ab;
  390. }
  391. .read_theme_3 :-ms-input-placeholder {
  392. color: #c3a1ab;
  393. }
  394. .read_theme_4 ::-webkit-input-placeholder {
  395. color: #ad9d8a;
  396. }
  397. .read_theme_4 :-moz-placeholder {
  398. color: #ad9d8a;
  399. }
  400. .read_theme_4 ::-moz-placeholder {
  401. color: #ad9d8a;
  402. }
  403. .read_theme_4 :-ms-input-placeholder {
  404. color: #ad9d8a;
  405. }
  406. .read_theme_5,
  407. .read_theme_5 .read_fiexd_tit h1,
  408. .read_theme_5 .read_recharge_tit_annotation span,
  409. .read_theme_5 .read_recharge_tit_null span {
  410. background: #1d1d1f;
  411. }
  412. .read_theme_5 .read_ewm {
  413. border-color: #604916;
  414. background-color: #29292a;
  415. }
  416. .read_theme_5 .read_ewm_other strong {
  417. color: #9c7317;
  418. }
  419. .read_theme_5 .read_fiexd_tit h1,
  420. .read_theme_5 .read_tit_box h2,
  421. .read_theme_5 .read_tit_box strong,
  422. .read_theme_5 .read_main_p p,
  423. .read_theme_5 .read_main_loading strong,
  424. .read_theme_5 .read_main_next,
  425. .read_theme_5 .read_recharge_tit_annotation span,
  426. .read_theme_5 .read_ewm_body em,
  427. .read_theme_5 .read_ewm_other h3,
  428. .read_theme_5 .read_recharge_tit_null span {
  429. color: #7e8286;
  430. }
  431. .read_theme_5 .read_main_next {
  432. background-color: #555;
  433. }
  434. .read_theme_5 .read_main_loading span {
  435. opacity: 0.3;
  436. }
  437. .read_theme_5 .m_f_night {
  438. display: none;
  439. }
  440. .read_theme_5 .m_f_day {
  441. display: block;
  442. }
  443. .read_theme_5 .read_recharge_list_tit,
  444. .read_theme_5 .read_recharge_sms_input input {
  445. color: #7e8286;
  446. }
  447. .read_theme_5 .read_recharge_but_list a strong,
  448. .read_theme_5 .read_recharge_but_list a em,
  449. .read_theme_5 .read_chapter_price strong,
  450. .read_theme_5 .read_chapter_price em,
  451. .read_theme_5 .read_chapter_price i {
  452. color: #56585c;
  453. }
  454. .read_theme_5 .read_recharge_tit_annotation span,
  455. .read_theme_5 .read_recharge_list_tit span {
  456. color: #6a7a8a;
  457. }
  458. .read_theme_5 .read_chapter_price em span,
  459. .read_theme_5 .read_recharge_but_list a em span,
  460. .read_theme_5 .read_recharge_sms_box span,
  461. .read_theme_5 .read_ewm_body p span {
  462. color: #a43334;
  463. }
  464. .read_theme_5 .read_recharge_but_list i {
  465. color: #c69797;
  466. background-color: #8c2e2f;
  467. }
  468. .read_theme_5 .read_recharge_sms_input {
  469. border-color: #29292a;
  470. background-color: #29292a;
  471. }
  472. .read_theme_5 .read_recharge_but_list a {
  473. background-color: #29292a;
  474. border-color: #29292a;
  475. }
  476. .read_theme_5 .read_recharge_more_but_1 {
  477. border-color: #5a5c5f;
  478. }
  479. .read_theme_5 .read_recharge_but_select a {
  480. background-image: url(/assets/img/frontend/icon/elect_icon_2.png);
  481. border-color: #2559a6;
  482. }
  483. .read_theme_5 .read_recharge_sms_but,
  484. .read_theme_5 .read_charge_order_but {
  485. background-color: #2559a6;
  486. color: #92acd3;
  487. -moz-box-shadow: 0 4px 3px rgba(37, 89, 166, 0.2);
  488. -webkit-box-shadow: 0 4px 3px rgba(37, 89, 166, 0.2);
  489. box-shadow: 0 4px 3px rgba(37, 89, 166, 0.2);
  490. }
  491. /*read_fiexd_tit f84545*/
  492. .read_fiexd_tit {
  493. height: 36px;
  494. }
  495. .read_fiexd_tit h1 {
  496. overflow: hidden;
  497. padding: 0 20px;
  498. position: fixed;
  499. left: 0;
  500. top: 0;
  501. right: 0;
  502. z-index: 1000;
  503. height: 36px;
  504. background-color: #eee;
  505. font-size: 12px;
  506. color: #a1a3a5;
  507. line-height: 36px;
  508. text-align: justify;
  509. box-sizing: border-box;
  510. }
  511. .read_body {
  512. min-height: 100%;
  513. overflow: hidden;
  514. text-align: justify;
  515. }
  516. .read_b_banner {
  517. margin: 0 0 10px;
  518. position: relative;
  519. left: 0;
  520. top: 0;
  521. overflow: hidden;
  522. }
  523. .read_b_banner img {
  524. display: block;
  525. width: 100%;
  526. }
  527. .read_b_close {
  528. position: absolute;
  529. left: 0;
  530. top: 0;
  531. bottom: 0;
  532. right: 93%;
  533. }
  534. .read_b_blank {
  535. position: absolute;
  536. left: 7%;
  537. top: 0;
  538. bottom: 0;
  539. right: 0;
  540. }
  541. .read_content_list {
  542. padding: 0 20px;
  543. }
  544. .read_main_box,
  545. .read_tit_box,
  546. .read_main_p,
  547. .read_main_p p,
  548. .read_main_other_box,
  549. .read_main_loading,
  550. .read_main_banner,
  551. .read_main_banner_img,
  552. .read_ewm {
  553. overflow: hidden;
  554. }
  555. .read_main_other_box {
  556. padding-bottom: 20px;
  557. }
  558. .read_main_banner {
  559. margin: 20px 0;
  560. }
  561. .read_tit_box h2 {
  562. font-size: 24px;
  563. color: #1d1b1b;
  564. line-height: 1.4;
  565. }
  566. .read_tit_box strong {
  567. padding: 10px 0;
  568. display: block;
  569. font-size: 12px;
  570. color: #6a7a8a;
  571. line-height: 1.4;
  572. }
  573. .read_main_p p {
  574. margin: 10px 0;
  575. font-size: 18px;
  576. color: #333;
  577. text-indent: 36px;
  578. line-height: 1.75;
  579. }
  580. .read_main_p p:first-child {
  581. display: none;
  582. }
  583. .read_main_loading {
  584. display: none;
  585. white-space: nowrap;
  586. font-size: 0;
  587. text-align: center;
  588. }
  589. .read_main_loading span,
  590. .read_main_loading strong {
  591. display: inline-block;
  592. *display: inline;
  593. *zoom: 1;
  594. margin: 0 2px;
  595. font-size: 14px;
  596. line-height: 42px;
  597. vertical-align: middle;
  598. }
  599. .read_main_loading span {
  600. overflow: hidden;
  601. height: 10px;
  602. width: 32px;
  603. background: url(/assets/img/frontend/icon/loading.gif) no-repeat 0 0;
  604. background-size: 32px 10px;
  605. }
  606. .read_main_loading strong {
  607. margin-left: 4px;
  608. color: #6a7a8a;
  609. }
  610. .read_main_next {
  611. margin: 20px 0;
  612. height: 44px;
  613. background-color: #f4f6f8;
  614. font-size: 16px;
  615. color: #6a7a8a;
  616. text-align: center;
  617. line-height: 44px;
  618. -moz-border-radius: 44px;
  619. -webkit-border-radius: 44px;
  620. border-radius: 44px;
  621. }
  622. .read_main_banner_img a {
  623. display: block;
  624. overflow: hidden;
  625. }
  626. .read_main_banner_img img {
  627. display: block;
  628. width: 100%;
  629. }
  630. .read_ewm {
  631. padding: 10px;
  632. box-sizing: border-box;
  633. }
  634. .read_ewm_img_box {
  635. margin: 0 auto;
  636. width: 240px;
  637. overflow: hidden;
  638. }
  639. .read_ewm_img {
  640. margin: 0 auto;
  641. overflow: hidden;
  642. width: 120px;
  643. }
  644. .read_ewm_img img {
  645. display: block;
  646. width: 100%;
  647. }
  648. .read_ewm_img_box span {
  649. display: block;
  650. height: 30px;
  651. font-size: 14px;
  652. color: #a1a3a5;
  653. text-align: center;
  654. line-height: 30px;
  655. }
  656. .read_ewm_other {
  657. margin: 0 100px 0 0;
  658. }
  659. .read_ewm_other h3 {
  660. margin-bottom: 6px;
  661. height: 30px;
  662. font-size: 20px;
  663. color: #000;
  664. line-height: 30px;
  665. }
  666. .read_ewm_other span {
  667. display: block;
  668. font-size: 12px;
  669. color: #666;
  670. line-height: 20px;
  671. }
  672. .read_ewm_other strong {
  673. margin-top: 14px;
  674. display: block;
  675. font-size: 12px;
  676. color: #e6a30c;
  677. line-height: 20px;
  678. }
  679. .read_body_fontsize_1 .read_main_p p {
  680. text-indent: .28rem;
  681. font-size: .20rem;
  682. }
  683. .read_body_fontsize_2 .read_main_p p {
  684. text-indent: .36rem;
  685. font-size: .22rem;
  686. }
  687. .read_body_fontsize_3 .read_main_p p {
  688. text-indent: .44rem;
  689. font-size: .24rem;
  690. }
  691. .read_body_fontsize_4 .read_main_p p {
  692. text-indent: .42rem;
  693. font-size: .21rem;
  694. }
  695. .read_body_fontsize_5 .read_main_p p {
  696. text-indent: .48rem;
  697. font-size: .25rem;
  698. }
  699. .read_catalog_box {
  700. visibility: hidden;
  701. position: fixed;
  702. left: 0;
  703. top: 0;
  704. right: 0;
  705. bottom: 0;
  706. z-index: 3000;
  707. overflow: auto;
  708. -webkit-transition: visibility 0.25s;
  709. transition: visibility 0.25s;
  710. }
  711. .read_catalog_show {
  712. visibility: visible;
  713. -webkit-transition: none;
  714. transition: none;
  715. }
  716. .read_catalog_list {
  717. overflow: hidden;
  718. position: relative;
  719. left: 0;
  720. top: 0;
  721. z-index: 10;
  722. margin-right: 15%;
  723. padding: 0 14px;
  724. display: block;
  725. height: 100%;
  726. white-space: nowrap;
  727. -webkit-transition: -webkit-transform 0.15s;
  728. transition: transform 0.15s;
  729. -webkit-transform: translateX(-100%);
  730. transform: translateX(-100%);
  731. }
  732. .read_catalog_show .read_catalog_list,
  733. .read_catalog_show .read_catalog_loading {
  734. -webkit-transform: translateX(0);
  735. transform: translateX(0);
  736. }
  737. .read_catalog_box i {
  738. position: absolute;
  739. left: 0;
  740. top: 0;
  741. right: 0;
  742. bottom: 0;
  743. z-index: 5;
  744. background: rgba(36, 36, 43, 0.9) url(/assets/img/frontend/icon/close_icon_1.png) no-repeat 95% center;
  745. background-size: 22px 22px;
  746. -webkit-transition: opacity 0.25s;
  747. transition: opacity 0.25s;
  748. opacity: 0;
  749. }
  750. .read_catalog_show i {
  751. opacity: 1;
  752. }
  753. .read_catalog_tit {
  754. height: 50px;
  755. }
  756. .read_catalog_tit strong {
  757. float: left;
  758. height: 50px;
  759. font-size: 16px;
  760. color: #333;
  761. line-height: 50px;
  762. }
  763. .read_catalog_tit span {
  764. float: right;
  765. padding-right: 26px;
  766. height: 50px;
  767. background: url(/assets/img/frontend/icon/list_icon_1.png) no-repeat right center;
  768. background-size: 16px auto;
  769. font-size: 16px;
  770. color: #333;
  771. line-height: 50px;
  772. }
  773. .read_catalog_tit .read_reverse_sequence {
  774. background-image: url(/assets/img/frontend/icon/list_icon_2.png);
  775. }
  776. .read_catalog_ul {
  777. overflow: auto;
  778. position: absolute;
  779. left: 0;
  780. top: 50px;
  781. right: 0;
  782. bottom: 50px;
  783. padding: 0 14px;
  784. box-sizing: border-box;
  785. }
  786. .more_mun_but {
  787. position: absolute;
  788. left: 0;
  789. right: 0;
  790. bottom: 0;
  791. height: 50px;
  792. width: 100%;
  793. overflow: hidden;
  794. display: block;
  795. font-size: 14px;
  796. color: #44bbff;
  797. text-align: center;
  798. white-space: normal;
  799. word-break: break-all;
  800. word-wrap: break-word;
  801. line-height: 50px;
  802. border-top: 1px solid #edf0fa;
  803. }
  804. .read_catalog_ul_touch {
  805. -webkit-overflow-scrolling: touch;
  806. }
  807. .read_catalog_ul li {
  808. overflow: hidden;
  809. height: 50px;
  810. background-color: #fff;
  811. border-bottom: 1px solid #edf0fa;
  812. }
  813. .read_catalog_ul li a {
  814. overflow: hidden;
  815. display: block;
  816. height: 50px;
  817. font-size: 14px;
  818. color: #a1a3a5;
  819. white-space: normal;
  820. word-break: break-all;
  821. word-wrap: break-word;
  822. line-height: 50px;
  823. }
  824. .read_catalog_ul li a:visited,
  825. .read_catalog_ul li a {
  826. color: #3a4a5a;
  827. }
  828. .read_catalog_ul li a.read_catalog_elect {
  829. color: #5599ff;
  830. }
  831. .read_catalog_loading {
  832. position: absolute;
  833. left: 0;
  834. top: 0;
  835. right: 15%;
  836. bottom: 0;
  837. z-index: 6;
  838. padding-top: 50%;
  839. box-sizing: border-box;
  840. background-color: #fff;
  841. -webkit-transition: -webkit-transform 0.15s;
  842. transition: transform 0.15s;
  843. -webkit-transform: translateX(-100%);
  844. transform: translateX(-100%);
  845. }
  846. .read_catalog_loading_img_1 {
  847. margin: 0 auto 20px;
  848. width: 210px;
  849. height: 155px;
  850. background: url(/assets/img/frontend/icon/loading_icon_2.gif) no-repeat center center;
  851. background-size: 210px 155px;
  852. }
  853. .read_catalog_loading strong {
  854. display: block;
  855. font-size: 14px;
  856. color: #6a7a8a;
  857. text-align: center;
  858. line-height: 30px;
  859. }
  860. .read_catalog_loading_hide .read_catalog_loading_img_1,
  861. .read_catalog_loading_hide strong {
  862. display: none;
  863. }
  864. .menu_evocation_box {
  865. position: fixed;
  866. left: 0;
  867. top: 0;
  868. right: 0;
  869. bottom: 0;
  870. z-index: 100;
  871. }
  872. .menu_evocation_box span,
  873. .menu_evocation_box strong {
  874. display: block;
  875. width: 100%;
  876. }
  877. .menu_evocation_box span {
  878. height: 30%;
  879. }
  880. .menu_evocation_box strong {
  881. height: 40%;
  882. }
  883. /*read_fiexd_tit end*/
  884. /*微信扫码*/
  885. .fiexd_ewm_box {
  886. display: none;
  887. position: fixed;
  888. z-index: 5000;
  889. left: 0;
  890. top: 0;
  891. right: 0;
  892. bottom: 0;
  893. width: 100%;
  894. overflow: hidden;
  895. background-color: rgba(27, 27, 27, 0.8);
  896. font-size: 0;
  897. white-space: nowrap;
  898. text-align: center;
  899. }
  900. .f_main_cloes {
  901. float: right;
  902. margin-top: 4px;
  903. width: 40px;
  904. height: 40px;
  905. background: url(/assets/img/frontend/icon/cha_icon_2.png) no-repeat center center;
  906. background-size: 18px 18px;
  907. }
  908. .f_main_cloes_2 {
  909. overflow: hidden;
  910. display: block;
  911. margin: 15px auto 0;
  912. height: 26px;
  913. width: 26px;
  914. background: url(/assets/img/frontend/icon/close_icon_3.png) no-repeat center center;
  915. background-size: 14px 14px;
  916. border-radius: 26px;
  917. border: 1px solid #fff;
  918. }
  919. .f_main_box,
  920. .f_align {
  921. display: inline-block;
  922. *display: inline;
  923. *zoom: 1;
  924. vertical-align: middle;
  925. }
  926. .f_align {
  927. margin-left: -1px;
  928. height: 100%;
  929. width: 1px;
  930. }
  931. .f_main_box {
  932. width: 280px;
  933. }
  934. .f_main_info {
  935. overflow: hidden;
  936. background-color: #fff;
  937. border-radius: 6px;
  938. }
  939. .f_mian_title {
  940. padding: 15px 0 0;
  941. overflow: hidden;
  942. }
  943. .f_mian_title h3 {
  944. height: 32px;
  945. font-size: 18px;
  946. color: #5e6a94;
  947. text-align: center;
  948. line-height: 32px;
  949. }
  950. .f_mian_title p {
  951. text-align: center;
  952. font-size: 13px;
  953. color: #fb6b69;
  954. line-height: 20px;
  955. }
  956. .f_mian_img {
  957. overflow: hidden;
  958. margin: 10px auto;
  959. padding: 10px;
  960. width: 160px;
  961. height: 160px;
  962. box-sizing: border-box;
  963. border: 1px #dfe1e6 solid;
  964. -moz-box-shadow: 0 2px 3px 0px rgba(94, 106, 148, 0.3);
  965. -webkit-box-shadow: 0 2px 3px 0px rgba(94, 106, 148, 0.3);
  966. box-shadow: 0 2px 3px 0px rgba(94, 106, 148, 0.3);
  967. }
  968. .f_mian_img canvas,
  969. .f_mian_img img {
  970. display: block;
  971. width: 100%;
  972. height: 100%;
  973. }
  974. .f_main_text,
  975. .f_main_text strong,
  976. .f_main_text span {
  977. display: block;
  978. overflow: hidden;
  979. font-size: 14px;
  980. font-weight: normal;
  981. color: #5e6a94;
  982. text-align: center;
  983. white-space: normal;
  984. line-height: 18px;
  985. }
  986. .f_main_text {
  987. padding: 0 16px 16px;
  988. }
  989. .f_main_text strong,
  990. .f_main_text span {
  991. margin: 4px 0;
  992. }
  993. .f_main_text span {
  994. font-size: 10px;
  995. }
  996. .f_main_tomorrow_but {
  997. display: block;
  998. height: 46px;
  999. border-top: 1px solid #dfe1e6;
  1000. text-align: center;
  1001. font-size: 15px;
  1002. color: #77a4ff;
  1003. line-height: 46px;
  1004. }
  1005. .f_main_over {
  1006. display: block;
  1007. margin: -8px auto 8px;
  1008. width: 200px;
  1009. height: 36px;
  1010. background-color: #f6f6f6;
  1011. border: 1px solid #ddd;
  1012. font-size: 14px;
  1013. color: #333;
  1014. text-align: center;
  1015. line-height: 36px;
  1016. border-radius: 4px;
  1017. }
  1018. /*弹出框*/
  1019. .bind_alert_box {
  1020. display: none;
  1021. position: fixed;
  1022. left: 0;
  1023. top: 0;
  1024. right: 0;
  1025. bottom: 0;
  1026. padding: 20px 0;
  1027. overflow: hidden;
  1028. background-color: rgba(0, 0, 0, 0.5);
  1029. text-align: center;
  1030. font-size: 0;
  1031. z-index: 3000;
  1032. }
  1033. .bind_alert_main,
  1034. .bind_alert_height {
  1035. display: inline-block;
  1036. *display: inline;
  1037. *zoom: 1;
  1038. vertical-align: middle;
  1039. }
  1040. .bind_alert_height {
  1041. height: 100%;
  1042. overflow: hidden;
  1043. width: 1px;
  1044. margin-left: -10px;
  1045. }
  1046. .bind_alert_main {
  1047. overflow: hidden;
  1048. width: 240px;
  1049. background-color: #fff;
  1050. border-radius: 6px;
  1051. font-size: 14px;
  1052. -moz-box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.3);
  1053. -webkit-box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.3);
  1054. box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.3);
  1055. }
  1056. .alert_tit {
  1057. text-align: center;
  1058. overflow: hidden;
  1059. height: 40px;
  1060. }
  1061. .alert_tit_clear {
  1062. margin: 5px 5px 0 0;
  1063. float: right;
  1064. width: 30px;
  1065. height: 30px;
  1066. background: url(/assets/img/frontend/icon/cha_icon_2.png) no-repeat center center;
  1067. background-size: 18px auto;
  1068. }
  1069. .alert_tit h2 {
  1070. margin: 0 40px;
  1071. overflow: hidden;
  1072. height: 40px;
  1073. font-size: 16px;
  1074. color: #808080;
  1075. text-align: center;
  1076. line-height: 40px;
  1077. }
  1078. .alert_tit h3 {
  1079. margin-top: 10px;
  1080. padding-left: 22px;
  1081. display: inline-block;
  1082. *display: inline;
  1083. *zoom: 1;
  1084. overflow: hidden;
  1085. height: 30px;
  1086. background: url(/assets/img/frontend/icon/warning_icon_2.png) no-repeat 0 center;
  1087. background-size: 18px auto;
  1088. font-size: 16px;
  1089. color: #333;
  1090. text-align: center;
  1091. line-height: 30px;
  1092. }
  1093. .alert_text {
  1094. padding: 10px;
  1095. }
  1096. .alert_txt_c {
  1097. font-size: 14px;
  1098. color: #808080;
  1099. text-align: left;
  1100. line-height: 20px;
  1101. }
  1102. .alert_but_box {
  1103. border-top: 1px solid #d8d8d8;
  1104. overflow: hidden;
  1105. }
  1106. .alert_but_box a {
  1107. display: block;
  1108. float: left;
  1109. width: 50%;
  1110. box-sizing: border-box;
  1111. }
  1112. .alert_but_1 {
  1113. height: 36px;
  1114. font-size: 15px;
  1115. color: #ff6fa2;
  1116. text-align: center;
  1117. line-height: 36px;
  1118. }
  1119. .unicom_input_box {
  1120. overflow: hidden;
  1121. margin: 10px 16px 0;
  1122. padding: 5px 6px;
  1123. height: 28px;
  1124. border: 1px solid #d8d8d8;
  1125. background-color: #fff;
  1126. border-radius: 4px;
  1127. }
  1128. .unicom_input_box input {
  1129. display: block;
  1130. width: 100%;
  1131. height: 28px;
  1132. border: 0;
  1133. margin: 0;
  1134. padding: 0;
  1135. font-size: 14px;
  1136. color: #333;
  1137. line-height: 28px;
  1138. }
  1139. .unicom_new_msg {
  1140. padding: 0 16px;
  1141. height: 34px;
  1142. text-align: right;
  1143. line-height: 24px;
  1144. }
  1145. .unicom_new_msg a,
  1146. .unicom_new_msg span {
  1147. font-size: 12px;
  1148. color: #4ab0fe;
  1149. line-height: 28px;
  1150. }
  1151. .marquee_text {
  1152. margin-bottom: 10px;
  1153. text-align: justify;
  1154. padding: 5px 16px;
  1155. background-color: #fffacb;
  1156. }
  1157. .marquee_main {
  1158. position: relative;
  1159. left: 0;
  1160. top: 0;
  1161. overflow: hidden;
  1162. }
  1163. .marquee_main span {
  1164. display: block;
  1165. font-size: 12px;
  1166. color: #9a6d44;
  1167. line-height: 20px;
  1168. }
  1169. /*read_ewm_body*/
  1170. .read_ewm_body {
  1171. display: none;
  1172. overflow: hidden;
  1173. padding: 0 20px 220px;
  1174. }
  1175. .read_ewm_body p {
  1176. margin: 20px 0;
  1177. }
  1178. .read_ewm_body p span {
  1179. color: #f84545;
  1180. }
  1181. .read_body_ewm_img {
  1182. margin: 40px auto 10px;
  1183. overflow: hidden;
  1184. width: 180px;
  1185. height: 180px;
  1186. }
  1187. .read_body_ewm_img img {
  1188. display: block;
  1189. width: 180px;
  1190. height: 180px;
  1191. }
  1192. .read_ewm_body em {
  1193. display: block;
  1194. height: 26px;
  1195. font-size: 14px;
  1196. color: #3a4a5a;
  1197. text-align: center;
  1198. line-height: 26px;
  1199. }
  1200. .read_ewm_body a {
  1201. display: block;
  1202. margin: 0 auto;
  1203. height: 30px;
  1204. width: 260px;
  1205. font-size: 14px;
  1206. color: #44bbff;
  1207. text-align: center;
  1208. line-height: 30px;
  1209. }
  1210. .scanIframe {
  1211. overflow: hidden;
  1212. position: absolute;
  1213. left: -100px;
  1214. top: -100px;
  1215. margin: 0;
  1216. padding: 0;
  1217. border: 0;
  1218. height: 1px;
  1219. width: 1px;
  1220. opacity: 0;
  1221. filter: alpha(opacity=0);
  1222. }
  1223. /***my_bookcase****/
  1224. .menu_h_more_list .my_bookcase,
  1225. .menu_h_more_list .menu_h_more_personal_center {
  1226. display: none;
  1227. }
  1228. .read_nex_but {
  1229. display: block;
  1230. margin: 20px 0;
  1231. overflow: hidden;
  1232. height: 36px;
  1233. background-color: #44bbff;
  1234. font-size: 16px;
  1235. color: #fff;
  1236. text-align: center;
  1237. line-height: 36px;
  1238. border-radius: 36px;
  1239. box-shadow: 0 4px 3px rgba(68, 187, 255, 0.2);
  1240. }
  1241. .read_theme_5 .read_nex_but {
  1242. color: #989898;
  1243. background-color: #555;
  1244. box-shadow: 0 4px 3px rgba(85, 85, 85, 0.2);
  1245. }
  1246. .read_other_box {
  1247. overflow: hidden;
  1248. padding-bottom: 10px;
  1249. }
  1250. .read_other_but_l {
  1251. overflow: hidden;
  1252. float: left;
  1253. padding: 4px 6px;
  1254. height: 24px;
  1255. font-size: 14px;
  1256. color: #31a6ff;
  1257. line-height: 24px;
  1258. }
  1259. .read_other_but_r {
  1260. overflow: hidden;
  1261. float: right;
  1262. padding: 4px 6px;
  1263. height: 24px;
  1264. text-decoration: underline;
  1265. font-size: 14px;
  1266. color: #fb6b69;
  1267. line-height: 24px;
  1268. }
  1269. .read_other_box span {
  1270. overflow: hidden;
  1271. float: left;
  1272. margin: 9px 10px 0;
  1273. height: 14px;
  1274. width: 1px;
  1275. background-color: #31a6ff;
  1276. }
  1277. .recent_reading_but {
  1278. position:absolute;
  1279. padding: 0 24px 0 20px;
  1280. right: 0;
  1281. top: 60px;
  1282. height: 32px;
  1283. background-color: #38383e;
  1284. border-radius: 32px 0 0 32px;
  1285. font-size: 16px;
  1286. color: #fff;
  1287. line-height: 32px;
  1288. z-index: 1001;
  1289. }
  1290. #console_main {
  1291. height: 0;
  1292. font-size: 0;
  1293. }
  1294. .console_box {
  1295. position: fixed;
  1296. left: 0;
  1297. top: 50%;
  1298. right: 0;
  1299. z-index: 5000;
  1300. margin-top: -.23rem;
  1301. height: .46rem;
  1302. font-size: 0;
  1303. text-align: center;
  1304. }
  1305. .console_box span {
  1306. display: inline-block;
  1307. *display: inline;
  1308. *zoom: 1;
  1309. padding: 0 .3rem;
  1310. height: .46rem;
  1311. background-color: rgba(0, 0, 0, 0.9);
  1312. -moz-border-radius: .06rem;
  1313. -webkit-border-radius: .06rem;
  1314. border-radius: .06rem;
  1315. font-size: .14rem;
  1316. color: #fff;
  1317. text-align: center;
  1318. line-height: .46rem;
  1319. }
  1320. .page-guide-and {
  1321. display: none;
  1322. position: fixed;
  1323. left: 0;
  1324. top: 0;
  1325. bottom: 0;
  1326. z-index: 600;
  1327. width: 100%;
  1328. background: url(/assets/img/android.png);
  1329. background-size: 100% 100%;
  1330. }
  1331. .page-guide-ios {
  1332. display: none;
  1333. position: fixed;
  1334. left: 0;
  1335. top: 0;
  1336. bottom: 0;
  1337. z-index: 600;
  1338. width: 100%;
  1339. background: url(/assets/img/ios.png);
  1340. background-size: 100% 100%;
  1341. }
  1342. .read_tit_box{
  1343. -webkit-touch-callout: none; /* iOS Safari */
  1344. -webkit-user-select: none; /* Chrome/Safari/Opera */
  1345. -khtml-user-select: none; /* Konqueror */
  1346. -moz-user-select: none; /* Firefox */
  1347. -ms-user-select: none; /* Internet Explorer/Edge */
  1348. user-select: none; /* Non-prefixed version, currentlynot supported by any browser */
  1349. }
  1350. .read_pop_icon{
  1351. position:fixed;
  1352. right: .12rem;
  1353. top: 1.5rem;
  1354. z-index: 100;
  1355. height: 1.03rem;
  1356. width: .86rem;
  1357. }
  1358. .read_pop_icon .rpi_img,
  1359. .read_pop_icon img,
  1360. .rphb_img img{
  1361. display: block;
  1362. height: 100%;
  1363. width: 100%;
  1364. }
  1365. .read_pop_icon .close_rpi{
  1366. position: absolute;
  1367. top: .16rem;
  1368. right: .06rem;
  1369. height: .2rem;
  1370. width: .2rem;
  1371. background: url(../../../img/1.png) no-repeat 0 0;
  1372. background-size: .2rem .2rem;
  1373. }
  1374. .read_pop_hd_box{
  1375. display: none;
  1376. position: fixed;
  1377. left: 0;
  1378. top: 0;
  1379. right: 0;
  1380. bottom: 0;
  1381. z-index: 1000;
  1382. background-color: rgba(0,0,0,.8);
  1383. font-size: 0;
  1384. white-space: nowrap;
  1385. text-align: center;
  1386. }
  1387. .rphb_content,
  1388. .rphb_jgb{
  1389. display: inline-block;
  1390. vertical-align: middle;
  1391. }
  1392. .rphb_jgb{
  1393. overflow: hidden;
  1394. height: 100%;
  1395. width: 1px;
  1396. margin-left: -1px;
  1397. }
  1398. .rphb_content{
  1399. overflow: hidden;
  1400. position: relative;
  1401. left: 0;
  1402. top: 0;
  1403. padding-bottom:20px;
  1404. }
  1405. .rphb_img{
  1406. display: block;
  1407. overflow: hidden;
  1408. height: 368px;
  1409. width: 307px;
  1410. }
  1411. .close_rphb{
  1412. position: absolute;
  1413. right:14px;
  1414. top: 30px;
  1415. height: 25px;
  1416. width: 25px;
  1417. background: url(../../../img/frontend/christmas_style/christmas_close.png) no-repeat 0 0;
  1418. background-size: 100% 100%;
  1419. }
  1420. /*章末推荐书籍*/
  1421. #read_recommend {
  1422. width: 100%;
  1423. position: relative;
  1424. bottom: 0;
  1425. padding: 0 14.4px;
  1426. overflow: hidden;
  1427. box-sizing: border-box;
  1428. }
  1429. #read_recommend .read_recommend_cover {
  1430. float: left;
  1431. position: relative;
  1432. width: 25%;
  1433. height: 100px;
  1434. border-radius: 0 0 4px 0;
  1435. background-color: #f1f1f1;
  1436. margin-right: 3%;
  1437. }
  1438. #read_recommend .read_recommend_cover .read_recommend_tag {
  1439. position: absolute;
  1440. display: inline-block;
  1441. width: 52px;
  1442. height: 15px;
  1443. line-height: 15px;
  1444. background: #fbd345;
  1445. border-radius: 0 0px 4px 0px;
  1446. font-size: 12px;
  1447. font-family: PingFangSC-Regular, PingFang SC;
  1448. font-weight: 400;
  1449. color: #000000;
  1450. text-align: center;
  1451. z-index: 999;
  1452. }
  1453. #read_recommend .read_recommend_cover img {
  1454. display: block;
  1455. width: 100%;
  1456. height: 100%;
  1457. position: relative;
  1458. }
  1459. #read_recommend .read_recommend_detail {
  1460. width: 72%;
  1461. float: right;
  1462. }
  1463. #read_recommend .read_recommend_detail .read_recommend_bookname {
  1464. margin: 0;
  1465. padding: 0;
  1466. height: 20px;
  1467. line-height: 20px;
  1468. text-align: left;
  1469. font-size: 15px;
  1470. font-family: PingFangSC-Medium, PingFang SC;
  1471. font-weight: 500;
  1472. color: rgba(0, 0, 0, 0.7);
  1473. margin-bottom: 7.2px;
  1474. }
  1475. #read_recommend .read_recommend_detail .read_recommend_desc {
  1476. margin: 0;
  1477. padding: 0;
  1478. font-size: 12px;
  1479. font-family: PingFangSC-Regular, PingFang SC;
  1480. font-weight: 400;
  1481. color: rgba(0, 0, 0, 0.6);
  1482. line-height: 18px;
  1483. display: -webkit-box;
  1484. -webkit-box-orient: vertical;
  1485. -webkit-line-clamp: 2;
  1486. overflow: hidden;
  1487. }
  1488. #read_recommend .read_recommend_detail .read_recommend_bottom {
  1489. margin-top: 7.6px;
  1490. height: 29px;
  1491. overflow: hidden;
  1492. }
  1493. #read_recommend .read_recommend_detail .read_recommend_bottom .read_recommend_author {
  1494. float: left;
  1495. margin-top: 12px;
  1496. height: 16px;
  1497. font-size: 12px;
  1498. font-family: PingFangSC-Regular, PingFang SC;
  1499. font-weight: 400;
  1500. color: rgba(0, 0, 0, 0.6);
  1501. line-height: 16px;
  1502. }
  1503. #read_recommend .read_recommend_detail .read_recommend_bottom .read_recommend_start_read {
  1504. float: right;
  1505. width: 90px;
  1506. height: 29px;
  1507. line-height: 29px;
  1508. background: #000000;
  1509. border-radius: 14px;
  1510. opacity: 0.55;
  1511. font-size: 12px;
  1512. font-family: PingFangSC-Regular, PingFang SC;
  1513. font-weight: 400;
  1514. color: #ffffff;
  1515. text-align: center;
  1516. text-decoration: none;
  1517. }