﻿.banner { position: relative; height: 4.2rem; overflow: hidden; }
.banner .images { height: 100%; }
.banner ul li {width:100%; height: 4.2rem; float: left; overflow: hidden; position: relative; }
.banner ul li a { display: block; height: 4.2rem; }
.banner .indexs { position: absolute; width: 100%; bottom: 0.24rem; text-align: center; }
.banner .indexs span { display: inline-block; width: 0.1rem; height: 0.1rem; border-width: 0.03rem; border-style: solid; border-radius: 50%; margin-right: 0.14rem; }

.section { padding: 0.64rem 0.32rem; background: #fff; }
.section .title { border-bottom: 0.01rem solid #ddd; line-height: 0.5rem; padding-bottom: 0.12rem; margin-bottom: 0.32rem; }
.section .title .fll { font-size: 0.36rem; }

.column { overflow: hidden; background: #F9F9F9; position: relative; }
.column .column-list { position: relative; overflow: hidden; }
.column .item { float: left; width: 2.78rem; height: 2rem; padding: 0.24rem; text-align: center; background: #fff; margin: 0 0.32rem 0.32rem 0; }
.column .item:nth-child(2n) { margin: 0 0 0.32rem 0; }
.column .item img { width: 0.7rem; height: 0.7rem; object-fit: cover; }
.column .item .name { font-weight: bold; }
.column .item .desc { font-size: 0.26rem; line-height: 0.36rem; }
.column .indexs { text-align: center; margin-top: 0.3rem; }
.column .indexs span { display: inline-block; width: 0.1rem; height: 0.1rem; border-width: 0.03rem; border-style: solid; border-radius: 50%; margin-right: 0.14rem; }
.column .indexs span:last-child { margin-right: 0; }

.service { position: relative; }
.service .service-list { width: 6.84rem; position: relative; overflow: hidden; }
.service .item { float: left; width: 3.28rem; margin: 0 0.26rem 0.32rem 0; }
.service .item:nth-child(2n) { margin: 0 0 0.32rem 0; }
.service .item .pic { width: 3.3rem; height: 1.86rem; }
.service .item .pic img { width: 100%; height: 100%; }
.service .item .name { padding: 0.16rem 0 0.08rem 0; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.service .item .desc { font-size: 0.26rem; line-height: 0.36rem; max-height: 0.72rem; overflow: hidden;text-overflow:ellipsis;white-space:nowrap; }
.service .indexs { text-align: center; margin-top: 0.3rem; }
.service .indexs span { display: inline-block; width: 0.1rem; height: 0.1rem; border-width: 0.03rem; border-style: solid; border-radius: 50%; margin-right: 0.14rem; }

.aboutus .box { height: 4.32rem; background-size: cover; }
.aboutus .title { font-size: 0.36rem; font-weight: bold; padding-top: 0.64rem; }
.aboutus .line { width: 1.3rem; height: 0.06rem; background: #fff; opacity: 0.2; margin: 0.32rem 0; }
.aboutus .desc { max-height: 0.8rem; line-height: 0.4rem; opacity: 0.8; overflow: hidden; }
.aboutus .link { width: 2.46rem; height: 0.72rem; line-height: 0.72rem; margin-top: 0.32rem; background: #fff; border-radius: 0.08rem; text-align: center; font-weight: bold; }
.aboutus .link a { display: block; }

.brand .item { float: left; width: 3.27rem; margin: 0 0.32rem 0.32rem 0; }
.brand .item:nth-child(2n) { margin: 0 0 0.32rem 0; }
.brand .item .pic { width: 100%; height: 1.5rem; }
.brand .item .pic img { max-width: 96%; max-height: 96%; position: relative; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); }
.brand .item .name { height: 0.6rem; line-height: 0.6rem; text-align: center; font-size: 0.26rem; }

.merit { padding: 0.64rem 0.32rem; }
.merit .slogan { line-height: 0.5rem; margin-bottom: 0.48rem; font-size: 0.36rem; font-weight: bold; }
.merit .item { width: 3.14rem; float: left; margin: 0 0.52rem 0.32rem 0; }
.merit .item:nth-child(2n) { margin: 0 0 0.32rem 0; }
.merit .item .pic { width: 0.8rem; height: 0.8rem; margin-right: 0.16rem; }
.merit .item .pic img { width: 100%; height: 100%; object-fit: cover; }
.merit .item .name { width: 2.18rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.merit .item .desc { width: 2.18rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; opacity: 0.6; }

.product .item { margin-bottom: 0.32rem; position: relative; }
.product .item .pic { width: 2.76rem; height: 2.76rem; border: 0.01rem solid #ddd; }
.product .info { width: 3.82rem; height: 2.8rem; font-size: 0.26rem; position: relative; }
.product .name { font-size: 0.3rem; font-weight: bold; margin-bottom: 0.14rem; max-height: 0.84rem; overflow: hidden; }
.product .split { width: 0.01rem; height: 0.28rem; margin: 0 0.08rem; }
.product .cas { margin-bottom: 0.14rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product .purity { margin-bottom: 0.14rem; }
.product .price { position: absolute; width: 100%; bottom: 0px; }
.product .price label { font-size: 0.3rem; font-weight: bold; }
.product .price .packsize { margin-left: 0.16rem; }
.product .item .tag { position: absolute; left: 0.08rem; top: 0.08rem; }


.news { position: relative; background: #f9f9f9 }
.news .news-list { height: 6rem; position: relative; overflow: hidden; }
.news .item { }
.news .pic { height: 3.88rem; }
.news .pic img { width: 100%; height: 100%; }
.news .time { padding: 0.22rem 0 0.12rem 0; }
.news .time span { font-weight: bold; margin-right: 0.12rem; }
.news .name { padding-bottom: 0.12rem; font-size: 0.32rem; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.news .desc { height: 0.8rem; line-height: 0.4rem; overflow: hidden; }
.news .indexs { text-align: center; margin-top: 0.3rem; }
.news .indexs span { display: inline-block; width: 0.1rem; height: 0.1rem; border-width: 0.03rem; border-style: solid; border-radius: 50%; margin-right: 0.14rem; }
