:root{
  --color1:#1464ad;
  --color1-light:#00689e;
  --color1-dark:#00689e;
  --color2:#8ebb34;
}
body{background:#f9f9f9;font-family:Poppins,Helvetica,Arial,sans-serif}
.container{max-width:1270px;margin-left:auto;margin-right:auto;background:#fff}
.header{padding:12px 20px;justify-content:space-between;align-items:center}
.logo{}
.logo img{max-height:100px}
.head-right{}
.head-tel{}
.head-feedback{margin-left:15px}
.head-contact{display:flex;justify-content:flex-end}
.head-contact__item{font-size:16px;color:var(--color1);display:flex;align-items:center}
.head-contact__item img{height:26px;margin-right:3px}
.head-contact__item a{color:var(--color1)}
.nav{margin-top:20px;display:flex;justify-content:flex-end}
.nav-item{margin-left:15px}
.nav-item:first-child{margin-left:0}
.nav-item a{font-size:17px;color:var(--color1);display:block;padding:3px 5px;border-radius:2px}
.nav-item a:hover,
.nav-item.cur a{background:var(--color1);color:#fff}
@media (max-width:1024px){
  .nav-item{margin-left:12px}
}
@media (max-width:768px){
  .header{padding:12px}
  .logo img{max-height:60px}
  .head-contact__item{font-size:14px}
  .nav-item{margin-left:10px}
  .nav-item a{font-size:14px}
}
@media (max-width:512px){
  .nav{margin-top:13px}
  .head-contact__item img{height:20px}
  .nav-item{margin-left:0}
}
.home-title{margin-bottom:25px;display:flex;justify-content:center;position:relative;z-index:2}
.home-title span{font-size:35px;padding:10px 30px;border-radius:15px 15px 0 0;font-weight:600;background:var(--color1);color:#fff}
@media (max-width:1024px){
  .home-title span{font-size:30px}
}
@media (max-width:768px){
  .home-title span{font-size:25px}
}
@media (max-width:512px){
  .home-title{margin-bottom:20px}
  .home-title span{font-size:18px}
}
.home-banner{padding-bottom:20px;background:var(--color1)}
.home-banner img{width:100%;display:block}
.home-about{padding:20px;text-align:center;background:var(--color1)}
.home-about__title{max-width:650px;margin:0 auto}
.home-about__title img{width:100%}
.home-about__desc{max-width:800px;margin:0 auto}
.home-about__desc p{font-size:min(17px,3vw);line-height:1.8;margin-top:16px;color:#fff;font-weight:300}
.home-product{margin:35px 0 70px;padding-bottom:40px;position:relative}
.home-product:after{content:'';border:solid 3px var(--color1);border-radius:50px;position:absolute;top:35px;right:50px;bottom:0;left:50px;z-index:1}
.product-list{padding:12px;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);position:relative;z-index:2}
.product-list__item{padding:6px 60px;position:relative}
.product-list__item:after{content:'';width:3px;background:var(--color1);position:absolute;right:0;top:0;bottom:0}
.product-list__item:last-child:after{display:none}
.product-list__img{height:350px}
.product-list__img img{width:100%;height:100%}
.product-list__name{margin:20px 0 5px;padding:12px 2px;font-size:20px;background:var(--color1);color:#fff;border-radius:30px;text-align:center;font-weight:400}
.product-list__name a{color:#fff}
.product-list__size{text-align:center}
.product-column{margin:40px 0;padding:0 15px}
.product-column img{max-width:1000px;display:block;width:100%;margin:0 auto}
@media (max-width:1280px){
  .product-list__img{height:30vw}
}
@media (max-width:1024px){
  .home-product:after{border:solid 3px var(--color1);right:30px;bottom:0;left:30px}
  .product-column{margin:30px 0}
  .home-product{margin:35px 0 50px}
  .product-list__item{padding:6px 40px}
}
@media (max-width:768px){
  .home-product:after{right:20px;bottom:0;left:20px}
  .product-column{margin:20px 0}
  .home-product{margin:35px 0}
  .product-list__item{padding:6px 25px}
  .product-list__name{font-size:16px}
}
@media (max-width:512px){
  .home-product:after{display:none}
  .product-list{grid-template-columns:100%;row-gap:20px}
  .product-list__item{padding:6px 12px}
  .product-list__item:after{display:none}
  .product-list__img{max-width:60%;margin:0 auto;height:auto}
}

.home-brand-wrap{padding:0 12px}
.home-brand{max-width:1020px;margin:0 auto}
.brand-row{margin-bottom:30px;display:grid;grid-template-columns:45% 50%;justify-content:space-between}
.brand-row__left{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}
.brand-row__img{flex:0 0 43%;height:200px;padding:3px;border-radius:50%;border:solid 5px var(--color1);overflow:hidden}
.brand-row__img img{width:100%;height:100%;border-radius:50%}
.brand-row__name{flex:0 0 45%;color:var(--color1);line-height:1;display:flex;align-items:center;text-align:center}
.brand-row__name strong{font-size:50px;display:block}
.brand-row__name span{font-size:40px}
.brand-row__desc{display:flex;align-items:center}
.brand-row__title{font-size:20px;font-weight:600;color:var(--color1)}
.brand-row__li{padding-left:20px;margin-top:9px;line-height:1.5;background:url("../images/li.png") no-repeat left 2px;color:#666}
@media (max-width:1024px){
  .brand-row__img{height:19vw}
  .brand-row__name{padding:0 30px}
  .brand-row__name strong{font-size:35px}
  .brand-row__name span{font-size:25px}
}
@media (max-width:768px){
  .brand-row{grid-template-columns:25% auto;column-gap:26px}
  .brand-row__left{justify-content:center}
  .brand-row__img{flex:0 0 80%}
  .brand-row__name{flex:0 0 100%;padding:0 10px;text-align:center;justify-content:center}
  .brand-row__name strong{font-size:20px}
  .brand-row__name span{font-size:15px}
}
@media (max-width:512px){
  .brand-row{grid-template-columns:25% auto;column-gap:16px}
  .brand-row__left{padding:30px 0}
  .brand-row__img{padding:2px;border-width:2px}
  .brand-row__name strong{font-size:17px}
  .brand-row__name span{font-size:14px}
  .brand-row__title{font-size:18px}
  .brand-row__li{background:url("../images/li.png") no-repeat left 5px;background-size:10px}
}
.home-img{}
.home-img img{display:block;width:100%}
.foot-contact{border-bottom:50px solid var(--color1)}
.foot-contact img{width:100%;display:block}
.footer{padding:30px 12px;background:var(--color1);color:#fff;text-align:center}
.footer__title{}
.footer__title img{max-width:350px}
.footer__name{font-size:20px;text-transform:uppercase;font-weight:300}
.footer__desc{margin:15px 0;font-weight:200}
.footer__contact{display:flex;justify-content:center}
.footer__feedback{margin-left:15px}
.footer__contact__item{font-size:16px;color:#fff;font-weight:300;display:flex;align-items:center}
.footer__contact__item img{height:26px;margin-right:3px}
.footer__contact__item a{color:#fff}
@media (max-width:768px){
  .foot-contact{border-bottom-width:20px}
}
.divider-line{height:10px;background:var(--color1)}