﻿@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); }
/*banner*/
.banner { position: relative; background: #000; margin: 0 auto; overflow: hidden; }
.banner .bd { position: relative; z-index: 0; }
.banner .bd li img { width: 100%; vertical-align: top; }
.banner .hd { position: absolute; bottom: 36px; width: 100%; height: 13px; cursor: pointer; z-index: 9; font-size: 0; text-align: center; display: block!important;}
.banner .hd li { display: inline-block; width: 13px; height: 13px; background: none; border: 1px solid #fff; opacity: 1; border-radius: 50%; transition: all 0.5s ease; margin: 0 10px; cursor: pointer; box-sizing: border-box; }
.banner .hd li.on { background: #fff; }
.banner .prev,.banner .next { width: 54px; height: 54px; cursor: pointer; margin-left: 10px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.7); background-color: rgba(255,255,255,0.2); top: 46%; left: -100px; position: absolute; z-index: 9; transition: all 0.5s ease; }
.banner .prev:hover,.banner .next:hover { border-color: #fff; }
.banner .next { left: auto; right: -100px; }
.banner:hover .prev { left: 3%; }
.banner:hover .next { right: 3%; }
/*search*/
.search { height: 73px; background: #fff; }
.search .keyword { font-size: 14px; line-height: 73px; float: left; }
.search .keyword strong { font-weight: normal; color: #b8b9bb; }
.search .keyword a { color: #666; display: inline-block; font-weight: bold; transition: all 0.5s ease; }
.search .keyword a:after { content: "、"; }
.search .keyword a:last-child:after { display: none; }
.search .keyword a:hover { color: #029ED9; }
.search .keyword a:hover:after { color: #666; }
.search .search_input { float: right; width: 321px; height: 72px; border-bottom: 1px solid #666; }
.search .search_input input[type="text"] { background: none; border: none; outline: none; display: block; box-sizing: border-box; float: left; width: 280px; font-size: 14px; line-height: 72px; color: #B8B9BB; }
.search .search_input .submit { border: none; outline: none; display: block; float: right; cursor: pointer; font-size: 0; width: 41px; height: 72px; background: url(/images/s_btn.png) no-repeat right center; }
/*title*/
h2.main_title a { display: block; text-align: center; line-height: 0; position: relative; padding-bottom: 22px; }
h2.main_title a:after { position: absolute; content: ""; width: 51px; height: 2px; background: #029ed9; left: 50%; bottom: 0; margin-left: -25px; }
h2.main_title i { display: block; font-size: 60px; line-height: 100%; color: #999; opacity: 0.1; position: absolute; text-transform: uppercase; width: 100%; left: 0; top: 0; }
h2.main_title strong { display: block; font-size: 35px; line-height: 60px; color: #029ed9; font-weight: bold; }
h2.main_title span { display: block; font-weight: normal; font-size: 24px; line-height: 100%; color: #333; margin-top: 12px; }
/*intro*/
.intro { height: 387px; background: url(/images/intro_bg.jpg) no-repeat center top; padding-top: 136px; box-sizing: border-box; }
.intro li { float: left; margin-right: 94px; }
.intro li i { display: block; margin-bottom: 14px; }
.intro li strong { display: inline-block; font-size: 48px; line-height: 100%; color: #029ed9; vertical-align: middle; }
.intro li span { display: inline-block; font-size: 30px; line-height: 48px; color: #333; vertical-align: middle; font-weight: bold; margin-left: 6px; }
.intro li p { font-size: 16px; line-height: 30px; color: #333; }
.intro li:first-child strong { font-size: 36px; line-height: 48px; }
.intro li:nth-child(2) span { color: #029ed9; font-weight: normal; text-transform: uppercase; }
.intro li:last-child { margin-right: 0; }
/*client*/
.client { padding-top: 92px; padding-bottom: 112px; }
.client .client_con { padding: 30px 17px; margin-left: -17px; width: 1234px; box-sizing: border-box; overflow: hidden; }
.client .client_con > .tempWrap,.client .client_con .client_list { overflow: visible !important; }
.client .client_con ul { float: left; margin-right: 17px; }
.client .client_con li { width: 186px; height: 122px; background: #ffffff; box-shadow: 4px 6px 38px 0px rgba(135,135,135,0.13); border-radius: 10px; box-sizing: border-box; overflow: hidden; margin-bottom: 19px; }
.client .client_nav { height: 10px; text-align: center; font-size: 0; }
.client .client_nav li { display: inline-block; cursor: pointer; width: 10px; height: 10px; background: #e0e0e0; opacity: 0.8; border-radius: 50%; transition: all 0.5s ease; margin: 0 13px; }
.client .client_nav li.on { background: #029ed9; }
/*case*/
.case { background: #f7f7f7; padding-top: 88px; overflow: hidden; }
.case .content1 { width: 1315px; margin: 0 auto; position: relative; padding-bottom: 648px; }
.case_nav { text-align: center; font-size: 0; position: relative; z-index: 2; }
.case_nav h3 { margin: 0 22px; display: inline-block; padding: 0 30px; }
.case_nav h3 a { display: block; font-size: 16px; line-height: 24px; color: #333; padding-top: 56px; padding-bottom: 45px; position: relative; transition: all 0.5s ease; }
.case_nav h3 a:before { position: absolute; content: ""; width: 100%; height: 1px; background: #029ed9; left: 0; bottom: 0; transition: all 0.5s ease; opacity: 0; transition-delay: 0.1s; }
.case_nav h3 a:after { position: absolute; content: ""; width: 11px; height: 11px; background: #ffffff; border: 1px solid #029ed9; border-radius: 50%; left: 50%; box-sizing: border-box; bottom: -5px; margin-left: -5px; opacity: 0; transition: all 0.5s ease; }
.case_nav h3:hover a { color: #029ed9; }
.case_nav h3:hover a:before,.case_nav h3:hover a:after { opacity: 1; }
.case_con { position: absolute; left: 0; bottom: 0; width: 1315px; height: 648px; }
.case_con .tempWrap { overflow: visible !important; }
.case_con .tempWrap div { overflow: visible !important; }
.case_con dl { margin: 0 10px; position: relative; overflow: hidden; line-height: 0; }
.case_con dd { position: absolute; width: 383px; height: 340px; background: rgba(0,0,0,0.3); top: 149px; left: 57px; box-sizing: border-box; padding: 50px 36px; }
.case_con dd h4 { font-size: 24px; line-height: 30px; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.case_con dd .desc { margin: 27px 0 29px; }
.case_con dd .desc p { font-size: 14px; line-height: 24px; color: #fff; }
.case_con dd i { display: block; width: 132px; height: 41px; background: #029ed9; font-size: 12px; line-height: 41px; color: #fff; text-align: center; text-transform: uppercase; transition: all 0.5s ease; }
.case_con dd i:hover { letter-spacing: 1px; }
.case_prev,.case_next { width: 283px; height: 649px; background: rgba(255,255,255,0.6); position: absolute; bottom: 0; cursor: pointer; }
.case_prev > div,.case_next > div { width: 48px; height: 48px; background: #ffffff; border-radius: 50%; position: absolute; top: 301px; left: 129px; }
.case_prev > div:hover,.case_next > div:hover { background: #029ed9; }
.case_prev > div:hover img,.case_next > div:hover img { filter: brightness(100); }
.case_prev { left: -293px; }
.case_next { right: -293px; }
/*ys*/
.ys { padding-top: 114px; }
.ys dl { overflow: hidden; }
.ys dt { float: left; line-height: 0; }
.ys dd { float: right; }
.ys dd h3 { position: relative; padding-bottom: 30px; margin-bottom: 25px; }
.ys dd h3 span { display: block; font-size: 20px; line-height: 100%; color: #029ED9; }
.ys dd h3 strong { display: block; font-size: 30px; line-height: 100%; color: #333; font-weight: normal; margin-top: 12px; }
.ys dd h3:before { position: absolute; content: ""; width: 16px; height: 2px; background: #029ed9; left: 0; bottom: 0; }
.ys dd h3:after { position: absolute; content: ""; width: 16px; height: 2px; background: #ff8400; left: 16px; bottom: 0; }
.ys dd p { font-size: 14px; line-height: 30px; color: #333; padding-left: 18px; position: relative; }
.ys dd p:before { position: absolute; content: ""; width: 6px; height: 6px; background: #ffffff; border: 1px solid #d2d2d2; border-radius: 50%; box-sizing: border-box; left: 0; top: 12px; transition: all 0.5s ease; }
.ys dd p:hover:before { border: #029ED9; background: #029ED9; }
.ys dd i { display: block; margin-top: 60px; padding-left: 89px; font-size: 16px; line-height: 100%; color: #666; position: relative; font-weight: bold; }
.ys dd i:before { position: absolute; content: ""; width: 77px; height: 1px; background: #cccccc; left: 0; top: 7px; }
.ys1 { margin-top: 59px; margin-bottom: 130px; }
.ys1 dt { width: 560px; height: 372px; }
.ys1 dd { width: 524px; padding-top: 37px; }
.ys2 { padding-bottom: 48px; margin-bottom: 95px; }
.ys2 dt { float: right; width: 560px; height: 372px; position: relative; }
.ys2 dt img:last-child { position: absolute; width: 320px; left: -151px; bottom: -48px; }
.ys2 dd { float: left; width: 463px; padding-top: 61px; }
.ys3 { padding-bottom: 173px; }
.ys3 dt { width: 560px; height: 372px; position: relative; }
.ys3 dt img:last-child { position: absolute; width: 220px; height: 268px; bottom: -46px; right: -66px; border: 4px solid #fff; box-sizing: border-box; box-shadow: 0 0 20px 0 rgba(0,0,0,0.1); }
.ys3 dd { width: 525px; padding-top: 37px; }
/*album*/
.album { overflow: hidden; max-width: 1920px; min-width: 1200px; margin: 0 auto; }
.album ul { overflow: hidden; margin-top: 55px; }
.album li { float: left; width: 26.3%; line-height: 0; position: relative; margin-left: 0.471%; margin-bottom: 0.471%; overflow: hidden; height:18.65vw; }
.album li img { width: 100%; min-height:100%; }
.album li h4 { position: absolute; width: 100%; height: 100%; background: url(/images/album_hover.png) no-repeat center bottom; padding: 53% 7.5% 0; box-sizing: border-box; font-size: 18px; line-height: 76px; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; z-index: 2; left: 0; bottom: 0; transition: all 0.5s ease; }
.album li:hover h4 { background: rgba(46,139,210,0.9); padding-top: 26%; text-align: center; }
.album li:first-child { width: 46.458%; margin-left: 0; height:37.76vw; /*像素/19.1957*/}
.album li:first-child h4 { padding-top: 70%; }
.album li:first-child:hover h4 { padding-top: 36%; }
/*product*/
.product { padding-top: 112px; padding-bottom: 97px; }
.product h2 { margin-bottom: 53px; }
.pro_nav { width: 305px; height: 675px; background: #029ed9; float: left; }
.pro_nav dt { height: 70px; }
.pro_nav h3 a { display: block; background: url(/images/product_icon.png) no-repeat 37px center; padding-left: 67px; position: relative; transition: all 0.5s ease; font-size: 16px; line-height: 69px; color: #fff; border-bottom: 1px solid rgba(255,255,255,0.3); text-transform: uppercase; font-weight: normal; }
.pro_nav h3 a:after { position: absolute; content: ""; width: 7px; height: 7px; border-right: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(-45deg); -ms-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg); top: 30px; right: 25px; transition: ease 0.4s; -o-transition: ease 0.4s; }
.pro_nav dd { display: none; height: 465px; overflow: hidden; border-bottom: 1px solid rgba(255,255,255,0.3); box-sizing: border-box; padding: 13px 20px 13px 42px; }
.pro_nav dd h4 a { display: block; font-size: 14px; line-height: 39px; color: #fff; padding-left: 26px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; position: relative; font-weight: normal; }
.pro_nav dd h4 a:before { position: absolute; content: ""; width: 11px; height: 1px; background: #ffffff; top: 19px; left: 0; opacity: 0.5; }
.pro_nav dd h4 a:hover { font-weight: bold; }
.pro_nav dl.on dt h3 a { background-color: #FF8400; font-weight: bold; }
.pro_nav dl.on dt h3 a:after { transform: rotate(45deg); -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); }
.pro_nav dl.on dd { display: block; }
.pro_con { width: 895px; float: right; }
.pro_con li { width: 421px; float: left; margin-left: 26px; margin-bottom: 26px; line-height: 0; text-align: center; }
.pro_con li > a { display: block; width: 421px; height: 289px; overflow: hidden; margin-bottom: 20px; }
.pro_con li img{display: block;width: 100%;}
.pro_con li h4 a { display: block; font-size: 14px; line-height: 18px; color: #666; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
/*sm_banner*/
.sm_banner { background: url(/images/sm_bg.jpg) no-repeat center top; height: 408px; }
.sm_banner h2 { float: left; padding-top: 165px; }
.sm_banner h2 strong { display: block; font-size: 36px; line-height: 100%; color: #fff; margin-bottom: 16px; }
.sm_banner h2 span { display: inline-block; font-size: 18px; line-height: 34px; color: #fff; width: 197px; margin-right: 4px; padding-left: 25px; box-sizing: border-box; background: url(/images/s_bg1.png) no-repeat center; }
.sm_banner h2 strong + span { margin-left: 32px; }
.sm_banner .s_tel { float: right; padding-top: 130px; }
.sm_banner .s_tel p { padding-left: 67px; background: url(/images/s_tel.png) no-repeat left 5px; }
.sm_banner .s_tel p span { display: block; font-size: 14px; line-height: 100%; color: #fff; }
.sm_banner .s_tel p strong { display: block; font-size: 36px; line-height: 100%; color: #fff; margin-top: 11px; }
.sm_banner .s_tel a { display: block; margin-left: 65px; width: 156px; height: 51px; background: #029ed9; font-size: 18px; line-height: 51px; color: #fff; text-align: center; transition: all 0.5s ease; margin-top: 40px; }
.sm_banner .s_tel a:hover { letter-spacing: 1px; }
/*news*/
.news { padding-top: 107px; padding-bottom: 86px; }
.news h2 { margin-bottom: 61px; }
.news h3 { height: 29px; margin-bottom: 35px; }
.news h3 strong { display: block; font-size: 16px; line-height: 100%; color: #2b2b2b; padding-bottom: 13px; float: left; position: relative; }
.news h3 strong:after { position: absolute; content: ""; width: 100%; height: 3px; background: #029ed9; left: 0; bottom: 0; }
.news h3 span { display: block; float: right; font-size: 12px; line-height: 24px; color: #BABBBD; text-transform: uppercase; transition: all 0.5s ease; }
.news h3 span:hover { color: #029ED9; }
.faq { width: 401px; float: right; }
.faq dl { overflow: hidden; margin-bottom: 17px; line-height: 0; }
.faq dt { width: 185px; float: left; }
.faq dt img{ width:185px;height:144px; display:block;}
.faq dd { width: 192px; float: right; padding-top: 4px; }
.faq dd h4 { font-size: 16px; line-height: 25px; color: #3f3f3f; max-height: 50px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; transition: all 0.5s ease; }
.faq dd p { font-size: 14px; line-height: 24px; color: #666; max-height: 48px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 10px 0 20px; }
.faq dd span { display: block; font-size: 12px; line-height: 100%; color: #029ed9; text-transform: uppercase; font-weight: bold; transition: all 0.5s ease; }
.faq dd span:hover { letter-spacing: 1px; }
.faq ul { margin-top: 29px; }
.faq li a { display: block; font-size: 14px; line-height: 36px; color: #3f3f3f; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding-left: 22px; position: relative; font-weight: bold; transition: all 0.5s ease; }
.faq li a:before { position: absolute; content: ""; width: 10px; height: 2px; background: rgba(63,63,63,0.3); top: 17px; left: 0; }
.faq dl:hover dd h4,.faq li:hover a { color: #029ED9; }
.news_con { width: 718px; margin-bottom: 38px; float: left; }
.news_con .hot { width: 718px; height: 306px; line-height: 0; position: relative; overflow: hidden; }
.news_con .hot img { width: 100%; transition: all 1s linear 0s; margin-top:-20%; }
.news_con .hot h4 { position: absolute; width: 100%; height: 48px; padding: 0 20px; box-sizing: border-box; left: 0; bottom: 0; font-size: 14px; line-height: 48px; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background: rgba(2,158,217,0.8); }
.news_con .hot:hover img { transform: scale(1.05) rotate(0deg) translateY(0); }
.wiki { width: 718px; float: left; }
.wiki h3 { margin-bottom: 21px; }
.wiki li { width: 322px; float: left; }
.wiki li h4 { width: 230px; float: left; font-size: 14px; line-height: 40px; color: #3F3F3F; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; transition: all 0.5s ease; }
.wiki li span { display: block; float: right; font-size: 14px; line-height: 40px; color: #C9C9C9; font-weight: normal; }
.wiki li:nth-child(2n) { float: right; }
.wiki li:hover h4 { color: #029ED9; }
/*contact*/
.contact { height: 408px; background: url(/images/contact_bg.jpg) no-repeat center top; padding-top: 125px; box-sizing: border-box; text-align: center; }
.contact h2 strong { display: block; font-size: 36px; line-height: 100%; color: #029ED9; }
.contact h2 span { display: block; font-size: 24px; line-height: 100%; color: #333; margin: 18px 0 44px; font-weight: normal; }
.contact h2 i { display: block; width: 180px; height: 51px; background: #029ED9; margin: 0 auto; font-size: 18px; line-height: 51px; color: #fff; transition: all 0.5s ease; font-weight: normal; }
.contact h2 i:hover { letter-spacing: 1px; }
/*links*/
.links { height: 76px; background: #F9F9F9; overflow: hidden; }
.links strong,.links a { display: block; float: left; font-size: 14px; line-height: 76px; color: #333; transition: all 0.5s ease; }
.links strong:hover,.links a:hover { color: #029ED9; }
.links a { margin-right: 60px; }
