body { font-family: AS; }
.scale_img dl dt img,.scale_img li img { transition: all 1s linear 0s; }
.scale_img dl:hover dt img,.scale_img li:hover img { transform: scale(1.05) rotate(0deg) translateY(0); }
/*header*/
.header { position: fixed !important; }
/*banner*/
.banner { position: relative; background: #000; margin: 0 auto; clear: both; }
.banner .bd { position: relative; z-index: 0; }
.banner .bd li img { width: 100%; vertical-align: top; }
.banner .content { position: absolute; left: 50%; transform: translateX(-50%); z-index: 9; bottom: 40px; }
.banner .hd { height: 8px; cursor: pointer; z-index: 9; font-size: 0; text-align: left; float: left; margin-top: 24px; }
.banner .hd li { display: inline-block; width: 12px; height: 12px; background: #fff; opacity: 0.5; border-radius: 50%; transition: all 0.5s ease; margin-right: 10px; cursor: pointer; }
.banner .hd li.on { background: #fff; opacity: 1; }
.banner .switch { width: 132px; height: 56px; float: right; }
.banner .prev,.banner .next { width: 54px; height: 54px; cursor: pointer; float: left; margin-left: 10px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.3); transition: all 0.5s ease; background-color: rgba(255,255,255,0.2); }
.banner .prev:hover,.banner .next:hover { border-color: #fff; }
/*title*/
h2.main_title a { display: block; line-height: 0; }
h2.main_title strong { display: block; font-size: 56px; line-height: 100%; color: #262626; }
h2.main_title span { display: block; font-size: 24px; line-height: 100%; color: #262626; margin-top: 25px; }
/*product*/
.product { padding: 145px 0 176px; overflow: hidden; }
.product h2 { margin-bottom: 78px; }
.product .hot { width: 30.928%; float: left; height: 606px; background: #0066dd; border-radius: 70px 0px 70px 0px; position: relative; margin-bottom: 60px; }
.product .hot img { height: 606px; width: auto; }
.product .hot h3 { font-size: 36px; line-height: 40px; color: #A8D0FF; text-transform: uppercase; position: absolute; top: 71px; left: 10.6%; padding-bottom: 75px; }
.product .hot h3:after { position: absolute; content: ""; content: ">"; left: 0; bottom: 0; }
.product ul { float: right; width: 69.072%; }
.product li { float: left; width: 31.85%; margin-left: 1.483%; margin-bottom: 14px; height: 296px; background: #f5f5f5; position: relative; overflow: hidden; }
.product li img { height: 174px; width: auto; margin-top: 40px; }
.product li h4 { position: absolute; box-sizing: border-box; padding: 0 20px; bottom: 20px; width: 100%; }
.product li h4 strong { display: block; font-size: 16px; line-height: 20px; color: #262626; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.product li h4 span { display: block; font-size: 12px; line-height: 100%; color: #999; margin-top: 11px; }
.product li a:after { position: absolute; content: ""; width: 100%; height: 100%; content: "READ MORE"; background: rgba(38,38,38,0.7); font-size: 18px; line-height: 296px; color: #fff; text-align: center; opacity: 0; left: 0; top: 0; transition: all 0.5s ease; }
.product li:hover a:after { opacity: 1; }
.product a.more { display: block; clear: both; font-size: 24px; line-height: 100%; color: #262626; padding-bottom: 52px; border-bottom: 2px solid #000; transition: all 0.5s ease; }
.product a.more:hover { letter-spacing: 1px; }
/*product1*/
.product1 { background: #f5f5f5; padding: 132px 0 167px; }
.product1 .hot { float: right; border-radius: 0 70px 0 70px; }
.product1 ul { float: left; }
.product1 li { margin-left: 0; margin-right: 1.483%; background: #fff; }
/* products */
.products .hot{display: none;}
.products ul{width: 100%;float:none;margin-bottom: 40px;}
.products ul::after{content:".";height:0;display:block;visibility:hidden;clear:both}
.products ul li{background: #f5f5f5;width: 32.357%;height: 357px;margin-left: 0;margin-right: 1.4645%;margin-bottom: 19px;box-sizing: border-box;padding-top: 100px;}
.products ul li:nth-of-type(1),.products ul li:nth-of-type(2){width: 49.357%;height: 541px;margin-right: 1.286%;padding-top: 160px;}
.products ul li:nth-of-type(2),.products ul li:nth-of-type(5){margin-right: 0;}
.products ul li h4{bottom: auto;top: 40px;padding-left: 40px;box-sizing: border-box;}
.products ul li h4 strong{font-size:20px;}
.products ul li a::after{display: none;}
.products ul li img{display: block;width:80%;height: auto;margin: 0 auto;}
.products ul li:hover{background: url(../image/product1_bg.jpg) no-repeat left top;}
.products ul li:hover h4 strong{color: #fff;}
.products ul li:hover h4 span{color: #fff;}
/*about*/
.about { position: relative; overflow: hidden; padding-top: 730px; }
.about .about_video { position: absolute; width: 1920px; height: 730px; overflow: hidden; left: 50%; top: 0; margin-left: -960px; }
.about .about_video:before { position: absolute; content: ""; width: 100%; height: 100%; background: rgba(0,0,0,0.53); left: 0; top: 0; z-index: 2; }
.about .about_video.show::before { display: none; }
.about .about_video video { width: 100%; position: relative; background: #000; }
.about .play { position: absolute; left: 50%; transform: translateX(-50%); top: 218px; text-align: center; z-index: 3; cursor: pointer; }
.about .play img { width: 92px; margin: 0 auto; }
.about .play h2 { display: block; font-size: 56px; line-height: 100%; color: #fff; margin: 20px 0 30px; }
.about .play p { font-size: 24px; line-height: 31px; color: #fff; }
.about_con { padding-top: 72px; overflow: hidden; padding-bottom: 61px; }
.about_con p { font-size: 16px; line-height: 24px; color: #000; width: 65.57%; float: left; font-family: ASR; }
.about_con a { display: block; width: 220px; height: 75px; background: #0066dd; border-radius: 0px 30px 0px 30px; float: right; text-align: center; font-size: 16px; line-height: 75px; color: #fff; margin-top: 5px; transition: all 0.5s ease; }
.about_con a:hover { letter-spacing: 1px; }
/*sm_banner*/
.sm_banner { height: 388px; background: url(../image/sm_bg.jpg) no-repeat center top; box-sizing: border-box; text-align: center; padding-top: 145px; }
.sm_banner h2 span { display: block; font-size: 36px; line-height: 100%; color: #fff; }
.sm_banner h2 strong { display: block; font-size: 56px; line-height: 100%; color: #fff; margin-top: 15px; }
/*factory*/
.factory { padding-top: 136px; padding-bottom: 144px; overflow: hidden; }
.factory h2 { float: left; margin-bottom: 69px; }
.factory ul { float: right; margin-top: 7px; }
.factory li { float: left; margin-left: 80px; }
.factory li strong { display: block; font-size: 56px; line-height: 100%; color: #262626; position: relative; padding-right: 26px; }
.factory li span { display: block; font-size: 18px; line-height: 100%; color: #999; margin-top: 12px; }
.factory li i { font-size: 24px; display: inline-block; position: absolute; right: 0; bottom: -9px; }
.factory_con { clear: both; }
.factory_con dl { float: left; width: 29.286%; padding-right: 3%; border-right: 1px solid #999; margin-right: 3%; }
.factory_con dt { border-radius: 50px 0px 50px 0px; overflow: hidden; line-height: 0; }
.factory_con dt img { height: 247px; width: auto; }
.factory_con dd h3 { font-size: 24px; line-height: 100%; color: #262626; margin: 38px 0 20px; }
.factory_con dd p { font-size: 14px; line-height: 24px; color: #999; }
.factory_con dd img { width: 64px; margin-top: 54px; }
.factory_con dl:last-child { padding-right: 0; margin-right: 0; border-right: none; }
/*benefit*/
.benefit { background: #f5f5f5; padding-top: 131px; padding-bottom: 178px; overflow: hidden; }
.benefit h2 { font-size: 56px; line-height: 59px; color: #262626; margin-bottom: 70px; }
.benefit h2 strong,.benefit h2 span { display: block; color: #262626; }
.benefit dl { width: 195px; height: 591px; margin-right: 16px; float: left; position: relative; transition: all 0.5s ease; overflow: hidden; }
.benefit dl:last-child { margin-right: 0; }
.benefit dt { line-height: 0; overflow: hidden; border-radius: 50px 0 50px 0px; }
.benefit dt img { width: auto; height: 591px; }
.benefit dd { background: #0066dd; position: absolute; left: 100%; height: 100%; left: 0; top: 0; box-sizing: border-box; padding: 62px 24px 0; transition: top 0.5s; }
.benefit dd h4 { font-size: 36px; line-height: 100%; color: #fff; }
.benefit dd h3 { font-size: 36px; line-height: 100%; color: #fff; display: none; }
.benefit dd p { font-size: 14px; line-height: 24px; color: #fff; display: none; margin-top: 25px; }
.benefit dd:after { position: absolute; content: ""; width: 30px; height: 30px; background: url(../image/more.png) no-repeat center; left: 24px; bottom: 70px; }
.benefit dl.on { width: calc(100% - 634px); }
.benefit dl.on dd { top: 375px; left: 6.26%; width: 87.48%; background: none; }
.benefit dl.on dd h4 { display: none; }
.benefit dl.on dd h3 { display: block; }
.benefit dl.on dd p { display: block; }
/*service*/
.service { background: #f5f5f5 url(../image/service_bg.jpg) no-repeat center top; padding-top: 134px; }
.service h2 span { display: block; font-size: 56px; line-height: 72px; color: #fff; }
.service .service_con { margin-top: 80px; background: #fff; overflow: hidden; border-radius: 50px 0px 50px 0px; padding: 67px 4.78% 0; box-sizing: border-box; }
.service .pic { width: 398px; float: left; }
.service .pic img { width: 100%; }
.service ul { width: 63%; float: right; }
.service li { padding-bottom: 32px; border-bottom: 1px solid #e0e0e0; margin-bottom: 32px; }
.service li h3 { font-size: 36px; line-height: 100%; color: #000; margin-bottom: 24px; transition: all 0.5s ease; }
.service li p { font-size: 14px; line-height: 24px; color: #666; font-family: ASR,Arial,"Microsoft Yahei"; transition: all 0.5s ease; }
.service li:hover h3 { color: #0066dd; }
.service li:hover p { color: #000; }
.service li:last-child { border-bottom: none; }
/*news*/
.news { background: #f5f5f5; overflow: hidden; padding-top: 115px; padding-bottom: 148px; }
.news h2 { margin-bottom: 60px; height: 56px; }
.news h2 strong { float: left; }
.news h2 i { display: block; float: right; font-size: 18px; line-height: 100%; color: #262626; margin-top: 38px; text-transform: uppercase; transition: all 0.5s ease; }
.news h2 i:hover { color: #0066dd; }
.news dl { width: 31.928%; float: left; margin-right: 2.108%; }
.news dl:last-child { margin-right: 0; }
.news dt { border-radius: 50px 0 50px 0; overflow: hidden; line-height: 0; height: 270px; position: relative; }
.news dt img { width: auto; height: 270px; }
.news dt:after { position: absolute; content: ""; width: 79px; height: 74px; background: #0066dd url(../image/more.png) no-repeat center; border-radius: 50px 0px 50px 0px; overflow: hidden; right: 0; bottom: 0; }
.news dd h4 { font-size: 24px; line-height: 32px; color: #262626; max-height: 64px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 32px 0 23px; transition: all 0.5s ease; }
.news dd p { font-size: 14px; line-height: 24px; color: #999; max-height: 72px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; transition: all 0.5s ease; }
.news dl:hover dd h4 { color: #0066dd; }
.news dl:hover dd p { color: #262626; }
/*subscribe*/
.subscribe { background: #262626 url(../image/subscribe_bg.jpg) no-repeat center top; padding-top: 167px; }
.subscribe h2 { width: 56.7%; float: left; margin-bottom: 127px; }
.subscribe h2 strong { display: block; font-size: 40px; line-height: 50px; color: #fff; }
.subscribe h2 span { display: block; font-size: 22px; line-height: 100%; color: #fff; margin-top: 40px; }
.subscribe .pic { width: 427px; float: right; margin-top: -34px; padding-right: 79px; }
.subscribe .pic img { width: 100%; }
.subscribe_con { clear: both; background: url(../image/subscribe_con.jpg) no-repeat center top; height: 342px; border-radius: 69px 0px 69px 0px; overflow: hidden; text-align: center; padding-top: 76px; box-sizing: border-box; }
.subscribe_con h3 { margin-bottom: 52px; }
.subscribe_con h3 strong { display: block; font-size: 48px; line-height: 100%; color: #262626; }
.subscribe_con h3 span { display: block; font-size: 14px; line-height: 100%; color: #999; text-transform: uppercase; margin-top: 11px; }
.subscribe_con input { display: inline-block; width: 629px; height: 77px; background: #ededed; padding-left: 27px; font-size: 14px; line-height: 77px; color: #999; box-sizing: border-box; margin-right: 10px; text-align: left; border: none; outline: none; vertical-align: middle; font-family: AS; }
.subscribe_con input:focus { color: #000; font-size: 16px; }
.subscribe_con button { display: inline-block; width: 270px; height: 77px; background: #0066dd; font-size: 24px; line-height: 77px; color: #fff; transition: all 0.5s ease; border: none; outline: none; cursor: pointer; vertical-align: middle; font-weight: bold; }
.subscribe_con button:hover { background: #0058be; }
@media screen and (max-width:1600px),(-webkit-min-device-pixel-ratio:2) {
  .factory_con dl { margin-right: 1.7%; padding-right: 1.7%; width: 31%; }
}
