Abody,div,dl,dt,dd,Substrate condition,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0; font-family:'Microsoft YaHei';}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}img{max-width:100%}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:400}ul{list-style-type:disc;list-style-position:outside;padding-left:20px}ol{padding-left:18px}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}q:before,q:after{content:''}abbr,acronym{border:0}.row:after,.row:before{display:table;content:" ";clear:both}.row{margin-right:0;margin-left:0}input,textarea{font-family:Arial,'Microsoft YaHei',sans-serif}::-webkit-input-placeholder{color:#939393;font-family:Arial,'Microsoft YaHei',sans-serif;opacity:1}::-ms-input-placeholder{color:#939393;font-family:Arial,'Microsoft YaHei',sans-serif;opacity:1}::placeholder{color:#939393;font-family:Arial,'Microsoft YaHei',sans-serif;opacity:1}.clearfix:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}.clearfix{display:inline-block}* html .clearfix{height:1%}.clearfix{display:block}.container{margin-left:auto;margin-right:auto;padding-right:15px;padding-left:15px;box-sizing:border-box}@media (min-width: 768px){.container{width:750px}}@media (min-width: 992px){.container{width:970px}}@media (min-width: 1230px){.container{width:1200px}}
/*HEADER*/

.clear {
   clear: both;
   display: block;
   overflow: hidden;
   visibility: hidden;
   width: 0;
   height: 0;
}
html{background-color:#ddd;}
body{font-size:16px; color:#646464; overflow-x: hidden; min-height:100vh; max-width:2560px; margin:auto !important;;}
input{padding:0 10px !important;}
input:-internal-autofill-selected {background-color:#fff !important;}
select:focus-visible{outline:0 solid #fff}
input:focus-visible{outline:0 solid #fff}
textarea:focus-visible{outline:0 solid #fff}
a{text-decoration:none; cursor:pointer;}
a:link, a:visited{color:#228dac}

p.title{color:#228dac; font-size: 40px; min-height: 70px; border-bottom: 2px solid; height: unset;}
nav{position:relative;height:100%;z-index:98; float:left; margin-left:100px; display:block;}
ul{list-style-type: none; font-size:16px; color:#228dac; font-weight:400;}
ul li{float:left; padding:0 30px;}
header ul li{white-space:nowrap;}
footer ul li{white-space:nowrap;}
.inner{background-color:#fff;}
.inner .topBanner{background-size:cover; position: relative; z-index: 12;}
.left{float:left;}
.right{float:right;}
.mobile{display:none;}
.invisible{opacity: 0;}
.visible{animation: fadeInUp 1000ms; opacity: 1 !important;}
.btnWhite{ min-width:240px; width:fit-content; height:64px; box-shadow: 3px 6px 6px rgba(0,0,0,0.2); float:left; cursor:pointer; padding:18px 40px; color:#228dac; font-size:22px;background-color:#fff;}
.pro_more{float:none; margin:50px auto 0}

.btnWhite a{display:flex; justify-content:center; align-items:center}
.btnWhite p{padding:0; margin:0; float:left;}
.btnWhite p.triangle{margin:2px 0 0 8px;}
.triangle{margin: 8px; border-left: 8px solid #228dac; border-top: 8px solid transparent; border-bottom: 8px solid transparent;}
.btnWhite:hover{background-color:#228dac; transition: 0.5s;}
.btnWhite:hover p{color:#fff;}
.btnWhite:hover p.triangle{ border-left: 8px solid #fff;}
.zero{padding-left:0 !important; padding-right:0 !important;}
.zeroMagrin{margin-left:0 !important; margin-right:0 !important;}
.delay2s{animation:fadeInUp 2000ms;;}
.delay4s{animation-delay:4s; -webkit-animation-delay:4s;}
header{background-color: #fff; width: 100%; height: 80px; z-index: 1000;  position: fixed; top: 0; padding:15px 30px; box-shadow: 2px 2px 2px rgba(0,0,0,0.1); max-width:2560px;}
header .logo{z-index:9}
header .logo img{position:relative;float:left;transition:all ease 0.3s;-webkit-transition:all ease 0.3s; height:54px ;}
header .btnMenu{display:none; width:30px;height:52px;position:relative;padding-top:11px;cursor:pointer;z-index:99;transition: open ease 0.3s;-webkit-transition: open ease 0.3s;top:1.5%;float:left;}
header .icon{ position:absolute; top:6px; right:0;}
header .itemBox{float:right; margin:0 ;}
header .btnSearchBox{display:none;}
.searchBox{float:right;background:#fff;}
.searchBox{position:relative;display:inline-block;  border:1px solid #eeeeee; vertical-align: top; margin-left:30px}
.searchBox input {height: 40px;  border:0; font-size: 14px;float: left;padding:0 20px;}
.searchBox form {float:right; border-radius:0; font-size:14px;}
.searchBox select {height:40px; border:0; float:right;}
.searchBox select option {width:64px;}
.searchBox .searchBtn {height: 40px; padding: 5px 20px; font-size: 18px; cursor: pointer; box-sizing: border-box; background-color:#228dac; float:right; margin-left: 20px; border:0}
.searchBox .searchBtn:hover {background-color:#0095da;}
.searchBox .searchBtn img{ height:30px; width:30px;}
header .btnRFQ{ float:left; height: 40px; padding:0 30px;}
header .btnRFQ a .btnIcon{float:left; background-position:top; background-image:url(../images/header-ico-RFQ.png);background-repeat:no-repeat; background-size:90%; height:30px; width:30px; margin:5px}
header .btnRFQ:hover a .btnIcon{background-position:bottom;}
header .btnRFQ a p{float:left;color:#228dac; font-size:16px; padding:10px 0; font-weight:600;}
header .btnRFQ:hover a p{color:#0095da}
header .btnLang{ float:left; height: 40px;}
header .btnLang a .btnIcon{float:left;  height:30px; margin:5px}
header .btnLang a p{float:left;color:#228dac; font-size:16px; padding:10px 0; font-weight:600;}
header .btnLang:hover a .btnIcon{background-position:bottom;}
header .btnLang:hover a p{color:#0095da}
header .btnSearchBox{ float:left; height: 40px; cursor:pointer;}
header .btnSearchBox .btnIcon{float:left; background-image:url(../images/header-ico-searchingBar.png);background-repeat:no-repeat; background-size:100%; height:30px; width:30px; margin:5px}
header .btnSearchBox p{float:left;color:#228dac; font-size:16px; padding:10px 0; font-weight:600;}
header .btnSearchBox:hover .btnIcon{background-position:bottom;}
header .btnSearchBox:hover p{color:#0095da}
header li:after {content: ''; display: block; margin: auto; height: 2px; width: 0px; background: transparent; transition: width .5s ease, background-color .5s ease;}
header li:hover:after {  width: 100%; background: #228dac;}
header li.current:after{content: ''; display: block; margin: auto; height: 2px; width:100%;  background: #228dac;}

/*dropdown*/
.menuBar .dropdown{display:none; opacity:0; height:auto; position:absolute;  padding-top: 32px; margin-left: -20px;  width:440px}
.menuBar .dropdown .dropdownCol{width:200px; height:160px; float:left;}
.menuBar .dropdown ul{padding:0;}
header .menuBar .dropdown ul li{padding:0 5px; min-width: 200px;}
header .menuBar .dropdown ul li:after{margin:30px 0 0 0;}
header .menuBar .dropdown ul li:hover:after{width:40%;}
.menuBar .dropdown p{ line-height:30px;font-size: 14px; float:left}
.menuBar .dropdown.aboutDropdown{  width:640px}
.menuBar .dropdown .dropdownContent{padding:13px 18px; background:#fff; box-shadow: 3px 6px 6px rgba(0,0,0,0.2);width:50%}
.menuBar .dropdown.aboutDropdown .dropdownContent{width: 66.66666667%;}
.menuBar .dropdown img{padding:13px; background-color:#eee; box-shadow: 3px 6px 6px rgba(0,0,0,0.2); max-width: none; height:186px;}
.menuBar .menuDropdown{height:30px; cursor: default;}
.menuBar .menuDropdown:hover .dropdown{display:block; opacity:1;}

.banner{margin-top:80px;}

.banner .swiper-pagination-bullet {
   background-color: #fff;
   width: 12px;
   height: 12px;
   opacity: .8;
}

.banner .swiper-pagination-bullet-active {
   background-color: #228dac
}

/*banner*/
section.banner{ height:600px; margin-top:80px; background-color:#fff;}
.royalSlider {height: 600px; max-width:2560px;}
.royalSlider img {}
.rsOverflow{max-width:2560px !important;}
.banner1{background-image:url('../images/index-banner1-bg.jpg'); background-size:cover; background-position:center; height:100%;}
.banner1 img{margin: 160px 0 0 -28vw;}
.banner2{background-image:url('../images/index-banner2-bg.jpg'); background-size:cover; background-position:center; height:100%;}
.banner2 img{margin: 160px 0 0 -28vw;}
.banner3{background-image:url('../images/index-banner3-bg.jpg'); background-size:cover; background-position:right; height:100%;}
.banner3 img{margin: 160px 0 0 -28vw;}


/*about us*/
section.aboutUs{margin:0 auto; padding:80px 0; background-color:#fff;}
.aboutUs img{width:100%;}
.aboutUs .aboutUs-list{display:flex; align-items:center}
.aboutUs .content{margin-left:30px}
.aboutUs p{float:left;}
.aboutUs .description{ margin:30px 0; line-height:220%}
.aboutUs .description p{float:none}
/*product*/
section.product{padding:80px 0; position:relative; text-align:center; color:#228dac; background-color:rgba(34,141,172,.2);}
.wave{height:50%; width:100%; overflow:hidden;position:absolute;z-index:0; top:100px; background: linear-gradient(60deg, rgba(0,172,193,1)  0%, rgba(84,58,183,1) 100%);}
.product p.title{color:#228dac;}

.productContent{margin:auto; position: relative; z-index: 10;}
.product .pic{overflow:hidden; background-color:#228dac; color:#fff; text-shadow: 0px 0px 4px rgba(0,0,0,0.6);}
.product .fade:hover{z-index:13;}
/* .product .productBranding  a:hover .word{top: 60%;} */
.product a:hover .word{height:40%; width: 100%;padding-top: 0 !important; top: 40%;}
.product a:hover .word p.title{}
.product a:hover .word p{float: inherit; margin: auto; text-align: center; width:100%;line-height: 30px;padding-bottom: 40px;}
/* .product .productBranding{padding-top:180px; position:absolute; right:0; top:0;} */
.product .productBranding .pic{ box-shadow: -2px 12px 14px rgba(0,0,0,0.2);margin-right:20px;}
/* .product .productCategory{position:absolute; right:0; top:400px;} */
.product .productCategory  .pic{width:390px; float:right; box-shadow: -2px 12px 14px rgba(0,0,0,0.2);}
.product .productInventory{position:absolute; z-index:11;display:none;}
.product .productInventory  .pic{width:390px; float:left;}
/* .product .productApplication{position:absolute; left:0; top:300px; z-index:10;} */
.product .productApplication .pic{ box-shadow: 7px 12px 14px rgba(0,0,0,0.2); margin-left:20px;}
.product .pic img{width:100%;}
.product a:hover .pic img{transform: scale(1.2, 1.2);transition: 0.5s; opacity:0.1;}
.product .pic .word{position:absolute; padding:40px; z-index:10;}
.product .pic p.title{font-size:24px; border-bottom: 0; height:30px; float:none; color:#fff}

.product .productContent .content{margin-bottom:50px}
/* .product .productContent  p.description{ margin:40px 0 27px;} */

.product .mobile{ margin:10px auto;}
.product .mobile a{ margin:30px; width:100%; height:100%; margin: auto; float: inherit; display: flex;}
.product .mobile a img{width:100%; height:100%;}
.product .mobile a:hover img{opacity:0.2; transition: 0.5s; background-color:#228dac;}
.product .mobile .m_word{position:absolute;padding:40px;}
.product .mobile p.title{font-size:40px; border-bottom: 0; height:54px;}
.product .mobile p{color:#fff; text-align:left; float:left;font-size:24px;}

/*product testing*/
section.testing{ height:100%; margin:auto; background-image:url(../images/footer-testing.jpg); background-size:cover; }
.testing .content{margin:80px 20px;}
.testing p.subtitle{border-bottom: 0;color:#fff; float: inherit; text-align:center; word-spacing:-4px; font-size:24px;}
.testing p.title{border-bottom: 0;color:#fff; float: inherit; text-align:center; word-spacing:-4px;}
.testing .btnWhite{float: inherit; margin:40px auto;}

/*footer*/
section.footer{background-color:#228dac; padding:80px 20px;}
.footer .logo{float:left; }
.footer .logo img{padding: 0 20px;max-width:200px;}
.footer .footerMenu{float:inherit; margin:auto; text-align:center; display:flex;}
.footer .footerCol{float:left; width:12vw; max-width: 290px;}
.footer .footerCol .d_RFQ{display:block;}
.footer .footerCol.RFQ{display:none;}
.footer ul{ padding:0;}
.footer li{ color:#ddd; line-height:36px; float:inherit; text-align:left;}
.footer a{color:#ddd;}
.footer a:hover{color:#ccc;}
.footer .footerTitle{font-weight:600; font-size:18px;}
.footer .footerTitle a{color:#fff;}
.footer .footerTitle:hover a{color:#fff !important;}
.footer .li{font-weight:0;}
.footer .logoISO{padding: 0 20px;}
.footer .logoISO img{padding:0 10px 30px; max-width:140px;}

.cookieBar{background-color:#228dac; height:40px;}
.cookieBar p{margin:0; color:#fff;}
.copyright{padding:10px 20px; float:left; height:20px;}
.privacy{padding:10px 20px; float:right; height:20px;}


.page { width: 100%; padding:50px 0 15px 0; float: left; text-align: center; overflow:hidden; font-size:15px;}
.page a{border:1px solid #ddd; border-radius:5px; padding:3px 10px; height:55px; line-height:55px;}
.page span,.page a:hover{padding:4px 11px; background:#228dac; color:#fff; border-radius:5px; border:0;}
.page .prev,.page .next { margin: 0 10px;}
.page .num { padding: 2px; text-align: center; color: #000; }
.page .cur { color: #f00;}