@charset "utf-8";
.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; top: 29px; }
/*banner*/
.banner { position: relative; background: #000; margin: 0 auto; clear: both; overflow: hidden; }
.banner .bd { position: relative; z-index: 0; }
.banner .bd li img { width: 100%; vertical-align: top; }
.banner .banner_con { position: absolute; bottom: 31px; width: 100%; }
.banner .switch { text-align: right; font-size: 0; }
.banner .switch .prev,.banner .switch .next { display: inline-block; vertical-align: middle; padding-top: 10px; cursor: pointer; }
.banner .pageState { display: inline-block; vertical-align: middle; font-size: 58px; font-family: Impact; font-weight: 400; color: #ffffff; line-height: 1; width: 98px; text-align: center; transition: all 0.5s ease; }
.banner .hd { padding-right: 50px; text-align: right; font-size: 0; height: 13px; margin-top: 16px; display: block!important;}
.banner .hd li { width: 13px; height: 13px; background: #ffffff; border-radius: 50%; margin-left: 17px; transition: all 0.5s ease; box-sizing: border-box; font-size: 0; display: inline-block; vertical-align: top; cursor: pointer; }
.banner .hd li.on { background: none; border: 1px solid #ffffff; }
/*search*/
.search { height: 80px; background: #fff; }
.search .content { position: relative; }
.search .keyword { font-size: 16px; line-height: 1; float: left; padding-top: 64px; }
.search .keyword strong { font-weight: normal; color: #999; }
.search .keyword a { color: #999; display: inline-block; font-weight: normal; transition: all 0.5s ease; }
.search .keyword a:after { content: "、"; }
.search .keyword a:last-child:after { display: none; }
.search .keyword a:hover { color: #006EE3; }
.search .keyword a:hover:after { color: #999; }
.search .search_input { float: right; width: 333px; height: 39px; background: #ffffff; border: 1px solid #bfbfbf; border-radius: 20px; margin-top: 41px; box-sizing: border-box; }
.search .search_input input[type="text"] { background: none; border: none; outline: none; display: block; box-sizing: border-box; float: left; width: 240px; padding-left: 20px; font-size: 16px; line-height: 37px; color: #ccc; }
.search .search_input .submit { border: none; outline: none; display: block; float: right; cursor: pointer; font-size: 0; width: 70px; height: 37px; background: url(/images/s_btn.png) no-repeat center; }
.search .s_tel { width: 553px; height: 67px; background: #006ee3; position: absolute; top: -33px; right: 50%; margin-right: 407px; padding-right: 37px; text-align: right; font-size: 0; }
.search .s_tel img { display: inline-block; vertical-align: middle; width: 49px; margin-right: 13px; }
.search .s_tel span { display: inline-block; vertical-align: middle; font-size: 30px; line-height: 67px; color: #fff; font-family: Cambria; }
/*title*/
h2.main_title{ display: block; text-align: center; font-size: 0; line-height: 0; }
h2.main_title strong { display: inline-block; font-size: 30px; line-height: 100%; color: #006ee3; position: relative; }
h2.main_title strong:before,h2.main_title strong:after { position: absolute; content: ""; width: 40px; height: 1px; background: #006ee3; top: 14px; left: -71px; }
h2.main_title strong:after { left: auto; right: -71px; }
h2.main_title span { display: block; font-weight: normal; font-size: 20px; line-height: 100%; color: #666; margin-top: 19px; }
/*intro*/
.intro { padding-top: 62px; padding-bottom: 60px; }
.intro h2 strong { display: block; font-size: 48px; line-height: 100%; color: #006EE3; }
.intro h2 span { display: block; font-size: 20px; line-height: 100%; color: #000; font-weight: normal; position: relative; padding-bottom: 36px; margin-top: 19px; margin-bottom: 49px; }
.intro h2 span:after { position: absolute; content: ""; width: 27px; height: 5px; background: #000000; border-radius: 3px; left: 0; bottom: 0; }
.intro h2 em { display: block; font-size: 18px; line-height: 100%; color: #006EE3; font-weight: normal; background: url(/images/more.png) no-repeat 91px center; transition: all 0.5s ease; }
.intro h2 em:hover { letter-spacing: 1px; }
.intro_con { width: calc(100% - 900px); float: left; }
.intro_con ul { margin-top: 98px; }
.intro_con li { float: left; margin-bottom: 94px; }
.intro_con li img { display: block; width: 47px; }
.intro_con li em { display: block; font-size: 18px; line-height: 100%; color: #333; margin: 13px 0; white-space: nowrap; }
.intro_con li i { display: inline-block; font-size: 32px; line-height: 100%; color: #333; font-weight: bold; vertical-align: -2px; margin-right: 3px; }
.intro_con li span { display: block; font-size: 18px; line-height: 100%; color: #333; }
.intro_con li:nth-child(1){width: 200px;}
.intro_con li:nth-child(2n) { float: right; width: 150px; margin-left: 100px; }
.intro_con li:nth-child(3),.intro_con li:nth-child(4) { margin-bottom: 0; }
.intro_pic { float: right; width: 814px; }
.intro_pic h3 { margin-top: 40px; background: url(/images/intro_icon.png) no-repeat left top; padding-top: 31px; }
.intro_pic h3 strong { display: block; font-size: 24px; line-height: 100%; color: #323232; font-weight: normal; }
.intro_pic h3 span { display: block; font-size: 12px; line-height: 100%; color: #999; font-weight: normal; margin-top: 9px; font-family: Arial; letter-spacing: 4.5px; }
.intro_pic h3 + p { font-size: 18px; line-height: 28px; color: #666; margin-top: 22px; }
.open-video { position: relative; width: 814px; height: 410px; overflow: hidden; border-radius: 5px; cursor: pointer; }
.open-video:after { position: absolute; content: ""; width: 100%; height: 100%; background: rgba(0,0,0,0.36) url(/images/video_icon.png) no-repeat center; top: 0; left: 0; z-index: 2; }
.video-box { position: fixed; top: 0; left: 0; right: 0; bottom: 0; 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; 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 { 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; }
/*product*/
.product { background: url(/images/product_bg.jpg) no-repeat center top; padding-top: 60px; padding-bottom: 130px; }
.product h2 { margin-bottom: 43px; }
.product h2 strong { color: #fff; }
.product h2 strong:before,.product h2 strong:after { background: #fff; }
.product h2 span { color: #fff; }
.pro_list dl { width: 32.357%; margin-bottom: 19px; background: #fff; height: 541px; height: 357px; float: left; position: relative; overflow: hidden; }
.pro_list dl:nth-child(1),.pro_list dl:nth-child(2) { width: 49.357%; height: 541px; }
.pro_list dl:nth-child(1) { margin-right: 1.286%; }
.pro_list dl:nth-child(4) { margin: 0 1.4645%; }
.pro_list dt { line-height: 0; opacity: 0; transition: all 0.5s ease; }
.pro_list dt img { height: 541px; width: auto; }
.pro_list dd { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.pro_list dd h4 { position: absolute; top: 50px; left: 43px; }
.pro_list dd h4 strong { display: block; font-size: 22px; line-height: 24px; color: #333; font-weight: normal; }
.pro_list dd h4 span { display: block; font-size: 16px; line-height: 20px; color: #999; margin-top: 12px; font-weight: normal; }
.pro_list dd img { width: 100%; }
.pro_list dd .more { display: block; width: 34px; height: 34px; position: absolute; left: 47px; bottom: 48px; opacity: 0; transition: all 0.5s ease; }
.pro_list dd .more img { width: 100%; }
.pro_list dd .more:hover { left: 43px; }
.pro_list dl:hover dt { opacity: 1; }
.pro_list dl:hover dd h4 strong,.pro_list dl:hover dd h4 span { color: #fff; }
.pro_list dl:hover dd .more { opacity: 1; }
.for_more { display: block; width: 186px; height: 46px; background: #ffffff; border-radius: 23px; text-align: center; margin: 0 auto; }
.for_more span { display: inline-block; vertical-align: middle; font-size: 18px; line-height: 46px; color: #006EE3; margin-right: 3px; transition: all 0.5s ease; }
.for_more img { display: inline-block; vertical-align: middle; }
.for_more:hover span { margin-right: 7px; }
.product .for_more { margin-top: 21px; }
/*sm_banner*/
.sm_banner { height: 394px; background: url(/images/sm_bg.jpg) no-repeat center top; margin: 63px 0; }
.sm_banner .content { box-sizing: border-box; padding-left: 96px; padding-right: 115px; }
.sm_banner h2 { padding-top: 117px; float: left; }
.sm_banner h2 span { display: block; width: 327px; height: 54px; background: #006ee3; font-size: 34px; line-height: 54px; color: #fff; font-weight: normal; text-align: center; }
.sm_banner h2 strong { display: block; font-size: 42px; line-height: 100%; color: #000; margin-top: 28px; }
.sm_banner .s_tel { float: right; width: 399px; height: 394px; background: url(/images/sm_tel_bg.png) no-repeat center; padding-top: 132px; box-sizing: border-box; }
.sm_banner .s_tel p { margin-left: 69px; padding-left: 62px; background: url(/images/s_tel.png) no-repeat left center; }
.sm_banner .s_tel p span { display: block; font-size: 18px; line-height: 100%; color: #fff; }
.sm_banner .s_tel p strong { display: block; font-size: 30px; line-height: 100%; color: #fff; font-family: Cambria; font-weight: 400; margin-top: 12px; }
.sm_banner .s_tel a { display: block; margin: 42px auto 0; width: 186px; height: 46px; border: 1px solid #ffffff; border-radius: 23px; box-sizing: border-box; text-align: center; }
.sm_banner .s_tel a span { display: inline-block; vertical-align: middle; font-size: 18px; line-height: 44px; color: #fff; margin-right: 3px; transition: all 0.5s ease; }
.sm_banner .s_tel a img { display: inline-block; vertical-align: middle; }
.sm_banner .s_tel a:hover span { margin-right: 6px; }
/*process*/
.process .process_list { margin: 40px 0; }
.process .process_list li { width: 110px; float: left; margin-right: calc((100% - 660px)/5); text-align: center; }
.process .process_list li img { display: block; width: 110px; height: 110px; }
.process .process_list li span { display: block; font-size: 20px; line-height: 100%; color: #006EE3; margin-top: 14px; font-weight: bold; }
.process .process_list li:last-child { margin-right: 0; }
.process_con { float: left; width: calc(100% - 357px); overflow: hidden; }
.process_con li { position: relative; width: 100%; height: 637px; line-height: 0; overflow: hidden; }
.process_con li img { height: 637px; width: auto; }
.process_con li h4 { background: url(/images/process_hover.png) no-repeat center bottom; width: 100%; padding: 53px 10px 11px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; box-sizing: border-box; font-size: 20px; line-height: 58px; color: #fff; left: 0; bottom: 0; position: absolute; text-align: center; font-weight: normal; }
.process_nav { float: right; width: 333px; }
.process_nav li { position: relative; margin-bottom: 23px; cursor: pointer; }
.process_nav li i { display: block; width: 333px; height: 307px; overflow: hidden; }
.process_nav li img { height: 307px; width: auto; }
.process_nav li h4 { background: url(/images/process_hover.png) no-repeat center -16px; padding: 9px 10px 0; box-sizing: border-box; height: 67px; font-size: 20px; line-height: 58px; color: #fff; font-weight: normal; position: absolute; left: 0; bottom: 0; width: 100%; text-align: center; z-index: 2; }
.process_nav li:before { position: absolute; content: ""; border-style: solid; border-width: 11px; border-color: transparent #006EE3 transparent transparent; top: 141px; left: -22px; opacity: 0; transition: all 0.5s ease; }
.process_nav li:after { position: absolute; content: ""; width: 100%; height: 100%; border: 4px solid #006EE3; box-sizing: border-box; left: 0; top: 0; opacity: 0; transition: all 0.5s ease; z-index: 2; }
.process_nav li.on:before,.process_nav li:hover:before,.process_nav li.on:after,.process_nav li:hover:after { opacity: 1; }
/*sm_banner2*/
.sm_banner2 { height: 432px; margin-top: 37px; background: url(/images/sm_bg2.jpg) no-repeat center top; padding-top: 111px; box-sizing: border-box; text-align: center; }
.sm_banner2 ul { border: 1px solid #006EE3; height: 56px; font-size: 0; box-sizing: border-box; display: inline-block; }
.sm_banner2 ul li { display: inline-block; padding-left: 47px; background: url(/images/sm_icon1.png) no-repeat 13px center; transition: all 0.5s ease; padding-right: 17px; font-size: 22px; line-height: 54px; color: #333; }
.sm_banner2 ul li:hover,.sm_banner2 ul li.on { background: #006EE3 url(/images/sm_icon2.png) no-repeat 13px center; color: #fff; }
.sm_banner2 h2 { font-size: 40px; line-height: 100%; color: #006EE3; margin: 29px 0 40px; }
.sm_banner2 .ask { display: block; width: 186px; height: 46px; background: #006ee3; border-radius: 23px; text-align: center; margin: 0 auto; }
.sm_banner2 .ask span { display: inline-block; vertical-align: middle; font-size: 18px; line-height: 46px; color: #fff; margin-right: 3px; transition: all 0.5s ease; }
.sm_banner2 .ask img { display: inline-block; vertical-align: middle; }
.sm_banner2 .ask:hover span { margin-right: 6px; }
/*client*/
.client { padding-top: 437px; background: url(/images/brand_bg.jpg) no-repeat center top; }
.client h2{ display: block; width: 456px; height: 64px; background: #006ee3; margin: 0 auto 75px; font-size: 30px; line-height: 64px; color: #fff; font-weight: normal; text-align: center; }
.client .client_con { overflow: hidden; }
.client .client_con li { width: calc((100% - 44px)/3); float: left; margin-right: 22px; overflow: hidden; position: relative; }
.client .client_con li > a { display: block; line-height: 0; width: 100%; overflow: hidden; box-sizing: border-box; border: 2px solid #e6e4e4; transition: all 0.5s ease; }
.client .client_con li > a img { width: 100%; }
.client .client_con li h4 a { display: block; font-size: 18px; line-height: 60px; color: #333; font-weight: normal; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding: 0 10px; box-sizing: border-box; height: 60px; background: #e6e4e4; transition: all 0.5s ease; }
.client .client_con li:hover > a { border-color: #006EE3; }
.client .client_con li:hover h4 a { background: #006EE3; color: #fff; }
.client .client_nav { text-align: center; font-size: 0; margin-top: 30px; height: 15px; margin-bottom: 63px; }
.client .client_nav li { display: inline-block; width: 15px; height: 15px; background: #006ee3; border-radius: 50%; box-sizing: border-box; vertical-align: top; cursor: pointer; margin: 0 12px; }
.client .client_nav li.on,.client .client_nav li:hover { border: 1px solid #006EE3; background: none; }
/*service*/
.service { height: 944px; background: url(/images/service_bg.jpg) no-repeat center top; position: relative; }
.service h2 { float: left; margin-top: 170px; width: 320px; }
.service h2 b { display: block; font-size: 56px; font-family: "Helvetica-Roman","Impact"; font-weight: normal; color: rgba(255,255,255,0.35); line-height: 1; text-transform: uppercase; }
.service h2 strong { display: block; font-size: 30px; line-height: 100%; color: #fff; margin: 19px 0 36px; }
.service h2 > span { display: block; font-size: 20px; line-height: 100%; color: #fff; margin-bottom: 19px; font-weight: normal; white-space: nowrap; }
.service h2 i { display: block; font-size: 14px; font-weight: 400; color: rgba(255,255,255,0.49); line-height: 21px; margin-top: 10px; margin-bottom: 82px; }
.service h2 a { display: block; width: 186px; height: 46px; box-sizing: border-box; border: 1px solid #ffffff; border-radius: 23px; text-align: center; }
.service h2 a span { display: inline-block; vertical-align: middle; font-size: 18px; line-height: 44px; color: #fff; font-weight: normal; margin-right: 3px; transition: all 0.5s ease; }
.service h2 a img { display: inline-block; vertical-align: middle; }
.service h2 a:hover span { margin-right: 6px; }
.service ul { height: 944px; position: absolute; width: calc(50% + 166px); right: 0; top: 0; }
.service li { float: left; width: 23.13%; padding-top: 270px; height: 944px; box-sizing: border-box; position: relative; transition: background-color 0.5s ease; }
.service li h3 { width: 50px; font-size: 50px; line-height: 100%; color: #fff; padding-bottom: 274px; position: relative; padding-left: 2px; margin-left: 12px; }
.service li h3:after { position: absolute; content: ""; width: 56px; height: 5px; background: #ffffff; border-radius: 3px; left: 0; bottom: 0; }
.service li .desc { display: none; }
.service li .desc p { font-size: 20px; line-height: 37px; color: #fff; padding-left: 25px; box-sizing: border-box; position: relative; }
.service li .desc p:before { position: absolute; content: ""; width: 5px; height: 5px; background: #ffffff; left: 0; top: 16px; }
.service li i { display: block; font-size: 91px; font-family: Impact; font-weight: 400; color: #ffffff; line-height: 1; position: absolute; bottom: 48px; left: 0; }
.service li.on { width: 53.74%; background: rgba(7,34,99,0.67); padding: 167px 3.914% 0; }
.service li.on h3 { margin-left: 0; text-align: center; width: 100%; padding-bottom: 46px; }
.service li.on h3:after { left: 50%; margin-left: -28px; }
.service li.on .desc { display: block; margin-top: 32px; }
.service li.on i { font-size: 410px; color: rgba(255,255,255,0.1); top: 687px; left: 10.32%; bottom: auto; }
/*news*/
.news { padding-top: 58px; padding-bottom: 36px; text-align: center; }
.news_nav { display: inline-block; font-size: 0; height: 58px; background: rgba(179,179,179,0); border: 1px solid #e3e3e3; border-radius: 29px; margin: 40px auto 29px; box-sizing: border-box; }
.news_nav h3 { display: inline-block; }
.news_nav h3 a { display: block; padding: 0 66px; font-size: 20px; line-height: 56px; color: #333; font-weight: normal; position: relative; z-index: 2; transition: all 0.5s ease; }
.news_nav h3 a:after { position: absolute; content: ""; width: 100%; height: 58px; top: -1px; left: 0; background: #006EE3; border-radius: 29px; opacity: 0; transition: all 0.5s ease; z-index: -1; }
.news_nav h3.on a,.news_nav h3:hover a { color: #fff; }
.news_nav h3.on a:after,.news_nav h3:hover a:after { opacity: 1; }
.news_con .hot { float: right; width: 46.285%; height: 545px; overflow: hidden; position: relative; }
.news_con .hot dt { line-height: 0; }
.news_con .hot dt img { height: 545px; width: auto; }
.news_con .hot dd { height: 194px; background: url(/images/news_hover.png) no-repeat center top; width: 100%; position: absolute; left: 0; bottom: 0; box-sizing: border-box; padding: 61px 46px 0; text-align: left; }
.news_con .hot dd span { display: block; font-size: 18px; line-height: 100%; color: #fff; margin-bottom: 18px; }
.news_con .hot dd h4,.news_con .hot dd p { font-size: 20px; line-height: 35px; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-weight: normal; }
.news_con .news_list { width: 51.5%; float: left; }
.news_con .news_list dl { text-align: left; border-bottom: 1px solid #ccc; overflow: hidden; }
.news_con .news_list dt { float: left; display: none; }
.news_con .news_list dd { width: 100%; float: right; padding: 31px 0; box-sizing: border-box; }
.news_con .news_list dd span { display: block; float: left; font-size: 18px; line-height: 26px; color: #999; margin-right: 37px; }
.news_con .news_list dd h4 { font-size: 18px; line-height: 26px; color: #333; font-weight: normal; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; width: 400px; }
.news_con .news_list dd p { font-size: 20px; line-height: 35px; color: #fff; max-height: 70px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; display: none; }
.news_con .news_list dl.on { background: #006EE3 url(/images/news_bg.jpg) no-repeat right bottom; padding: 32px 40px 32px 30px; }
.news_con .news_list dl.on dt { width: 47%; height: 213px; overflow: hidden; line-height: 0; display: block; }
.news_con .news_list dl.on dt img { height: 213px; width: auto; }
.news_con .news_list dl.on dd { float: right; width: 46.44%; height: 213px; background: url(/images/more4.png) no-repeat left 158px; box-sizing: border-box; }
.news_con .news_list dl.on dd a { padding-bottom: 60px; display: block; }
.news_con .news_list dl.on dd span { color: #fff; float: none; margin-bottom: 17px; }
.news_con .news_list dl.on dd h4 { display: none; }
.news_con .news_list dl.on dd p { display: block; }
/*about*/
.about { background: url(/images/about_bg.jpg) no-repeat center top; height: 730px; box-sizing: border-box; text-align: center; padding-top: 405px; }
.about h2 strong { display: block; font-size: 38px; line-height: 100%; color: #006EE3; }
.about h2 span { display: block; font-size: 20px; line-height: 100%; color: #666; font-weight: normal; margin: 18px 0 29px; }
.about .ask { display: block; margin: 0 auto; width: 186px; height: 46px; background: #006EE3; border-radius: 23px; }
.about .ask span { display: inline-block; vertical-align: middle; font-size: 18px; line-height: 46px; color: #fff; margin-right: 2px; transition: all 0.5s ease; }
.about .ask img { display: inline-block; vertical-align: middle; }
.about .ask:hover span { margin-right: 6px; }
/*links*/
body { position: relative; }
.links { position: absolute; bottom: 99px; left: 50%; margin-left: -123px; height: 225px; width: 320px; overflow: hidden; }
.links em { font-style: normal; font-size: 20px; line-height: 100%; color: #fff; display: block; margin-bottom: 14px; }
.links i { font-style: normal; color: #fff; font-size: 50px; line-height: 1; font-family: Impact; vertical-align: -2px; }
.links a { display: block; font-size: 18px; color: #fff; line-height: 50px; transition: all 0.5s ease; float: left; }
.links a:nth-child(even) { padding-right: 57px; margin-right: 56px; background: url(/images/f_line.png) no-repeat right center; }
.footer { margin-top: -55px; }