@charset "utf-8";
/*通用样式*/
*,a,a:hover,a:active,a:visited,a:link,a:focus{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color: transparent;outline:none;text-decoration: none;}
html, body, div, span, iframe, map, font, img, a img, samp, strong, hr, h1, h2, h3, h4, h5, h6, b, p, blockquote, a, address, code, dl, dt, dd, ol, ul, li, form, label, table, tr, td, th{ padding: 0; margin: 0; border: 0; font-weight: normal; font-family: 'Microsoft YaHei', Arial, Helvetica, sans-serif;  list-style:none;}
html, body { position: relative; height: 100%;}
input,textarea { outline: none; border: none; box-sizing: border-box; background: none;}
body{ background:#fff; font:normal 12px/22px "微软雅黑";  }
img{ border:0;  }
a{ text-decoration:none; color:#000;  }
a:hover{ color:red;  }
.clear { clear:both;}
div { box-sizing:border-box;}
.clearfix::after { content: ''; clear: both; display: block; height: 0;}
/* CSS Document */
.headerBox {position: fixed; left: 0; width: 100%; z-index: 10; top: 0; transition: all 0.5s;}
.banner {padding: 120px 0;
ackground-color: transparent;
    background-image: linear-gradient(90deg, #037EF3 0%, #037EF3 100%);
    opacity: 0.9;
    transition: background 0.3s, border-radius 0.3s, opacity 0.3s;}
.headerBox.move { background: #ffffff; box-shadow: 0px 5px 80px rgba(0, 0, 0, 0.1);}
.banner { position: relative;}
.bannerBottom { position: absolute; bottom: -7px; left: 0; width: 100%;}
.header { max-width: 92%; align-items: center; z-index: 2; z-index: 10; margin: 0 auto; width: 1140px; padding: 13px 0; display: flex; justify-content: space-between;}
.header .logo img{ display: block; transition: all 0.5s; height: 35px; width: auto;}
.header .logo { position: relative;}
.header .logo img:nth-child(2) { position: absolute; left: 0; top: 0; opacity: 0;}
.headerBox.move .logo img:nth-child(2) { opacity: 1;}
.headerBox.move .logo img:nth-child(1) { opacity: 0;}
.nav ul { display: flex;}
.nav li { line-height: 35px; padding: 0 18px;}
.nav li a { position: relative; display: block; position: relative; font-weight: bold; color: #ffffff; font-size: 14px;}
.nav li a::after { content: ''; position: absolute;top: 100%;
background: #ffffff;
    border-radius: 3px;
    left: 0%;
    width: 100%;
    height: 3px;
    transform: scaleX(0);
    transition: transform 0.2s;
    transform-origin: right center;
    box-sizing: border-box;
    display: block;}
.headerBox.move .nav li a { color: #262d35;}
.nav li:hover a::after {transform: scaleX(1);
    transform-origin: left center; }
.bannerInfor { position: relative; z-index: 2; display: flex; justify-content: space-between;}
.bannerInfor>div { flex: 1; width: 50%;}
.bannerSwiper img { display: block; width: 100%;}
.bannerInfor { width:1140px; max-width: 92%; margin: 0 auto;} 
.bannerText span { display: inline-block; font-size: 13.5px; color: #ffffff; line-height: 1; padding: 5px 10px; border-radius: 3px;
background: #ff6c5f !important; font-weight: bold;}
.bannerText h2 { margin: 30px 0; font-weight: bold; color: #ffffff; font-size: 48px; line-height: 1;}
.bannerText p { font-size: 20px; color:#ffffff; line-height: 1.6;}
.bannerText a { border-radius: 26px; margin-top: 12px; display: inline-flex; position: relative; box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1), 0 20px 30px rgba(0, 0, 0, 0.15) !important; align-items: center; padding: 12px 32px; line-height: 28px;}
.bannerText a i { transition: all 0.2s; position: relative; z-index: 2; margin-right: 6px; display: block; background: url(../images/kf.png) center no-repeat;
width: 18px; height: 18px; background-size: 100% auto;}
.bannerText a b { transition: all 0.2s; position: relative; z-index: 2; font-weight: bold; font-size: 18px; color: #ffffff;}
.bannerText a::after { content: '';border-radius: 26px; position: absolute; left: 0; top: 0;
background: #ffffff; transform: scaleX(0);transform-origin: right center; width: 100%; height: 100%; transition: transform .2s;}
.bannerText a:hover::after { transform: scale(1); transform-origin: left center; }
.bannerText a:hover i { margin-right:12px; background: url(../images/kfon.png) center no-repeat; background-size: 100% auto;}
.bannerText a:hover b { color: #000;}
.solution { width: 1120px; max-width: 92%; margin: 100px auto;}
.solutionTit { line-height: 1; text-align: center; color: #495057 !important; font-size: 48px; font-weight: bold;}
.solution ul { margin-top: 100px; gap: 20px; display: flex; justify-content: space-between;}
.solution li { border-radius: 6px; transition: all 0.5s; box-shadow: 0 12px 37px rgba(0, 0, 0, 0.05), 0 5px 12px rgba(0, 0, 0, 0.1) !important; padding: 35px 20px 55px 20px; flex: 1; text-align: center; box-sizing: border-box;}
.solution li h2 { line-height: 30px; font-weight: bold; margin-top: 30px; font-size: 24px; color: #495057; line-height: 1;}
.solution li img { display: block; margin: 0 auto;}
.solution li p { font-size: 18px; color: #adb5bd !important; margin-top: 10px;}
.solution li:hover { transform: translateY(-10px);}
.introduce { background: rgb(248,249,250); padding: 100px 0;}
.introduceList { max-width: 92%; width: 1140px; margin: 0 auto;}
.introduceList li { padding: 80px 0; align-items: center; display: flex; justify-content: space-between;}
.introduceList li>div { flex: 1; width: 50%;}
.introduceList li img { width: 90%; display: block; margin: 0 auto;}
.introduceList li:nth-child(2n) {flex-direction: row-reverse;}
.intImg { padding: 10px;}
.intText { padding: 10px;}
.intText h2 { font-weight: bold; margin-top: 30px; font-size: 36px; color: #495057; line-height: 1;}
.intText p { line-height: 2; font-size: 18px; color: #adb5bd !important; margin-top: 20px;}
.intText a { transition: all 0.2s; margin-top: 30px; display: inline-flex; border-radius: 4px; padding: 12px 32px; align-items: center; background: #02c77b; color: #ffffff;
font-weight: bold; font-size: 18px;}
.intText a i { transition: all 0.2s; margin-right: 6px; display: block; background: url(../images/btnIcon.png) center no-repeat;
width: 11px; height: 18px; background-size: 100% auto;}
.intText a:hover i { margin-right: 12px;}
.intText a:hover{ background: rgb(2,179,111);}
.introduceList li:last-child { padding-bottom: 0;}
.footTop {width: 1140px; display: flex; padding: 60px 0; margin: 0 auto; max-width: 92%; justify-content: space-between;}
.footLogo img{ height: 35px; display: block;}
.footLogo { display: block; margin-bottom: 20px;}
.contactFoot { width: 24%;}
.contactFoot li { margin-top:20px; line-height: 29px; display: flex; align-items: center;}
.contactFoot li p { font-size: 16px; color: #6C757D; margin-left: 10px;}
.cpic { display:flex; align-items: center;}
.goods {background: rgb(248,249,250); text-align: center; padding: 80px 0;}
.goods ul { width: 1140px; margin: 80px auto 0; max-width: 92%; display: flex; justify-content: space-between;}
.goods li { width: 25%; box-sizing: border-box; padding: 40px;}
.goods li h2 { font-size: 24px; margin-top: 20px; font-weight: bold; color: #495057; line-height: 1;}
.goods li p { font-size: 16px; line-height: 2; margin-top: 10px; color: #adb5bd !important;}
.footLink { width: 16%;}
.footLink li a { line-height: 40px; justify-content: center; font-size: 16px; color: #6c757d !important; font-weight: bold; display: flex; align-items: center;}
.footLink h2,.scanBox h2 { font-size: 18px; font-weight: bold; color: #495057; line-height: 43px;}
.footLink { text-align: center; padding-left: calc(16% - 245px);}
.footLink li a img { transition: all 0.3s; margin-right: 4px;}
.footLink li:hover a img { margin-right:10px;}
.scanBox { text-align: center;}
.scanBox img { width: 200px; margin: 0 auto;}
.frLink { margin-top: 60px; display: flex; flex-wrap: wrap;}
.frLink a { width: 50%;}
.frLink img { width: 32px;}
.copy { border-top: 1px solid rgba(0, 0, 0, 0.08); padding: 15px 0 10px;}
.copy p { text-align: center; font-size: 16px; font-weight: 200; color: #999999; margin: 10px 0;}
.copyLink { margin-top: 20px; display: flex; justify-content: center;}
.copyLink a { transition: all 0.2s; display: block; font-size: 16px; font-weight: bold; padding: 10px; margin: 0 5px;
border-radius: 5px; background: #F8F9FA; color: #495057;}
.copyLink a:hover {transform: translateY(-5px);}
.menubox { display: none;}
@media screen and  (max-width:1080px){
	.menubox { display: block;}
	.menubox{ display: block; position: absolute;right: 4%; top: 10px; width:45px; height: 40px;opacity: 1;pointer-events: auto;transition: 0.3s;}
		.menubox div{position: absolute;left: 20px;width: 30px;height: 2px;background-color: rgba(0, 0, 0, 0.4) !important;transition: 0.6s;}
		.menubox div:nth-child(1){top: 9px;}
		.menubox div:nth-child(2){top: 19px;}
		.menubox div:nth-child(3){top: 29px;}
		.menubox.on div:nth-child(1){top: 19px;transform: rotateZ(45deg);}
		.menubox.on div:nth-child(2){top: 19px;opacity: 0;}
		.menubox.on div:nth-child(3){top: 19px;transform: rotateZ(-45deg);}
	.bannerInfor { flex-direction: column;}
	.bannerInfor>div { width: 100%;}
	.bannerText p { font-size: 16px;}
	.bannerText h2,.solutionTit { font-size: 26px; margin-bottom: 10px;}
	.banner { padding: 100px 0 40px;}
	.nav { display: none; padding: 10px 0; width: 100%; position: fixed; left: 0; top: 60px; background: #ffffff;}
	.nav ul { flex-direction: column;}
	.nav li a { text-align: center; color: #495057;}
	.headerBox { background: #ffffff;}
	.headerBox .logo img:nth-child(1) { opacity: 0;}
	.headerBox .logo img:nth-child(2) { opacity: 1;}
	.solution ul { margin-top: 20px;}
	.solution { margin-top: 20px;}
	.solution ul { flex-wrap: wrap; gap: 4%;}
	.solution li { padding: 20px 10px; width: 48%; flex: auto; margin-bottom: 4%;}
	.solution li h2,.intText h2 { font-size: 18px; margin: 16px 0;}
	.solution li p,.intText p { font-size: 14px;}
	.solution { margin-bottom: 30px;}
	.introduce { padding: 30px 0;}
	.introduceList li { padding: 30px 0;}
	.intText h2 { margin-top: 0;}
	.introduceList li,.introduceList li:nth-child(2n) { flex-direction: column;}
	.introduceList li>div { width: 100%;}
	.intText a { font-size: 16px;}
	.goods { padding: 30px 0;}
	.goods ul { margin: 30px auto;flex-wrap: wrap;}
	.goods li { width: 50%; padding: 20px 10px;}
	.goods li p { font-size:14px}
	.footTop { padding: 30px 0; flex-wrap: wrap;}
	.scanBox{ width: 50%!important; margin-top: 20px;}
	.scanBox img { width: 100px;}
	.footTop>div { width: 100%;}
	.footLink { display: none;}
	.frLink a { width: auto;}
	.frLink { margin-top: 20px; justify-content: center; gap: 15px;}
	.copy { padding: 15px 4%;}
	.copy p { font-size: 14px;}
	.copyLink a { font-size: 14px;}
	.copyLink { overflow-x: auto; white-space: nowrap; justify-content: flex-start;}
}

@media screen and  (max-width:780px){

}