﻿@charset "utf-8";

/*banner*/
.banner { position: relative; background: #fff; margin: 0 auto; overflow: hidden; clear: both; }
.banner .swiper-slide { line-height: 0; }
.banner .swiper-slide img { width: 100%; }
.banner .swiper-pagination { bottom: 80px !important; }
.banner .swiper-pagination-bullet { width: 8px; height: 8px; background: #D02513; opacity: 0.4; border-radius: 4px; cursor: pointer; margin: 0 8px !important; transition: all 0.5s ease; }
.banner .swiper-pagination-bullet-active { opacity: 1; width: 26px; }
.banner .prev,.banner .next { width: 54px; height: 54px; cursor: pointer; margin-left: 10px; border-radius: 50%; background: #D02513; opacity: 0.5; top: 46%; left: -100px; position: absolute; z-index: 9; transition: all 0.5s ease; }
.banner .prev:hover,.banner .next:hover { opacity: 1; }
.banner .next { left: auto; right: -100px; }
.banner:hover .prev { left: 3%; }
.banner:hover .next { right: 3%; }
/*title*/
h2.main_title { position: relative; text-align: center; }
h2.main_title a { display: block; line-height: 0; }
h2.main_title strong { display: inline-block; font-size: 42px; line-height: 100%; color: #191e27; font-weight: bold; position: relative; }
h2.main_title strong:before,h2.main_title strong:after { position: absolute; content: ""; width: 310px; height: 50px; top: 19px; background: url(/images/tbg1.png) no-repeat center; }
h2.main_title strong:before { left: -337px; }
h2.main_title strong:after { right: -337px; background: url(/images/tbg2.png) no-repeat center; }
h2.main_title span { display: block; font-size: 18px; line-height: 100%; color: #191e27; font-weight: normal; margin-top: 18px; }
.feature { height: 186px; box-shadow: 0px 12px 62px 0px rgba(125,132,139,0.28); background: #fff; position: relative; z-index: 9; margin-top: -55px; box-sizing: border-box; padding: 0 8%; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; }
.feature li i { display: block; font-size: 16px; line-height: 100%; color: #818181; font-style: normal; }
.feature li strong { font-size: 60px; line-height: 100%; color: #D02513; font-weight: bold; font-family: "D-DIN"; }
.feature li span { display: block; font-size: 16px; line-height: 100%; color: #818181; margin-top: 10px; }
.intro { height: 736px; background: #f6f7fb; box-sizing: border-box; position: relative; z-index: 2; margin-top: -131px; padding-top: 230px; }
.intro dl { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.intro dt { width: 50.64%; position: relative; height: 384px; }
.intro dt a { display: block; line-height: 0; overflow: hidden; height: 384px; }
.intro dt img { height: 100%; width: 100%; object-fit: cover; transition: all 1s linear 0s; }
.intro dt:before { position: absolute; content: ""; width: 337px; height: 54px; background: url(/images/intro_icon.png) no-repeat center; top: 61px; left: -324px; z-index: 2; }
.intro dd { width: 43.14%; padding-top: 28px; }
.intro dd h2 strong { display: block; font-size: 36px; line-height: 100%; color: #2b2d35; font-weight: bold; }
.intro dd h2 i { font-style: normal; color: #D02513; }
.intro dd h2 span { display: block; font-size: 24px; line-height: 100%; color: #2b2d35; font-weight: normal; margin-top: 13px; }
.intro dd p { font-size: 16px; line-height: 29px; color: #999999; margin: 53px 0 69px; }
.intro dl:hover dt img { transform: scale(1.05) rotate(0deg) translateY(0); }
a.moreinfo { display: block; width: 187px; height: 44px; border: 2px solid #D02513; text-align: center; box-sizing: border-box; transition: all 0.5s ease; font-weight: bold; font-size: 16px; line-height: 40px; color: #D02513; border-radius: 22px; }
a.moreinfo:hover { letter-spacing: 0.5px; background: #D02513; color: #fff; }
.client { padding: 93px 0; overflow: hidden; }
.client_nav { margin: 53px 0; border-top: 1px solid #cacaca; border-bottom: 1px solid #cacaca; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; padding: 8px 0; }
.client_nav > div { display: flex; display: -webkit-flex; }
.client_nav h3 { margin-right: 50px; transition: all 0.5s ease; }
.client_nav h3 a { display: block; font-size: 16px; line-height: 68px; color: rgba(43,45,53,0.6); padding: 0 55px; font-weight: normal; }
.client_nav h3:hover { background: linear-gradient(135deg,#ff7725,#d02513); box-shadow: 0px 7px 19px 2px rgba(208,37,19,0.41); }
.client_nav h3:hover a { font-weight: bold; color: #fff; }
.client_con { position: relative; }
.client_con .client_list li { transition: all 0.5s ease; }
.client_con .client_list li img { width: 100%; }
.client_con .client_list li:hover { box-shadow: 0 0 30px 0 rgba(0,0,0,0.1); z-index: 2; }
.client_con .client_prev,.client_con .client_next { width: 35px; height: 10px; padding: 60px 10px; background: #fff; position: absolute; top: 50%; transform: translateY(-50%); cursor: pointer; transition: all 0.5s ease; z-index: 8; filter: grayscale(1); }
.client_con .client_prev:hover,.client_con .client_next:hover { filter: grayscale(0); }
.client_con .client_prev { left: -90px; }
.client_con .client_next { right: -90px; }
.product { padding-top: 148px; padding-bottom: 87px; background: #f6f7fb url(/images/product_bg.jpg) no-repeat center top; }
.product h2 strong,.product h2 span { color: #fff; }
.pro_nav { margin: 99px 0 68px; }
.pro_nav .pro_category { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; width: 100%; height: 80px; background: #e8eaf1; padding: 9px 47px 9px 9px; box-sizing: border-box; transition: all 0.5s ease; }
.pro_nav .pro_category:hover { box-shadow: 0px 7px 19px 2px rgba(212,212,212,0.41); position: relative; z-index: 2; }
.pro_nav .pro_category:hover h3 a { background: linear-gradient(135deg,#ff7725,#d02513); font-weight: bold; color: #fff; }
.pro_nav .pro_category:hover h3 a:after { opacity: 1; }
.pro_nav .pro_category:hover h4 a { color: #2b2d35; }
.pro_nav .pro_category:first-child { background: #fff; }
.pro_nav h3 { width: 166px; transition: all 0.5s ease; }
.pro_nav h3 a { display: block; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; font-size: 16px; line-height: 62px; color: #2b2d35; font-weight: normal; position: relative; transition: all 0.5s ease; }
.pro_nav h3 a:after { position: absolute; content: ""; border-style: solid; border-width: 7px 5px; right: -10px; top: 50%; transform: translateY(-50%); opacity: 0; border-color: transparent transparent transparent #D02513; transition: all 0.5s ease; }
.pro_nav .pro_category > div { display: flex; display: -webkit-flex; margin-left: 42px; flex-grow: 1; }
.pro_nav h4 { position: relative; margin-right: 52px; }
.pro_nav h4 a { display: block; font-size: 16px; line-height: 62px; color: rgba(43,45,53,0.6); font-weight: normal; transition: all 0.5s ease; }
.pro_nav h4:hover a { color: #D02513 !important; }
.pro_nav a.more { display: block; font-size: 14px; line-height: 62px; color: #9a9fab; transition: all 0.5s ease; }
.pro_nav a.more:hover { color: #D02513; }
.pro_con { display: grid; grid-template-columns: repeat(4,1fr); column-gap: 20px; row-gap: 20px; }
.pro_con li { overflow: hidden; transition: all 0.5s ease; }
.pro_con li > a { display: block; overflow: hidden; line-height: 0; }
.pro_con li > a img { width: 100%; }
.pro_con li h4 > a { display: block; text-align: center; box-sizing: border-box; height: 99px; padding-top: 25px; padding-bottom: 20px; transition: all 0.5s ease; }
.pro_con li h4 strong { display: block; font-size: 20px; line-height: 30px; color: #000; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-weight: normal; }
.pro_con li h4 span { display: block; font-size: 14px; line-height: 24px; color: #999; font-weight: normal; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.pro_con li h4 i { display: block; font-size: 14px; line-height: 100%; color: #fff; font-weight: normal; font-style: normal; display: none; }
.pro_con li:hover { background: linear-gradient(135deg,#ff7725,#d02513); box-shadow: 0px 7px 19px 2px rgba(210,210,210,0.41); }
.pro_con li:hover h4 a { align-items: center; -webkit-align-items: center; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; padding-right: 20px; padding-left: 28px; }
.pro_con li:hover h4 strong { color: #fff; }
.pro_con li:hover h4 span { display: none; }
.pro_con li:hover h4 i { display: block; flex-shrink: 0; }
.power { padding-top: 101px; padding-bottom: 119px; }
.power .power_feature { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; text-align: center; }
.power .power_feature li { width: 20%; height: 270px; background: #eff1f7; padding-top: 46px; box-sizing: border-box; transition: all 0.5s ease; }
.power .power_feature li img { display: block; width: 50px; margin: 0 auto; }
.power .power_feature li h3 { font-size: 24px; line-height: 100%; color: #2b2d35; font-weight: bold; margin: 44px 0 27px; }
.power .power_feature li span { display: block; font-size: 14px; line-height: 20px; color: #666; }
.power .power_feature li:hover { padding-top: 44px; }
.power .power_feature li:nth-child(even) { background: #f6f7fb; }
.power_con { position: relative; overflow: hidden; padding: 64px 32.357% 51px 0; }
.power_con .power_next { display: block; cursor: pointer; position: absolute; top: 50%; transform: translateY(-50%); width: 84px; height: 84px; z-index: 9; box-shadow: 0px 7px 19px 2px rgba(44,44,44,0.41); background: #fff url(/images/client_prev.png) no-repeat center; left: 910px; border-radius: 50%; transition: all 0.5s ease; }
.power_con .swiper-slide { position: relative; transform: translateX(-40%) scale(0.87); }
.power_con .swiper-slide:after { position: absolute; content: ""; width: 100%; height: 100%; background: rgba(0,0,0,0.66); left: 0; top: 0; transition: all 0.5s ease; }
.power_con .swiper-slide-active { transform: translateX(0) scale(1); z-index: 2; box-shadow: 0px 7px 36px 4px rgba(0,0,0,0.4); }
.power_con .swiper-slide-active:after { display: none; }
.power_con .open-video { width: 100%; position: relative; line-height: 0; overflow: hidden; cursor: pointer; }
.power_con .open-video h4 { position: absolute; top: 120px; left: 48px; }
.power_con .open-video h4 span { display: block; font-size: 28px; line-height: 40px; color: #fff; font-weight: normal; }
.power_con .open-video h4 i { margin-top: 173px; display: inline-block; font-size: 14px; line-height: 30px; color: #fff; padding-right: 46px; background: url(/images/video_icon.png) no-repeat right; }
.power_con .open-video h4:after { position: absolute; content: ""; width: 163px; height: 1px; background: #D6726A; left: 0; bottom: 61px; }
.power_con .open-video img { width: 100%; }
.video-box {
  position:fixed;top:50%;/* 调整为你需要的位置 */
  left:50%;/* 调整为你需要的位置 */
  transform:translate(-50%,-50%);width:100%;height:100%;font-size:0;z-index:9999;background:rgba(0,0,0,0.9);display:none;
}
.video-box .video { width: 800px; height: 640px; position: absolute; position: fixed; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }
.video-box .video iframe,.video-box .video video { width: 800px; height: 640px; }
.video-box .close-video { position: absolute; top: calc(54px); right: 5%; width: 30px; height: 30px; cursor: pointer; background: url(/images/close.png) no-repeat center; }
.service { height: 636px; background: url(/images/service_bg.jpg) no-repeat center; background-size: cover; box-sizing: border-box; padding-top: 101px; }
.service h2 strong,.service h2 span { color: #fff; }
.service .info { font-size: 18px; line-height: 100%; color: #fff; font-weight: bold; padding-left: 10px; border-left: 3px solid #D02513; margin: 66px 0 31px; }
.service ul { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.service li { position: relative; width: 32.5%; box-shadow: 0px 7px 19px 2px rgba(20,20,20,0.29); background: #D02513; box-sizing: border-box; transition: all 0.5s ease; padding: 65px 52px 0 52px; height: 252px; }
.service li h3 { font-size: 28px; line-height: 100%; color: #fff; font-weight: bold; margin-bottom: 32px; }
.service li p { font-size: 18px; line-height: 30px; color: #fff; }
.service li i { display: block; width: 24px; height: 24px; box-sizing: border-box; border: 1px solid #fff; font-size: 14px; line-height: 22px; color: #2b2d35; text-align: center; font-style: normal; position: absolute; right: 25px; bottom: 25px; background: #fff; border-radius: 50%; }
.service li:hover { background: #fff; }
.service li:hover h3 { color: #D02513; }
.service li:hover p { color: #2b2d35; }
.service li:hover i { border-color: #000; }
.ys { padding-top: 104px; padding-bottom: 95px; position: relative; overflow: hidden; background: #f5f6fa; }
.ys h2 { margin-bottom: 86px; }
.ys dl { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; box-shadow: 0px 7px 19px 2px rgba(210,210,210,0.41); background: #fff; margin-bottom: 35px; }
.ys dt { width: 47.36%; height: 515px; position: relative; }
.ys dt img { height: 515px; position: absolute; right: 0; top: 0; }
.ys dd { width: 52.64%; padding: 71px 5.857% 0 4.357%; line-height: 0; }
.ys dd h3 { margin-top: 17px; padding-top: 5px; padding-bottom: 33px; border-bottom: 1px solid #bfbfbf; background: url(/images/ys_icon.png) no-repeat right top; margin-bottom: 24px; }
.ys dd h3 strong { display: block; font-size: 32px; line-height: 100%; color: #2b2d35; font-weight: bold; }
.ys dd h3 i { color: #D02513; }
.ys dd h3 span { display: block; font-size: 24px; line-height: 100%; color: #2b2d35; font-weight: normal; margin-top: 16px; }
.ys dd p { width: 492px; font-size: 14px; line-height: 29px; color: #2b2d35; }
.ys dd .moreinfo { margin-top: 48px; }
.ys dl:nth-child(2) dt { order: 1; }
.ys dl:nth-child(2) dt img { right: auto; left: 0; }
/*news*/
.news { padding: 83px 0 76px; }
.news_nav { margin: 71px 0 48px; border-top: 1px solid #cacaca; border-bottom: 1px solid #cacaca; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; padding: 8px 0; }
.news_nav > div { display: flex; display: -webkit-flex; }
.news_nav h3 { margin-right: 20px; transition: all 0.5s ease; }
.news_nav h3 a { display: block; font-size: 16px; line-height: 68px; color: rgba(43,45,53,0.6); padding: 0 37px; font-weight: normal; }
.news_nav h3.on,.news_nav h3:hover { background: linear-gradient(135deg,#ff7725,#d02513); box-shadow: 0px 7px 19px 2px rgba(208,37,19,0.41); }
.news_nav h3.on a,.news_nav h3:hover a { font-weight: bold; color: #fff; }
.news_con .swiper-slide { background: #fff; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.news_con dl { width: 32.357%; }
.news_con dt { line-height: 0; overflow: hidden; }
.news_con dt img { width: 100%; }
.news_con dd h4 { font-size: 18px; line-height: 28px; color: #000; font-weight: normal; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding-top: 34px; transition: all 0.5s ease; }
.news_con dd p { font-size: 14px; line-height: 24px; color: #999; max-height: 48px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 11px 0 27px; }
.news_con dd span { display: block; font-size: 16px; line-height: 100%; color: #6d6d6d; transition: all 0.5s ease; }
.news_con dl:hover dd h4,.news_con dl:hover dd span { color: #D02513; }
.faq { margin-top: 88px; background: #f6f7fb; height: 186px; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.faq h3 { width: 139px; height: 186px; }
.faq h3 a { display: block; background: #D02513; font-size: 20px; line-height: 186px; color: #fff; font-weight: bold; text-align: center; }
.faq .faq_con { width: calc(100% - 139px); overflow: hidden; }
.faq li { position: relative; box-sizing: border-box; width: 33.33%; }
.faq li:after { position: absolute; content: ""; width: 1px; height: 117px; background: #e8e8eb; right: -1px; top: 35px; }
.faq li a { display: block; padding: 30px 60px 0 54px; box-sizing: border-box; height: 186px; }
.faq li h4 { font-size: 18px; line-height: 30px; color: #000; font-weight: normal; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; transition: all 0.5s ease; }
.faq li p { font-size: 14px; line-height: 23px; color: #999; max-height: 46px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 10px 0 26px; }
.faq li span { display: block; font-size: 16px; line-height: 100%; color: #6d6d6d; }
.faq li:hover h4 { color: #D02513; }
.about { height: 399px; background: url(/images/about_bg.jpg) no-repeat center bottom; }
.about .container { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; }
.about .pic { width: 417px; margin-right: 139px; }
.about .pic img { width: 100%; }
.about .con { text-align: center; padding-top: 55px; }
.about h2 strong { display: block; font-size: 36px; line-height: 100%; color: #383b47; font-weight: bold; }
.about h2 span { display: block; font-size: 20px; line-height: 100%; color: #383b47; font-weight: normal; margin-top: 18px; }
.about h2 i { color: #D02513; font-weight: normal; }
.about ul { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; margin: 36px 0 27px; }
.about li { width: 202px; margin: 0 3px; overflow: hidden; }
.about li img { width: 100%; }
.about .about_more { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; }
.about .about_more a { display: block; width: 234px; height: 42px; text-align: center; font-size: 16px; line-height: 38px; color: #D02513; font-weight: bold; transition: all 0.5s ease; box-sizing: border-box; margin: 0 7px; background: #fff; border-radius: 21px; border: 2px solid transparent; }
.about .about_more a:hover { border-color: #D02513; box-shadow: 0px 7px 19px 2px rgba(99,136,195,0.41); }
/*links*/
body { position: relative; }
.links { height: 54px; overflow: hidden; position: absolute; width: 100%; bottom: 16px; left: 0; box-sizing: border-box; }
.links .con { width: calc(100% - 400px); height: 54px; overflow: hidden; }
.links em { font-style: normal; font-size: 14px; line-height: 54px; color: #747476; float: left; }
.links a { display: block; font-size: 14px; color: #747476; line-height: 54px; margin-right: 30px; transition: all 0.5s ease; float: left; margin-bottom: 15px; }
.links a:hover { color: #fff; }
.footer .f_info { line-height: 1; }
@media screen and (max-width:1440px),screen and (max-width:1440px) and (-webkit-min-device-pixel-ratio:2) {
  .client_con .client_prev { left: -76px; }
  .client_con .client_next { right: -76px; }
  .power_con .power_next { left: 840px; }
}
