
.reviews{
    text-align: center;
    line-height:64px;
}

.img-responsive{
    height:25px;
}
.reviews em{
    font-style: normal;
    font-weight: bold;
}
.reviews a{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
}
.reviews .img1{margin-right:10px;}

.indextitle{
    font-size: 24px;
    color: #231F20;
    font-family: Poppins-Bold;
    margin-bottom:25px;
}
.indextitle a{
    float: right;
    font-size: 15px;
    color: #119227;
    font-family: Poppins-SemiBold;
}
.hotsale,.homebottom{background:#fff;}
.hotsale{padding-bottom:35px;}
.hotsale .content ul{
    display: grid;
    grid-gap: 25px;
    grid-template-columns: repeat(6, 1fr);
}
.hotsale .content li{
    padding:0;
}
.hotsale .content li p{

    font-family: Poppins-SemiBold;
font-size: 17px;
color: #333333;
line-height: 22px;
text-align: center;
height:44px;
overflow: hidden;
}
.d-flex{
    display: flex;
    align-items: center;
    justify-content: center;
}
.hotsale .content li .pro{
    height:128px;

}
.hotsale .content li .pro a{
    height: 100%;
}
.hotsale .content li .pro img{
    max-width: 100%;
    max-height:90%;
}
.hotsale .content li .select{
    width:80%;
height: 37px;
line-height:37px;
border-radius: 6px ;
background: url(../../images/index/arrowright.png) no-repeat right 5px center;
border: 1px solid #BFBFBF;
font-size: 15px;
color:#666;
font-family: Poppins-Medium;
text-align: center;
position: relative;
margin:0 auto;
cursor: pointer;
}
.hotsale .content li .select span{

    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    padding: 0 26px 0 10px;
    height: 37px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.hotsale .content li .select2 span{padding:0;}
.hotsale .content li .select.cur{
    background: url(../../images/index/arrowrights.png) no-repeat right 5px center;
}
.hotsale .content li .select2.cur{
    background:none;
}
.hotsale .content li .select2{
    background:none;
    border:1px solid transparent;
}
.hotsale .content li .select ul{
    border: 1px solid #BFBFBF;
    position:absolute;
    top:40px;
    width: 100%;
    border-radius: 6px ;
    background:#fff;
    display: none;
}
.hotsale .content li .select li{
    line-height:25px;
    display: block;
    text-align: center;
   
}
.hotsale .content li .price{
    text-align: center;
    margin:6px 0;
    color:#E5681A;
    font-size: 18px;
    font-family: Poppins-Medium;
}
.hotsale .content li .original-price{
    text-decoration: line-through;
    font-size: 15px;
    color:#666;
}
.hotsale .content li .add{
line-height:40px;
background: #FF6633;
border-radius: 6px;
font-size: 16px;
color:#fff;
font-family: Poppins-Medium;
display: block;
margin:0 auto;
text-align: center;
transition: all .3s;
}
.hotsale .content li .add:hover{
    
}
.hotsale .content li .margin-t{
    margin:10px 0 35px;
}

.homecenter{
background: #FDF8F5;
padding:35px 0;

}

.whychose ul{
    display: grid;
    grid-gap: 25px;
    grid-template-columns: repeat(3, 1fr);
}

.whychose li{
    text-align: center;
background: #FFFFFF;
box-shadow: 0px 3px 6px 1px rgba(0,0,0,0.16);
border-radius: 12px;
padding:18px 40px 40px;
}
.whychose li .icon-wrapper{
    position: relative;
            width: 100px;
            height: 100px;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            margin:0 auto;
}
.whychose li .icon-wrapper img{
    z-index: 2;
    transition: all 0.4s ease;
}
.whychose li .icon-wrapper::before {
    content: '';
    position: absolute;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    z-index: 1;
    transition: all 0.4s ease;
    transform: scale(0.8);
    opacity: 0;
}

.whychose li .icon-wrapper::after {
    content: '';
    position: absolute;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 2px solid #FF6633;
    z-index: 0;
    transition: all 0.4s ease;
    transform: scale(0);
    opacity: 0;
}


.whychose li .icon-wrapper:hover::before {
    transform: scale(1.2);
    opacity: 1;
}

.whychose li .icon-wrapper:hover::after {
    transform: scale(1);
    opacity: 1;
}


.whychose li span{

font-family: Poppins-SemiBold;
font-size: 21px;
color: #333333;
display: block;
margin-bottom: 6px;
}
.whychose li  p{
    text-align: left;
    color:#555;
    font-size: 16px;
    font-family: Poppins-Medium;
    line-height: 25px;
}

.customer{
    margin-top:60px;
    overflow: hidden;
   
}
.mySwiper {
    position: relative;
   
}
.mySwiper .swiper-container{
    padding-bottom: 20px;
}
.mySwiper  .swiper-slide{
    background:#fff;
box-shadow: 0px 3px 6px 1px rgba(0,0,0,0.16);
border-radius: 9px;
padding:25px;
}

.mySwiper  .user-info{
    display: flex;
    justify-content: space-between;
} 
.mySwiper  .user-info .avatar{
    width:54px;
    height:54px;
    border-radius: 12px;
    margin-right:10px;
}
.mySwiper  .user-info .avatar img{
    max-width: 90%;
    max-height:90%;
}
.mySwiper  .user-info .info{
    display: flex;
    justify-content: space-between;
    flex:1;
    align-items: center;
}
.mySwiper  .user-info .info .name{

font-size: 20px;
color: #333333;
font-family: Poppins-SemiBold;
}
.mySwiper  .user-info .info .date{

font-size: 15px;
color: #777777;
font-family: Poppins-Medium;
margin-top:5px;
}
.mySwiper  .user-info svg{
    color:#FF6633;
}
.mySwiper  .user-icon{
    margin:20px 0;
}
.mySwiper  .user-icon span{
    display: inline-block;
    line-height:23px;
    height: 23px;
    background: #FFF4F0;
    border-radius: 3px;
    padding:0 6px;
    margin:0 6px 6px 0;
    color: #FF6633;
    font-size: 14px;
    font-family: Poppins-Medium;
}
.mySwiper .description{

font-size: 16px;
color: #555555;
font-family: Poppins-Medium;
line-height: 25px;
}
.mySwiper:before,.mySwiper:after{
    content: "";
    height: 100%;
    position: absolute;
    top: 0;
    width: 155px;
    z-index: 1;
}

.mySwiper:before{

left: 0;
z-index: 2;
background: linear-gradient( 270deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.85) 19%, #FDF8F5 100%);
}


.mySwiper:after {
background: linear-gradient( 90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.85) 49%, #FDF8F5 100%);
    right: 0;
}

.homebottom{
    padding: 35px 0 80px;
}

.homebottom .news ul{
    display: grid;
    grid-gap: 18px;
    grid-template-columns: repeat(3, 1fr)
}
.homebottom .news li{
    padding:18px 12px 30px;
    transition: all .3s;
}
.homebottom .news li:hover{

background: #FFFFFF;
box-shadow: 0px 3px 45px 1px rgba(235,103,69,0.24);
border-radius: 8px ;
transform: translate(0,-5px);
}
.homebottom .news li .newimg{
    height:0;
    padding-bottom:43%;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
}
.homebottom .news li .newimg img{
    width: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
}
.homebottom .news li .title{
 
font-size: 20px;
color: #333333;
line-height: 24px;
height:48px;
overflow: hidden;
font-family: Poppins-SemiBold;
margin:12px 0 10px;
}
.homebottom .news li .font{

font-size: 16px;
color: #333333;
line-height: 20px;
text-align: left;
height:40px;
overflow: hidden;
font-family: Poppins-Medium;
}
.homebottom .news li  .time{
padding:0 7px;
display: inline-block;
height: 24px;
background: #FF6633;
border-radius: 12px ;
line-height:24px;
font-size: 14px;
color: #FFFFFF;
font-family: Poppins-Regular;
margin-top:8px;
}

.homebottom .faq{
    margin-top:55px;
}
.homebottom .faq .lists{
    display: grid;
    grid-gap: 38px;
    grid-template-columns: repeat(2, 1fr);
}
.homebottom .faq dt{
border-bottom: 1px solid #DDE2EC;
line-height:50px;
font-size: 22px;
color:#333;
font-family: Poppins-SemiBold;
display: flex;
align-items: center;
}
.homebottom .faq dt img{
    margin-right:5px;
}
.homebottom .faq dd{
    padding:17px 40px 17px 57px;
    border-bottom: 1px solid #DDE2EC;
}
.homebottom .faq dd.cur{
background: #FDF8F5;
}
.homebottom .faq dd .qus{
    font-size: 18px;
color:#333;
line-height:25px;
font-family: Poppins-Medium;
display: flex;
justify-content: space-between;
}
.homebottom .faq dd .qus span{
  flex:1;
}
.homebottom .faq dd .qus em{
    width: 40px;
height: 25px;
line-height:25px;
background: url(../../images/index/jia.png) no-repeat center center;
border-radius: 13px ;
border: 1px solid #DDE2EC;
display: inline-block;
cursor: pointer;
}
.homebottom .faq dd .qus em.active{
    background: url(../../images/index/jian.png) no-repeat center center;
}
.homebottom .faq .ans{
    font-size: 16px;
    color:#333;
font-family: Poppins-Regular;
margin-top:12px;
display: none;
}

@media (max-width: 1024px) {
    .homebottom{padding:35px 0 ;}
    .hotsale .content ul{
        grid-template-columns: repeat(2, 1fr);
    }

  
  
    .hotsale .content li .select,.mySwiper .user-info .info .date,.indextitle a{font-size: 14px;  }
    .hotsale .content li .add,.homebottom .faq .ans{font-size: 15px;   }
    .whychose li p,.mySwiper .description,.homebottom .news li .font{font-size: 15px; line-height: 24px;height:auto;}
    .hotsale .content li p,.reviews a{font-size: 16px;  line-height:21px;}
    .hotsale .content li .price,.homebottom .faq dd .qus{font-size: 17px;  line-height:24px;}
    .whychose li span,.homebottom .news li .title, .homebottom .faq dt{font-size: 19px; line-height:23px; }
    .mySwiper .description{margin-top:10px;}
 
    .indextitle{
        font-size: 21px; 
          
    }
    .whychose ul,.homebottom .faq .lists,.homebottom .news ul{display: block;}
    .whychose li{margin-bottom: 20px;padding:18px 30px 30px;}
    .homebottom .faq .lists .item-list{margin-bottom: 20px;}
    .homebottom .news li{background:#fff;box-shadow: 0px 3px 45px 1px rgba(235,103,69,0.24);margin-bottom: 20px;border-radius: 8px;}
    
    .mySwiper .swiper-slide{width:90% !important;margin-right:15px !important}
    .mySwiper:before, .mySwiper:after{background:transparent;}
    .customer{margin-top:40px;}
    .reviews .img1,.mySwiper .user-icon,.pay-icon{display: none;}
    .homebottom .faq dt img{width:40px;}
    .homebottom .faq dd{    padding: 17px 20px 17px 45px;}
    .hotsale .content li .select{width:100%}

}