#brand-list{ overflow: hidden; } .product-banner img{ width: 100%; } .product_cate{ width: 100%; text-align: center; padding-bottom: .3rem; color: #a0a0a0; display: flex; } .actived{ color: #ea1974; } .product_cate span{ display: inline-block; border-right: 0.01rem #a0a0a0 solid; padding: 0 .3rem; flex: 1; } .product-banner img{ width: 100%; } .product_cate span:last-of-type{ border-right: none; } .products_list{ padding:.3rem; display: flex; } .product_cover img{ width: 2rem; } .product_ll{ width: 50%; border-bottom: #a2a2a2 .01rem solid; } .product_ll:nth-of-type(-n+2){ border-top: none; } .product_info{ flex: 1; padding-left: .5rem; position: relative; } .product_i_title,.product_i_price{ font-weight: 600; } .product_i_price{ padding: .1rem 0; } .product_i_intro{ position: absolute; bottom: 0.15rem; } .main_chapter:last-of-type{ padding-bottom: .3rem; } .product_ll{ float: left; width: 50%; padding-top: .3rem; padding-bottom: .3rem; } .ll-cover{ font-size: 0; } .ll-cover,.ll-info{ width: 50%; float: left; text-align: center; } .ll-cover img{ height: 1.5rem; width: auto !important; } .ll-info{ text-align: left; } .product_ll:hover{ border-radius: .04rem; box-shadow: 0 0 10px 5px rgba(220,220,220,1); transition: box-shadow 0.3s ease-in-out; } .product-content{ margin-top: .3rem; } .l-img{ flex: 1; font-size: 0; padding-right: .15rem; overflow: hidden; } .l-img img{ width: 100%; } .p-info{ flex: 1; padding-left: .15rem; } .p-title{ font-weight: 600; } .p-intro{ margin-top: .2rem; } .attr-line{ padding-top: .2rem; clear: both; } .a-l-l{ font-weight: 600; width: .5rem; } .a-l-r{ flex: 1; } .p-body{ max-width: 6.4rem; margin: 0 auto; margin-top: .2rem; text-align: center; } .p-body img{ max-width: 100%; } .swiper-container { width: 100%; height: 100%; margin-left: auto; margin-right: auto; } .swiper-slide { background-size: cover; background-position: center; } .gallery-top { height: 80%; } .gallery-thumbs { height: 20%; box-sizing: border-box; margin-top: 10px; font-size: 0; } .gallery-thumbs img{ height: 100%; } .gallery-thumbs .swiper-slide { width: 25%; height: 100%; opacity: 0.4; overflow: hidden; position: relative; cursor: pointer; } .gallery-thumbs .swiper-slide:hover img{ transform: scale(1.2); transition: transform 200ms linear; } .gallery-thumbs .swiper-slide-thumb-active { opacity: 1; } .swiper-slide-active{ opacity: 1 !important; transform: scale(1.2); transition: transform 300ms linear; } #sub_category{ padding: 0; height: 45px; margin: auto; list-style: none; display: flex; color: #a0a0a0; font-weight: 600; padding: 0 1rem; } #sub_category li{ flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; position: relative; cursor: pointer; } #sub_category i{ display: block; position: absolute; left: 0; width: .01rem; background-color: #a0a0a0; height: 40%; top: 30%; } #sub_category li:nth-of-type(1) i{ display: none; } #sub_category li:before{ content: ''; position: absolute; width: 0; left: 50%; bottom: 0; height: .02rem; background-color: #eb1a74; } #sub_category li:hover{ color: #eb1a74; } #sub_category li:hover:before{ width: 80%; left: 10%; transition: all 0.5s; } .suit_list{ margin: 0 auto; margin-top: .2rem; color: #3f3a39; } .suit_list li{ border-bottom: .01rem #a2a2a2 solid; } .suit_list li:nth-of-type(1){ margin-top: .3rem; } .suit_list li:hover{ border-radius: .04rem; box-shadow: 0 0 10px 5px rgba(220,220,220,1); transition: box-shadow 0.3s ease-in-out; } .suit_list .products_list:hover{ border-bottom: none; } .swiper-slide{ overflow: hidden; }