shopClass.less 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416
  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. margin: 0 auto;
  102. }
  103. .ad{
  104. margin-top: 20px;
  105. margin-bottom: 20px;
  106. }
  107. .slow_6 {
  108. -webkit-transition: all .6s;
  109. -moz-transition: all .6s;
  110. -ms-transition: all .6s;
  111. -o-transition: all .6s;
  112. transition: all .6s;
  113. }
  114. .index_main {
  115. width: 1200px;
  116. margin-bottom: 30px;
  117. }
  118. .shop_head_1 {
  119. height: 60px;
  120. margin-top: 20px;
  121. background-image: url(@/public/shop/navbg.png);
  122. .shop_head_1_a {
  123. float: left;
  124. height: 60px;
  125. line-height: 60px;
  126. font-weight: bold;
  127. margin-left: 30px;
  128. font-size: 20px;
  129. color: #fff;
  130. }
  131. }
  132. .shop_2 {
  133. width: 100%;
  134. margin-top: 20px;
  135. .shop_2_in {
  136. margin-bottom: 15px;
  137. }
  138. .shop_2_in_box {
  139. width: 590px;
  140. background: #F7FBFE;
  141. border: solid 1px #ddd;
  142. box-sizing: border-box;
  143. }
  144. .shop_2_in_box:nth-of-type(odd) {
  145. float: left;
  146. }
  147. .shop_2_in_box:nth-of-type(even) {
  148. float: right;
  149. }
  150. .shop_2_box {
  151. height: 50px;
  152. display: flex;
  153. }
  154. .shop_2_name {
  155. height: 50px;
  156. line-height: 50px;
  157. color: #255590;
  158. font-size: 16px;
  159. width: 126px;
  160. font-weight: bold;
  161. border-right: solid 1px #ddd;
  162. text-align: center;
  163. display: block;
  164. }
  165. .shop_2_right {
  166. flex: 1;
  167. height: 50px;
  168. padding: 0px 17px;
  169. box-sizing: border-box;
  170. }
  171. .shop_2_a {
  172. float: left;
  173. padding: 0px 21px;
  174. height: 50px;
  175. line-height: 50px;
  176. color: #333;
  177. font-size: 16px;
  178. &:hover {
  179. color: #255590;
  180. }
  181. }
  182. .shop_2_in_box_even .shop_2_box:nth-of-type(odd) .shop_2_name {
  183. line-height: 60px;
  184. }
  185. .shop_2_in_box_even .shop_2_box:nth-of-type(even) .shop_2_name {
  186. line-height: 43px;
  187. }
  188. .shop_2_in_box_even .shop_2_box:nth-of-type(odd) .shop_2_a {
  189. line-height: 60px;
  190. }
  191. .shop_2_in_box_even .shop_2_box:nth-of-type(even) .shop_2_a {
  192. line-height: 43px;
  193. }
  194. .shop_2_in_2 {
  195. background: #F7FBFE;
  196. border: solid 1px #ddd;
  197. margin-top: 14px;
  198. display: flex;
  199. box-sizing: border-box;
  200. }
  201. .shop_2_name_2 {
  202. height: 59px;
  203. line-height: 59px;
  204. color: #255590;
  205. font-size: 16px;
  206. width: 126px;
  207. font-weight: bold;
  208. border-right: solid 1px #ddd;
  209. text-align: center;
  210. display: block;
  211. }
  212. .shop_2_right_2 {
  213. flex: 1;
  214. height: 59px;
  215. padding: 0px 17px;
  216. box-sizing: border-box;
  217. }
  218. .shop_2_a_2 {
  219. float: left;
  220. padding: 0px 24px;
  221. height: 59px;
  222. line-height: 59px;
  223. color: #333;
  224. font-size: 16px;
  225. &:hover {
  226. color: #255590;
  227. }
  228. }
  229. }
  230. .shop_3 {
  231. margin-top: 30px;
  232. }
  233. .shop_3_in {
  234. width: 590px;
  235. }
  236. .shop_3_in:nth-of-type(odd) {
  237. float: left;
  238. }
  239. .shop_3_in:nth-of-type(even) {
  240. float: right;
  241. }
  242. .shop_head_2 {
  243. height: 29px;
  244. position: relative;
  245. .shop_head_2_name {
  246. float: left;
  247. height: 29px;
  248. line-height: 29px;
  249. color: #255590;
  250. font-size: 22px;
  251. font-weight: bold;
  252. padding-left: 22px;
  253. background: url(@/public/img/3.png) no-repeat left center;
  254. background-size: 12px 18px;
  255. }
  256. .shop_head_2_more {
  257. height: 29px;
  258. line-height: 29px;
  259. color: #999;
  260. float: right;
  261. font-size: 16px;
  262. }
  263. .shop_head_2_more::after {
  264. content: '';
  265. display: block;
  266. left: 0px;
  267. top: 0px;
  268. position: absolute;
  269. width: 100%;
  270. height: 100%;
  271. z-index: 11;
  272. }
  273. }
  274. .shop_head_3 {
  275. height: 29px;
  276. position: relative;
  277. .shop_head_3_name {
  278. float: left;
  279. height: 29px;
  280. line-height: 29px;
  281. color: #F7812B;
  282. font-size: 22px;
  283. font-weight: bold;
  284. padding-left: 22px;
  285. background: url(@/public/img/4.png) no-repeat left center;
  286. background-size: 12px 18px;
  287. }
  288. .shop_head_3_more {
  289. height: 29px;
  290. line-height: 29px;
  291. color: #999;
  292. float: right;
  293. font-size: 16px;
  294. }
  295. .shop_head_3_more::after {
  296. content: '';
  297. display: block;
  298. left: 0px;
  299. top: 0px;
  300. position: absolute;
  301. width: 100%;
  302. height: 100%;
  303. z-index: 11;
  304. }
  305. }
  306. .shop_img_ul_1 {
  307. margin-top: 30px;
  308. height: 788px;
  309. .shop_img_li_1 {
  310. margin-bottom: 20px;
  311. border: solid 1px #ddd;
  312. box-sizing: border-box;
  313. }
  314. .shop_img_li_1_img_box {
  315. float: left;
  316. width: 180px;
  317. height: 178px;
  318. }
  319. .shop_img_li_1_img {
  320. display: block;
  321. width: 100%;
  322. height: 100%;
  323. }
  324. .shop_img_li_1_right {
  325. float: right;
  326. width: 367px;
  327. margin-right: 22px;
  328. }
  329. .shop_img_li_1_h4 {
  330. height: 50px;
  331. line-height: 26px;
  332. color: #333;
  333. font-size: 20px;
  334. font-weight: 500;
  335. margin-top: 10px;
  336. }
  337. .shop_img_li_1_tag {
  338. height: 25px;
  339. line-height: 25px;
  340. color: #255590;
  341. border: solid 1px #255590;
  342. margin-top: 16px;
  343. box-sizing: border-box;
  344. font-size: 14px;
  345. float: left;
  346. padding: 0px 5px;
  347. }
  348. .shop_img_li_1_price_box {
  349. height: 26px;
  350. margin-top: 21px;
  351. line-height: 26px;
  352. color: #333;
  353. font-size: 20px;
  354. }
  355. .shop_img_li_1_price_tag {
  356. height: 26px;
  357. line-height: 26px;
  358. color: #333;
  359. font-size: 14px;
  360. display: inline-block;
  361. }
  362. .shop_img_li_1_btn {
  363. clear: both;
  364. float: left;
  365. height: 30px;
  366. line-height: 30px;
  367. color: #fff;
  368. font-size: 14px;
  369. background: #255590;
  370. padding: 0px 20px;
  371. margin-top: 32px;
  372. }
  373. .shop_img_li_1:nth-last-of-type(1) {
  374. margin-bottom: 0px;
  375. }
  376. .shop_img_li_1_a:hover .shop_img_li_1_h4 {
  377. color: #255590;
  378. }
  379. .shop_img_li_1_a:hover .shop_img_li_1_price_box {
  380. color: #255590;
  381. }
  382. .shop_img_li_1_a:hover .shop_img_li_1_price_tag {
  383. color: #255590;
  384. }
  385. }
  386. .shop_ul_1 {
  387. background: #F9F9F9;
  388. border: solid 1px #ddd;
  389. box-sizing: border-box;
  390. margin-top: 30px;
  391. .shop_li_1 {
  392. border-bottom: dashed 1px #ddd;
  393. padding: .6px 0px;
  394. }
  395. .shop_li_1_a {
  396. display: block;
  397. width: 100%;
  398. }
  399. .shop_li_1_left {
  400. float: left;
  401. width: 400px;
  402. margin-left: 20px;
  403. }
  404. .shop_li_1_h4 {
  405. height: 26px;
  406. line-height: 26px;
  407. color: #333;
  408. font-size: 20px;
  409. font-weight: 500;
  410. position: relative;
  411. text-indent: 16px;
  412. margin-top: 20px;
  413. }
  414. .shop_li_1_h4::after {
  415. content: '';
  416. display: block;
  417. width: 6px;
  418. height: 6px;
  419. background: #F7812B;
  420. position: absolute;
  421. left: 0px;
  422. top: 11px;
  423. }
  424. .shop_li_1_text {
  425. height: 21px;
  426. line-height: 21px;
  427. text-indent: 16px;
  428. color: #666;
  429. font-size: 16px;
  430. margin: 10px 0px 18px 0px;
  431. }
  432. .shop_li_1_btn {
  433. float: right;
  434. height: 30px;
  435. line-height: 30px;
  436. color: #fff;
  437. font-size: 14px;
  438. background: #F7812B;
  439. padding: 0px 20px;
  440. margin: 34px 20px 0px 0px;
  441. }
  442. .shop_li_1_a:hover .shop_li_1_h4 {
  443. color: #F7812B;
  444. }
  445. .shop_li_1_a:hover .shop_li_1_text {
  446. color: #F7812B;
  447. }
  448. }
  449. .shop_head_4 {
  450. height: 29px;
  451. position: relative;
  452. .shop_head_4_name {
  453. float: left;
  454. height: 29px;
  455. line-height: 29px;
  456. color: #255590;
  457. font-size: 22px;
  458. font-weight: bold;
  459. padding-left: 22px;
  460. background: url(@/public/img/3.png) no-repeat left center;
  461. background-size: 12px 18px;
  462. }
  463. .shop_head_4_more {
  464. height: 29px;
  465. line-height: 29px;
  466. color: #999;
  467. float: right;
  468. font-size: 16px;
  469. }
  470. .shop_head_4_more::after {
  471. content: '';
  472. display: block;
  473. left: 0px;
  474. top: 0px;
  475. position: absolute;
  476. width: 100%;
  477. height: 100%;
  478. z-index: 11;
  479. }
  480. }
  481. .shop_head_5 {
  482. height: 29px;
  483. position: relative;
  484. .shop_head_5_name {
  485. float: left;
  486. height: 29px;
  487. line-height: 29px;
  488. color: #F7812B;
  489. font-size: 22px;
  490. font-weight: bold;
  491. padding-left: 22px;
  492. background: url(@/public/img/4.png) no-repeat left center;
  493. background-size: 12px 18px;
  494. }
  495. .shop_head_5_more {
  496. height: 29px;
  497. line-height: 29px;
  498. color: #999;
  499. float: right;
  500. font-size: 16px;
  501. }
  502. .shop_head_5_more::after {
  503. content: '';
  504. display: block;
  505. left: 0px;
  506. top: 0px;
  507. position: absolute;
  508. width: 100%;
  509. height: 100%;
  510. z-index: 11;
  511. }
  512. }
  513. .shop_img_ul_2 {
  514. margin-top: 30px;
  515. .shop_img_li_2 {
  516. margin-bottom: 20px;
  517. border: solid 1px #ddd;
  518. box-sizing: border-box;
  519. }
  520. .shop_img_li_2_img_box {
  521. float: left;
  522. width: 180px;
  523. height: 178px;
  524. }
  525. .shop_img_li_2_img {
  526. display: block;
  527. width: 100%;
  528. height: 100%;
  529. }
  530. .shop_img_li_2_right {
  531. float: right;
  532. width: 367px;
  533. margin-right: 22px;
  534. }
  535. .shop_img_li_2_h4 {
  536. height: 50px;
  537. line-height: 26px;
  538. color: #333;
  539. font-size: 20px;
  540. font-weight: 500;
  541. margin-top: 10px;
  542. }
  543. .shop_img_li_2_tag {
  544. height: 25px;
  545. line-height: 25px;
  546. color: #255590;
  547. border: solid 1px #255590;
  548. margin-top: 16px;
  549. box-sizing: border-box;
  550. font-size: 14px;
  551. float: left;
  552. padding: 0px 5px;
  553. }
  554. .shop_img_li_2_price_box {
  555. height: 26px;
  556. margin-top: 21px;
  557. line-height: 26px;
  558. color: #333;
  559. font-size: 20px;
  560. }
  561. .shop_img_li_2_price_tag {
  562. height: 26px;
  563. line-height: 26px;
  564. color: #333;
  565. font-size: 14px;
  566. display: inline-block;
  567. }
  568. .shop_img_li_2_btn {
  569. clear: both;
  570. float: left;
  571. height: 30px;
  572. line-height: 30px;
  573. color: #fff;
  574. font-size: 14px;
  575. background: #255590;
  576. padding: 0px 20px;
  577. margin-top: 27px;
  578. }
  579. .shop_img_li_2:nth-last-of-type(1) {
  580. margin-bottom: 0px;
  581. }
  582. .shop_img_li_2_a:hover .shop_img_li_2_h4 {
  583. color: #255590;
  584. }
  585. .shop_img_li_2_a:hover .shop_img_li_2_price_box {
  586. color: #255590;
  587. }
  588. .shop_img_li_2_a:hover .shop_img_li_2_price_tag {
  589. color: #255590;
  590. }
  591. }
  592. .shop_img_ul_3 {
  593. margin-top: 30px;
  594. .shop_img_li_3 {
  595. margin-bottom: 20px;
  596. border: solid 1px #ddd;
  597. box-sizing: border-box;
  598. }
  599. .shop_img_li_3_img_box {
  600. float: left;
  601. width: 180px;
  602. height: 178px;
  603. }
  604. .shop_img_li_3_img {
  605. display: block;
  606. width: 100%;
  607. height: 100%;
  608. }
  609. .shop_img_li_3_right {
  610. float: right;
  611. width: 367px;
  612. margin-right: 22px;
  613. }
  614. .shop_img_li_3_h4 {
  615. height: 50px;
  616. line-height: 26px;
  617. color: #333;
  618. font-size: 20px;
  619. font-weight: 500;
  620. margin-top: 10px;
  621. }
  622. .shop_img_li_3_tag {
  623. height: 25px;
  624. line-height: 25px;
  625. color: #F7812B;
  626. border: solid 1px #F7812B;
  627. margin-top: 16px;
  628. box-sizing: border-box;
  629. font-size: 14px;
  630. float: left;
  631. padding: 0px 5px;
  632. }
  633. .shop_img_li_3_price_box {
  634. height: 26px;
  635. margin-top: 21px;
  636. line-height: 26px;
  637. color: #333;
  638. font-size: 20px;
  639. }
  640. .shop_img_li_3_price_tag {
  641. height: 26px;
  642. line-height: 26px;
  643. color: #333;
  644. font-size: 14px;
  645. display: inline-block;
  646. }
  647. .shop_img_li_3_btn {
  648. clear: both;
  649. float: left;
  650. height: 30px;
  651. line-height: 30px;
  652. color: #fff;
  653. font-size: 14px;
  654. background: #F7812B;
  655. padding: 0px 20px;
  656. margin-top: 27px;
  657. }
  658. .shop_img_li_3:nth-last-of-type(1) {
  659. margin-bottom: 0px;
  660. }
  661. .shop_img_li_3_a:hover .shop_img_li_3_h4 {
  662. color: #F7812B;
  663. }
  664. .shop_img_li_3_a:hover .shop_img_li_3_price_box {
  665. color: #F7812B;
  666. }
  667. .shop_img_li_3_a:hover .shop_img_li_3_price_tag {
  668. color: #F7812B;
  669. }
  670. }
  671. .shop_4 {
  672. margin-top: 29px;
  673. min-height: 400px;
  674. }
  675. .banner_1 {
  676. margin-top: 29px;
  677. height: 90px;
  678. overflow: hidden;
  679. .banner_1_a {
  680. display: block;
  681. width: 100%;
  682. height: 100%;
  683. }
  684. .banner_1_img {
  685. display: block;
  686. width: 100%;
  687. }
  688. }
  689. .shop_5 {
  690. margin-top: 30px;
  691. min-height: 400px;
  692. }
  693. .shop_5_left {
  694. float: left;
  695. width: 720px;
  696. }
  697. .shop_5_right {
  698. float: right;
  699. width: 450px;
  700. min-height: 411px;
  701. }
  702. .shop_head_7 {
  703. height: 29px;
  704. position: relative;
  705. .shop_head_7_name {
  706. float: left;
  707. height: 29px;
  708. line-height: 29px;
  709. color: #255590;
  710. font-size: 22px;
  711. font-weight: bold;
  712. padding-left: 22px;
  713. background: url(@/public/img/3.png) no-repeat left center;
  714. background-size: 12px 18px;
  715. }
  716. .shop_head_7_more {
  717. height: 29px;
  718. line-height: 29px;
  719. color: #999;
  720. float: right;
  721. font-size: 16px;
  722. }
  723. .shop_head_7_more::after {
  724. content: '';
  725. display: block;
  726. left: 0px;
  727. top: 0px;
  728. position: absolute;
  729. width: 100%;
  730. height: 100%;
  731. z-index: 11;
  732. }
  733. }
  734. .shop_box_1 {
  735. float: left;
  736. width: 350px;
  737. }
  738. .shop_box_2 {
  739. float: right;
  740. width: 350px;
  741. }
  742. .shop_img_ul_4 {
  743. margin-top: 30px;
  744. .shop_img_li_4 {
  745. width: 350px;
  746. height: 230px;
  747. margin-bottom: 20px;
  748. position: relative;
  749. }
  750. .shop_img_li_4_a {}
  751. .shop_img_li_4_img {
  752. display: block;
  753. width: 350px;
  754. height: 230px;
  755. }
  756. .shop_img_li_4_rgba {
  757. width: 350px;
  758. height: 44px;
  759. line-height: 44px;
  760. color: #fff;
  761. font-size: 18px;
  762. padding: 0px 10px;
  763. box-sizing: border-box;
  764. position: absolute;
  765. z-index: 11;
  766. left: 0px;
  767. bottom: 0px;
  768. background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 33%, rgba(0, 0, 0, 0) 100%);
  769. }
  770. }
  771. .shop_img_ul_5 {
  772. margin-top: 0px;
  773. .shop_img_li_5 {
  774. width: 165px;
  775. height: 96px;
  776. position: relative;
  777. }
  778. .shop_img_li_5:nth-of-type(odd) {
  779. float: left;
  780. }
  781. .shop_img_li_5:nth-of-type(even) {
  782. float: right;
  783. }
  784. .shop_img_li_5_a {}
  785. .shop_img_li_5_img {
  786. width: 165px;
  787. height: 96px;
  788. }
  789. .shop_img_li_5_rgba {
  790. width: 165px;
  791. height: 28px;
  792. line-height: 28px;
  793. color: #fff;
  794. font-size: 14px;
  795. box-sizing: border-box;
  796. position: absolute;
  797. padding: 0px 10px;
  798. left: 0px;
  799. bottom: 0px;
  800. z-index: 11;
  801. background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 6%, rgba(0, 0, 0, 0) 100%);
  802. }
  803. }
  804. .shop_ul_2 {
  805. margin-top: 30px;
  806. .shop_li_2 {
  807. height: 24px;
  808. line-height: 24px;
  809. color: #333;
  810. font-size: 18px;
  811. margin-bottom: 17px;
  812. box-sizing: border-box;
  813. text-indent: 16px;
  814. position: relative;
  815. }
  816. .shop_li_2:hover {
  817. color: #255590;
  818. }
  819. .shop_li_2::after {
  820. content: '';
  821. display: block;
  822. width: 6px;
  823. height: 6px;
  824. background: #ddd;
  825. border-radius: 50%;
  826. position: absolute;
  827. left: 0px;
  828. top: 8px;
  829. z-index: 11;
  830. }
  831. .shop_li_2:nth-of-type(3n-2) {
  832. font-weight: bold;
  833. }
  834. .shop_li_2:hover::after {
  835. content: '';
  836. display: block;
  837. background: #255590;
  838. }
  839. .shop_li_2:nth-last-of-type(1) {
  840. margin-bottom: 0px;
  841. }
  842. }
  843. .shop_head_8 {
  844. height: 29px;
  845. position: relative;
  846. .shop_head_8_name {
  847. float: left;
  848. height: 29px;
  849. line-height: 29px;
  850. color: #255590;
  851. font-size: 22px;
  852. font-weight: bold;
  853. padding-left: 22px;
  854. background: url(@/public/img/3.png) no-repeat left center;
  855. background-size: 12px 18px;
  856. }
  857. .shop_head_8_more {
  858. height: 29px;
  859. line-height: 29px;
  860. color: #999;
  861. float: right;
  862. font-size: 16px;
  863. }
  864. .shop_head_8_more::after {
  865. content: '';
  866. display: block;
  867. left: 0px;
  868. top: 0px;
  869. position: absolute;
  870. width: 100%;
  871. height: 100%;
  872. z-index: 11;
  873. }
  874. }
  875. .shop_img_ul_6 {
  876. margin-top: 30px;
  877. .shop_img_li_6 {
  878. height: 267px;
  879. position: relative;
  880. width: 450px;
  881. }
  882. .shop_img_li_6_a {}
  883. .shop_img_li_6_img {
  884. display: block;
  885. height: 267px;
  886. width: 450px;
  887. }
  888. .shop_img_li_6_rgba {
  889. height: 44px;
  890. line-height: 44px;
  891. color: #fff;
  892. font-size: 18px;
  893. padding: 0px 10px;
  894. box-sizing: border-box;
  895. position: absolute;
  896. width: 450px;
  897. z-index: 11;
  898. left: 0px;
  899. bottom: 0px;
  900. background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 6%, rgba(0, 0, 0, 0) 100%);
  901. }
  902. }
  903. .shop_ul_3 {
  904. margin-top: 20px;
  905. .shop_li_3 {
  906. height: 24px;
  907. line-height: 24px;
  908. color: #333;
  909. font-size: 18px;
  910. margin-bottom: 17px;
  911. box-sizing: border-box;
  912. text-indent: 16px;
  913. position: relative;
  914. }
  915. .shop_li_3:hover {
  916. color: #255590;
  917. }
  918. .shop_li_3::after {
  919. content: '';
  920. display: block;
  921. width: 6px;
  922. height: 6px;
  923. background: #ddd;
  924. border-radius: 50%;
  925. position: absolute;
  926. left: 0px;
  927. top: 8px;
  928. z-index: 11;
  929. }
  930. .shop_li_3:hover::after {
  931. content: '';
  932. display: block;
  933. background: #255590;
  934. }
  935. .shop_li_3:nth-last-of-type(1) {
  936. margin-bottom: 0px;
  937. }
  938. }
  939. .shop_head_9 {
  940. height: 29px;
  941. position: relative;
  942. .shop_head_9_name {
  943. float: left;
  944. height: 29px;
  945. line-height: 29px;
  946. color: #255590;
  947. font-size: 22px;
  948. font-weight: bold;
  949. padding-left: 22px;
  950. background: url(@/public/img/3.png) no-repeat left center;
  951. background-size: 12px 18px;
  952. }
  953. .shop_head_9_more {
  954. height: 29px;
  955. line-height: 29px;
  956. color: #999;
  957. float: right;
  958. font-size: 16px;
  959. }
  960. .shop_head_9_more::after {
  961. content: '';
  962. display: block;
  963. left: 0px;
  964. top: 0px;
  965. position: absolute;
  966. width: 100%;
  967. height: 100%;
  968. z-index: 11;
  969. }
  970. }
  971. .shop_6 {
  972. margin-top: 30px;
  973. }
  974. .shop_6_left {
  975. float: left;
  976. width: 720px;
  977. }
  978. .shop_6_right {
  979. float: right;
  980. width: 450px;
  981. }
  982. .shop_box_3 {
  983. width: 350px;
  984. float: left;
  985. }
  986. .shop_box_4 {
  987. width: 350px;
  988. float: right;
  989. }
  990. .shop_img_ul_7 {
  991. margin-top: 30px;
  992. .shop_img_li_7 {
  993. width: 350px;
  994. height: 230px;
  995. margin-bottom: 20px;
  996. position: relative;
  997. }
  998. .shop_img_li_7:nth-last-of-type(1) {
  999. margin-bottom: 0px;
  1000. }
  1001. .shop_img_li_7_a {}
  1002. .shop_img_li_7_img {
  1003. display: block;
  1004. width: 350px;
  1005. height: 230px;
  1006. }
  1007. .shop_img_li_7_rgba {
  1008. width: 350px;
  1009. height: 44px;
  1010. line-height: 44px;
  1011. color: #fff;
  1012. font-size: 18px;
  1013. padding: 0px 10px;
  1014. box-sizing: border-box;
  1015. position: absolute;
  1016. z-index: 11;
  1017. left: 0px;
  1018. bottom: 0px;
  1019. background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 33%, rgba(0, 0, 0, 0) 100%);
  1020. }
  1021. }
  1022. .shop_ul_4 {
  1023. margin-top: 30px;
  1024. .shop_li_4 {
  1025. height: 24px;
  1026. line-height: 24px;
  1027. color: #333;
  1028. font-size: 18px;
  1029. margin-bottom: 17px;
  1030. box-sizing: border-box;
  1031. text-indent: 16px;
  1032. position: relative;
  1033. }
  1034. .shop_li_4:hover {
  1035. color: #255590;
  1036. }
  1037. .shop_li_4::after {
  1038. content: '';
  1039. display: block;
  1040. width: 6px;
  1041. height: 6px;
  1042. background: #ddd;
  1043. border-radius: 50%;
  1044. position: absolute;
  1045. left: 0px;
  1046. top: 8px;
  1047. z-index: 11;
  1048. }
  1049. .shop_li_4:nth-of-type(3n-2) {
  1050. font-weight: bold;
  1051. }
  1052. .shop_li_4:hover::after {
  1053. content: '';
  1054. display: block;
  1055. background: #255590;
  1056. }
  1057. .shop_li_4:nth-last-of-type(1) {
  1058. margin-bottom: 0px;
  1059. }
  1060. }
  1061. .shop_head_10 {
  1062. height: 29px;
  1063. position: relative;
  1064. .shop_head_10_name {
  1065. float: left;
  1066. height: 29px;
  1067. line-height: 29px;
  1068. color: #255590;
  1069. font-size: 22px;
  1070. font-weight: bold;
  1071. padding-left: 22px;
  1072. background: url(@/public/img/3.png) no-repeat left center;
  1073. background-size: 12px 18px;
  1074. }
  1075. .shop_head_10_more {
  1076. height: 29px;
  1077. line-height: 29px;
  1078. color: #999;
  1079. float: right;
  1080. font-size: 16px;
  1081. }
  1082. .shop_head_10_more::after {
  1083. content: '';
  1084. display: block;
  1085. left: 0px;
  1086. top: 0px;
  1087. position: absolute;
  1088. width: 100%;
  1089. height: 100%;
  1090. z-index: 11;
  1091. }
  1092. }
  1093. .shop_box_5 {
  1094. width: 170px;
  1095. float: left;
  1096. }
  1097. .shop_box_6 {
  1098. width: 265px;
  1099. float: right;
  1100. }
  1101. .shop_img_ul_8 {
  1102. margin-top: 28px;
  1103. .shop_img_li_8 {
  1104. width: 170px;
  1105. height: 110px;
  1106. margin-bottom: 10px;
  1107. position: relative;
  1108. }
  1109. .shop_img_li_8_a {}
  1110. .shop_img_li_8_img {
  1111. width: 170px;
  1112. height: 110px;
  1113. display: block;
  1114. }
  1115. .shop_img_li_8_rgba {
  1116. width: 170px;
  1117. height: 28px;
  1118. line-height: 28px;
  1119. color: #fff;
  1120. font-size: 14px;
  1121. box-sizing: border-box;
  1122. position: absolute;
  1123. padding: 0px 10px;
  1124. left: 0px;
  1125. bottom: 0px;
  1126. z-index: 11;
  1127. background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 6%, rgba(0, 0, 0, 0) 100%);
  1128. }
  1129. .shop_img_li_8:nth-last-of-type(1) {
  1130. margin-bottom: 0px;
  1131. }
  1132. }
  1133. .shop_ul_5 {
  1134. margin-top: 30px;
  1135. .shop_li_5 {
  1136. height: 48px;
  1137. margin-bottom: 11px;
  1138. width: 265px;
  1139. }
  1140. .shop_li_5:nth-last-of-type(1) {
  1141. margin-bottom: 0px;
  1142. }
  1143. .shop_li_5_in {
  1144. height: 48px;
  1145. width: 265px;
  1146. display: table-cell;
  1147. vertical-align: middle;
  1148. }
  1149. .shop_li_5_a {
  1150. line-height: 24px;
  1151. color: #333;
  1152. font-size: 18px;
  1153. box-sizing: border-box;
  1154. position: relative;
  1155. width: 265px;
  1156. box-sizing: border-box;
  1157. padding-left: 16px;
  1158. }
  1159. .shop_li_5_a::after {
  1160. content: '';
  1161. display: block;
  1162. width: 6px;
  1163. height: 6px;
  1164. background: #ddd;
  1165. border-radius: 50%;
  1166. position: absolute;
  1167. left: 0px;
  1168. top: 44%;
  1169. z-index: 11;
  1170. }
  1171. .shop_li_5_a:hover::after {
  1172. content: '';
  1173. display: block;
  1174. background: #255590;
  1175. }
  1176. .shop_li_5_a:hover {
  1177. color: #255590;
  1178. }
  1179. }
  1180. .banner_2 {
  1181. margin-top: 29px;
  1182. height: 90px;
  1183. overflow: hidden;
  1184. .banner_2_a {
  1185. display: block;
  1186. width: 100%;
  1187. height: 100%;
  1188. }
  1189. .banner_2_img {
  1190. display: block;
  1191. width: 100%;
  1192. }
  1193. }
  1194. @media screen and (min-width:1200px) {
  1195. /*pc_1440*/
  1196. @media screen and (max-width:1440px) {
  1197. /*1200*/
  1198. }
  1199. .pc_none {
  1200. display: none;
  1201. }
  1202. }
  1203. @media screen and (max-width:599px) {}
  1204. @media screen and (max-width:320px) {}