Home Explore Help
Sign In
caimei365
/
caimei365-www
3
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Tree: 5db1e78c1c
Branches Tags
caimei365-www
/
src
/
main
/
resources
/
static
/
css
/
base
/
floor.css

floor.css 14 KB
History Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138 
  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. .section_page .section_page_title{width:100%;height:103px;box-sizing:border-box;padding:31px 0 16px 0}
    8. 

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

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

  10. .section_page .section_page_main{width:100%;float:left;height:568px;overflow:hidden;transition:all 0.6s}
    11. 

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

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

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

  14. .section_page .section_page_main.type_03{height:704px}
    15. 

  15. .section_page  .page_main_item{width:164px;height:268px;float:left;margin-right:16px;margin-bottom:16px;background-color:#FFFFFF;transition:all 0.4s;display:block}
    16. 

  16. .section_page  .page_main_item.default{cursor:default}
    17. 

  17. .section_page  .page_main_item.ad_04{border-radius:2px}
    18. 

  18. .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)}
    19. 

  19. .section_page .section_page_main.section_6{height:auto}
    20. 

  20. .section_page .section_page_main.section_6 .section_page_more{display:none}
    21. 

  21. .section_page .section_page_main.section_3,.section_page .section_page_main.section_4,.section_page .section_page_main.section_5{height:704px}
    22. 

  22. .section_page .section_page_main.max{height:auto}
    23. 

  23. .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}
    24. 

  24. .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}
    25. 

  25. .section_page_main.section_2 .page_main_item.ad_02,.section_page_main.section_4 .page_main_item.ad_03{width:344px}
    26. 

  26. .section_page .page_main_item_adv{width:100%;height:100%;display:block}
    27. 

  27. .section_page .page_main_image{width:164px;height:164px;display:block;float:left;border-radius:2px 2px 0 0}
    28. 

  28. .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}
    29. 

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

  30. .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}
    31. 

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

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

  33. .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}
    34. 

  34. .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}
    35. 

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

  36. .section_page .page_main_price .main_price_login,.section_page .page_main_price .main_price_show.none{display:none}
    37. 

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

  38. .section_page .page_main_price .price_text_tag .listTag{margin:0;float:left}
    39. 

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

  40. .section_page .page_main_price .main_price_none.sec{margin-top:25px}
    41. 

  41. .section_page .page_main_price .main_price_none .listTag{margin:0}
    42. 

  42. .section_page .page_main_price .price_grade,.section_page .page_main_price .price_grade_shop,.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}
    43. 

  43. .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}
    44. 

  44. .section_page .page_main_price .icon:before{width:67px;height:22px}
    45. 

  45. .section_page .page_main_price .price_grade_1:before{background-position:0 -714px}
    46. 

  46. .section_page .page_main_price .price_grade_2:before{background-position:0 -744px}
    47. 

  47. .section_page .page_main_price .price_grade_3:before{background-position:0 -774px}
    48. 

  48. .section_page .page_main_price .price_grade_4:before{background-position:0 -804px}
    49. 

  49. .section_page .page_main_price .price_grade_5:before{background-position:0 -834px}
    50. 

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

  51. .section_page .section_page_more.show{display:block}
    52. 

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

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

  54. .section_page .section_page_more .more:hover{color:#E15616;border-color:#E15616}
    55. 

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

  56. /* 底部供应商 */
    57. 

  57. .section_page .section_page_bottom{width:100%;float:left;height:auto}
    58. 

  58. .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}
    59. 

  59. .section_page .page_main_li.ad_01{width:884px;height:184px}
    60. 

  60. .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)}
    61. 

  61. .section_page  .page_main_li.ad_02:hover .page_main_name{color:#E15616;font-weight:bold}
    62. 

  62. .section_page  .page_main_li .page_main_logo{width:100%;height:134px;display:block;float:left}
    63. 

  63. .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}
    64. 

  64. 

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

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

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

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

  69. }
    70. 

  70. /**
    71. 

  71.  * 移动端
    72. 

  72.  */
    73. 

  73. @media screen and (max-width:768px) {
    74. 

  74. .section_page{width:100%;height:auto}
    75. 

  75. .section_page .section_page_title{padding:2.4vw 0 2.4vw 3.2vw;position:relative}
    76. 

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

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

  78. .section_page .page_main_item{width:45.6vw !important;height:68vw;overflow:hidden;margin:0 1.3vw 2.6vw 1.3vw;background:#fff;text-align:left}
    79. 

  79. .section_page .page_main_image{width:45.6vw;height:45.6vw}
    80. 

  80. .section_page .page_main_text{padding:0 3.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}
    81. 

  81. .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%}
    82. 

  82. .section_page .page_main_price{width:100%;box-sizing:border-box;padding:0 3.2vw}
    83. 

  83. .section_page .page_main_price .price_text_tag{width:100%;box-sizing:border-box;float:left}
    84. 

  84. .section_page .page_main_price .main_price_show{color:#f94b4b}
    85. 

  85. .section_page .page_main_price .main_price_login,.section_page .page_main_price .main_price_show.none{display:none}
    86. 

  86. .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}
    87. 

  87. .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}
    88. 

  88. .section_page .section_page_main.section_6{height:auto}
    89. 

  89. .section_page .section_page_main.section_6 .section_page_more{display:none}
    90. 

  90. .section_page .section_page_main.section_3,.section_page .section_page_main.section_4,.section_page .section_page_main.section_5{height:167vw}
    91. 

  91. .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:24vw}
    92. 

  92. .section_page .section_page_main{margin:auto;width:97vw;height:140vw;overflow:hidden}
    93. 

  93. .section_page .section_page_main.type_03{height:167vw}
    94. 

  94. .section_page .section_page_more{display:none}
    95. 

  95. .section_page .section_page_more.show{display:block}
    96. 

  96. .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:.54vw;position:relative;text-indent:2vw}
    97. 

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

  98. .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}
    99. 

  99. .section_page .page_main_li .page_main_logo{width:100%;height:21.6vw;display:block;float:left}
    100. 

  100. .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}
    101. 

  101. .section_page_bottom{width:97vw;padding:3.2vw;overflow:hidden}
    102. 

  102. .page_main_li.ad_01 img{width:100%;height:100%}
    103. 

  103. .section_right{padding:3.2vw}
    104. 

  104. .box{white-space:nowrap;overflow-x:auto}
    105. 

  105. .section_right .section_right_item{display:inline-block;width:42.2vw;height:61.6vw;background:#fff;margin-right:2.4vw;flex-shrink:0}
    106. 

  106. .section_right .right_item_title{overflow:hidden;padding:2.4vw}
    107. 

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

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

  109. .section_right .right_item_main{height:auto;padding:.54vw 2.4vw}
    110. 

  110. .section_right .item_banner{width:37.4vw;height:37.4vw;display:block;position:relative}
    111. 

  111. .section_right .item_banner img{width:100%;height:100%}
    112. 

  112. .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}
    113. 

  113. .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}
    114. 

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

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

  116. .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}
    117. 

  117. .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}
    118. 

  118. .section_page .section_page_main.max{height:auto}
    119. 

  119. .section_page .page_main_item.ad_01.bottom{margin:2.4vw auto;display:block}
    120. 

  120. .section_page .page_main_price .icon:before{width:15.8vw;height:5vw}
    121. 

  121. .section_page .page_main_price .price_grade_1:before{background-position:-84vw -69.5vw}
    122. 

  122. .section_page .page_main_price .price_grade_2:before{background-position:-84vw -76.5vw}
    123. 

  123. .section_page .page_main_price .price_grade_3:before{background-position:-84vw -83.7vw}
    124. 

  124. .section_page .page_main_price .price_grade_4:before{background-position:-84vw -90.7vw}
    125. 

  125. .section_page .page_main_price .price_grade_5:before{background-position:-84vw -97.5vw}
    126. 

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

  127. .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:#4A4F58;font-style:normal;float:left}
    128. 

  128. .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}
    129. 

  129. .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}
    130. 

  130. .section_page .page_main_price .bold{font-weight:bold}
    131. 

  131. 

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

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

  134. #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}
    135. 

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

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

  137. #recommendBox .swiper-wrapper{height:inherit}
    138. 

  138. }
    139.