﻿
/* CSS Document PC*/
:root{
	--main_color:#e00024;        /* 主色 */
	--main_color_rgb:224,0,36;  /* rgba */}
@font-face{ font-family:'alimama'; src: url('/images/alimama.ttf');}
@font-face{ font-family:'"阿里妈妈方圆体 VF Regular'; 
src:  url('/images/ALIMAMAFANGYUANTIVF-THIN.ttf') format("ttf"),
  url('/images/AlimamaFangYuanTiVF-Thin.woff2') format("woff2"),
  url('/images/AlimamaFangYuanTiVF-Thin.woff') format("woff");
  font-display: swap;


}
.banner1 .swiper-slide{ position:relative;width:100%!important;    overflow: hidden;}
.banner1 .swiper-slide img{ width:100%; height:100vh; min-height:100%; transition:1s linear 2s; transform:scale(1.1,1.1);}
.banner1 .swiper-slide .txt{ width:100%; position:absolute; top:52%; left:50%; transform: translate(-50%, -50%); color:#fff; text-align:Center;}
.banner1 .swiper-slide .txt h2{ font-size:70px; line-height:78px; font-weight:bold;}
.banner1 .swiper-slide .txt h3{ font-size:42px; line-height:46px; margin-top:36px;}
.banner1 .swiper-slide-active img,.swiper-slide-duplicate-active img{ transition:3s linear; transform:scale(1,1);}
.swiper-pagination-bullet-active {
    opacity: 1;
    background: #fff;
}
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:1520px; margin:0 auto;}
.container-fluid{overflow:hidden;}
.titles{text-align: center;color:  var(--main_color);}
.titles h3 {font-size: 3vw;text-transform: uppercase;font-weight:900;line-height: 1;font-family:'阿里妈妈方圆体 VF Regular';-webkit-text-stroke: 2px;}
.titles h2 {font-size: 1.2vw;line-height: 2;font-family:'阿里妈妈方圆体 VF Regular'; font-weight: bold;}
 .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;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:48px; line-height:48px; margin:20px 0 30px 0;}
#mould87107 .first .wenan_a h3{ font-size:48px; line-height:48px;}
#mould87107 .first .link_a{ width:320px; margin:100px 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;}


/*more*/
.new-i-more {display: flex;align-items: center;width: -moz-max-content;width: max-content;}
.new-i-more.border .text {line-height: 50px;border: 1px solid var(--main_color);background: unset;color: #000;}
.new-i-more .text {width: clamp(68.2666666667px,6.6666666667vw,128px);display: flex;align-items: center;justify-content: center;border-radius: 99px;font-size:16px;font-weight: bold;transition: .3s;}
.new-i-more.border .arrow {background: var(--main_color);color: #fff;border-radius: 50%;display: flex;align-items: center;overflow: hidden;transition: .3s;justify-content: center;}
.new-i-more .arrow .fa {width: 50px;height: 50px;background:url(/images/jiantou.png) no-repeat center;}
.new-i-more:hover .text{background:var(--main_color);color:#fff;}
.new-i-more:hover .fa{transform: rotate(45deg);}

/*返回顶部*/
.back_top{ position: fixed; right: 24px; bottom: 126px; width: 64px; height: 64px; color: #fff; border-radius:6px; background-color: var(--main_color); text-align:Center; cursor: pointer;z-index: 999;}
.back_top img{ width: 20px; display: block; margin:0 auto 5px auto; padding-top:10px;}
.back_top p{ font-size: 14px;}


/* 背景 */

.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;display: flex;justify-content: flex-end;}
.navbars41{display: flex;width: 1720px;height: 100px;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: flex; */height:100%;margin:0 auto;align-items: center;justify-content: space-between;width: 58%;line-height: 100px;}
.navbars41 li{display: table-cell;vertical-align: middle;position:relative;}
.navbars41 li a{padding: 0 36px;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;}
.navbars41 li:hover .hide1 a{ background: none; border-radius:inherit; color:#333; line-height:44px; font-size:14px;}
.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 {width: 50px;height: 50px;flex-direction: row;}
a.hotTel {display: flex;flex-direction: row;position: relative;align-items: center;padding: 0 3%;}
.navbars41 .hotTel .icon i{display: block;-webkit-transition: all .35s;-webkit-animation: rotateIns 2s ease infinite;}
.header_active a.hotTel {background: var(--main_color);height: 100px;}
.header_active .navbars41 li:nth-of-type(1) a{color: var(--main_color);}
@-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 {color: #fff;font-family: Arial;font-weight: bold;font-size: 32px;letter-spacing: 2px;}
.navbars41 .hotTel:hover .tel {opacity: 1;}
.header_active .navbars41 .logo{float:left;width: 150px;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;
}

/* 关于我们 */
.about_a {padding: 5% 0;display: flex;justify-content: flex-end;background: url(/images/about-bg.jpg) no-repeat;}
.about_a h3 {font-size: 42px;font-weight: bold;line-height: 1.2;color: #000;}
.about_a h2 {font-size: 38px;line-height: 2;font-weight: bold;color:  var(--main_color);font-family:'阿里妈妈方圆体 VF Regular';-webkit-text-stroke: 1.5px;}
.about_a .width_1600{align-items: center;/* margin: unset; */display: flex;flex-direction: row;box-sizing: border-box;flex-wrap: nowrap;justify-content: flex-end;width: 1720px;margin: 0;}
.about_a .width_1600 .right {flex: 1;padding-right: 5%;box-sizing: border-box;}
.about_a .width_1600 .right p {font-size: 16px;line-height: 2;margin: 2% 0;text-align:justify;    text-indent: 2em;}
.about_a .width_1600 .left {position: relative;}
.about-a {display: flex;flex-direction: row;justify-content: space-between;    margin: 5% 0;}
.ll {display: flex;}
.about_a .width_1600 .right .ll p {margin: 0;text-indent: 0;font-size: 14px;}
.about_a .ll h2 {line-height: 1.5;margin-right: 3%;font-size: 42px;}
.lie {display: flex;flex-direction: column;flex: 1;}


/*产品*/
.product_b{background: url(/images/product-bg.jpg) no-repeat center center;background-size: cover;padding: 5% 0;}
#box-5 .titles{color:#fff;}
#box-5 .box1{margin: 0 -25%;padding-top: 20px;}
#box-5 .swiper-slide-shadow-left,#box-5 .swiper-slide-shadow-right{display: none;}
#box-5 li .img img{border-radius: 25px;overflow: hidden;}
.img img{
	object-fit: cover;
	max-width: 100%;
}
#box-5 .swiper-pagination-bullet-active {
    opacity: 1;
    background: #fff;
}
@media (min-width: 767px){
	#box-5 li{flex-shrink: 0!important;position: relative!important;transition-property: transform!important;box-sizing: border-box!important;}
	#box-5 li.swiper-slide-active{transform: translate3d(0px, 0px, -2vw) rotateX(0deg) rotateY(58deg) scale(1.1)!important;opacity: 1;}
	#box-5 li.swiper-slide-active+li{transform:translate3d(1vw, 0px, -115.9485px) rotateX(0deg) rotateY(8.9743deg) scale(0.89)!important;opacity: 1;}
	#box-5 li.swiper-slide-next+li{transform:translate3d(-1vw, 0px, -115.9485px) rotateX(0deg) rotateY(-8.9743deg) scale(0.89)!important;opacity: 1;}
	#box-5 li.swiper-slide-next+li+li{transform:translate3d(0px, 0px, -2vw) rotateX(0deg) rotateY(-58deg) scale(1.1)!important;opacity: 1;}
}


/* 优势 */
.mao {padding: 5% 0;}
.youshi {    margin-top: 2%;background: #fff;border: 1px solid var(--main_color);border-radius: 20px;display: flex;flex-direction: column;align-items: center;}
.ys{padding: 3%;}
.boxes:nth-of-type(3){margin-bottom:0;}
.boxes {display: flex;margin-bottom: 7%;}
.bb {display: flex;flex-direction: row;align-items: center;justify-content: center;}
.bb img {width: 30%;}
.bo h2 {font-family:'阿里妈妈方圆体 VF Regular';font-size: 26px;line-height: 1.5;font-weight:bold;}
.bo p{font-family:'Arial';color:#999;}
.bo {margin-left: 2%;}





.news_a {    background: #f1f1f1;padding-top: 4%;}
.neww.width_1600 {margin-top: 1%;display: flex;justify-content: space-between;flex-wrap: wrap;}
.nn {display: flex; justify-content: center;    width: calc(25% - 10px);flex-direction: column;padding: 3%;background: #fff;margin-right: 2%;margin-bottom: 5%;border-radius: 20px;}
.neww .nn:nth-child(3n){margin-right:0;}
.nn:hover{box-shadow:0px 0px 12px #0000004d;}
.nn:hover h4{color:var(--main_color);}
.times {display: flex;justify-content: space-between;width: 100%;align-items: center;}
.nn .times p {color:#fff;background: var(--main_color);padding: 2% 5%;border-radius: 30px;margin-bottom: 0;}
.times h5 {color: #777;font-size: 14px;}
.nn h4 {margin: 7% 0;font-size: 24px;line-height: 1.5;}
.nn p {text-align: justify;margin-bottom: 6%;line-height: 1.5;color:#333;}
.nn a {color: #999;display: flex;align-items: center;}
.nn a span{background: url(/images/btn.png) no-repeat center center;width: 29px;height: 29px;display: block;margin-left: 2%;}



/*底部*/
footer{ background: var(--main_color) url(/images/foot_bg.jpg) no-repeat center bottom 80px; padding:100px 0;}
footer .left{ float:left;}
footer .left li{ margin-bottom:40px;}
footer .left li h4{ float:left; font-size:20px; line-height:24px; margin-right:24px;}
footer .left li h4:before{ content:"•"; color:#fff; padding-right:12px;}
footer .left li h4 a{ color:#fff;}
footer .left li h5{ float:left; font-size:18px; line-height:24px; margin-right:24px;}
footer .left li h5 a{ color:rgba(255,255,255,0.9);}
footer .left li h5:hover a{ color:rgba(255,255,255,0.8);}

footer .right{ width:24%;}
footer .right .ewm{ float:left; margin-right:30px; margin-top:30px;}
footer .right .ewm:last-child{  margin-right:0;}
footer .right .ewm h5{ text-align:center; color:#fff; line-height:36px;}
footer .right{ float:right;}
footer .right .lianxi_a p{ color:#fff; line-height:36px;}
footer .right .lianxi_a p span{ font-size:24px; font-weight:bold;}

.messages3{ width: 28%; background:none; float:left; margin-left:8%;}
.messages3 ul{ padding: 0; width: 100%;}
.messages3 ul li{ margin-bottom:12px;}
.messages3 ul li input{ float: inherit;height: 50px; padding: 0; padding-left: 14px; width: 100%; color:#333; border:none; border-radius: 6px; margin: 0!important; background:#fff; box-shadow:none; font-size:16px;}
.messages3 ul li input:first-child{ margin-right:2%!important;}
.messages3 ul li input:focus{ box-shadow:none; border:1px solid #fff;}
.messages3 ul li textarea{ float: inherit; height: 180px; padding: 0; padding: 14px 0 0 14px; width: 100%; color:#333; border:none; border-radius: 6px; margin: 0; background:#fff; box-shadow:none; font-size:16px;}
.messages3 ul li a{ width: 100%; background: #fff; border-radius: 6px; font-size: 16px; color: var(--main_color); margin: 0; line-height: 48px; height: 48px;}


.copyright{ background:#ffcb75; width:100%; color:#333; position:absolute; bottom:0;}
.copyright_bg{ width:1600px; margin:0 auto;}
.copyright p{ float:left; line-height:48px;}
.copyright p:last-child{ float:right;}
.copyright p a{ color:#333;}
.copyright p a:hover{ text-decoration: underline;}


@media (min-width: 1921px) and (max-width: 4000px){
  .about_a .width_1600 {margin:0 auto;}}
@media (max-width: 1680px){.navbars41 li a {padding: 0 30px;}
  .width_1600{width:88%;}.navbars41{width:94%;}.foott{width:94%;}.main_a{width:94%;}.about_a .width_1600 {width: 94%;}.copyright_bg {width:88%;}
}
@media (min-width: 1560px) and (max-width: 1679px){.navbars41 li a {padding: 0 24px;}
 
   .about_a h3 {
    font-size: 34px;line-height: 46px;}
  .about_a h2 {
    font-size: 24px;
    line-height: 44px;}
  .about_a .width_1600 .right p {line-height: 1.7;}
#box-4 ul li {
  max-width: 27%;}
}
@media (max-width: 1560px){
   .about_a h3 {
    font-size: 34px;line-height: 46px;}
  .about_a h2 {
    font-size: 24px;
    line-height: 44px;}
  .about_a .width_1600 .right p {line-height: 1.7;}
#box-4 ul li {
  max-width: 25%;}
}
@media (max-width: 1500px){
    .width_1600{width:88%;}.navbars41{width:94%;}.foott{width:90%;}.main_a{width:90%;}
 #box-4 ul li {
  max-width: 25%;}
  .fol h3 {
    font-size: 30px;}
  .for strong {
    font-size: 20px;
    color: var(--main_color);
}.fol ul {width: 80%;}
}
@media (max-width: 1440px){
  .messages3 {margin-left: 5%;}
 .about_a h3 {
    font-size: 34px;line-height: 46px;}
  .about_a h2 {
    font-size: 24px;
    line-height: 44px;}
}
@media (min-width: 1360px) and (max-width: 1400px){
  footer .right .ewm {
    float: left;
    margin-right: 20px;}
  .messages3 {
    margin-left: 2%;
}
  .fol ul {width: 80%;}
.about_a h3 {
    font-size: 26px;
    line-height: 38px;}.about_a h2 {
    font-size: 20px;
    line-height: 38px;
}.about_a .width_1600 .right p {
    line-height: 1.5;
}.fol h3 {
    font-size: 30px;}
  .for strong {
    font-size: 20px;
    color: var(--main_color);
}
}
