shukan.less 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766
  1. @charset "utf-8";
  2. * {
  3. margin: 0;
  4. padding: 0;
  5. font-family: "微软雅黑", "microsoft yahei";
  6. }
  7. ul,
  8. ol {
  9. list-style: none;
  10. }
  11. a:active {
  12. text-decoration: none;
  13. }
  14. a:hover {
  15. text-decoration: none;
  16. }
  17. a:visited {
  18. text-decoration: none;
  19. }
  20. a:link {
  21. text-decoration: none;
  22. }
  23. a:focus {
  24. text-decoration: none;
  25. }
  26. body {
  27. position: relative;
  28. }
  29. .clearfix {
  30. overflow: hidden;
  31. }
  32. .clearfix_2::after {
  33. content: '';
  34. display: block;
  35. height: 0;
  36. visibility: hidden;
  37. clear: both;
  38. }
  39. .hiddenColor {
  40. visibility: hidden;
  41. }
  42. .hand {
  43. cursor: pointer;
  44. }
  45. .aTag_parent {
  46. position: relative;
  47. }
  48. .aTag_parent>a,
  49. .aTag {
  50. display: block;
  51. width: 100%;
  52. height: 100%;
  53. position: absolute;
  54. z-index: 99;
  55. border: 0px;
  56. top: 0px;
  57. left: 0px;
  58. background: rgba(0, 0, 0, 0);
  59. }
  60. .dot1 {
  61. display: block;
  62. word-break: keep-all;
  63. white-space: nowrap;
  64. overflow: hidden;
  65. text-overflow: ellipsis;
  66. }
  67. .dot2 {
  68. overflow: hidden;
  69. display: -webkit-box;
  70. -webkit-box-orient: vertical;
  71. -webkit-line-clamp: 2;
  72. }
  73. input,
  74. img {
  75. border: none;
  76. }
  77. .cover100 img {
  78. display: block;
  79. width: 100%;
  80. height: 100%;
  81. object-fit: cover;
  82. }
  83. .back100 {
  84. background-size: 100% 100%;
  85. background-repeat: no-repeat;
  86. }
  87. article,
  88. aside,
  89. footer,
  90. header,
  91. time,
  92. video,
  93. main,
  94. nav,
  95. h4,
  96. h3,
  97. section {
  98. display: block;
  99. }
  100. .index_main {
  101. width: 1200px;
  102. margin: 0 auto;
  103. // margin-bottom: 222px;
  104. }
  105. .slow_6 {
  106. -webkit-transition: all .6s;
  107. -moz-transition: all .6s;
  108. -ms-transition: all .6s;
  109. -o-transition: all .6s;
  110. transition: all .6s;
  111. }
  112. .banner_1 {
  113. height: 90px;
  114. overflow: hidden;
  115. margin-top: 20px;
  116. .banner_1_a {
  117. display: block;
  118. width: 1200px;
  119. }
  120. .banner_1_img {
  121. display: block;
  122. width: 1200px;
  123. }
  124. }
  125. .index_1 {
  126. margin-top: 30px;
  127. }
  128. .index_1_left {
  129. float: left;
  130. width: 720px;
  131. }
  132. .index_1_right {
  133. float: right;
  134. width: 450px;
  135. }
  136. .index_1_li:nth-of-type(1) .index_1_li_tag {
  137. background: #49A769;
  138. color: #fff;
  139. }
  140. .index_1_li:nth-of-type(2) .index_1_li_tag {
  141. background: #F6C12D;
  142. color: #fff;
  143. }
  144. .index_1_li:nth-of-type(3) .index_1_li_tag {
  145. background: #F3C57F;
  146. color: #fff;
  147. }
  148. .index_1_li_a:hover {
  149. color: #49A769;
  150. }
  151. .index_2 {
  152. margin-top: 11px;
  153. }
  154. .index_2_left {
  155. float: left;
  156. width: 720px;
  157. }
  158. .index_2_right {
  159. float: right;
  160. width: 450px;
  161. }
  162. .book_head_box {
  163. border-bottom: solid 1px #D9D9D9;
  164. .book_head_left {
  165. float: left;
  166. }
  167. .book_head_a {
  168. float: left;
  169. height: 55px;
  170. line-height: 55px;
  171. color: #333;
  172. font-weight: bold;
  173. font-size: 22px;
  174. border-bottom: solid 3px rgba(0, 0, 0, 0);
  175. margin-right: 40px;
  176. }
  177. .book_head_only {
  178. float: left;
  179. height: 55px;
  180. line-height: 55px;
  181. color: #49A769;
  182. font-weight: bold;
  183. font-size: 22px;
  184. border-bottom: solid 3px #49A769;
  185. }
  186. .book_head_a_more {
  187. float: right;
  188. height: 19px;
  189. line-height: 19px;
  190. margin-top: 20px;
  191. color: #333;
  192. font-size: 16px;
  193. }
  194. .book_head_a_more:hover {
  195. color: #49A769;
  196. }
  197. .book_head_right {
  198. float: right;
  199. margin-top: 11px;
  200. }
  201. .book_head_right_a {
  202. float: left;
  203. height: 31px;
  204. line-height: 31px;
  205. color: #fff;
  206. font-size: 16px;
  207. border-radius: 4px;
  208. overflow: hidden;
  209. padding: 0px 10px 0px 33px;
  210. }
  211. }
  212. .book_1_img_ul {
  213. height: 650px;
  214. .book_1_img_li {
  215. width: 350px;
  216. margin: 30px 0px 10px 0px;
  217. }
  218. .book_1_img_li:nth-of-type(odd) {
  219. float: left;
  220. }
  221. .book_1_img_li:nth-of-type(even) {
  222. float: right;
  223. }
  224. .book_1_img_li_a {
  225. width: 350px;
  226. display: block;
  227. overflow: hidden;
  228. }
  229. .book_1_img_li_a:hover .book_1_img_li_dot2 {
  230. color: #49A769;
  231. }
  232. .book_1_img_li_img {
  233. float: left;
  234. width: 140px;
  235. height: 170px;
  236. border-radius: 6px;
  237. }
  238. .book_1_img_li_right {
  239. float: right;
  240. width: 190px;
  241. }
  242. .book_1_img_li_dot2 {
  243. width: 190px;
  244. height: 46px;
  245. line-height: 23px;
  246. color: #333;
  247. font-size: 18px;
  248. margin-top: 12px;
  249. }
  250. .book_1_img_li_btn {
  251. float: left;
  252. border: solid 1px #49A769;
  253. margin-top: 74px;
  254. height: 34px;
  255. line-height: 34px;
  256. color: #49A769;
  257. font-size: 14px;
  258. padding: 0px 19px;
  259. text-align: center;
  260. box-sizing: border-box;
  261. }
  262. }
  263. .book_num_1_ul {
  264. .book_num_1_li {}
  265. .book_num_1_li_a {
  266. display: block;
  267. width: 100%;
  268. overflow: hidden;
  269. position: relative;
  270. }
  271. .book_num_1_li_tag {
  272. float: left;
  273. height: 22px;
  274. line-height: 22px;
  275. color: #999;
  276. font-size: 16px;
  277. margin: 23px 0px 0px 0px;
  278. }
  279. .book_num_1_li_img {
  280. width: 80px;
  281. height: 120px;
  282. border-radius: 4px;
  283. margin: 29px 25px 0px 40px;
  284. display: none;
  285. float: left;
  286. }
  287. .book_num_1_li_dot1 {
  288. float: right;
  289. border-bottom: solid 1px #E6E6E6;
  290. height: 66px;
  291. line-height: 66px;
  292. color: #333;
  293. font-size: 16px;
  294. margin-top: 0px;
  295. width: 400px;
  296. overflow: hidden;
  297. display: -webkit-box;
  298. -webkit-box-orient: vertical;
  299. -webkit-line-clamp: 1;
  300. }
  301. // .book_num_1_li:nth-of-type(1) .book_num_1_li_tag {
  302. // font-weight: bold;
  303. // margin-top: 38px;
  304. // }
  305. .book_num_1_li:nth-of-type(-n+3) .book_num_1_li_tag {
  306. color: #49A769;
  307. }
  308. .book_num_1_li_a:hover .book_num_1_li_dot1 {
  309. color: #49A769;
  310. }
  311. //鼠标移入后的效果
  312. .num_active {
  313. font-weight: bold;
  314. margin-top: 38px;
  315. }
  316. .img_active {
  317. display: block;
  318. }
  319. .text_active {
  320. width: 295px;
  321. border: solid 0px #111;
  322. color: #333;
  323. font-size: 16px;
  324. line-height: 22px;
  325. height: 44px;
  326. font-weight: bold;
  327. margin-top: 39px;
  328. overflow: hidden;
  329. display: -webkit-box;
  330. -webkit-box-orient: vertical;
  331. -webkit-line-clamp: 2;
  332. }
  333. .text_active::after {
  334. content: '';
  335. display: block;
  336. position: absolute;
  337. width: 295px;
  338. height: 1px;
  339. background: #E6E6E6;
  340. right: 0px;
  341. bottom: 13px;
  342. }
  343. }
  344. .index_3 {
  345. margin-top: 11px;
  346. }
  347. .index_3_left {
  348. float: left;
  349. width: 720px;
  350. }
  351. .index_3_right {
  352. float: right;
  353. width: 450px;
  354. }
  355. .book_2_img_ul {
  356. margin-top: 30px;
  357. height: 590px;
  358. }
  359. .book_2_img_li {
  360. float: left;
  361. width: 170px;
  362. margin: 0px 13px 30px 0px;
  363. }
  364. .book_2_img_li_a {
  365. display: block;
  366. width: 170px;
  367. }
  368. .book_2_img_li_img {
  369. display: block;
  370. width: 170px;
  371. height: 230px;
  372. }
  373. .book_2_img_li_dot1 {
  374. height: 21px;
  375. line-height: 21px;
  376. color: #333;
  377. width: 96%;
  378. font-size: 18px;
  379. text-align: center;
  380. margin: 17px auto 0;
  381. }
  382. .book_2_img_li:nth-of-type(4n) {
  383. margin-right: 0px;
  384. }
  385. .book_2_img_li_a:hover .book_2_img_li_dot1 {
  386. color: #49A769;
  387. }
  388. .book_3_img_ul {
  389. margin-top: 30px;
  390. height: 156px;
  391. .book_3_img_li {
  392. float: left;
  393. width: 108px;
  394. margin: 0px 18px 0px;
  395. }
  396. .book_3_img_li_a {
  397. display: block;
  398. width: 108px;
  399. }
  400. .book_3_img_li_img {
  401. display: block;
  402. width: 80px;
  403. height: 120px;
  404. margin: 0px auto;
  405. }
  406. .book_3_img_li_dot1 {
  407. height: 21px;
  408. line-height: 21px;
  409. text-align: center;
  410. width: 108px;
  411. margin: 17px auto 0px;
  412. color: #333;
  413. font-size: 16px;
  414. }
  415. .book_3_img_li_a:hover .book_3_img_li_dot1 {
  416. color: #49A769;
  417. }
  418. }
  419. .book_2_ul {
  420. .book_2_li {
  421. border-bottom: solid 1px #E6E6E6;
  422. height: 68px;
  423. position: relative;
  424. box-sizing: border-box;
  425. }
  426. .book_2_li_a {
  427. height: 68px;
  428. width: 400px;
  429. float: left;
  430. line-height: 77px;
  431. color: #333;
  432. font-size: 16px;
  433. }
  434. .book_2_li_tag {
  435. float: right;
  436. width: 16px;
  437. line-height: 16px;
  438. height: 16px;
  439. color: #49A769;
  440. font-size: 14px;
  441. background: #edf7f0;
  442. margin-top: 30px;
  443. text-align: center;
  444. }
  445. .book_2_li_a:hover {
  446. color: #49A769;
  447. }
  448. .book_2_li_a::after {
  449. content: '';
  450. display: block;
  451. position: absolute;
  452. width: 100%;
  453. height: 100%;
  454. left: 0px;
  455. top: 0px;
  456. }
  457. }
  458. .banner_2 {
  459. height: 90px;
  460. overflow: hidden;
  461. margin-top: 1px;
  462. .banner_2_a {
  463. display: block;
  464. width: 1200px;
  465. }
  466. .banner_2_img {
  467. display: block;
  468. width: 1200px;
  469. }
  470. }
  471. .index_4 {
  472. margin-top: 11px;
  473. margin-bottom: 25px;
  474. }
  475. .index_4_left {
  476. float: left;
  477. width: 720px;
  478. }
  479. .index_4_right {
  480. float: right;
  481. width: 450px;
  482. }
  483. .book_3_ul {
  484. .book_3_li {
  485. border-bottom: solid 1px #E6E6E6;
  486. height: 68px;
  487. position: relative;
  488. box-sizing: border-box;
  489. }
  490. .book_3_li_a {
  491. height: 68px;
  492. width: 400px;
  493. float: left;
  494. line-height: 77px;
  495. color: #333;
  496. font-size: 16px;
  497. }
  498. .book_3_li_tag {
  499. float: right;
  500. width: 16px;
  501. line-height: 16px;
  502. height: 16px;
  503. color: #49A769;
  504. font-size: 14px;
  505. background: #edf7f0;
  506. margin-top: 30px;
  507. text-align: center;
  508. }
  509. .book_3_li_a:hover {
  510. color: #49A769;
  511. }
  512. .book_3_li_a::after {
  513. content: '';
  514. display: block;
  515. position: absolute;
  516. width: 100%;
  517. height: 100%;
  518. left: 0px;
  519. top: 0px;
  520. }
  521. }
  522. .book_4_img_ul {
  523. margin-top: 30px;
  524. height: 156px;
  525. .book_4_img_li {
  526. float: left;
  527. width: 108px;
  528. margin: 0px 18px 0px;
  529. }
  530. .book_4_img_li_a {
  531. display: block;
  532. width: 108px;
  533. }
  534. .book_4_img_li_img {
  535. display: block;
  536. width: 80px;
  537. height: 120px;
  538. margin: 0px auto;
  539. }
  540. .book_4_img_li_dot1 {
  541. height: 21px;
  542. line-height: 21px;
  543. text-align: center;
  544. width: 108px;
  545. margin: 17px auto 0px;
  546. color: #333;
  547. font-size: 16px;
  548. }
  549. .book_4_img_li_a:hover .book_4_img_li_dot1 {
  550. color: #49A769;
  551. }
  552. }
  553. .book_5_img_ul {
  554. margin-top: 30px;
  555. height: 570px;
  556. .book_5_img_li {
  557. box-sizing: border-box;
  558. background: #FBFBFB;
  559. padding: 20px;
  560. margin-bottom: 20px;
  561. }
  562. .book_5_img_li_a {
  563. display: block;
  564. width: 100%;
  565. height: 100%;
  566. }
  567. .book_5_img_li_img {
  568. float: left;
  569. width: 100px;
  570. height: 136px;
  571. }
  572. .book_5_img_li_right {
  573. float: right;
  574. width: 555px;
  575. }
  576. .book_5_img_li_dot2 {
  577. height: 50px;
  578. line-height: 25px;
  579. color: #333;
  580. font-size: 20px;
  581. font-weight: bold;
  582. }
  583. .book_5_img_li_a:hover .book_5_img_li_dot2 {
  584. color: #49A769;
  585. }
  586. .book_5_img_li_foot {
  587. margin-top: 38px;
  588. }
  589. .book_5_img_li_foot_red {
  590. float: left;
  591. height: 21px;
  592. line-height: 21px;
  593. color: #E52222;
  594. font-size: 16px;
  595. margin: 14px 5px 0px 0px;
  596. }
  597. .book_5_img_li_foot_num {
  598. float: left;
  599. height: 40px;
  600. line-height: 40px;
  601. color: #E52222;
  602. font-size: 30px;
  603. margin: 0px 10px 0px 0px;
  604. }
  605. .book_5_img_li_foot_text {
  606. float: left;
  607. height: 21px;
  608. line-height: 21px;
  609. color: #999;
  610. font-size: 14px;
  611. margin: 14px 0px 0px 0px;
  612. }
  613. .book_5_img_li_foot_price {
  614. float: left;
  615. height: 21px;
  616. line-height: 21px;
  617. color: #999;
  618. font-size: 14px;
  619. margin: 14px 0px 0px 0px;
  620. position: relative;
  621. }
  622. .book_5_img_li_foot_price::after {
  623. content: '';
  624. display: block;
  625. background: #999;
  626. width: 100%;
  627. height: 1px;
  628. left: 0px;
  629. top: 50%;
  630. position: absolute;
  631. }
  632. }
  633. @media screen and (min-width:1200px) {
  634. /*pc_1440*/
  635. @media screen and (max-width:1440px) {
  636. /*1200*/
  637. }
  638. .pc_none {
  639. display: none;
  640. }
  641. }
  642. @media screen and (max-width:599px) {}
  643. @media screen and (max-width:320px) {}