@charset "utf-8";
* {margin: 0;padding: 0;}
body {background: #fff;}
body,article,section,h1,h2,h3,h4,h5,h6,hgroup,p,a,ul,ol,li,em,div,small,span,footer,canvas,figure,figcaption,form,input,var { margin: 0; padding: 0; font-weight: normal;font-style: normal;}
html,
body {
    /*position:relative;*/
    width: 100%;
    /*height:100%;*/
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    font: 14px/1.5 '微软雅黑', 'Microsoft Yahei', 'Simsun';
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    /*-webkit-user-select:none;*/
    text-decoration: none;
}
ul,li {list-style-type: none; margin: 0; padding: 0}
ul,ol {list-style: none;}
a {text-decoration: none;color: #666}
a:hover,a:active {outline: 0;}

img {
    width: auto\9;
    height: auto;
    max-width: 100%;
    vertical-align: middle;
    border: 0;
    -ms-interpolation-mode: bicubic;
}
.clearfix::after { display: block;line-height: 0; content: ""; clear: both}
.fr {float: right}
.fl {float: left}
.tac {text-align: center;}
.tar {text-align: right;}
.tal {text-align: left;}
input:focus,button:focus,textarea:focus,select:focus {outline: 0;}
i,em {font-style: normal;}
button {font-family: "微软雅黑", "Arial";outline-style: none;}
input[type=checkbox] {vertical-align: -2px;_vertical-align: -1px}
/* 
@media screen and (-webkit-min-device-pixel-ratio: 0)and (max-device-width:768px) {
    body p {
        max-height: 999999px
    }
} */
audio,
map area {outline: none}
* {-webkit-text-size-adjust: 100%}
body{
    font-size: 14px;
    font-weight: normal;
    text-decoration: none;
    font-family: 微软雅黑;
    color: #222222;
}
/*common*/
.banner .bannerContent,.elemWrap .elemWrapContent,.middleWrap .middleWrapContent,.dataWrap .dataWrapContent,.newsListWrap,.footerContent,.copyright {max-width: 1440px;margin: 0 auto;position: relative;}
/*nav*/
.nav{width: 100%;position: fixed;background: #272d43;z-index:999;transition: box-shadow 0.3s ease-in-out;}
.nav.scrolled {box-shadow: 0px 5px 8px rgba(0, 0, 0, 0.2);}
.nav .navContent {height:82px;padding:20px 0;max-width:1440px;margin: 0 auto;position: relative;}
.nav .navContent .navTel {display:block; padding:10px; text-align: center; background:#fff url(../images/tel.png) no-repeat 10px; border-radius: 3px;-webkit-border-radius:3px; -moz-border-radius:3px; -ms-border-radius:3px; -o-border-radius:3px; text-indent: 20px;position: absolute;right:0;top:40px;}
.nav .navContent .logo {width:232px;height:82px;background: url(../images/logo.png);text-indent: -9999px;}
.nav .navContent .menu ul {padding:0 60px}
.nav .navContent .menu ul li {display: inline-block;height:82px;line-height:82px;min-width:60px;margin:0 20px;}
.nav .navContent .menu a {color:#48b0ee;font-size:18px;width:100%;height: 100%;display: block;}
.nav .navContent .menu a:hover,.nav .navContent .menu a.on{color:#fff}
/*banner*/
.banner {width: 100%;min-height: 700px;margin:0 auto;background: url(../images/banner.jpg) no-repeat center top;background-size: cover;position: relative;overflow: hidden;}
.banner .bannerContent .bannerTitle { position: absolute; top:220px; left: 70px; width: 445px; height: auto; animation: flyOut 1s ease-in-out forwards; -webkit-animation: flyOut 1s ease-in-out forwards;}
.banner .bannerContent .bannerTitle span {font:bold 52px/1.5 '微软雅黑', 'Microsoft Yahei', 'Simsun';color: #333}
.banner .bannerContent .bannerText { position: absolute; top: 400px; left: 70px; width: 488px; height: auto; animation: flyOut 1.3s ease-in-out forwards; -webkit-animation: flyOut 1.3s ease-in-out forwards;}
.banner .bannerContent .bannerText span{font-size: 18px;color:#333}
.elemWrap {width: 100%;height:125px;margin: 0 auto;background: url(../images/bannerUnder.jpg) no-repeat center top;background-size: cover;position: relative;overflow: hidden;}
.elemWrap .elemWrapContent {display: flex;line-height: 21px;padding-top:20px;}
.elemWrap .elemWrapContent .elemDiv{ flex:1; opacity: 0; margin: 0 2%; }
.elemWrap .elemWrapContent .elemDiv a { width:100%; height:100%;display: block; transition: transform 0.3s ease-out; -webkit-transition: transform 0.3s ease-out; -moz-transition: transform 0.3s ease-out; -ms-transition: transform 0.3s ease-out; -o-transition: transform 0.3s ease-out; }
.elemWrap .elemWrapContent .elemDiv a:hover { transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); }
.elemWrap .elemWrapContent .elemDiv .elemIcon{width:44px;height:46px;display: inline-block;}
.icon01 {background: url(../images/em01.png) no-repeat center; background-size: contain;}
.icon02 {background: url(../images/em02.png) no-repeat center; background-size: contain;}
.icon03 {background: url(../images/em03.png) no-repeat center; background-size: contain;}
.elemWrap .elemWrapContent .elemDiv .elemText {width:70%;padding-left:14px;display:inline-block;}
.elemWrap .elemWrapContent .elemDiv .elemText span {width:100%;display: block;color:#333;}
.elemWrap .elemWrapContent .elemDiv .elemText span h1 {font-size: 18px;font-weight: bold;}
.elemWrap .elemWrapContent .elemDiv .elemText span:last-child{color:#666;font-size:16px;margin-top:12px}
/*middle*/
.middleWrap {background-color: #f5f8ff;}
.middleWrapContent {padding: 5% 0;}
.middleWrap h1 {word-wrap: break-word; -webkit-text-size-adjust: 100%;text-align: center;font-weight: bold;font-size: 33px;}
.middleWrap .middleWrapContent .bi { margin-top:5%;display: flex; background: #fff; border-radius:3px; -webkit-border-radius:3px ; -moz-border-radius:3px ; -ms-border-radius:3px ; -o-border-radius:3px ; }
/* .middleWrap .middleWrapContent .bi .biCol{ flex: 1; padding:3.5vw 0 15vw 0; box-sizing: border-box;transition: background-image 0s linear, transform 0.3s ease-out, opacity 0.2s ease-out;border-right: 1px solid #f5f9ff;} */
.middleWrap .middleWrapContent .bi .biCol{ flex: 1; padding:3.5vw 0 15vw 0; box-sizing: border-box;position:relative;border-right: 1px solid #f5f9ff;overflow: hidden;}
.middleWrap .middleWrapContent .bi .biCol:last-child {border: 0;}
.bi01 {background: url(../images/bi01.png) no-repeat center 90%; background-size: 90%;}
.bi02 {background: url(../images/bi02.png) no-repeat center 90%; background-size: 90%;}
.bi03 {background: url(../images/bi03.png) no-repeat center 90%; background-size: 90%;}
.bi04 {background: url(../images/bi04.png) no-repeat center 90%; background-size: 90%;}
.middleWrap .middleWrapContent .bi .biCol::before { z-index:2;content:''; inset:0; position:absolute; background: url(../images/biColHoverBg.jpg) no-repeat center/cover; opacity: 0; transition: opacity 0.5s ease-in-out; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; -ms-transition: opacity 0.5s ease-in-out; -o-transition: opacity 0.5s ease-in-out; }
.middleWrap .middleWrapContent .bi .biCol:hover::before { opacity: 1; }
.middleWrap .middleWrapContent .bi .biCol div {text-align: center;position:relative;z-index:3}
.middleWrap .middleWrapContent .bi .biCol .biColTitle h2 {font-weight: bold;font-size: 22px;height:33px;line-height: 33px;}
.middleWrap .middleWrapContent .bi .biCol .biColText {font-size:12px;height:30px;line-height:30px;}
.middleWrap .middleWrapContent .bi .biCol .biColMore {padding:20px}
.middleWrap .middleWrapContent .bi .biCol .biColMore a { background:#0069ea; color:#fff; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; font-size: 14px;text-align: center;line-height:46px;margin:0 30%;display: block;}
/*data*/
.dataWrap {background:url(../images/dataWrapBg.jpg) no-repeat center bottom;background-size: cover;padding:2vw 0;position:relative}
.dataWrap .dataWrapContent .dataItems {padding:5% 40% 6.25vw 8%;}
.dataWrap .dataWrapContent .dataItems div { width:100%; display: block;}
.dataWrap .dataWrapContent .dataItems .dataItemsTitle {font-weight: bold;font-size: 33px;}
.dataWrap .dataWrapContent .dataItems .dataItemsText {font-size: 16px;}
.dataWrap .dataWrapContent .dataItems .dataItemsDatas{display: flex;padding:3.6vw 0}
.dataWrap .dataWrapContent .dataItems .dataItemsDatas .dataItemsData { max-width:100%;min-height: 30px;box-sizing: border-box; position: relative}
.dataWrap .dataWrapContent .dataItems .dataItemsDatas .dataItemsData span {width:100%;display: block;font-size:18px;color:#333}
.dataWrap .dataWrapContent .dataItems .dataItemsDatas .dataItemsData span:first-child{font-weight: bold;font-size:24px;}
.dataWrap .dataWrapContent .dataItems .dataItemsDatas .dataItemsData span b {font-size:44px;color:#0069ea;margin-right: 3px;}
.dataWrap .dataWrapContent .dataItems .dataItemsDatas .dataItemsData span b.numCounter {opacity: 0;transform: translateY(30px);transition: opacity 0.5s ease, transform 0.5s ease;}
.dataWrap .dataWrapContent .dataItems .dataItemsDatas .dataItemsData span b.numCounter.visible { opacity: 1; transform: translateY(0); }
.dataWrap .dataWrapContent .dataItems .dataItemsMore {background: url(../images/dataBg.png) no-repeat -1vw center;background-size: 100% 100%;padding:3.125vw}
.dataWrap .dataWrapContent .dataItems .dataItemsMore span {width:100%;min-height:30px;display: block;font-size: 13px;line-height:40px;color:#666;}
/*news*/
.newsTab {display: flex;justify-content: right;margin:40px 0 20px 0;}
.tab {padding: 10px 20px;cursor: pointer;border-radius: 20px;margin: 0 10px;font-size: 16px;transition: all 0.3s ease-in-out;}
.tab.active {background-color: #0f42a1; color: white;}
.tab.active a{color:#fff}
.newsListWrap { height:500px;padding:20px 0;overflow: hidden; margin: 0 auto;position: relative;}
.newsList { display: flex;width: 4320px; transition: transform 0.5s ease-in-out;overflow: hidden;}
.newsItem { width: 1440px;flex-shrink: 0;text-align: center;display: flex;justify-content: space-around;}
.newsItem a {flex: 1;width:400px;background-color: #fff;border-radius: 8px;padding: 20px;margin:20px;}
.newsItem a:hover {transform: translateY(-5px);box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);}
.newsItem a:hover h2 {color:#0069ea}
.newsItem a img { width: 100%; height: 100%; display:block; transition: transform 0.3s ease; -webkit-transition: transform 0.3s ease; -moz-transition: transform 0.3s ease; -ms-transition: transform 0.3s ease; -o-transition: transform 0.3s ease; }
.newsItem a:hover img { transform: scale(1.1); border-radius:3px ; }
.newsItem a h2 {width:100%;display:block;font-size: 24px;color: #333;padding-top:10px;margin-bottom: 10px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.newsItem a p {font-size: 14px;color: #666;line-height: 1.5;max-height:43px;overflow: hidden;margin-bottom: 10px;text-align: left;word-break: break-word; white-space: normal;text-overflow: ellipsis;text-overflow: ellipsis;display: -webkit-box; line-clamp: 2;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.newsItem a span { display:block; float:left; font-size: 12px; color: #999; border:1px solid #e5e5e5; padding: 5px 10px; border-radius: 3px; overflow: hidden; position:relative; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; }
.newsItem a span:first-child,.newsItem a span:last-child { border-radius: 0 ;border:0;padding:0; -webkit-border-radius: 0 ; -moz-border-radius: 0 ; -ms-border-radius: 0 ; -o-border-radius: 0 ; background-color: transparent;}
.newsItem a span:last-child {float: right;font-size: 16px;}
.newsItem a span:last-child::before{ content: '→'; transition: left 0.5s ease; -webkit-transition: left 0.5s ease; -moz-transition: left 0.5s ease; -ms-transition: left 0.5s ease; -o-transition: left 0.5s ease; }
/*footer*/
.footer {background:#272d43;padding:30px 0 10px 0;}
.footerContent {display:flex;color:#fff;font-size: 16px;}
.footerContent .footerItem {flex:1;display: block;padding:1vw 2.2vw;box-sizing: border-box;}
.footerContent>.footerItem:first-child {text-indent: -999px;background: url(../images/logo.png) no-repeat center left;border-right:1px solid #383c4b}
.footerContent .footerItem .footerItem {padding:0}
.footerContent .footerItem span {width:100%;min-height:40px;line-height:38px;display: block;margin: 0px;}
.footerContent .footerItem span a {font-size:14px;}
.footerContent .footerItem span a:hover {color:#fff}
.footerContent .footerItem span:first-child a {font-size:16px;color:#fff;margin:10px 0;}
.footerContent .footerItem:last-child span:nth-child(odd) {font-size:14px;color:#666}
.copyright {padding-top:30px;text-align: center;color:#666}
.copyright span {width:100%;min-height:30px;display: block;}
.copyright span a {color:#666;}
.copyright span a:last-child{margin-left:10px}
.copyright span p {margin:5px;}
.copyright a img {width:16px;margin:0 5px}
/*inner*/
.bannerInner {min-height: 400px;margin:0 auto;background-size: cover;}
.bannerAbout {background: url(../images/bannerAbout.jpg) no-repeat center bottom;}
.bannerProduct {background: url(../images/bannerProduct.jpg) no-repeat center bottom;}
.bannerContact {background: url(../images/bannerContact.jpg) no-repeat center bottom;}
.bannerSolution {background: url(../images/bannerSolution.jpg) no-repeat center bottom;}
.bannerNews {background: url(../images/bannerNews.jpg) no-repeat center bottom;}
.banner .bnInnerTitle { position: absolute; top:220px; left: 70px; width: 445px; height: auto; animation: flyOut 1s ease-in-out forwards; -webkit-animation: flyOut 1s ease-in-out forwards;}
.banner .bnInnerTitle span {font:bold 32px/1.5 '微软雅黑', 'Microsoft Yahei', 'Simsun';color: #fff}
.banner .bnInnerText { position: absolute; top: 300px; left: 70px; width: 488px; height: auto; animation: flyOut 1.3s ease-in-out forwards; -webkit-animation: flyOut 1.3s ease-in-out forwards;}
.banner .bnInnerText span{font-size: 18px;color:#fff}
.middleWrapContent h1 p{color:#0069ea;font-weight: bold;font-size: 22px;}
/*about*/
.aboutText {padding:2vw 0;display: block;font-size: 0.85vw;line-height: 1.65vw;}
.aboutText p {text-indent: 2em;}
.cultureBg {min-height: 500px;background:url(../images/cultureBg.jpg) no-repeat center/cover}
.cultureWrap {display: flex;}
.cultureWrap .cultureItem {flex:1 ;text-align: center;padding:3vw 2vw 0;margin:2vw;background:#fff;min-height:150px}
.cultureWrap .cultureItem .cultureText { margin:20px 0;font-size: 14px;color:#666 }
.cultureWrap .cultureItem .cultureImg { width:100px; height:100px; display: flex; align-items: center; justify-content: center; position:absolute; left:50%; transform: translate(-50%); background:#0069ea; box-sizing: border-box; border-radius:50% ; -webkit-border-radius:50% ; -moz-border-radius:50% ; -ms-border-radius:50% ; -o-border-radius:50% ; border:5px solid #fff; -webkit-transform: translate(-50%); -moz-transform: translate(-50%); -ms-transform: translate(-50%); -o-transform: translate(-50%); }
.cultureWrap .cultureItem .cultureImg img {vertical-align: middle;}
/*contact*/
.contactBg {background:url(../images/contactBg.jpg) no-repeat center bottom;background-size: cover;}
.contactWrap {max-width:1440px;height: 700px;}
.contactInfo {width:500px;padding:3vw;margin-top:2.6vw}
.contactInfo dl {font-size:0.88vw}
.contactInfo dl dt {margin-bottom:20px}
.contactInfo dl dt h1 {font-size:1.5vw;line-height:100px;}
.contactInfo dl dt:nth-child(2) {text-indent: 2em;}
.contactInfo dl dd {min-height: 30px;line-height: 50px;}
#map {width:100%;min-height:260px;margin-top:40px;}
/*solution*/
.solutionWrap,.advatageWrap,.newsInnerListWrap {margin-top:3vw;}
.solutionWrap .solutionItem {display: flex;width:100%;}
.solutionWrap .solutionItem .solutionItemImg,.solutionWrap .solutionItem .solutionItemText {width:50%;display:block;flex:1;overflow: hidden;}
.solutionWrap .solutionItem>div:first-child {padding-right: 6%}
.solutionWrap .solutionItem .solutionItemText h2 {margin:50px 0 10px 0}
.solutionWrap .solutionItem .solutionItemText h3 { margin-bottom:20px;font-size:14px;}
.solutionWrap .solutionItem .solutionItemText div {color:#666;font-size:15px;line-height: 26px;}
.advatageWrap {display: flex;flex-wrap: wrap}
.advatageWrap .advatageItem {flex:1 1 50%;box-sizing: border-box;display: flex;padding:60px 60px 0 60px;}
.advatageItemNum {padding-right:30px;}
.advatageItemNum img {width:80px;height:80px;display: block}
.advatageItemTextTitle {font-weight: bold;font-size: 16px;line-height:34px;}
.advatageItemTextSum {font-size:14px}
/*product*/
.productWrap {display: flex;flex-wrap: wrap;padding:3vw 120px;}
.productWrap .productItem { flex:1; position: relative;width: 236px; min-height: 304px; margin: 0 32px 13px 32px; text-align: center; transition: all .3s; cursor: pointer; }
.productWrap .productItem:hover {box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);border-radius: 20px;}
.productWrap .itemHover:hover { opacity: 0; transition:opacity .1s ; -webkit-transition:opacity .1s ; -moz-transition:opacity .1s ; -ms-transition:opacity .1s ; -o-transition:opacity .1s ; }

.animWrap {width: 236px;height: 159px;}
.animWrap .proIconWrap {position: absolute; top: 13px; left: 45px; width: 146px; height: 146px;}
.animWrap .proBg {display: block;position: absolute; top: 0; left: 0; z-index: 0; width: 146px; height: 146px; border-radius: 50%;transform-origin: center center; transition: all .3s; }
.animWrap .proIcon{position: absolute; top: 50%; left: 50%; margin-left: -45px; margin-top: -45px; width: 90px; height: 70px;transition: all .1s;}
.productWrap .productItem .pbg01 {background-color: #27c9f8;background: linear-gradient(145deg, #06e5f8, #3eb5f8)}
.productWrap .productItem:hover .pbg01{background:linear-gradient(90deg, #3eb5f8, #06e5f8); }
.productWrap .productItem .pbg02 { background-color: #64aaf2; background: linear-gradient(145deg, #64edea, #64aaf2)}
.productWrap .productItem:hover .pbg02 { background: linear-gradient(90deg, #64edea, #64aaf2)}
.productWrap .productItem .pbg03 { background-color: #f8788b; background: linear-gradient(145deg, #f8c84c, #f8788b)}
.productWrap .productItem:hover .pbg03 { background: linear-gradient(90deg, #f8c84c, #f8788b)}
.productWrap .productItem .pbg04 { background-color: #f65589; background: linear-gradient(145deg, #f26768, #f65589)}
.productWrap .productItem:hover .pbg04 { background: linear-gradient(90deg, #f26768, #f65589)}
.productWrap .productItem .pbg05 { background-color: #c467ff; background: linear-gradient(145deg, #fe80fb, #c467ff)}
.productWrap .productItem:hover .pbg05 { background: linear-gradient(90deg, #fe80fb, #c467ff)}
.productWrap .productItem .pbg06 { background-color: #38cf7a; background: linear-gradient(145deg, #32dab7, #38cf7a)}
.productWrap .productItem:hover .pbg06 { background: linear-gradient(90deg, #32dab7, #38cf7a)}
.productWrap .productItem .pbg07 {background-color: #b376ff; background: linear-gradient(145deg, #44aaf8, #b376ff)}
.productWrap .productItem:hover .pbg07 { background: linear-gradient(90deg, #44aaf8, #b376ff)}
.productWrap .productItem .pbg08{ background-color: #6cbaf8;background: linear-gradient(145deg, #7ee1f9, #6cbaf8)}
.productWrap .productItem:hover .pbg08 {background: linear-gradient(90deg, #7ee1f9, #6cbaf8)}
.productWrap .productItem:hover .proBg{ top:-13px; left: -45px; width: 236px; height: 159px; border-radius:20px 20px 0 0; -webkit-border-radius:20px 20px 0 0; -moz-border-radius:20px 20px 0 0/20px 20px 0 0; -ms-border-radius:20px 20px 0 0/20px 20px 0 0; -o-border-radius:20px 20px 0 0/20px 20px 0 0; overflow: hidden;}

.animWrap .proText {position:relative;font-size: 16px;color:#fff;line-height: 1;padding-top:35px;}
.animWrap .proDesc {position: relative;font-size: 13px; color: #fff; line-height: 1.8; padding:10PX 10px 0 10px;}
.animWrap .proMore {position: relative; display: inline-block; width: 100px; height: 30px; line-height: 30px; border-radius: 15px; font-size: 12px; margin-top: 10px; border: solid #fff 1px; background: #fff;overflow: hidden;color:#333}
.productItem .elHover{opacity: 0;transition: opacity .1s;}
.productItem:hover .elHover{opacity: 1;}
.productItem .proName {position: absolute; top: 190px; left: 0; width: 100%; font-size: 16px; color: #333; line-height: 1; transition: opacity .3s;text-align: center;display: block;}
.productItem:hover .proName,.productItem:hover .proIcon{opacity: 0;}
.productItem .proDescMore {padding-top: 18px; padding-left: 10px; padding-right: 10px; line-height: 1.8; font-size: 13px; color: #666}
/*newsInnerList*/
.newsInnerListWrap {display: flex;flex-wrap: wrap}
.newsInnerListWrap .newsListItem {flex:0 0 100%; ;display:block;padding:20px;box-sizing: border-box;border-bottom:1px solid #e5e5e5;}
.newsInnerListWrap .newsListItem:hover { transform: translateY(-5px); box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); border-radius:3px ; -webkit-border-radius:3px ; -moz-border-radius:3px ; -ms-border-radius:3px ; -o-border-radius:3px ; }
.newsInnerListWrap .newsListItem .newsListItemTitle h4 {font-size: 16px;line-height: 24px;font-weight: bold;}
.newsInnerListWrap .newsListItem .newsListItemTitle span {position:absolute;top:20px;right:20px}
.newsInnerListWrap .newsListItem:hover .newsListItemTitle h4 {color:#0069ea}
.newsInnerListWrap .newsListItem .newsListItemTitle span {color:#999;line-height: 24px;font-size: 14px;}
.newsInnerListWrap .newsListItem .newsListItemDesc {color:#666;line-height: 24px;font-size: 14px;margin:10px 0}
.newsInnerListWrap .newsListItem .newsListItemTag { font-size: 12px;line-height: 26px;display: inline-block; color:#999; padding:0 8px; border:1px solid #e5e5e5; border-radius:3px ; -webkit-border-radius:3px ; -moz-border-radius:3px ; -ms-border-radius:3px ; -o-border-radius:3px ; }
.newsInnerListWrap .newsListItem:hover .newsListItemTag {background:#0069ea;color:#fff; border:1px solid #0069ea}
.pageInfo {width:100%;padding:3vw 0;text-align: center;}
.pageInfo span {margin:2px 10px;padding:0 10px;line-height: 24px;display: inline-block;}
.pageInfo span a {width: 100%;display: block;}
.pageInfo span a.on,.pageInfo span:hover a,.moreNews span a:hover {color:#0069ea}
.newsBox .newsBoxTitle h1 {font-size: 22px;line-height: 24px;padding-top:24px;}
.newsBox .newsBoxTime {font-size: 14px;color:#999;margin:30px 0;text-align: center;}
.newsContent {border-top: 1px solid #ebebeb;border-bottom: 1px dashed #ebebeb;margin-bottom:30px;padding:30px 0;color:#666;line-height: 2.8;}
.moreNews {width:100%}
.moreNews span {width:100%;height:40px;display:block;line-height: 40px;}
.moreNews span:first-child a::before {content: "上一篇：";}
.moreNews span:last-child a::before {content: "下一篇：";}
/*productContent*/
.productContentWrap {width:100%;position: relative;padding: 3vw 0}
.productContent {background:#fff;box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);padding:2vw;width:100%;box-sizing: border-box;display: flex;}
.productContent .proImgBox {max-width:600px;height: 400px;overflow: hidden;flex:1;}
.productContent .proImgBox img {width:100%;height: 100%;}
.productContent .proContent {flex:1;padding-left:20px}
.productContent .proContent h1,.productContent .proContent h2,.productContent .proContent h3 {font-size: 20px;line-height: 50px;}
.productContent .proContent div,.productContent .proContent p {font-size: 14px;color:#666;line-height: 36px;}
.position {width:1440px;margin:0 auto;padding:20px 0;}
/*media*/
.hamburger { display: none; flex-direction: column; justify-content: space-between; width: 30px; height: 21px; background: transparent; border: none; cursor: pointer; position: absolute; top: 10px; left: 10px; z-index: 10;}
.hamburger span { display: block; width: 100%; height: 3px; background-color: #fff;transition: all 0.3s ease;}
.hamburger.active span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px);}
.hamburger.active span:nth-child(2) {opacity: 0;}
.hamburger.active span:nth-child(3) {transform: rotate(-45deg) translate(5px, -5px);}
/* ydd */
@media (max-width: 768px) {
    /*common*/
    .nav .navContent {flex-direction: column; align-items: center; padding:0}
    .nav .navContent .logo { margin-left:20vw;background:url(../images/logo.png) no-repeat center/70%}
    .menu ul { display: none; width: 100%; }
    .menu ul.active { display: block;}
    .menu li {width: 100%; text-align: center;}
    .nav .navContent .navTel {position: fixed;background: none;background:url(../images/mediaTel.png) no-repeat  left center,linear-gradient(135deg, #4e68b6 0%, #43c2ff 100%);background-size: contain;right: 0;top: 50%;transform: translateY(-50%);width: 20px; height: 20px; border-radius: 25px 0 0 25px;border-right:transparent;display: flex; align-items: center;justify-content: center;font-size: 0;cursor: pointer;transition: width 0.4s ease, border-radius 0.4s ease;white-space: nowrap; overflow: hidden;-webkit-border-radius: 25px 0 0 25px;-moz-border-radius: 25px 0 0 25px; -ms-border-radius: 25px 0 0 25px; -o-border-radius: 25px 0 0 25px;}
    .nav .navContent .navTel.expanded {width: 140px;font-size: 16px; padding-left: 15px; color:#fff;border-radius: 25px 0 0 25px;-webkit-border-radius:25px 0 0 25px;-moz-border-radius:25px 0 0 25px;-ms-border-radius:25px 0 0 25px;-o-border-radius:25px 0 0 25px;}
    .bannerContent { text-align: center;}
    .bnInnerText { font-size: 14px;}
    .middleWrapContent { padding: 20px;}
    .cultureWrap { flex-direction: column;}
    .cultureItem { margin-bottom: 20px;}
    .hamburger {display: flex;}
    .nav .navContent .menu ul{padding:0}
    .nav .navContent .menu ul li {margin:0 auto;height: 50px;line-height: 50px;}
    .banner,.bannerInner {min-height:250px}
    .banner .bnInnerTitle,.banner .bnInnerText { width: auto;  padding-left: 2vw;}
    .banner .bannerContent .bannerTitle,.banner .bnInnerTitle {top:120px;}
    .banner .bannerContent .bannerTitle span,.banner .bnInnerTitle span {font-size: 5vw;}
    .banner .bannerContent .bannerText {width:auto;padding:0 10px;}
    .banner .bannerContent .bannerText span{font-size: 3vw;}
    .banner .bannerContent .bannerText {top:190px}
    .banner .bnInnerText {top:180px}
    .footerContent{display: none;}
    .copyright{padding-top:0}
    .copyright span a {width:100%;display: block;}
    .copyright span a:last-child{margin-left:0}
    /*index*/
    .elemWrap .elemWrapContent .elemDiv a {display: flex;flex-direction: column;}
    .elemWrap .elemWrapContent .elemDiv a .elemIcon,.elemWrap .elemWrapContent .elemDiv .elemText {width:100%;display: block;box-sizing: border-box;text-align: center;padding:5px 0 5px 0}
    .elemWrap .elemWrapContent .elemDiv .elemText span h1 {font-size: 16px;}
    .elemWrap .elemWrapContent .elemDiv .elemText span:last-child {display: none;}
    .middleWrap .middleWrapContent .bi {display: flex;flex-direction: column;}
    .middleWrap .middleWrapContent .bi .biCol {min-height:300px;background-size: 40%;border-bottom:1px solid #dedede}
    .middleWrap h1 {font-size: 7vw;}
    .dataWrap .dataWrapContent .dataItems .dataItemsDatas .dataItemsData span b {font-size: 7vw;}
    .dataWrap .dataWrapContent .dataItems .dataItemsDatas .dataItemsData span:first-child{font-size: 5vw;}
    .dataWrap .dataWrapContent .dataItems .dataItemsDatas .dataItemsData span {font-size: 3vw;}
    .dataWrap .dataWrapContent .dataItems {padding:5% 0% 6.25vw 4%;}
    .dataWrap .dataWrapContent .dataItems .dataItemsMore {padding:10px 0}
    .dataWrap .dataWrapContent .dataItems .dataItemsMore span {width:95%;padding:5px 0 5px 10px;box-sizing: border-box;line-height: 24px;}
    /*about*/
    .aboutText {font-size:14px ;}
    .aboutText p {line-height: 10vw;}
    .cultureWrap .cultureItem {margin-bottom:12vw}
    /*product*/
    .position {width:auto;margin:0 auto;padding:20px 0;}
    .productWrap{display: flex;flex-wrap: wrap;padding:3vw 0}
    .productWrap .productItem {flex:1 1 35%;box-sizing: border-box;min-height: auto;width:35%;margin:0px 5px 10px 5px;overflow: hidden;}
    .animWrap {width: auto;}
    .animWrap .proIconWrap {width:100px;height: 100px;left:23%}
    .animWrap .proBg {width:auto;min-width: 100px;height:auto;min-height: 100px;}
    .animWrap .proIcon {width:60px;left:65%;top:65%}
    .productItem .proName {top:130px}
    .animWrap .proDesc,.productItem .proDescMore{font-size: 12px;}
    /*solution*/
    .advatageWrap,.solutionWrap,.solutionWrap .solutionItem {display: flex;flex-direction: column;}
    .solutionWrap .solutionItem {flex:1}
    .solutionWrap .solutionItem .solutionItemImg, .solutionWrap .solutionItem .solutionItemText{width:100%}
    .solutionWrap .solutionItem:last-child .solutionItemImg {display: none;}
    .advatageWrap .advatageItem {padding:30px 10px 10px 10px}
    .advatageItemNum img {width: 30vw;height: auto;}
    
    /*contact*/
    .contactInfo {width: auto;margin:0 auto;padding:5vw 3vw}
    .contactInfo dl {font-size: 4vw;}
    .contactInfo dl dt h1 {font-size: 5vw;line-height: 60px;}
    #map {width:100%}
}

/*am*/
.flyOut { animation: flyOut 1s ease-in-out forwards; -webkit-animation: flyOut 1s ease-in-out forwards; }
.fadeInScale { transform: scale(0.5); animation: fadeInScale .6s ease-in-out forwards; -webkit-animation: fadeInScale .6s ease-in-out forwards; -webkit-transform: scale(0.5); -moz-transform: scale(0.5); -ms-transform: scale(0.5); -o-transform: scale(0.5); }  
@keyframes flyOut {
    0% {
        left: 50%;
        transform: translateX(-50%);
        opacity: 0;
    }

    100% {
        left: 0;
        transform: translateX(0);
        opacity: 1;
    }
}
@keyframes fadeInScale {
    0% {
        opacity: 0;
        transform: scale(0.5);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}