@charset "utf-8";
.header { height:0;}
.center { width:90%; margin:auto; padding-top:25px; position:absolute; left:0; right:0; top:0; bottom:0; z-index:2;}
.footer { display:none;}

/**首页**/
.allbody { width:100%; height:100vh;}
.allbody .righrqie { right:2.3%;}
.allbody .righrqie .swiper-pagination-bullet { width:10px; height:10px; margin:10px 0; border:1px solid #ea2830; background:none; filter:alpha(opacity=100); opacity:1;}
.allbody .righrqie .swiper-pagination-bullet-active { width:12px; height:12px; border:none; background:#ea2830;}
.side1 { width:100%; height:100vh; position:relative; overflow:hidden;}

/*banner*/
.banner { width:100%; height:100vh; margin:0 auto; position:relative;}
.banner a { display:block; width:100%;}
.banner .text { width:90%; height:215px; color:#fff; text-align:center; margin:auto; position:absolute; top:35%; right:0; left:0; z-index:2;}
.banner .text h1 { line-height:45px; font-size:34px; margin-bottom:15px;}
.banner .text p { line-height:30px; font-size:20px;}
.banner img { display:block; width:100%; height:100vh;}
.banner .swiper-pagination-bullets,.banner .swiper-pagination-custom { bottom:15%;}
.banner .swiper-pagination-bullet {	width:12px; height:12px; margin:0 5px !important; border:1px solid #fff; border-radius:8px; background:none; opacity:1; -webkit-transition:0.4s; transition:0.4s;}
.banner .swiper-pagination-bullet-active { background:#fff;}
.banner .swiper-slide-active .text h1 { -webkit-animation:fade-left 1.5s forwards; animation:fade-left 1.5s forwards;}
.banner .swiper-slide-active .text p { -webkit-animation:fade-right 1.5s forwards; animation:fade-right 1.5s forwards;}

/*项目公告*/
.project { width:98%; height:60px; margin:auto; background:#fff; position:absolute; left:0; right:0; bottom:2%; z-index:2;}
.project .lft { float:left; width:65px; height:35px; font-size:16px; color:#fff; padding:25px 10px 0 10px; background:#ea2830; position:relative;}
.project .lft::after { display:block; content:""; width:20px; height:2px; background:#fff; position:absolute; left:10px; top:20px;}
.project .jectmsg { line-height:25px;}
.project .jectmsg .mg { padding:5px 10px;}
.project .jectmsg .mg a { display:block; width:100%; font-size:14px; color:#333; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.project .jectmsg .mg p { font-size:12px; color:#999;}

/**栏目标题**/
.tits { width:100%; padding-bottom:45px;}
.tits h3 { float:left; line-height:35px; font-weight:500; font-size:24px; color:#333; text-transform:Uppercase; position:relative;}
.tits h3::after { display:block; content:""; width:25px; height:3px; background:#ea2830; position:absolute; left:0; bottom:-10px;}
.tits h3 span { display:block; font-size:20px;}
.tits a { display:block; float:right; width:90px; height:35px; line-height:35px; font-size:12px; color:#fff; padding-left:15px; margin-top:10px; border-radius:17.5px; background:#ea2830 url(../images/anpc_02.png) no-repeat 75px center;}

/**关于我们**/
.about { width:100%; overflow:hidden; background:url(../images/anpc_05.jpg) no-repeat center center / 100% 100%;}
.about .center { height:420px;}
.about .msg { width:100%;}
.about .msg h2 { font-size:18px; color:#ea2830; margin-bottom:15px;}
.about .msg h2 span { margin-right:30px; position:relative;}
.about .msg h2 span::after { display:block; content:""; width:1px; height:15px; background:#ddd; position:absolute; right:-20px; top:6px;}
.about .msg h2 span:last-child::after { display:none;}
.about .msg p { width:90%; line-height:30px; font-size:12px; color:#666; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical;}
.about .msg .mulu { width:100%; margin:30px auto 40px auto; position:relative;}
.about .msg .mulu li { float:left; width:calc(100% / 4 - 5px); text-align:center; margin-right:5px; border:1px solid #ddd; border-radius:4px; box-sizing:border-box;}
.about .msg .mulu li a { display:block; width:100%; padding:10px 0 5px 0;}
.about .msg .mulu li i { display:block; width:35px; height:28px; margin:0 auto; background-position:center; background-repeat:no-repeat; background-size:35px 28px;}
.about .msg .mulu li span { font-size:12px; color:#333;}
.about .msg .mulu li .ab1 { background-image:url(../images/anpc_06.png);}
.about .msg .mulu li:hover .ab1 { background-image:url(../images/anpc_06h.png);}
.about .msg .mulu li .ab2 { background-image:url(../images/anpc_07.png);}
.about .msg .mulu li:hover .ab2 { background-image:url(../images/anpc_07h.png);}
.about .msg .mulu li .ab3 { background-image:url(../images/anpc_08.png);}
.about .msg .mulu li:hover .ab3 { background-image:url(../images/anpc_08h.png);}
.about .msg .mulu li .ab4 { background-image:url(../images/anpc_09.png);}
.about .msg .mulu li:hover .ab4 { background-image:url(../images/anpc_09h.png);}
.about .msg .btn { display:block; width:120px; height:45px; line-height:45px; font-size:14px; color:#fff; padding-left:45px; border-radius:22.5px;  box-shadow:0 5px 20px rgba(234,40,48,0.5); background:#ea2830 url(../images/anpc_02.png) no-repeat 110px center;}

/**新闻资讯**/
.news { width:100%; overflow:hidden; background:url(../images/anpc_10.jpg) no-repeat center center / 100% 100%;}
.news .center { height:405px;}
.news li { width:100%; margin-bottom:15px;}
.news li a { display:block; width:100%;}
.news li .time { float:left; width:65px; height:55px; line-height:25px; font-size:12px; color:#666; text-align:center; padding-top:10px; border:1px solid #dadada; background:#fff;}
.news li .time b { display:block; width:100%; font-size:22px; color:#333;}
.news li .msg { padding:0 15px 0 80px;}
.news li .msg h3 { font-weight:500; font-size:14px; color:#231f20; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.news li .msg p { line-height:25px; font-size:12px; color:#999; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.news li .msg span { display:block; font-size:12px; color:#666; background:url(../images/anpc_03.png) no-repeat 52px center;}

/**产品推荐**/
.pros { width:100%; overflow:hidden; background:url(../images/anpc_11.jpg) no-repeat center center / 100% 100%;}
.pros .center { height:470px;}
.pros li { float:left; width:calc(100% / 2 - 5px); text-align:center; margin:0 10px 10px 0; border-radius:10px; overflow:hidden; background:rgba(255,255,255,0.8);}
.pros li:nth-child(2n) { margin-right:0;}
.pros li a { display:block; padding:20px 0 10px 0;}
.pros li .img { width:70px; height:70px; padding:10px; margin:0 auto; border-radius:20px; position:relative;}
.pros li .img::after { display:block; content:""; width:95px; height:95px; margin:auto; border-radius:30px; position:absolute; top:0; right:0; bottom:0; left:0; animation:2.5s linear infinite rol; -webkit-animation:2.5s linear infinite rol;}
.pros li .img img { display:block; width:70px; height:70px; position:relative; z-index:2;}
.pros li h3 { line-height:25px; font-size:18px; color:#231f20; margin-top:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pros li p { width:90%; font-size:12px; color:#999; text-transform:Uppercase; padding:0 5%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pros li .img1 { background:#c9ebb9;}
.pros li .img1::after { filter:alpha(opacity=30); opacity:0.3; background:#c9ebb9;}
.pros li .img2 { background:#feb5be;}
.pros li .img2::after { filter:alpha(opacity=30); opacity:0.3; background:#feb5be;}
.pros li .img3 { background:#ead2a2;}
.pros li .img3::after { filter:alpha(opacity=30); opacity:0.3; background:#ead2a2;}
.pros li .img4 { background:#93c5dc;}
.pros li .img4::after { filter:alpha(opacity=30); opacity:0.3; background:#93c5dc;}

@keyframes rol {
	from { -webkit-transform:rotate(0deg);}
	to { -webkit-transform:rotate(360deg)}
}
@-webkit-keyframes rol {
	from { -webkit-transform:rotate(0deg);}
	to { -webkit-transform:rotate(360deg)}
}

/**脚部**/
.foots { width:100%; overflow:hidden; background:url(../images/anpc_16.jpg) no-repeat center center / 100% 100%; position:relative;}
.foots .job { width:100%; text-align:center; position:absolute; top:18%; z-index:2;}
.foots .job h1 { line-height:50px; font-size:26px; color:#ea2830;}
.foots .job h3 { font-weight:500; font-size:14px; color:#231f20;}
.foots .job a { display:block; width:120px; height:40px; line-height:40px; font-size:14px; color:#fff; margin:30px auto 0 auto; border-radius:25px; box-shadow:0 0 10px rgba(234,40,48,0.8); background:#ea2830;}

.foots .bottom { width:95%; padding:10% 2.5% 10px 2.5%; background:url(../images/anpc_17.png) no-repeat center top / 100%; position:absolute; bottom:0; z-index:1;}
.foots .bottom a:hover { color:#ea2830;}

.foots .bottom .link { line-height:25px; font-size:12px; padding-bottom:10px; margin-bottom:10px; border-bottom:1px solid #f5f5f5;}
.foots .bottom .link span { color:#231f20;}
.foots .bottom .link span b { font-size:16px; text-transform:Uppercase;}
.foots .bottom .link span i { display:inline-block; width:10px; height:10px; margin:0 5px; background:url(../images/anpc_18.png) no-repeat 0 0 / 100%;}
.foots .bottom .link a { color:#999; margin:0 10px 0 5px;}
.foots .bottom .link a:hover { color:#ea2830;}

.foots .bottom li {}
.foots .bottom li a { line-height:25px; font-size:12px; color:#231f20;}


.foots .bottom .contact { width:100%;}
.foots .bottom .contact h3 { font-size:15px; color:#231f20; margin-bottom:10px;}
.foots .bottom .contact p { font-size:12px; color:#7b7b7b;}
.foots .bottom .contact .img { float:right; width:107px; text-align:center; margin-top:10px;}
.foots .bottom .contact .img img { display:block; width:95px; height:95px; margin-bottom:5px; padding:5px; border:1px solid #eee; background:#fff;}
.foots .bottom .copy { font-size:12px; color:#333; margin-top:12px; padding-top:8px; text-align:center; border-top:1px solid #f5f5f5;}

/*特效*/
@-webkit-keyframes fade-left { 
	from { -webkit-transform:translate(300px,0); -ms-transform:translate(300px,0); transform:translate(300px,0);}
	to { -webkit-transform:translate(0,0); -ms-transform:translate(0,0); transform:translate(0,0);}
}
@keyframes fade-left { 
	from { -webkit-transform:translate(300px,0); -ms-transform:translate(300px,0); transform:translate(300px,0);}
	to { -webkit-transform:translate(0,0); -ms-transform:translate(0,0); transform:translate(0,0);}
}
@-webkit-keyframes fade-right { 
	from { -webkit-transform:translate(-300px,0); -ms-transform:translate(-300px,0); transform:translate(-300px,0);}
	to { -webkit-transform:translate(0,0); -ms-transform:translate(0,0); transform:translate(0,0);}
}
@keyframes fade-right { 
	from { -webkit-transform:translate(-300px,0); -ms-transform:translate(-300px,0); transform:translate(-300px,0);}
	to { -webkit-transform:translate(0,0); -ms-transform:translate(0,0); transform:translate(0,0);}
}
@-webkit-keyframes fade-up { 
	from { -webkit-transform:translate(0,300px); -ms-transform:translate(0,300px); transform:translate(0,300px);}
	to { -webkit-transform:translate(0,0); -ms-transform:translate(0,0); transform:translate(0,0);}
}
@keyframes fade-up { 
	from { -webkit-transform:translate(0,300px); -ms-transform:translate(0,300px); transform:translate(0,300px);}
	to { -webkit-transform:translate(0,0); -ms-transform:translate(0,0); transform:translate(0,0);}
}
@-webkit-keyframes fade-down { 
	from { -webkit-transform:translate(0,-300px); -ms-transform:translate(0,-30px); transform:translate(0,-300px);}
	to { -webkit-transform:translate(0,0); -ms-transform:translate(0,0); transform:translate(0,0);}
}
@keyframes fade-down { 
	from { -webkit-transform:translate(0,-300px); -ms-transform:translate(0,300px); transform:translate(0,-300px);}
	to { -webkit-transform:translate(0,0); -ms-transform:translate(0,0); transform:translate(0,0);}
}
.swiper-slide-active .center { -webkit-animation:fade-up 1.5s forwards; animation:fade-up 1.5s forwards;}
.foots.swiper-slide-active .job { -webkit-animation:fade-down 1.5s forwards; animation:fade-down 1.5s forwards;}
.foots.swiper-slide-active .bottom { -webkit-animation:fade-up 1.5s forwards; animation:fade-up 1.5s forwards;}