@charset "UTF-8";

@import "iconfont.css";
@import "animate.css";

:root {
  --color-primary: #D71635;
  /* 区块 */
  --bg-color: #d71635;
  /* 文字 */
  --text-color: #0f0f0f;
  --text-color-active: #d71635;
  /* 文字链接、导航 */
  --link-color-selected: #d71635;
  --link-color-hover: #d71635;
  /* 按钮 */
  --btn-bg: #d71635;
  --btn-bg-hover: #d71635;
  --font-family:'Roboto';
  --font-family-second:'robotobold';
  --font-family-third:'robotoblack'
}

html{font-size: clamp(12px, calc(10px + 0.35vw), 16px);}

/*********** reset start **************/
*,*::before,*::after {margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:none;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
img{max-width:100%;height:auto;width:auto;vertical-align:bottom;}
fieldset,img,input,button,hr,textarea{border:0;padding:0;}
:focus{outline:0;}
address,caption,cite,code,dfn,em,b,th,i,var,optgroup{font-style:normal;font-weight:400;}
abbr,acronym{border:0;font-variant:normal;}
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}
code,kbd,samp,tt{font-size:100%;}
input,button,textarea,select{font-size:100%;}
ol,ul{list-style:none;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;}
sup,sub{font-size:100%;vertical-align:baseline;}
:link,:visited,ins{text-decoration:none;}
button,input[type="submit"]{-webkit-appearance:none;-moz-appearance:none;appearance:none;}
input::placeholder,textarea::placeholder{opacity:1}

/*************** common class start ********************/
.uppercase{text-transform:uppercase;}
.hide{display:none;}
.cl{zoom:1}
.cl:before,.cl:after{display:table;content:" ";}
.cl:after{clear:both;}
.pr{position:relative;}
.fr,.float-right{float:right;}
.fl,.float-left{float:left;}
.row{margin-right:-10px;margin-left:-10px;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}
.flex-wrap{display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap}
.align-items-center{-webkit-align-items:center;align-items:center}
.row-reverse{-webkit-flex-direction:row-reverse;flex-direction:row-reverse}
/*************** common class end ********************/
body{color:var(--text-color,#666);font-size:16px;font-family:var(--font-family);background:#fff;max-width:1920px;margin:0 auto;}
a{color:inherit;}
a:hover{text-decoration:none;color:var(--color-primary);}

.h1,h1,.h2,h2,.h3,h3.h4, .h5, .h6, h4, h5, h6{margin:0;}

.wp{width:1400px;margin:0 auto}
@media screen and (max-width:1600px){
  .wp{width:1300px;}
}
@media screen and (max-width:1441px){
  .wp{width:1200px;}
}
@media screen and (max-width:1367px){
  .wp{width:100%;padding-right:80px;padding-left:80px;}
}
@media screen and (max-width:1281px){
  .wp{padding-right:70px;padding-left:70px;}
}
  
@media (max-width:1171px){
.wp{width:100%;padding-inline:clamp(15px, 5vw, 50px);}
}     
  
/***************** grid and size start ***********************/
.visible-xs,.visible-xs-block{display:none!important}
@media screen and (max-width:768px){
  .visible-xs{display:block!important}
  .visible-xs-block{display:block!important}
}
@media screen and (max-width:768px){
  .hidden-xs{display:none!important}
}
.col-xs-1,.col-sm-1,.col-md-1,.col-lg-1,.col-xs-2,.col-sm-2,.col-md-2,.col-lg-2,.col-xs-3,.col-sm-3,.col-md-3,.col-lg-3,.col-xs-4,.col-sm-4,.col-md-4,.col-lg-4,.col-xs-5,.col-sm-5,.col-md-5,.col-lg-5,.col-xs-6,.col-sm-6,.col-md-6,.col-lg-6,.col-xs-7,.col-sm-7,.col-md-7,.col-lg-7,.col-xs-8,.col-sm-8,.col-md-8,.col-lg-8,.col-xs-9,.col-sm-9,.col-md-9,.col-lg-9,.col-xs-10,.col-sm-10,.col-md-10,.col-lg-10,.col-xs-11,.col-sm-11,.col-md-11,.col-lg-11,.col-xs-12,.col-sm-12,.col-md-12,.col-lg-12{position:relative;min-height:1px;padding-right:10px;padding-left:10px;-webkit-box-sizing:border-box;box-sizing:border-box}
.col-xs-12{width:100%}
.col-xs-11{width:91.66666667%}
.col-xs-10{width:83.33333333%}
.col-xs-9{width:75%}
.col-xs-8{width:66.66666667%}
.col-xs-7{width:58.33333333%}
.col-xs-6{width:50%}
.col-xs-5{width:41.66666667%}
.col-xs-4{width:33.33333333%}
.col-xs-3{width:25%}
.col-xs-2{width:16.66666667%}
.col-xs-1{width:8.33333333%}
@media screen and (min-width:768px){
  .col-sm-12{width:100%}
  .col-sm-11{width:91.66666667%}
  .col-sm-10{width:83.33333333%}
  .col-sm-9{width:75%}
  .col-sm-8{width:66.66666667%}
  .col-sm-7{width:58.33333333%}
  .col-sm-6{width:50%}
  .col-sm-5{width:41.66666667%}
  .col-sm-4{width:33.33333333%}
  .col-sm-3{width:25%}
  .col-sm-2{width:16.66666667%}
  .col-sm-1{width:8.33333333%}
}
@media screen and(min-width:992px){
  .col-md-12{width:100%}
  .col-md-11{width:91.66666667%}
  .col-md-10{width:83.33333333%}
  .col-md-9{width:75%}
  .col-md-8{width:66.66666667%}
  .col-md-7{width:58.33333333%}
  .col-md-6{width:50%}
  .col-md-5{width:41.66666667%}
  .col-md-4{width:33.33333333%}
  .col-md-3{width:25%}
  .col-md-2{width:16.66666667%}
  .col-md-1{width:8.33333333%}
}
@media screen and (min-width:1200px){
  .col-lg-12{width:100%}
  .col-lg-11{width:91.66666667%}
  .col-lg-10{width:83.33333333%}
  .col-lg-9{width:75%}
  .col-lg-8{width:66.66666667%}
  .col-lg-7{width:58.33333333%}
  .col-lg-6{width:50%}
  .col-lg-5{width:41.66666667%}
  .col-lg-4{width:33.33333333%}
  .col-lg-3{width:25%}
  .col-lg-2{width:16.66666667%}
  .col-lg-1{width:8.33333333%}
}
/***************** grid and size end ***********************/

.zhuli-hot_product{padding:clamp(30px,4.17vw,80px) 0;}
.zhuli-hot_product .tit{text-align:center;}
.zhuli-hot_product .tit h3{font-size:clamp(22px, 2.1vw, 40px);line-height:1;color:#2c2c2c;font-weight:700;text-transform:uppercase;}
.zhuli-hot_product .tit p{max-width:80%;font-size:1.1rem;color:#5b5b5b;line-height:1.56;margin:1rem auto 0;}

.zhuli-hot_product ul{margin:3rem 0 0;display:grid;grid-template-columns:repeat(4, 1fr);gap:2rem;}
.zhuli-hot_product ul li{position:relative;text-align:center;cursor:pointer;}
.zhuli-hot_product ul li .pic{width:100%;position:relative;display:block;overflow:hidden;}
.zhuli-hot_product ul li .pic img{width:100%;transition:all 0.3s ease 0s;}
.zhuli-hot_product ul li h6{padding:20px 10px;}
.zhuli-hot_product ul li h6 a{font-size:clamp(14px,0.89vw,17px);color:#000;line-height:1.2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;-webkit-line-clamp:3;}
.zhuli-hot_product ul li:hover{box-shadow:0px 30px 50px -26px rgba(16,36,94,0.25);}
.zhuli-hot_product ul li:hover h6 a{color:var(--color-primary);}
.zhuli-hot_product ul li:hover img{transform:scale(1.08);}


@media screen and (max-width:991px){
.zhuli-hot_product ul{grid-template-columns:repeat(3, 1fr);}
}
@media screen and (max-width:768px){
.zhuli-hot_product ul{grid-template-columns:repeat(2, 1fr);gap:1.5rem;}
.zhuli-hot_product .tit p{max-width:100%;}
}