/* CSS Document */
:root{
	--main_color:#3298ff;        /* 主色 */
	--main_color_rgb:50,152,255;  /* rgba */}
@font-face{ font-family:'alimama'; src: url('/images/alimama.ttf');}
@font-face{ font-family:'Beba'; src: url('/images/BebasNeue-Bold.ttf');}
a {
    text-decoration: none;
}
.t_left_center{ display: flex; flex-direction: column; justify-content: center;}
.flex_start{ display: flex; justify-content: flex-start; flex-wrap: wrap;}
.flex_space{ display: flex; justify-content: space-between; flex-wrap: wrap;align-items: center;}
.t_center{ display: flex; flex-direction: column; justify-content: center; align-items: center;}
.width_1600{ width:1600px; margin:0 auto;}
.container-fluid{overflow:hidden;}
.titles{text-align: center;color:  var(--main_color);}
.titles h3 {font-size: 40px;text-transform: uppercase;font-weight: bold;line-height: 2;}
.titles h2 {font-size: 1.2vw;margin-bottom: 2%;}
 .swiper-button-next:after,.news_other .swiper-button-prev:after{ display:none;}
.swiper-button-next{ width:50px; height:50px; border-radius:50%; background:var(--main_color) url(/images/btn_jt.png) no-repeat center; top:inherit; bottom:0; right:41%;}
 .swiper-button-prev{ width:50px; height:50px; border-radius:50%; background:var(--main_color) url(/images/btn_jt.png) no-repeat center; top:inherit; bottom:0; left:50%; transform:rotate(180deg);}
#mould87107  .first{ position:relative;}
#mould87107 .first:after{ content:"";width: 100%; height:100vh; position:absolute; top:0; left:0; background:rgba(0,0,0,0.3); z-index:9;}
#mould87107 .first .wenan_a{ text-align:center; color:#fff; position:absolute; top:32%; left:0; width: 100%; height:200px; z-index:10;}
#mould87107 .first .wenan_a span{ width:40px; height:40px; margin:0 auto; background:url(/images/q.png) no-repeat center; display:block;}
#mould87107 .first .wenan_a h2{font-size: 40px;line-height: 40px;margin:20px 0 30px 0;}
#mould87107 .first .wenan_a h3{font-size: 28px;line-height: 28px;}
#mould87107 .first .link_a{width: 380px;margin: 60px auto 0 auto;}
#mould87107 .first .link_a a{ float:left; font-size:18px; color:#fff; background:url(/images/b.png) no-repeat center right; padding-right:5px;}
#mould87107 .first .link_a a:first-child{ margin-right:80px;}


/*侧边*/
.right-float{width:70px;position:fixed;right:2px;bottom:4%;z-index:300;}
.right-1{width:70px;height:70px;background:var(--main_color);border-radius:6px;margin-top:1px;display:flex;justify-content:space-between;flex-wrap:wrap;align-content:center;position:relative;cursor:pointer;}
.right-1 a{width:100%;height:100%;display:block;overflow:hidden;display:flex;justify-content:space-between;flex-wrap:wrap;align-content:center;}
.right-1 samp{width:100%;overflow:hidden;display:block;text-align:center;}
.right-1 span{width:100%;display:block;overflow:hidden;text-align:center;font-size:12px;color:#fff;margin-top:6px;}
.right-phone{width:240px;height:70px;position:absolute;right:90px;top:50%;background:#fff;display:flex;justify-content:space-between;flex-wrap:wrap;align-content:center;border-radius:6px;box-sizing:border-box;padding-left:16px;opacity:0;transform-origin:right center;transform:translateY(-50%) scale(0);}
.right-phone:before{width:auto;content:"";position:absolute;right:-10px;top:50%;transform:translateY(-50%);border-left:10px #fff solid;border-top:10px transparent solid;border-bottom:10px transparent solid;}
.right-phone p{width:100%;overflow:hidden;font-size:16px;color:#222;line-height:24px;}
.right-1:hover .right-phone{transform:translateY(-50%) scale(1);opacity:1;}
.right-wx{width:180px;height:180px;position:absolute;right:90px;top:50%;background:#fff;display:flex;justify-content:space-between;flex-wrap:wrap;align-content:center;border-radius:6px;box-sizing:border-box;transform-origin:right center;transform:translateY(-50%) scale(0);}
.right-wx:before{width:auto;content:"";position:absolute;right:-10px;top:50%;transform:translateY(-50%);border-left:10px #fff solid;border-top:10px transparent solid;border-bottom:10px transparent solid;}
.right-wx img{width:100%;height:auto;border-radius:6px;}
.right-1:hover .right-wx{transform:translateY(-50%) scale(1);opacity:1;}
.right-2{width:70px;height:70px;background:#fff;border-radius:6px;margin-top:1px;display:flex;justify-content:space-between;flex-wrap:wrap;align-content:center;position:relative;cursor:pointer;box-shadow:0px 0px 12px 4px rgba(0,0,0,0.04);}
.right-2 span{width:100%;overflow:hidden;text-align:center;display:block;font-size:14px;font-weight:bold;color:var(--main_color);background:url("/images/icon-153.png") no-repeat top center;padding-top:12px;}
.right-2 p{width:100%;overflow:hidden;text-align:center;display:block;font-size:12px;color:#222;}

/* 关于我们 */
.about_a {padding: 5% 0% 1% 0;}
.about_a h3 {font-size: 38px;font-weight: bold;line-height: 48px;color:  var(--main_color);}
.about_a h2 {font-size: 22px;line-height: 56px;font-weight: bold;color:  var(--main_color);}
.about_a .width_1600{align-items: center;margin: initial;display: flex;flex-direction: row-reverse;box-sizing: border-box;flex-wrap: nowrap;justify-content: flex-end;}
.about_a .width_1600 .right {flex: 1;padding-left: 5%;box-sizing: border-box;}
.about_a .width_1600 .right p {font-size: 15px;line-height: 1.5;margin-bottom: 1%;text-align:justify;/* text-align: justify; */text-indent: 32px;}
.about_a .width_1600 .right a{border-radius: 25px;background:  var(--main_color);font-size: 16px;color: #fff;font-weight: bold;display: inline-flex;/* padding: 26px; *//* text-align: center; */width: 130px;line-height: 46px;border: 2px solid  var(--main_color);z-index: 2;position: relative;overflow: hidden;transition: color 0.2s;justify-content: center;margin-top: 3%;}
.about_a .width_1600 .right  a:hover{color:  var(--main_color);}
.about_a .width_1600 .right  a img{width: 26px;margin-left: 10px;transition: 1s;}
.about_a .width_1600 .right  a::before {content: "";will-change: transform;transform-origin: 50% 0%;border-radius: 50%;width: 150%;height: 200%;transition: transform 1s cubic-bezier(.5,0,0,1);position: absolute;top: -50%;left: -25%;transform: scaleY(0);z-index: -1;background-color: #fff;}
.about_a .width_1600 .right  a:hover::before {transform-origin: 50% 100%;transform: none;}
.about_a .width_1600 .left {flex: 1.5;max-width: 800px;position: relative;}

/* 背景 */

.product_q{ min-height: 100vh; position:relative; z-index:2;}
.mask{ position: absolute; height: calc(100% + 80px); left: 0; top: 0; width: 100%; background-color: var(--main_color); -webkit-mask-size: 100% 100%; -webkit-mask-repeat: repeat; animation: mask linear 5s infinite;}
.mask .bg{ position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-size: cover;background-position: center center; background-blend-mode: soft-light; background-color: #000;}
.product_q .wrapper{ position: relative;padding: 120px 90px 70px;display: flex;flex-direction: column;justify-content: space-between;align-items: center;}
.title_top{ width: 458px; height: 164px; background: url(/images/title_bg.png) no-repeat center; background-size: 100% 100%; margin-bottom:80px;}
.title_top p{ font-size: 60px; line-height: 164px; color: #fff; text-align: center; font-family:'alimama';}
.product_q .wrapper .koubei{ width:100%; display: flex; justify-content: space-between; flex-wrap: wrap; overflow: hidden;}
.product_q .wrapper .koubei li{ flex: auto; display: flex; align-items: center;}
.product_q .wrapper .koubei li:nth-child(2){ justify-content: center;}
.product_q .wrapper .koubei li:nth-child(3){ justify-content: flex-end;}
.more_a{ margin-top:64px;}
.more_a a{ display: inline-flex; color: var(--main_color);}
.more_a p{ font-size: 36px;width: 64px;height: 64px;background-color: #f5e7ce;border: 6px solid #cd5249;border-radius: 50%;position: relative;display: flex;align-items: center;justify-content: center; font-family: 'alimama';}
.more_a a p::before{ content: ''; width: 56px; top: 50%; height: 56px; left: 50%; position: absolute; border: 1px solid #ede6d7; border-radius: 50%; transform: translate(-50%, -50%);}
.more_a a p+p{ margin-left: -18px;}



#mould87106{ width:100%; position:fixed; top:0; left:0; background:none; z-index:99; transition: .6s ease-in-out;}
.navbars41{display: flex;width: 1600px;height: 100px;margin: 0 auto;flex-direction: row;justify-content: space-evenly;align-items: center;}
.navbars41 .logo{ float:left; width: 120px; height: 100%; display: table;background:url(/images/logo1.png) no-repeat;background-size:contain; background-position: center;}
.navbars41 .logo a{ display: table-cell; vertical-align: middle;}
.navbars41 ul{display: table; height:100%;margin:0 auto;}
.navbars41 li{ display: table-cell; vertical-align: middle; position:relative;}
.navbars41 li a{ padding:0 30px; font-size:18px; color:#fff; transition: .4s ease-in-out;}
.navbars41 .phone{ background:url(/images/phone1.png) no-repeat center;width:50px;height:50px;background-color:#fff;border-radius:50%;}
.navbars41 .tabb {font-size: 18px;background: #ffffff;font-weight: bold;padding: 13px;border-radius: 50%;margin-left: 3%;color:var(--main_color);}
.navbars41 li .hide1{ width:160px; position:absolute; top:80px; left:50%; z-index:999;transform:translateX(-50%); background: #fff; padding:10px; box-sizing:border-box; border-radius:5px; display:none; 
  box-shadow: 0 0 10px rgb(0 0 0 / 20%);}
.navbars41 li:hover .hide1{ display:block; text-align:center;}
.navbars41 li .hide1 a{ display:block; padding:0 6px; line-height:32px; font-size:12px;}
.navbars41 li:hover .hide1 a{ background: none; border-radius:inherit; color:#333;}
.navbars41 li:hover .hide1 a:hover{ background: var(--main_color); border-radius:5px; color:#fff;}
.header_active{ background: #fff!important; box-shadow: 0 0 10px rgb(0 0 0 / 20%);}
.header_active .navbars41{ height:100px;}
.header_active .navbars41 li a{ color:#333;}
.header_active .navbars41 li a:hover{ color: var(--main_color);}
.header_active .navbars41 li.active a{ color: var(--main_color);}
.header_active .navbars41 .phone{background:url(/images/phone.png) no-repeat center;width:50px;height:50px;background-color:var(--main_color);border-radius:50%;}
.icon {background: #ffffff;width: 50px;height: 50px;display: grid;place-items: center;border-radius: 50%;position: relative;z-index: 5;}
a.hotTel {display: flex;flex-direction: row-reverse;position: relative;}
.navbars41 .hotTel .icon i{display: block;-webkit-transition: all .35s;-webkit-animation: rotateIns 2s ease infinite;}
@-webkit-keyframes rotateIns {
	0% {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}

	10%,
	20% {
		-webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
		transform: scale3d(.9, .9, .9) rotate(-3deg)
	}

	30%,
	50%,
	70%,
	90% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
		transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
	}

	40%,
	60%,
	80% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
		transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
	}

	100% {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
}
.navbars41 .hotTel .tel {position: absolute;padding-right: 50px; right: 0px;opacity: 0;height: 50px;top: 0px;background: #fff;color:var(--main_color);-webkit-transition: all .5s;border-radius: 60px;overflow: hidden;text-align: center;line-height: 50px;font-family: DIN;font-size: 24px;}
.navbars41 .hotTel:hover .tel {width: 200px;opacity: 1;}

.header_active .navbars41 .logo{ float:left; width: 120px; height: 100%; display: table;background:url(/images/logo.png) no-repeat;background-size:contain; background-position: center;}
.header_active .navbars41 .tabb {font-size: 18px;color: #ffffff;font-weight: bold;padding: 13px;border-radius: 50%;margin-left: 3%;background:var(--main_color);}
#mould87107{ position: relative;}
#mould87107 .swiper-pagination{ bottom:20px;}
#mould87107 .swiper-container .swiper-pagination .swiper-pagination-bullet{ width:30px; height:30px; background:url(/images/icon_btn.png) no-repeat; background-size:cover; opacity:0.3; border-radius:inherit;}
#mould87107 .swiper-container .swiper-pagination .swiper-pagination-bullet-active{ opacity:1;}
#mould87107 .swiper-slide {width: 100%!important;
    height: auto;}
#mould87107 .swiper-slide  video {
    height: 100vh;
    width: 100%;
    object-fit: cover;
}
/*产品*/
.product_b{margin-top:5%;background: #f3f8fe;padding: 5% 0;}
.product_a {display: flex;flex-direction: row;align-items: center;justify-content: space-around;}
.product-l {flex: 1;max-width: 560px;}
.product-l .pp {padding-bottom: 2%;}
.product-l .pp { background:url(/images/jiantou.png) no-repeat center left; padding-left:48px;}
.product-l .pp h2 {font-size: 24px;font-weight: bold;line-height: 2;}
.product-l .on{ background:url(/images/jiantou1.png) no-repeat top left; padding-left:58px;color:  var(--main_color);}
.product-l .pp:hover{background:url(/images/jiantou1.png) no-repeat top left; padding-left:58px;}
.product-l .pp p{line-height:1.5;/* font-size: 14px; */}
.product-l .pp:hover h2{color:  var(--main_color);}
.product-l .pp:hover p{color:  var(--main_color);}
.product-r {flex: 1;max-width: 710px;position:relative;margin-right: 3%;}
.tu {position: relative;z-index: 2;}
.product-r .tu img{border-radius: 50%;border: 20px solid #c2dcf6;}
.circle {position: absolute;top: 0%;left: -16%;animation: rotate 10s linear infinite;}
@keyframes rotate {
  from {
      transform: rotate(0deg);
  }
  to {
      transform: rotate(360deg);
  }
    }



/* 猫砂 */
.mao {margin-top: 5%;}
.mao-a {display: flex;justify-content: space-around;margin-bottom: 3%;}
.maomao{width:100%;}
.mm h2{font-size: 30px;font-weight: bold;line-height: 3;}
.mm:nth-of-type(1) h2{font-size: 26px;font-weight: bold;line-height: 3;background:url(/images/mm1.png) no-repeat center left;background-size: 11%;padding-left: 50px;}
.mm:nth-of-type(2) h2{font-size: 26px;font-weight: bold;line-height: 3;background:url(/images/mm2.png) no-repeat center left;background-size: 10%;padding-left: 50px;}
.mm:nth-of-type(3) h2{font-size: 26px;font-weight: bold;line-height: 3;background:url(/images/mm3.png) no-repeat center left;background-size: 26%;padding-left: 50px;}
.mm:nth-of-type(4) h2{font-size: 26px;font-weight: bold;line-height: 3;background:url(/images/mm4.png) no-repeat center left;background-size: 11%;padding-left: 50px;}
.mm p {font-size: 18px;font-weight: bold;}




/* news */
.news_a {
    margin-top: 5%;
}
#box-4 {margin-bottom: 5%;}
#box-4 ul{display: flex;flex-direction: row;justify-content: space-between;}
#box-4 ul li{max-width: 440px;padding: 34px;background: #ffffff;border-radius: 20px;box-shadow: 0 0 20px rgb(0 0 0 / 30%);}
#box-4 ul li .text1 p {font-size: 16px;line-height: 36px;color: #999999;}
#box-4 ul li .title.hangNum1 {font-size: 17px;line-height: 40px;font-weight: 700;}
#box-4 ul li .content_img {margin: 60px 0 35px 0;}
#box-4 ul li .desc p {line-height: 2;}
#box-4 ul li:hover{box-shadow: 0 0 20px rgb(50 152 255 / 30%);}
#box-4 ul li:hover .title{color:var(--main_color);}
#box-4 ul li:hover .desc{color:var(--main_color);}





/*底部*/
.liuyan{background:url(/images/zaixian.jpg);height: 516px;display: flex;flex-direction: column;justify-content: center;align-items: center;background-size: cover;
    background-repeat: no-repeat;
    background-position: center;}
.liuyan img {max-width: 200px;}
.liuyan h2{font-size: 28px;line-height: 2.5;color:#fff;}
.liuyan a{font-size:18px;width:180px;height:46px;background:var(--main_color);color:#fff;    display: grid;align-items: center;border-radius: 50px;justify-content: center;}

.foots{background-color:#f3f8fe;display: flex;flex-direction: column;}
.foots .duo {position: relative;z-index: 2;margin-top: -2%;}
.duo img {
    width: 100%;
}
.foott {padding: 5% 0;width: 1600px;margin: 0 auto;display: flex;flex-direction: row;}
.fol {flex: 1;}
.fol h3 {font-size: 24px;font-weight: bold;margin-bottom: 4%;}
.fol ul {flex-wrap: nowrap;justify-content: space-between;width: 74%;display: grid;grid-template-columns: repeat(2, 1fr);gap: 10px;}
.fol ul li {background:var(--main_color);color: #ffffff;line-height: 58px;text-align: center;border-radius: 50px;font-size: 20px;width: 200px;}
.for {flex: 1.8;}
.for h5 {font-size: 24px;line-height: 1.5;}
.for ul {display: flex;flex-direction: row;margin-top: 3.5%;justify-content: space-between;}
.for ul li {/* flex: 1; */display: grid;/* max-width: 600px; */}
.for li p {font-size: 16px;line-height: 2;/* width: 118%; */}
strong {font-size: 18px;color:var(--main_color);}
.copyright{background:var(--main_color);border-top:solid 1px rgba(255,255,255,0.2);color:#fff;text-transform:uppercase;}
.copyright a{ color:#fff;}
.copyright p{ line-height:64px;}
.main_a {width: 1600px;margin: auto;max-width: 1600px;position: relative;}

@media (min-width: 1921px) and (max-width: 4000px){
  .about_a .width_1600 {margin:0 auto;}}
@media (max-width: 1680px){
  .width_1600{width:94%;}.navbars41{width:94%;}.foott{width:94%;}.main_a{width:94%;}
}
@media (min-width: 1560px) and (max-width: 1679px){
 .product-l .pp h2 {
   font-size: 20px;}
   .about_a h3 {
    font-size: 32px;line-height: 46px;}
  .about_a h2 {
    font-size: 20px;
    line-height: 40px;}
  .about_a .width_1600 .right p {line-height: 1.7;}
#box-4 ul li {
  max-width: 27%;}
}
@media (max-width: 1560px){.product-l .pp h2 {
   font-size: 20px;}
  .for ul li {max-width: 540px;}
   .about_a h3 {
    font-size: 20px;
    line-height: 40px;
    }
  .about_a h2 {
    font-size: 16px;
    line-height: 30px;
    }
  .about_a .width_1600 .right p {line-height: 1.4;}
#box-4 ul li {
  max-width: 25%;}
}
@media (max-width: 1500px){.for {
    flex: 1.7;
}.for ul li {max-width: 450px;}
    .width_1600{width:90%;}.navbars41{width:90%;}.foott{width:90%;}.main_a{width:90%;}
 #box-4 ul li {
  max-width: 25%;}
  .fol h3 {
    font-size: 24px;}
  .for strong {
    font-size: 20px;
    color: var(--main_color);
}.fol ul {width: 80%;}
}
@media (max-width: 1440px){
  .for {
    flex: 1.9;
}
  #box-4 ul li .title.hangNum1 {
    font-size: 17px;
    line-height: 30px;}
  .titles h3 {
    font-size: 36px;}
  .mm h2 {font-size: 22px;}
  .product-l .pp p {font-size:14px;}
  .mm p {
    font-size: 16px;}

}
@media (min-width: 1360px) and (max-width: 1400px){
  #mould87107 .first .wenan_a h3 {
    font-size: 22px;
    line-height: 28px;
}
  .fol ul {width: 80%;}.mm p {
    font-size: 16px;}
.fol ul li {width: 180px;}.for ul li {
    max-width: 400px;
}
}