/* CSS Document */
@font-face {
    font-family: 'DINAlternate';
    src: url('../fonts/DINAlternate/DIN-Bold.woff') format('woff');
    font-style: normal;
    font-weight: bold;
    text-rendering: optimizeLegibility;
	font-display: swap;
}
@font-face {
	font-family: 'SourceHanSansCN-Regular';
	src: url('../fonts/SourceHanSansCN-Regular/SourceHanSansCN-Regular.eot');
	src: url('../fonts/SourceHanSansCN-Regular/SourceHanSansCN-Regular.eot?#iefix') format('embedded-opentype'),
		url('../fonts/SourceHanSansCN-Regular/SourceHanSansCN-Regular.woff') format('woff'),
		url('../fonts/SourceHanSansCN-Regular/SourceHanSansCN-Regular.ttf') format('truetype'),
		url('../fonts/SourceHanSansCN-Regular/SourceHanSansCN-Regular.svg#SourceHanSansCN-Regular') format('svg');
	font-style: normal;
	font-weight: normal;
	text-rendering: optimizeLegibility;
	font-display: swap;
}
.wrap{ width:84%; max-width:1630px; padding:0 15px; margin:0 auto;}

.header{ position:fixed; left:0; top:0; width:100%; z-index:10; transition:all .5s;}
.header .wrap{ width:90%; min-width:320px;}
.logo{ float:left; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; height:120px; transition:all .3s;}
.logo a{ display:block;}
.logo img{ height:54px; transition:all .3s;}
.nav{ float:right;}
.navBox{ margin:0 auto;}
.navList{ margin:0; text-align:center;}
.navList > li{ padding:0; vertical-align:middle; margin-left:45px; margin-left:2.34vw;}
.navList > li > a{ display:block; line-height:36px; font-size:22px; font-size:1.145vw; padding:0 0 25px; color:#FFFFFF; font-weight:500; position:relative; transition:all .3s;}
.navList > li > a:after{ display:block; content:""; position:absolute; left:50%; bottom:0; width:0%; height:3px; background:#457AE6; background:#FFFFFF; transition:all .3s;}
.navList > li.active > a,.navList > li.cur > a,.navList > li > a:hover{}
.navList > li.active > a:after,.navList > li:hover > a:after{ left:0; width:100%;}
.navSub{ position:absolute; left:0; top:100%; width:100%; background:#FFFFFF; padding:20px 20px 15px; text-align:left; box-shadow:0 2px 2px rgba(0,0,0,0.1); opacity:0; visibility:hidden; transition:all .1s; min-height:360px; z-index:2;}
.navList2{ display:flex; flex-wrap:wrap; justify-content:center; max-width:1630px; margin:0 auto;}
.navList2 > li{ padding:.1rem 1.56vw; font-weight:normal;}
.navList2 > li > a{ display:block; font-size:18px; color:#333333; line-height:30px; padding:.1rem 0; font-weight:600;}
.navList2 > li > a:after{ display:block; content:""; width:100%; max-width:.4rem; height:1px; background:#DEDEDE; margin:.1rem 0;}
.navList2 > li > a:hover{ color:#457AE6;}
.navThr{ list-style:none; font-size:16px; color:#333333; min-width:180px;}
.navThr > li{}
.navThr > li > a{ display:block; color:#333333; line-height:26px; padding:5px 30px 5px 10px; transform:translateX(-10px); transition:all .5s;}
.navThr > li > a:hover{ transform:translateX(0); color:#FFFFFF; background:url(../images/arrow4.png) right 10px top 10px #457AE6 no-repeat; border-radius:4px; box-shadow:1px 4px 5px rgba(0,0,0,0.2);}
.navThr.two{ display:flex; flex-wrap:wrap; width:420px; margin:0 -4px;}
.navThr.two > li{ width:50%; padding:0 4px;}
.navList > li:hover .navSub{ opacity:1; visibility:visible; transition:all .3s;}

.navRig{ text-align:right; line-height:59px; color:#FFFFFF; font-size:0; margin:0 -1vw; transition:all .3s;}
.navRig li{ font-size:16px; position:relative; padding:0 1vw; vertical-align:middle;}
.navRig li:after{ display:block; content:""; width:2px; height:14px; background:#FFFFFF; position:absolute; left:100%; top:50%; margin-top:-6px;}
.navRig li:nth-last-child(2):after,.navRig li:nth-last-child(1):after{ display:none;}
.navRig a,.navRig i,.navRig span{ display:inline-block; vertical-align:middle; color:#FFFFFF; line-height:24px; position:relative; font-style:normal;}
.navRigIco{ display:inline-block; vertical-align:middle; width:24px; height:24px; background-position:center center; background-repeat:no-repeat; background-size:contain;}
.navRigIco1{ background-image:url(../images/navSearch.png); cursor:pointer;}
.navRigIco2{ background-image:url(../images/navTel.png);}
.navTel span{ margin-left:5px;}
.navRig span.navLangBtn{ display:none;}
.navLangCon{ color:#FFFFFF; font-size:14px;}
.navLangCon a{ color: #FFFFFF; margin:0 5px;}
.navLangCon a:last-child{ margin-right:0;}
.navLangCon a:hover,.navLangCon a.active{ color:#FFFFFF; text-decoration:underline;}
.navRig li.navBtn{ cursor:pointer; display:none;}
.navBtn span{ width:25px; height:30px; position:relative; margin-left:5px;}
.navBtn span b{ display:block; width:100%; height:2px; background:#FFFFFF; position:absolute; left:0; top:calc((100% - 4px) / 2); transition:all .3s;}
.navBtn span b:nth-child(1){ transform:translateY(8px) rotate(0deg);}
.navBtn span b:nth-child(3){ transform:translateY(-8px) rotate(0deg);}
.navBtn.active b:nth-child(1){ transform:translateY(0) rotate(45deg);}
.navBtn.active b:nth-child(3){ transform:translateY(0) rotate(-45deg);}
.navBtn.active b:nth-child(2){ opacity:0;}

.header.no-show{ transform:translateY(-100%);}
.header.whiteBg{ background:#FFFFFF; background:rgba(255,255,255,0.8); box-shadow:0 -1px 0 #DEDEDE inset;}
.header.whiteBg .logo{ height:80px;}
.header.whiteBg .logo img{ height:40px;}
.header.whiteBg .logo .shows{ display:none;}
.header.whiteBg .logo .hides{ display:block;}
.header.whiteBg .navList > li > a{ color:#222222; font-size:16px; line-height:30px; padding:0 0 10px; font-weight:bold;}
.header.whiteBg .navList > li.active > a:after,.header.whiteBg .navList > li.cur > a:after,.header.whiteBg .navList > li:hover > a:after{ left:0; width:100%; background:#457AE6;}
.header.whiteBg .navRig{ line-height:40px;}
.header.whiteBg .navRig a,.header.whiteBg .navRig i,.header.whiteBg .navRig span{ color:#666666;}
.header.whiteBg .navRig li:after{ background:#CCCCCC;}
.header.whiteBg .navLangCon{ color:#CCCCCC;}
.header.whiteBg .navLangCon a{ color:#CCCCCC;}
.header.whiteBg .navLangCon a:hover,.header.whiteBg .navLangCon a.active{ color:#457AE6;}
.header.whiteBg .navRigIco1{ background-image:url(../images/navSearch2.png);}
.header.whiteBg .navRigIco2{ background-image:url(../images/navTel2.png);}
.header.whiteBg .navBtn span b{ background:#457AE6;}

.searchBg{ position:fixed; left:0; top:auto; width:100%; min-height:3.6rem; padding:.3rem; background:#F9F9F9; display:flex; flex-direction:column; justify-content:center; opacity:0; visibility:hidden; transform:translateY(10px); transition:all .5s; z-index:1; border-bottom:1px solid #DEDEDE;}
.searchBox{ width:90%; max-width:640px; margin:0 auto;}
.search{ position:relative; margin-bottom:.3rem;}
.searchInput{ width:100%; height:50px; padding:10px 90px 10px 60px; line-height:30px; font-size:16px; color:#333333; background:#FFFFFF; border:none; box-shadow: 0px 3px 15px 0px rgba(23, 41, 77, 0.1);}
.searchIco{ position:absolute; left:10px; top:50%; margin-top:-18px; width:36px; height:36px; background:url(../images/searchIco.png) center center no-repeat; cursor:pointer;}
.searchBtn{ position:absolute; right:0; top:0; width:80px; font-size:16px; line-height:50px; color:#FFFFFF; background:#457AE6; text-align:center; border:none;}
.searchBtn:hover,.searchBtn:focus{ color:#FFFFFF;}
.searchH3{ font-size:16px; color:#666666; line-height:22px; margin:.1rem 0;}
.searchHot{ list-style:none; display:flex; flex-wrap:wrap; font-size:14px; line-height:20px; margin:0 -.15rem;}
.searchHot li{ padding:0 .15rem;}
.searchHot li a{ display:block; color:#999999;}
.searchHot li a:hover{ color:#457AE6;}
.searchBg.active{ opacity:1; visibility:visible; transform:translateY(0);}


/*footBg*/
.footBg{ background:url(../images/footBg.png) center center no-repeat; background-size:cover; font-size:16px; color:#FFFFFF; line-height:30px; position:relative; z-index:1; padding:90px 0 50px;}
.footBg .wrap{ width:90%;}
.footBg a{ color:#FFFFFF;}
.footBg a:hover{ color:#FFFFFF;}
.ftLef{ float:left; width:48.75%;}
.ftCon{ list-style:none; display:flex; flex-wrap:wrap; margin:.3rem -.15rem; line-height:30px;}
.ftCon li{ width:33.33%; padding:.3rem .15rem 0;}
.ftTit{ font-size:18px; line-height:28px; font-weight:bold;}
.ftEn{ font-size:12px; line-height:22px; opacity:.5; text-transform:uppercase;}
.ftTel{ padding:.2rem .3rem; margin:.3rem 0; background:rgba(255,255,255,0.1); border-radius:5px;}
.ftTelList{ display:flex; flex-wrap:wrap; margin:0 -.2rem;}
.ftTelItem{ width:50%; padding:0 .2rem; margin:.1rem 0;}
.ftTelUL{ list-style:none; display:flex; margin:0 -.18rem;}
.ftTelUL li{ padding:0 .18rem;}
.messList{ list-style:none; margin:.3rem -.1rem;}
.messList li{ padding:0 .1rem; margin-bottom:.1rem;}
.messInput{ display:block; width:100%; line-height:24px; padding:10px 12px; height:44px; background:rgba(255,255,255,0.3); border-radius:5px; border:none; font-size:16px; color:#FFFFFF;}
.messInput::-webkit-input-placeholder{ color:#FFFFFF; opacity:.3;}
.messInput::-moz-placeholder{ color:#FFFFFF; opacity:.3;}
.messInput:-moz-placeholder{ color:#FFFFFF; opacity:.3;}
.messInput:-ms-input-placeholder{ color:#FFFFFF; opacity:.3;}
textarea.messInput{ height:80px; resize:none;}
#messBtn{ display:block; width:200px; line-height:50px; background:#FFFFFF; border-radius:5px; font-size:18px; color:#004CE6; text-align:center; margin-top:.1rem; transition:all .3s;}
#messBtn:hover{ background:rgba(255,255,255,0.8)}

.ftRig{ float:right; width:48.75%; text-align:right;}
.ftShare{ font-size:0; margin:0 -.1rem; margin:.7rem 0;}
.ftShare li{ padding:0 .1rem; position:relative; vertical-align:middle; margin-top:5px;}
.ftShare li a{ display:block; width:40px; height:40px; border-radius:50%; background-position:center center; background-repeat:no-repeat; background-size:contain;}
.ftShareIco1{ background-image:url(../images/shareIco1.png);}
.ftShareIco1:hover{ background-image:url(../images/shareIco1a.png);}
.ftShareIco2{ background-image:url(../images/shareIco2.png);}
.ftShareIco2:hover{ background-image:url(../images/shareIco2a.png);}
.ftShareIco3{ background-image:url(../images/shareIco3.png);}
.ftShareIco3:hover{ background-image:url(../images/shareIco3a.png);}
.ftShareIco4{ background-image:url(../images/shareIco4.png);}
.ftShareIco4:hover{ background-image:url(../images/shareIco4a.png);}
.ftNav{ display:flex; justify-content:flex-end; flex-wrap:wrap; line-height:160%; margin:.5rem 0 1rem;}
.ftNav li{ padding-left:3.95vw; margin:.06rem 0;}
.ftNav li:first-child{ padding-left:0;}
.ftNav .ftTit{ margin-bottom:.2rem;}
.ftLink p{ margin:.1rem 0;}
.ftLink p a:hover{ text-decoration:underline;}
.ftWx{ overflow:hidden; margin:.8rem -1.04vw; display:flex; justify-content:flex-end;}
.ftWx li{ max-width:50%; padding:0 1.04vw; display:flex; justify-content:flex-start; align-items:center;}
.ftWx li span{ width:40px; padding:10px; background:rgba(255,255,255,0.3); line-height:18px; height:120px; display:flex; flex-direction:column; justify-content:center;}
.ftWx li img{ display:block; width:120px; height:120px;}
.ftText{ margin:.6rem 0 0; font-size:14px; line-height:200%;}
.ftText p{ opacity:.5; margin:.1rem 0;}
.ftText p a{ display:inline-block; vertical-align:middle; margin-left:.15rem;}
.ftText p a:hover{ text-decoration:underline;}
.copyRight{ font-size:14px; line-height:160%;}
.copyRight p{ opacity:.5; margin:.1rem 0;}


.banIn{ height:640px; position:relative;}
.banIn .imgBg{ position:fixed; left:0; top:0; width:100%; height:640px;}
.banIn .banText{ text-align:center;}
.banInCn{ font-size:20px; line-height:140%;}
.banInEn{ font-size:40px; font-family:DINAlternate; text-transform:uppercase;}
.banInLine{ display:block; width:.2rem; height:2px; margin:.1rem auto}
.banInLine span{ display:block; width:100%; height:100%; background:#FFFFFF;}

.banBotBg{ background:rgba(0,0,0,0.4); position:relative; z-index:2; line-height:30px; padding:.2rem 0; margin-top:-70px;}
.breadcrumb{ text-align:right; background:none; border-radius:0; margin:0; padding:0; font-size:0; color:#AAAAAA;}
.breadcrumb li{ font-size:16px; vertical-align:middle; padding:0; position:relative;}
.breadcrumb li a{ display:block; color:#999999;}
.breadcrumb li + li:before{ display:none;}
.breadcrumb li + li + li{ padding-left:18px;}
.breadcrumb li + li + li:before{ display:block; content:">"; position:absolute; left:0; top:0; color:#999999;}
.breadcrumb li.active{ color:#FFFFFF;}
.breadcrumb li a:hover{ color:#FFFFFF;}

.banBotBg .wrap,
.innerBg .wrap{ max-width:1230px; margin:0 auto; width:90%;}
.left{ float:left; width:20.83%; border-radius:.1rem; background: linear-gradient(356deg, #4DC3FF 0%, #457AE6 100%); padding:.3rem 0 0; margin-top:-.3rem; position:relative; z-index:2; margin-bottom:.3rem; box-shadow:0 .15rem .15rem rgba(0, 17, 51, 0.1);}
.leftEn{ float:right; font-size:2.5vw; color:#FFFFFF; white-space:nowrap; writing-mode:tb-rl; font-family:DINAlternate; opacity:.2; padding:.2rem;}
.leftTit{ display:none;}
.sortList{ list-style:none;}
.sortList li{ position:relative;}
.sortList li a{ display:block; padding:.15rem .3rem; font-size:18px; line-height:30px; color:#FFFFFF; position:relative; opacity:.75;}
.sortList li a:hover{ opacity:1;}
.sortList li.active > a{ opacity:1;}
.sortList li.active > a:after{ display:block; content:""; width:30%; height:2px; max-width:.4rem; background:#FFFFFF; position:absolute; right:.3rem; top:calc(14px + .15rem);}
.sortList li.active .sortSecond{ display:block;}
.sortSecond{ list-style:none; display:none;}
.sortSecond li{}
.sortSecond li a{ font-size:16px; padding:.05rem .3rem .05rem .4rem;}
.sortSecond li.active a:after{ width:16px; height:16px; top:calc(.05rem + 7px); background:url(../images/sort.png) right center no-repeat;}

.right{ float:right; width:73.33%; padding:.6rem 0 0; font-size:18px; color:#6D6F73; line-height:200%;}
.rigTit{ font-size:36px; color:#222222; line-height:140%; font-weight:bold;}
.rigTitEn{ font-size:18px; color:#457AE6; line-height:24px;}
.right2{ padding:.3rem 0 0;}

.page{ text-align:center; margin:.6rem 0; font-size:0;}
.page a,.page span{ display:inline-block; vertical-align:middle; width:36px; height:36px; border:1px solid rgba(0,0,0,0.1); line-height:34px; font-size:14px; color:rgba(0,0,0,0.65); border-radius:2px; margin:.05rem;}
.page a.active,.page span.active{ border-color:#1890FF; color:#1890FF; cursor:no-drop;}
.page a:not(.active):hover{ color:#1890FF; border-color:#1890FF;}

.body2 .header{ background:#FFFFFF; box-shadow:0 -1px 0 #DEDEDE inset;}
.body2 .header .logo .shows{ display:none;}
.body2 .header .logo .hides{ display:block;}
.body2 .header .navList > li > a{ color:#222222;}
.body2 .header .navList > li.active > a:after,.body2 .header .navList > li.cur > a:after,.body2 .header .navList > li:hover > a:after{ left:0; width:100%; background:#457AE6;}
.body2 .header .navRig a,.body2 .header .navRig i,.body2 .header .navRig span{ color:#666666;}
.body2 .header .navRig li:after{ background:#CCCCCC;}
.body2 .header .navLangCon a{ color:#CCCCCC;}
.body2 .header .navRigIco1{ background-image:url(../images/navSearch2.png);}
.body2 .header .navRigIco2{ background-image:url(../images/navTel2.png);}
.body2 .header .navBtn span b{ background:#457AE6;}
.body2 .banBotBg{ margin-top:120px; background:rgba(0,0,0,0.05);}
.body2 .breadcrumb{ color:#AAAAAA;}
.body2 .breadcrumb li a{ color:#AAAAAA;}
.body2 .breadcrumb li + li + li:before{ color:#AAAAAA;}
.body2 .breadcrumb li.active{ color:#333333;}

.proName{ font-size:24px; color:#333333; line-height:32px; margin:.15rem 0;}

.tip{ border-radius:10px; background:rgba(0,0,0,0.7); color:#FFFFFF; position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); display:none; z-index:20; line-height:30px; padding:.1rem .2rem;}

.onLine{ position:fixed; right:.1rem; bottom:25%; z-index:2; list-style:none; background:#457AE6; width:64px; border-radius:5px;}
.onLine li{ max-width:48px; padding:.1rem 0; margin:0 auto; border-bottom:1px solid rgba(255,255,255,0.2);}
.onLine li:last-child{ border:none;}
.onLine li a{ display:block; width:40px; height:40px; margin:0 auto; background-position:center center; background-repeat:no-repeat; background-size:cover;}
.telIco{ background-image:url(../images/onIco1.png);}
.messIco{ background-image:url(../images/onIco2.png);}
.sinaIco{ background-image:url(../images/onIco3.png);}
.wxIco{ background-image:url(../images/onIco4.png);}
.topIco{ background-image:url(../images/onIco5.png);}

.onLay{ position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); width:90%; max-width:480px; background:#FFFFFF; z-index:2; border-radius:.1rem; border: 1px solid #DEDEDE; padding:.3rem .5rem; box-shadow:0 5px 10px rgba(0,0,0,0.1); display:none;}
.onClose{ display:block; width:32px; height:32px; background:url(../images/onClose.png) center center no-repeat; position:absolute; right:.1rem; top:.1rem; cursor:pointer;}
.onLayTit{ font-size:24px; color:#1F2226; line-height:160%; font-weight:bold; margin:0 0 .15rem;}
.onText{ background:rgba(77,195,255,0.2); border-radius:5px; font-size:18px; color:#333333; line-height:160%; padding:.18rem; margin-bottom:.18rem; text-align:center;}
.onText i{ font-style:normal; color:#A3BECC;}
.onText span{ color:#457AE6;}
.onBtn{ display:block; min-width:160px; height:44px; line-height:44px; border:none; background:#457AE6; font-size:18px; color:#FFFFFF; border-radius:5px; margin:.1rem auto -.38rem;}
.onBtn:focus{ outline: none;}
.onTipIco{ width:20%; max-width:84px; margin:0 auto;}
.onTipIco img{ display:block; max-width:100%; height:auto; margin:0 auto;}
.onImg img{ max-width:100%; height:auto; margin-top:.2rem;}

.videoBg{ position:fixed; left:0; top:0; right:0; bottom:0; height:100%; overflow:hidden; overflow-y:auto; background:rgba(0,0,0,0.73); z-index:10;}
.videoBox{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:52%; max-width:1000px;}
.videoBox video{ display:block; width:100%; height:auto;}
.videoClose{ display:block; width:44px; height:44px; background:url(../images/close.png) center center no-repeat; background-size:cover; position:absolute; left:100%; bottom:98%; margin:0 0 0 .1rem; cursor:pointer;}
.videoClose:hover{ transform:rotate(90deg); transition:all .3s;}

@media (min-width:1200px){
	.navSub,.sortList{ display:block !important;}
}
@media (max-width:1600px){
	.logo{ height:100px;}
	.logo img{ height:50px;}
	.navList > li{ margin-left:2vw;}
	.navList > li > a{ line-height:30px; font-size:18px; padding:0 0 20px;}
	.navRig{ line-height:50px;}
	.navList2 > li > a{ font-size:16px;}
	.navThr > li > a{ font-size:14px;}
	
	.footBg{ padding:70px 0 30px; font-size:14px;}
	.ftCon{ margin:.2rem -.15rem;}
	.ftTit{ font-size:16px;}
	.ftTel{ padding:.2rem;}
	#messBtn{ width:180px; line-height:46px; font-size:16px;}
	.ftNav{ margin:.5rem 0 .8rem;}
	.ftWx{ margin:.6rem -1.04vw;}
	
	.banIn,.banIn .imgBg{ height:540px;}
	.banInCn{ font-size:18px;}
	.banInEn{ font-size:32px;}
	.banBotBg{ line-height:20px; margin-top:-60px;}
	.sortList li a{ font-size:16px;}
	.sortSecond li a{ font-size:14px;}
	.sortSecond li.active a:after{ background-size:14px auto;}
	.right{ font-size:16px;}
	.rigTit{ font-size:28px;}
	.rigTitEn{ font-size:16px;}
	
	.body2 .banBotBg{ margin-top:100px;}
	.onLine{ width:50px; padding:5px 0;}
	.onLine li{ max-width:40px; padding:5px 0;}
	.onLine li a{ background-size:30px auto;}
	
	.videoClose{ width:38px; height:38px;}
}
@media (max-width:1400px){
	.header .wrap{ width:100%;}
	.logo{ height:80px;}
	.logo img{ height:40px;}
	.navRig{ line-height:40px;}
	.navList > li > a{ padding:0 0 10px; font-size:16px;}
	.navRig a,.navRig i,.navRig span{ font-size:14px;}
	.navBtn span b:nth-child(1){ transform:translateY(6px) rotate(0deg);}
	.navBtn span b:nth-child(3){ transform:translateY(-6px) rotate(0deg);}
	.footBg{ padding:.6rem 0 .3rem;}
	.footBg .wrap{ width:100%;}
	.ftLef{ width:50%;}
	.ftCon{ margin:.2rem -.1rem; line-height:24px; font-size:12px;}
	.ftCon li{ padding:.2rem .1rem 0;}	
	.ftTelList{ margin:0 -.1rem;}
	.ftTelItem{ padding:0 .1rem;}
	.messInput{ font-size:14px;}
	.ftShare{ margin:.4rem 0;}
	.ftLink{ font-size:13px;}
	
	.banIn,.banIn .imgBg{ height:480px;}
	.breadcrumb li{ font-size:14px;}
	.sortList li a{ padding:.1rem .2rem;}
	.sortList li.active a:after{ right:.2rem; top:calc(14px + .1rem); width:25%;}
	.right{ padding:.4rem 0 0; width:76%;}
	.right{ font-size:15px;}
	
	.body2 .banBotBg{ margin-top:80px;}
	
	.onLayTit{ font-size:20px;}
	.onText{ font-size:16px;}
	.onBtn{ font-size:16px;}
}
@media (max-width:1200px){
	.navBg{ position:fixed; right:-100%; top:0; width:100%; height:100vh; background:#457AE6; opacity:.8; z-index:2; transition:all .5s;}
	.navBox{ position:fixed; right:-66%; top:0; height:100vh; width:66%; background:#FFFFFF; overflow:hidden; z-index:2; transition:all .5s;}
	.navList{ text-align:left; height:calc(100% - 80px); overflow-y:auto;}
	.navList > li{ display:block; margin:0;}
	.navList > li > a{ color:#727272; height:auto; line-height:46px; padding:0 .3rem; border-bottom:1px solid #f2f2f2;}
	.navList > li > a:after{ height:1px; background:#457AE6;}
	.navList > li > a > i{ float:right; width:46px; height:46px; background:url(../images/arrow.png) center center no-repeat; background-size:30%;}
	.navList > li.active > a{ color:#457AE6;}
	.navList > li.cur > a,.navList > li > a.cur{ color:#457AE6;}
	.navList > li.cur > a > i,.navList > li > a.cur > i{ transform:rotate(180deg); transition:all .3s;}
	.navList > li:hover .navSub{ opacity:1; visibility:visible; margin-top:0;}
	.navSub{ width:100%; min-width:0; position:static; transform:none; padding:.2rem .2rem .2rem .5rem; border-top-width:1px; margin:0; opacity:1; visibility:visible; display:none; transition:none; background:#F0F0F0; box-shadow:none; min-height:0;}
	.navSub:after{ display:none;}
	.navList2{ display:block;}
	.navList2 > li{ padding:0; margin-bottom:.1rem;}
	.navList2 > li > a{ padding:0; font-size:15px;}
	.navList2 > li > a:after{ margin:2px 0;}
	.navThr{ display:flex; margin:0 -4px; flex-wrap:wrap;}
	.navThr > li{ padding:0 4px;}
	.navThr.two{ width:100%;}
	.navThr.two > li{ width:auto;}
	.navRig{ line-height:80px;}
	.navRig li.navBtn{ display:inline-block;}
	.navTop{ height:80px; background:#457AE6; padding:0 .3rem; display:flex; justify-content:flex-end; align-items:center;}
	.navClose{ width:25px; height:30px; position:relative; cursor:pointer; margin-right:10px;}
	.navClose span{ display:block; width:100%; height:2px; background:#FFFFFF; position:absolute; left:0; top:calc((100% - 4px) / 2); transition:all .3s;}
	.navClose span:nth-child(1){ transform:translateY(0) rotate(45deg);}
	.navClose span:nth-child(3){ transform:translateY(0) rotate(-45deg);}
	.navClose span:nth-child(2){ opacity:0;}
	
	.header.whiteBg .navList > li > a{ line-height:46px; padding:0 .3rem; font-weight:normal;}
	.header.whiteBg .navList > li.active > a{ color:#457AE6;}
	.header.whiteBg .navRig{ line-height:80px;}
		
	.banner,.mainBg,.footBg,.banIn,.banBotBg{ transition:all .5s;}
	.navBg.active,.navBox.active{ right:0;}
	.navBox.active{ box-shadow:-1px 0 5px #457AE6;}
	.banner.active,.mainBg.active,.footBg.active,.banIn.active,.banBotBg.active{ transform:translateX(-60%);}
	
	.footBg{ padding:.3rem 0;}
	.ftLef{ float:none; width:100%; margin:.3rem 0;}
	.ftRig{ float:none; width:100%; margin:.3rem 0; text-align:center;}
	.ftShare{ margin:.3rem 0;}
	.ftNav{ justify-content:center; margin:.3rem 0;}
	.ftWx{ margin:.3rem -1.04vw; justify-content:center;}
	.ftText{ margin:.3rem 0 0; text-align:left; line-height:160%;}
	.ftText p a{ margin-left:0; margin-right:.15rem;}
	
	.banIn,.banIn .imgBg{ height:420px;}
	.banIn .banText{ padding-top:80px;}
	.banBotBg{ margin:0; background: linear-gradient(356deg, #4DC3FF 0%, #457AE6 100%);}
	.breadcrumb{ float:none; width:100%; text-align:left; margin:0;}
	.breadcrumb,.breadcrumb li a,.breadcrumb li + li + li:before{ color:#FFFFFF;}
	.innerBg{ overflow:hidden;}
	.left,.right{ float:none; width:100%; margin:0;}
	.left{ padding:0; margin:.3rem 0;}
	.leftTit{ position:relative; display:block; padding:.2rem .3rem; color:#FFFFFF; font-size:18px; background:url(../images/arrow4.png) right .3rem center no-repeat; cursor:pointer; z-index:1;}
	.sortList{ display:none; padding-bottom:.3rem;}
	.sortList li a{ font-size:14px; padding:.1rem .3rem;}
	.sortList li.active > a:after{ position:static; display:inline-block; vertical-align:middle; margin-left:.1rem; max-width:.5rem;}
	.sortSecond li a{ font-size:12px; padding:2px .3rem 2px .5rem;}
	.leftEn{ float:none; text-align:right; padding:.1rem .3rem; writing-mode:horizontal-tb; position:absolute; right:20px; bottom:0;}
	.right{ padding:0;}
	.rigTit{ font-size:24px;}
	.rigTitEn{ font-size:14px;}
	
	.onLine{ bottom:.3rem;}
}
@media (max-width:991px){
	.wrap{ width:100%; padding:0 .3rem;}
	.header .wrap{ padding:0 15px;}
	.logo{ height:60px; width:145px; overflow:hidden;}
	.logo img{ height:40px;}
	.navRig{ line-height:60px;}
	.navRig{ margin:0 -.06rem;}
	.navRig li{ padding:0 .06rem;}
	.navRig a,.navRig i,.navRig span{ line-height:25px;}
	.navTop{ height:60px;}
	.navList{ height:calc(100% - 60px);}
	.navList > li > a{ font-size:15px;}
	.navList2 li a{ font-size:14px;}
	.footBg .wrap{ padding:0 15px;}
	.banIn,.banIn .imgBg{ height:380px;}
	.banIn .banText{ padding-top:60px;}
	.banInEn{ font-size:24px;}
	.banInCn{ font-size:20px;}
	.page{ margin:.5rem 0;}
	.page a, .page span{ width:.4rem; height:.4rem; line-height:.38rem;}
	.banBotBg .wrap,
	.innerBg .wrap{ width:100%;}
	
	.header.whiteBg .logo{ height:60px;}
	.header.whiteBg .navList > li > a{ font-size:15px;}
	.header.whiteBg .navRig{ line-height:60px;}
	
	.body2 .banBotBg{ margin-top:60px;}
	
	.videoBox{ width:90%;}
	.videoClose{ width:32px; height:32px; left:auto; right:0; bottom:100%; margin:0 0 10px 0;}
}
@media (max-width:767px){
	.navRig{ margin:0  -.1rem;}
	.navRig li{ padding:0 .1rem; position:static;}
	.navTel span{ display:none;}
	.navRig span.navLangBtn{ display:block; padding-right:20px; cursor:pointer;}
	.navRig span.navLangBtn:after{ display:block; content:""; position:absolute; right:0; top:50%; margin-top:-3px; width:0; height:0; border-top:6px solid #FFFFFF; border-left:6px solid transparent; border-right:6px solid transparent;}
	.navLangCon{ display:none; position:absolute; top:100%; left:0; width:100%; text-align:right; background:#FFFFFF; line-height:30px; padding:.2rem .3rem;}
	.navLangCon a,.navLangCon a:hover{ color:#CCCCCC;}
	.header.whiteBg .navRig span.navLangBtn:after{ border-top-color:#CCCCCC;}
	.banIn,.banIn .imgBg{ height:3.8rem;}
}
@media (max-width:640px){
	.searchBox{ max-width:100%; width:100%;}
	.searchInput{ height:44px; line-height:24px; padding:10px 80px 10px 40px;}
	.searchBtn{ line-height:44px; width:70px;}
	.searchIco{ background-size:28px auto; width:28px; height:28px; margin-top:-14px;}
	.ftCon{ display:block;}
	.ftCon li{ width:100%;}
	.ftTelList{ display:block;}
	.ftTelItem{ width:100%;}
	.ftTelUL{ flex-wrap:wrap;}
	#messBtn{ width:160px;}
	.ftNav{ display:block; text-align:left;}
	.ftNav li{ padding-left:0;}
	.ftNav .ftTit{ margin-bottom:0;}
	.ftLink{ margin:0 -.1rem;}
	.ftLink p{ display:inline-block; vertical-align:middle; padding:0 .1rem;}
	.banIn,.banIn .imgBg{ height:3.6rem;}
	.leftTit{ font-size:16px;}
	.leftEn{ font-size:.3rem;}
	.right{ font-size:14px;}
	.rigTit{ font-size:20px;}
	.rigTitEn{ font-size:12px;}
	
	.page a, .page span{ width:.5rem; height:.5rem; line-height:.48rem; margin:.1rem .02rem;}
}
@media (max-width:460px){
	.logo{ height:50px; width:120px;}
	.logo img{ height:35px;}
	.navRig{ line-height:50px;}	
	.navBtn span{ width:20px;}
	.navTop{ height:50px;}
	.searchInput{ font-size:14px;}
	.ftShare li a{ width:32px; height:32px;}
	.ftWx li span{ height:100px; font-size:14px; line-height:16px; width:30px; padding:5px;}
	.ftWx li img{ width:100px; height:100px;}
	.banIn .banText{ padding-top:50px;}	
	.banInEn{ font-size:20px;}
	.banInCn{ font-size:16px;}
	.breadcrumb li{ font-size:12px;}
	.rigTit{ font-size:18px;}
	
	.body2 .banBotBg{ margin-top:50px;}
	
	.onLine{ right:.1rem; bottom:.1rem; width:40px;}
	.onLine li a{ width:30px; height:30px; background-size:24px auto;}
	.onLayTit{ font-size:16px;}
	.onText{ font-size:14px;}
	.onBtn{ height:40px; line-height:44px;}
	.onClose{ background-size:24px auto;}	
	
	.header.whiteBg .logo{ height:50px;}
	.header.whiteBg .navRig{ line-height:50px;}
	
	.videoClose{ width:28px; height:28px;}
}