Inicio Explorar Ayuda
Iniciar sesión
caimei365
/
caimei365-www
3
0
Fork 0
Archivos Incidencias 0 Pull Requests 0 Wiki
Árbol: cd6113998a
Ramas Etiquetas
caimei365-www
/
src
/
main
/
resources
/
static
/
css
/
base
/
floor.css

floor.css 19 KB
Histórico Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183 
  1. @charset "utf-8";
    2. 

  2. /**
    3. 

  3.  * 楼层样式，PC端
    4. 

  4.  */
    5. 

  5. @media screen and (min-width:768px) {
    6. 

  6. .section_page{width:100%;height:auto;float:left}
    7. 

  7. .swiper-container-floor.hotList{padding: 0 12px;}
    8. 

  8. .section_page .section_page_title{width:100%;height:103px;box-sizing:border-box;padding:31px 0 16px 0}
    9. 

  9. .section_page .section_page_title h1{font-size:24px;line-height:31px;text-align:left;color:#4a4f58}
    10. 

  10. .section_page .section_page_title p{font-size:14px;line-height:19px;text-align:left;color:#93979f;margin-top:6px}
    11. 

  11. .section_page .section_page_main{width:100%;float:left;height:578px;overflow:hidden;transition:all 0.6s;padding: 12px 0;box-sizing: border-box;}
    12. 

  12. .section_page .floorCon{width:100%}
    13. 

  13. .section_page .swiper-wrapper-floor{width:100%;height:268px}
    14. 

  14. .section_page .section_page_main.type_08{height:268px}
    15. 

  15. .section_page .recommendBox-wrapperHot {overflow: visible !important;}
    16. 

  16. .section_page .section_page_main.type_03{height:704px}
    17. 

  17. .section_page  .page_main_item{width:164px;height:270px;float:left;margin-right:16px;margin-bottom:16px;background-color:#FFFFFF;transition:all 0.4s;display:block;position: relative;overflow: hidden;border-radius: 8px;}
    18. 

  18. .section_page  .page_main_item.default{cursor:default}
    19. 

  19. .section_page  .page_main_item.ad_04{border-radius:8px;}
    20. 

  20. .section_page  .page_main_item.ad_04:hover{transform:translateY(-5px);box-shadow:0 8px 8px rgba(102,102,102,0.05),0 10px 10px rgba(102,102,102,0.05),0 12px 12px rgba(102,102,102,0.05)}
    21. 

  21. .section_page .section_page_main.section_6{height:auto}
    22. 

  22. .section_page .section_page_main.section_6 .section_page_more{display:none}
    23. 

  23. .section_page .section_page_main.section_3,.section_page .section_page_main.section_4,.section_page .section_page_main.section_5{height:704px}
    24. 

  24. .section_page .section_page_main.max{height:auto}
    25. 

  25. .section_page_main.section_3 .page_main_item.ad_01,.section_page_main.section_4 .page_main_item.ad_01,.section_page_main.section_5 .page_main_item.ad_01,.section_page_main.section_6 .page_main_item.ad_01{width:884px;height:120px;border-radius: 8px;}
    26. 

  26. .section_page_main.section_1 .page_main_item.ad_01,.section_page_main.section_2 .page_main_item.ad_01,.section_page_main.section_3 .page_main_item.ad_02,.section_page_main.section_4 .page_main_item.ad_02{width:524px}
    27. 

  27. .section_page_main.section_2 .page_main_item.ad_02,.section_page_main.section_4 .page_main_item.ad_03{width:344px}
    28. 

  28. .section_page .page_main_item_adv{width:100%;height:100%;display:block;transition:all .5s;-o-transition:all .5s;-webkit-transition:all .5s;border-radius: 8px;}
    29. 

  29. .section_page .page_main_item_adv:hover{ transform:scale(1.1);-ms-transform:scale(1.1);-webkit-transform:scale(1.1); }
    30. 

  30. .section_page .page_main_image{width:164px;height:164px;display:block;float:left;border-radius:8px 8px 0 0;}
    31. 

  31. .section_page .page_main_type{width: 34px;height: 34px;text-align: justify;box-sizing: border-box;padding: 5px;border-radius: 0 0 8px 8px;background-color: #33CCBF;font-size: 12px;color: #FFFFFF;line-height: 13px;position: absolute;top: 0;right: 10px;}
    32. 

  32. .section_page .page_main_text{width:100%;height:42px;float:left;box-sizing:border-box;margin-top:10px;padding:0 8px;white-space:normal;word-break:break-all;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-height:21px}
    33. 

  33. .section_page .page_main_tag{width:100%;height:24px;float:left;margin-top:16px;padding:0 8px}
    34. 

  34. .section_page .page_main_tag p{display:block;padding:0 4px;height:24px;box-sizing:border-box;border:1px solid #e3ebf7;border-radius:2px;float:left;font-size:12px;line-height:22px;text-align:center;color:#9aa5b5}
    35. 

  35. .section_page .page_main_price{width:100%;height:54px;float:left;box-sizing:border-box;padding:0 8px}
    36. 

  36. .section_page .page_main_price .main_price_text{width:100%;height:54px;float:left;box-sizing:border-box}
    37. 

  37. .section_page .page_main_price .main_price_unde{width:100%;height:31px;line-height:31px;font-size:14px;color:#4a4f58;text-align:left;float:left}
    38. 

  38. .section_page .page_main_price .main_price_show{width:100%;height:30px;line-height:30px;font-size:14px;color:#f94b4b;text-align:left;float:left}
    39. 

  39. .section_page .page_main_price .main_price_show del{color: #B8BFCA}
    40. 

  40. .section_page .page_main_price .main_price_show.none{color:#999999;text-decoration:line-through}
    41. 

  41. .section_page .page_main_price .section_page .page_main_price .main_price_show.none{display:none}
    42. 

  42. .section_page .page_main_price .price_text_tag{width:100%;height:22px;box-sizing:border-box;float:left;margin-top:0px}
    43. 

  43. .section_page .page_main_price .price_text_tag .couponTag{float:left;margin-right: 2px;}
    44. 

  44. .section_page .page_main_price .price_text_tag .listTag{margin:0;float:left}
    45. 

  45. .section_page .page_main_price .main_price_none{width:100%;height:24px;box-sizing:border-box;float:left;margin-top:2px}
    46. 

  46. .section_page .page_main_price .main_price_none.sec{margin-top:25px}
    47. 

  47. .section_page .page_main_price .main_price_none .listTag{margin:0}
    48. 

  48. .section_page .page_main_price .price_grade,.section_page .page_main_price .price_grade_shop{float:left;margin:0;height:22px;line-height:22px;color:#4A4F58;font-style:normal;font-size:14px}
    49. 

  49. .section_page .page_main_price .price_grade_club{float:left;margin:0;height:22px;line-height:22px;color:#4A4F58;font-style:normal;font-size:14px;color: #f94b4b;}
    50. 

  50. .section_page .page_main_price .price_grade{float: unset}
    51. 

  51. .section_page .page_main_price .price_grade span,.section_page .page_main_price .price_grade_shop span,.section_page .page_main_price .price_grade_club span{display:inline-block;float:left}
    52. 

  52. .section_page .page_main_price .icon:before{width:67px;height:22px}
    53. 

  53. .section_page .page_main_price .price_grade_1:before{background-position:0 -708px}
    54. 

  54. .section_page .page_main_price .price_grade_2:before{background-position:0 -736px}
    55. 

  55. .section_page .page_main_price .price_grade_3:before{background-position:0 -764px}
    56. 

  56. .section_page .page_main_price .price_grade_4:before{background-position:0 -791px}
    57. 

  57. .section_page .page_main_price .price_grade_5:before{background-position:0 -818px}
    58. 

  58. /*标签缩小*/
    59. 

  59. .section_page .page_main_price .price_text_tag {-webkit-transform: scale(0.8) translateX(-18px);-ms-transform: scale(0.8) translateX(-18px);transform: scale(0.8) translateX(-18px)}
    60. 

  60. .section_page .page_main_price .price_text_tag .svip-tag,
    61. 

  61. .section_page .page_main_price .price_text_tag .listTag{-webkit-transform: translateX(4px);-ms-transform: translateX(4px);transform: translateX(4px)}
    62. 

  62. /*会员标签*/
    63. 

  63. .section_page .page_main_price .price_text_tag .svip-tag{width:100%;height:22px;letter-spacing:0}
    64. 

  64. .section_page .page_main_price .price_text_tag .svip-tag .svip-icon{position:relative;z-index:9;display:inline-block;width:30px;height:22px;text-align:center;line-height:22px;font-size:12px;font-weight:400;color:#F0CB72;opacity:1;background:#333333;border-radius: 0 11px;padding: 0 2px;}
    65. 

  65. .section_page .page_main_price .price_text_tag .svip-tag .svip-icon.btr{border-radius:2px 8px 0px 2px}
    66. 

  66. .section_page .page_main_price .price_text_tag .svip-tag .svip-price{z-index:1;position:relative;display:inline-block;padding-left:24px;padding-right:2px;margin-left:-27px;line-height:22px;background:#F0CB72;opacity:1;border-radius:2px;font-size:12px}
    67. 

  67. .section_page .page_main_price .price_text_tag .svip-tag .svip-price span{color: #333}
    68. 

  68. 

  69. .section_page .section_page_more{width:100%;height:32px;margin-top:16px;float:left;display:none}
    70. 

  70. .section_page .section_page_more.show{display:block}
    71. 

  71. .section_page .section_page_more .more{width:98px;height:32px;line-height:32px;font-size:14px;margin:0 auto;border-radius:16px;border:1px solid #cccccc;color:#909090;text-align:left;transition:all 0.2s;cursor:pointer;padding-left:15px;box-sizing:border-box;position:relative}
    72. 

  72. .section_page .section_page_more .more .icon:before{background-position:-93px 7px;width:20px;height:32px;right:0;position:absolute}
    73. 

  73. .section_page .section_page_more .more:hover{color:#FF5B00;border-color:#FF5B00}
    74. 

  74. .section_page .section_page_more .more:hover .icon:before{background-position:-153px 7px}
    75. 

  75. /* 底部供应商 */
    76. 

  76. .section_page .section_page_bottom{width:100%;float:left;height:auto}
    77. 

  77. .section_page  .page_main_li{width:134px;height:166px;float:left;margin-right:16px;margin-bottom:16px;background-color:#FFFFFF;transition:all 0.4s;display:block;overflow: hidden;border-radius: 8px;}
    78. 

  78. .section_page .page_main_li.ad_01{width:884px;height:184px}
    79. 

  79. .section_page  .page_main_li.ad_02:hover{transform:translateY(-5px);box-shadow:0 8px 8px rgba(102,102,102,0.05),0 10px 10px rgba(102,102,102,0.05),0 12px 12px rgba(102,102,102,0.05)}
    80. 

  80. .section_page  .page_main_li.ad_02:hover .page_main_name{color:#FF5B00;font-weight:bold}
    81. 

  81. .section_page  .page_main_li .page_main_logo{width:100%;height:134px;display:block;float:left;border-radius: 8px 8px 0 0;}
    82. 

  82. .section_page  .page_main_li .page_main_name{width:100%;height:32px;float:left;line-height:32px;text-align:center;font-size:14px;color:#4a4f58;background-color:#f9f9f9}
    83. 

  83. #recommendBox {position: relative;height: 329px;overflow: hidden;}
    84. 

  84. #recommendBox .swiper-pagination{width:100%;padding:10px 0;z-index:1;text-align:center;font-size:0;left:0;bottom: 0;}
    85. 

  85. #recommendBox .swiper-pagination span{display:inline-block;width:14px;height:4px;border:5px solid transparent;cursor:pointer;opacity:.2}
    86. 

  86. #recommendBox .swiper-pagination span:before{content:"";display:inline-block;width:100%;height:4px;background:#FF5B00;border-radius:2px}
    87. 

  87. #recommendBox .swiper-pagination.hot span{display:inline-block;width:14px;height:6px;border:5px solid transparent;background: rgba(255, 180, 150, 0.39);cursor:pointer;opacity:1;}
    88. 

  88. #recommendBox .swiper-pagination.hot span:before{content:"";display:inline-block;width:100%;height:6px;background: rgba(255, 180, 150, 0.39);border-radius:3px}
    89. 

  89. #recommendBox .swiper-pagination span.on{width:28px;opacity:1}
    90. 

  90. #recommendBox .swiper-pagination span.on{width:28px;opacity:1}
    91. 

  91. #recommendBox .swiper-pagination.hot span.swiper-pagination-bullet-active{width:28px;opacity:1}
    92. 

  92. #recommendBox .swiper-pagination.hot span.swiper-pagination-bullet-active:before{background:#FFFFFF;}
    93. 

  93. .swiper-pagination-bullet{background: none !important;}
    94. 

  94. 

  95. }
    96. 

  96. /**
    97. 

  97.  * 移动端
    98. 

  98.  */
    99. 

  99. @media screen and (max-width:768px) {
    100. 

  100. .section_page{width:100%;height:auto;position: relative;}
    101. 

  101. .section_page .section_page_title{padding:2.4vw 0 2.4vw 3.2vw;position:relative}
    102. 

  102. .section_page .section_page_title h1{font-weight:bold;color:#4a4f58;font-size:4.8vw;line-height:9.7vw}
    103. 

  103. .section_page .section_page_title p{font-weight:normal;color:#93979f;font-size:3.4vw;line-height:4.3vw}
    104. 

  104. .section_page .page_main_item{width:45.6vw !important;height:70vw;overflow:hidden;margin:0 1.3vw 2.6vw 1.3vw;background:#fff;text-align:left;border-radius: 2vw;}
    105. 

  105. .section_page .page_main_image{width:45.6vw;height:45.6vw;border-radius: 2vw 2vw 0 0;}
    106. 

  106. .section_page .page_main_type{width: 8.8vw;height: 8.8vw;text-align: justify;box-sizing: border-box;padding: 1vw;border-radius: 0 0 2vw 2vw;background-color: #33CCBF;font-size: 2.6vw;color: #FFFFFF;line-height: 3.4vw;position: absolute;top: 0;right: 2vw;}
    107. 

  107. .section_page .page_main_text{padding:0 2vw;height:9.3vw;line-height:5vw;font-size:3.4vw;vertical-align:middle;word-break:break-all;overflow:hidden;text-overflow:ellipsis;display:-webkit-inline-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-top:1vw}
    108. 

  108. .section_page .page_main_item.ad_02 img,.section_page .page_main_item.ad_03 img,.section_page .page_main_item.ad_01 img{height:100%;width:100%;border-radius: 2vw;}
    109. 

  109. .section_page .page_main_price{width:100%;box-sizing:border-box;padding:0 1.5vw}
    110. 

  110. .section_page .page_main_price .price_text_tag{width:100%;box-sizing:border-box;float:left;margin-top: 1.2vw;min-height: 4.6vw;}
    111. 

  111. .section_page .page_main_price .main_price_show{color:#f94b4b}
    112. 

  112. .section_page .page_main_price .main_price_show del{color: #B8BFCA}
    113. 

  113. .section_page .page_main_price .section_page .page_main_price .main_price_show.none{display:none}
    114. 

  114. .section_page .page_main_price .main_price_unde{width:100%;height:6.5vw;line-height:6.5vw;font-size:3.4vw;color:#4a4f58;text-align:left;float:left}
    115. 

  115. .section_page .page_main_price .price_text_tag .couponTag{padding:0 0.5vw;border:.27vw solid #f94b4b;background:#fff1eb;font-size:2.8vw;float:left;height:4.2vw;line-height:4.2vw;color: #f94b4b;border-radius: 0.2vw;margin-right: 0.8vw;}
    116. 

  116. .section_page .page_main_price .price_text_tag .listTag{padding:0 2vw;border:.27vw solid #ffe6dc;background:none;font-size:2.8vw;float:left;height:4.2vw;line-height:4.2vw;border-radius: 0.2vw;}
    117. 

  117. .section_page .section_page_main.section_6{height:auto}
    118. 

  118. .section_page .section_page_main.section_6 .section_page_more{display:none}
    119. 

  119. .section_page .section_page_main.section_3,.section_page .section_page_main.section_4,.section_page .section_page_main.section_5{height:180vw}
    120. 

  120. .section_page_main.section_3 .page_main_item.ad_01,.section_page_main.section_4 .page_main_item.ad_01,.section_page_main.section_5 .page_main_item.ad_01,.section_page_main.section_6 .page_main_item.ad_01,.section_page .page_main_li.ad_01{width:93.6vw !important;height:auto;}
    121. 

  121. .section_page .section_page_main{margin:auto;width:97vw;height:146vw;overflow:hidden;box-sizing: border-box;padding: 2vw 0;}
    122. 

  122. .section_page .section_page_main.type_03{height:167vw}
    123. 

  123. .section_page .section_page_more{display:none}
    124. 

  124. .section_page .section_page_more.show{display:block}
    125. 

  125. .section_page .section_page_more .more{width:20vw;height:6.4vw;margin:5vw auto;border:.27vw solid #cccccc;color:#909090;font-size:3vw;line-height:6.4vw;border-radius:3.2vw;position:relative;text-indent:2vw}
    126. 

  126. .section_page .section_page_more .more .icon:before{background-position:-51.5vw 0px;width:5.4vw;height:6.7vw;right:0;position:absolute}
    127. 

  127. .section_page .page_main_li{width:21.6vw;height:26.6vw;float:left;margin-right:2.4vw;margin-bottom:2.4vw;background-color:#FFFFFF;display:block;border-radius: 2vw;}
    128. 

  128. .section_page .page_main_li .page_main_logo{width:100%;height:21.6vw;display:block;float:left;border-radius: 2vw 2vw 0 0;}
    129. 

  129. .section_page .page_main_li .page_main_name{width:100%;height:5vw;float:left;line-height:5vw;text-align:center;font-size:2.6vw;color:#4a4f58;background-color:#f9f9f9}
    130. 

  130. .section_page_bottom{width:97vw;padding:3.2vw;overflow:hidden}
    131. 

  131. .page_main_li.ad_01 img{width:100%;height:100%}
    132. 

  132. .section_right{padding:2vw 3.2vw;}
    133. 

  133. .box{white-space:nowrap;overflow-x:auto}
    134. 

  134. .section_right .section_right_item{display:inline-block;width:42.2vw;height:61.6vw;background:#fff;margin-right:2.4vw;flex-shrink:0;vertical-align: top;border-radius: 2vw;}
    135. 

  135. .section_right .section_right_item>a{width: 100%;height: 100%;display: block;border-radius: 2px;}
    136. 

  136. .section_right .section_right_item>a img{width: 100%;height: 100%;display: block;border-radius: 2px;}
    137. 

  137. .section_right .section_right_ite.none{display: none;}
    138. 

  138. .section_right .section_right_ite.show{display: block;}
    139. 

  139. .section_right .right_item_title{overflow:hidden;padding:2.4vw}
    140. 

  140. .section_right .right_item_title p{float:left;font-size:3.4vw;font-weight:bold;color:#4a4f58;text-align:left}
    141. 

  141. .section_right .right_item_title a{display:inline-block;float:right;font-size:3.2vw;color:#909090;text-align:right}
    142. 

  142. .section_right .right_item_main{height:auto;padding:.54vw 2.4vw}
    143. 

  143. .section_right .item_banner{width:37.4vw;height:37.4vw;display:block;position:relative;border-radius: 2vw;}
    144. 

  144. .section_right .item_banner img{width:100%;height:100%;border-radius: 2vw;}
    145. 

  145. .section_right .item_banner .name{width:100%;height:6.4vw;position:absolute;bottom:0;background:rgba(0,0,0,0.4);line-height:6.4vw;font-size:3.2vw;color:#ffffff;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 2.7vw;box-sizing:border-box;border-radius: 0 0 2vw 2vw;}
    146. 

  146. .section_right .item_banner .statu{height:5.8vw;border-radius:2.9vw;background:rgba(0,0,0,0.4);position:absolute;left:2vw;top:2vw}
    147. 

  147. .section_right .item_banner .statu p{float:left;width:13.3vw;text-align:center;font-size:2.6vw;line-height:5.8vw;color:#FFF}
    148. 

  148. .section_right .item_banner .statu i{display:block;width:3.7vw;height:3.7vw;float:left;margin:1.1vw .54vw 0 .54vw}
    149. 

  149. .section_right .item_text .item_text_name{text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;position:relative;color:#4a4f58;font-size:3.2vw;padding-left:2.7vw}
    150. 

  150. .section_right  .item_text .item_text_name:before{content:'';width:1.1vw;height:1.1vw;border-radius:50%;background-color:#cccccc;position:absolute;left:0;top:1.7vw}
    151. 

  151. .section_page .section_page_main.max{height:auto}
    152. 

  152. .section_page .page_main_item.ad_01.bottom{margin:2.4vw auto;display:block}
    153. 

  153. .section_page .page_main_price .icon:before{width:15.8vw;height:5vw}
    154. 

  154. .section_page .page_main_price .price_grade_1:before{background-position:-84vw -69.5vw}
    155. 

  155. .section_page .page_main_price .price_grade_2:before{background-position:-84vw -76.5vw}
    156. 

  156. .section_page .page_main_price .price_grade_3:before{background-position:-84vw -83.7vw}
    157. 

  157. .section_page .page_main_price .price_grade_4:before{background-position:-84vw -90.7vw}
    158. 

  158. .section_page .page_main_price .price_grade_5:before{background-position:-84vw -97.5vw}
    159. 

  159. .section_page .page_main_price .main_price_none .listTag{padding:0 2vw;border:.27vw solid #ffe6dc;background:none;font-size:2.8vw;float:right}
    160. 

  160. .section_page .page_main_price .price_grade,.section_page .page_main_price .price_grade_shop,.section_page .page_main_price .price_grade_club{display:block;height:7vw;line-height:7vw;color:#f94b4b;font-style:normal;float:left}
    161. 

  161. .section_page .page_main_price .price_grade .icon,.section_page .page_main_price .price_grade_shop .icon,.section_page .page_main_price .price_grade_club .icon{display:inline-block;font-size:0;height:5vw;line-height:5vw;vertical-align:text-bottom}
    162. 

  162. .section_page .page_main_tag{color:#9aa5b5;margin:1vw 3.2vw;border:.27vw solid #e3ebf7;display:inline-block;padding:0 1.3vw;border-radius:.54vw}
    163. 

  163. .section_page .page_main_price .bold{font-weight:bold}
    164. 

  164. /*会员标签*/
    165. 

  165. .section_page .page_main_price .price_text_tag {-webkit-transform: scale(0.8) translateX(-4.2vw);-ms-transform: scale(0.8) translateX(-4.2vw);transform: scale(0.8) translateX(-4.2vw)}
    166. 

  166. .section_page .page_main_price .price_text_tag .svip-tag,
    167. 

  167. .section_page .page_main_price .price_text_tag .listTag{-webkit-transform: translateX(1.2vw);-ms-transform: translateX(1.2vw);transform: translateX(1.2vw)}
    168. 

  168. .section_page .page_main_price .price_text_tag .svip-tag{float: left; height:4.74vw;letter-spacing:0;overflow: hidden}
    169. 

  169. .section_page .page_main_price .price_text_tag .svip-tag .svip-icon{position:relative;z-index:9;float: left; width:9.8vw;height:4.74vw;text-align:center;line-height:4.74vw;font-size:2.8vw;font-weight:400;color:#F0CB72;opacity:1;background:#333333}
    170. 

  170. .section_page .page_main_price .price_text_tag .svip-tag .svip-icon.btr{border-radius:2px 8px 0px 2px}
    171. 

  171. .section_page .page_main_price .price_text_tag .svip-tag .svip-price{z-index:1;position:relative;float: left;padding-left:5.4vw;padding-right:0.6vw;margin-left:-6vw;line-height:4.74vw;height: 4.74vw; background:#F0CB72;opacity:1;border-radius:2px;font-size:2.8vw}
    172. 

  172. .section_page .page_main_price .price_text_tag .svip-tag .svip-price span{color: #333}
    173. 

  173. .section_page .page_main_price .price_text_tag .svip-tag .svip-price span:nth-child(2){margin-left: -0.4vw}
    174. 

  174. 

  175. 

  176. #recommendBox{width: calc(100%);height:150vw;overflow:hidden;position:relative;}
    177. 

  177. #recommendBox .swiper-pagination{width:100%;height:2.6vw;z-index:1;text-align:center;font-size:0;position:absolute;bottom:0vw;left:0}
    178. 

  178. #recommendBox .swiper-pagination .swiper-pagination-bullet{display:block;width:2vw;border-width:1vw 1px;border-color:transparent;cursor:pointer;background:none;font-size:0;opacity:.2}
    179. 

  179. #recommendBox .swiper-pagination .swiper-pagination-bullet:before{content:"";display:block;width:100%;height:.6vw;background:#FF5B00;border-radius:.3vw}
    180. 

  180. #recommendBox .swiper-pagination.hot .swiper-pagination-bullet:before{content:"";display:block;width:100%;height:.6vw;background:#FFFFFF;border-radius:.3vw}
    181. 

  181. #recommendBox .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{width:3.8vw;opacity:1}
    182. 

  182. #recommendBox .swiper-wrapper{height:inherit}
    183. 

  183. }
    184.