/* CSS Document */
.header{ padding:0 3%; position:fixed; left:0; top:0; width:100%; z-index:10; transition:all .5s;}
.logo{ float:left; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; height:90px;}
.logo a{ display:block;}
.logo img{ height:45px;}
.navList{ margin:0; text-align:center;}
.navList > li{ padding:0; vertical-align:middle; margin:0 30px; position:relative;}
.navList > li > a{ display:block;width:40px; height:90px; line-height:90px;}
.navIco{ background-position:center center; background-repeat:no-repeat;}
.navIco1{ background-image:url(../imgs/navIco1.png);}
.navIco2{ background-image:url(../imgs/navIco2.png);}
.navIco3{ background-image:url(../imgs/navIco3.png);}
.navIco4{ background-image:url(../imgs/navIco4.png);}
.navIco5{ background-image:url(../imgs/navIco5.png);}
.navIco6{ background-image:url(../imgs/navIco6.png);}
.navIco7{ background-image:url(../imgs/navIco7.png);}
.navIco8{ background-image:url(../imgs/navIco8.png);}
.navSub{ position:absolute; left:50%; transform:translateX(-50%); top:100%; width:960px; background:#FFFFFF; padding:40px 70px 50px; text-align:left; box-shadow:0 2px 2px rgba(0,0,0,0.1); display:none;}
.navSubTit{ font-size:42px; color:#333333; line-height:62px; padding:10px 0; border-bottom:1px solid rgba(0,0,0,0.1); width:50%; max-width:375px;}
.navSubBox{ display:flex;}
.navSubLef{ width:50%; font-size:16px; color:#666666; line-height:30px; padding:25px 50px 0 0; border-right:1px solid rgba(0,0,0,0.1);}
.navList2{ width:50%; font-size:0; margin-top:-10px;}
.navList2 li{ width:50%; padding:10px 0; padding-left:40px;}
.navList2 li a{ display:block; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:16px; color:#333333; line-height:30px;}
.navList2 li a span{ display:inline-block; vertical-align:middle; width:40px; margin-right:8px;}
.navList2 li a span img{ display:block; max-width:100%; height:auto; margin:0 auto;}
.navList2 li a:hover{ color:#e60012;}
.navList2 li a:hover span img{ animation:flash 1s linear;}

.navRig{ float:right; line-height:90px; color:#FFFFFF; font-size:0; margin:0 -15px; font-weight:bold;}
.navRig li{ font-size:0; position:relative; padding:0 15px;}
.navRig li:before{ display:block; content:""; width:1px; height:14px; background:#FFFFFF; opacity:.5; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.navRig li:first-child:before{ display:none;}
.navRig a,.navRig i,.navRig span{ font-size:16px; display:inline-block; vertical-align:middle; color:#FFFFFF; line-height:30px; position:relative; font-style:normal;}
.navRig a.active:after{ display:block; content:""; width:100%; height:1px; background:#FFFFFF; opacity:.6; position:absolute; left:0; bottom:5px;}
.navRigIco{ display:inline-block; vertical-align:middle;}
.navRigIco1{ width:24px; height:24px; background:url(../imgs/ico_search.png) center center no-repeat; cursor:pointer;}
.navRigIco2{ width:24px; height:24px; background:url(../imgs/ico_lang.png) center center no-repeat;}
.navBtn{ font-family: 'Lato'; cursor:pointer;}
.navBtn span{ width:25px; height:30px; position:relative; margin-left:12px;}
.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; box-shadow:0 1px 2px rgba(0,0,0,0.1);}
.header.whiteBg .logo .shows,.header.black .logo .shows{ display:none;}
.header.whiteBg .logo .hides,.header.black .logo .hides{ display:block;}
.header.whiteBg .navIco1,.header.black .navIco1{ background-image:url(../imgs/navIco1a.png);}
.header.whiteBg .navIco1:hover,.header.black .navIco1:hover{ background-image:url(../imgs/navIco1b.png);}
.header.whiteBg .navIco2,.header.black .navIco2{ background-image:url(../imgs/navIco2a.png);}
.header.whiteBg .navIco2:hover,.header.black .navIco2:hover{ background-image:url(../imgs/navIco2b.png);}
.header.whiteBg .navIco3,.header.black .navIco3{ background-image:url(../imgs/navIco3a.png);}
.header.whiteBg .navIco3:hover,.header.black .navIco3:hover{ background-image:url(../imgs/navIco3b.png);}
.header.whiteBg .navIco4,.header.black .navIco4{ background-image:url(../imgs/navIco4a.png);}
.header.whiteBg .navIco4:hover,.header.black .navIco4:hover{ background-image:url(../imgs/navIco4b.png);}
.header.whiteBg .navIco5,.header.black .navIco5{ background-image:url(../imgs/navIco5a.png);}
.header.whiteBg .navIco5:hover,.header.black .navIco5:hover{ background-image:url(../imgs/navIco5b.png);}
.header.whiteBg .navIco6,.header.black .navIco6{ background-image:url(../imgs/navIco6a.png);}
.header.whiteBg .navIco6:hover,.header.black .navIco6:hover{ background-image:url(../imgs/navIco6b.png);}
.header.whiteBg .navIco7,.header.black .navIco7{ background-image:url(../imgs/navIco7a.png);}
.header.whiteBg .navIco7:hover,.header.black .navIco7:hover{ background-image:url(../imgs/navIco7b.png);}
.header.whiteBg .navIco8,.header.black .navIco8{ background-image:url(../imgs/navIco8a.png);}
.header.whiteBg .navIco8:hover,.header.black .navIco8:hover{ background-image:url(../imgs/navIco8b.png);}
.header.whiteBg .navRig a,.header.whiteBg .navRig i,.header.whiteBg .navRig span,
.header.black .navRig a,.header.black .navRig i,.header.black .navRig span{ color:#333333;}
.header.whiteBg .navRig a.active,.header.black .navRig a.active{ color:#e60012;}
.header.whiteBg .navRig a.active:after,.header.black .navRig a.active:after{ background:#e60012; opacity:.6;}
.header.whiteBg .navRigIco1,.header.black .navRigIco1{ background-image:url(../imgs/ico_search2.png);}
.header.whiteBg .navRigIco2,.header.black .navRigIco2{ background-image:url(../imgs/ico_lang2.png);}
.header.whiteBg .navBtn span b,.header.black .navBtn span b{ background:#333333;}
.header.whiteBg .navRig li:before,.header.black .navRig li:before{ background:#000000; opacity:.18;}
.navList > li.active > .navIco1{ background-image:url(../imgs/navIco1b.png);}
.navList > li.active > .navIco2{ background-image:url(../imgs/navIco2b.png);}
.navList > li.active > .navIco3{ background-image:url(../imgs/navIco3b.png);}
.navList > li.active > .navIco4{ background-image:url(../imgs/navIco4b.png);}
.navList > li.active > .navIco5{ background-image:url(../imgs/navIco5b.png);}
.navList > li.active > .navIco6{ background-image:url(../imgs/navIco6b.png);}
.navList > li.active > .navIco7{ background-image:url(../imgs/navIco7b.png);}
.navList > li.active > .navIco8{ background-image:url(../imgs/navIco8b.png);}

.searchBg{ background:url(../imgs/searchBg.jpg) center center no-repeat; background-size:cover; position:fixed; left:0; top:0; right:0; bottom:0; z-index:11; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:.3rem; padding-bottom:5%; opacity:0; visibility:hidden; transform:scale(0) translateY(-100%); transition:all .8s;}
.searchBg.active{ opacity:1; visibility:visible; transform:scale(1) translateY(0);}
.searchClose{ position:absolute; right:3%; top:.6rem; width:40px; height:40px; background:url(../imgs/ico_close.png) center center no-repeat; cursor:pointer; z-index:2;}
.searchClose:hover{ transform:rotate(-90deg); transition:all .5s;}
.searchTit{ font-size:46px; color:#FFFFFF; line-height:180%; text-align:center; margin-bottom:1rem;}
.searchBox{ width:100%; max-width:800px; border-bottom:1px solid rgba(255,255,255,0.35); margin:0 auto; position:relative; padding-left:30px;}
.searchInput{ display:block; width:100%; font-size:18px; color:#FFFFFF; line-height:40px; height:40px; border:none; background:none;}
.searchInput::-webkit-input-placeholder{ color:#FFFFFF; opacity:1;}
.searchInput::-moz-placeholder{ color:#FFFFFF; opacity:1;}
.searchInput:-moz-placeholder{ color:#FFFFFF; opacity:1;}
.searchInput:-ms-input-placeholder{ color:#FFFFFF; opacity:1;}
.searchIco{ display:block; width:30px; height:40px; background:url(../imgs/ico_search3.png) left center no-repeat; position:absolute; left:0; top:0;}

.menuBg{ background:url(../imgs/searchBg.jpg) center center no-repeat; background-size:cover; position:fixed; left:0; top:0; right:0; bottom:0; display:flex; flex-direction:column; justify-content:center; align-items:center; z-index:11; padding:.3rem; padding-bottom:5%; opacity:0; visibility:hidden; transform:scale(0) translateY(-100%); transition:all .8s;}
.menuBg.active{ opacity:1; visibility:visible; transform:scale(1) translateY(0);}
.menuBox{ width:100%; max-height:100%;}
.menuBox .mCustomScrollBox{ width:100%;}
.menuList{ width:100%; max-width:1440px; margin:0 auto; color:#FFFFFF; font-size:0; max-height:100%;}
.menuList li{ width:14.28%; vertical-align:top; padding:0 10px;}
.menuList li h3{ margin-bottom:.3rem;}
.menuList li h3 a{ color:#FFFFFF; font-size:24px; line-height:32px;}
.menuSub{}
.menuSub p{ margin:10px 0; line-height:20px;}
.menuSub p a{ font-size:16px; color:#FFFFFF;}
.menuSub p a:hover{ text-decoration:underline;}


/*footBg*/
.footBg{ background:url(../imgs/footBg.png) center center #333333 no-repeat; background-size:cover; color:#FFFFFF; line-height:160%; padding:0 3%; position:relative; z-index:1;}
.ftTop{ padding:.5rem 0;}
.ftNav{ display:flex; flex-wrap:wrap; justify-content:space-around; font-style:normal; list-style:none; position:relative; overflow:hidden;}
.ftNav li{ flex:auto; width:12.5%; border-right:1px solid rgba(255,255,255,0.18); padding:0 2%; margin:.1rem 0;}
.ftNav li:first-child{ padding-left:0;}
.ftNav li:last-child{ border:none; padding-right:0;}
.ftNav a{ color:#FFFFFF;}
.ftTit{ font-size:18px; line-height:200%; margin:5px 0;}
.ftCon{ overflow:hidden; font-size:14px;}
.ftCon p{ margin:.1rem 0; position:relative; padding-left:10px;}
.ftCon p:before{ display:block; content:""; width:0; height:0; border-left:4px solid rgba(255,255,255,0.18); border-top:4px solid transparent; border-bottom:4px solid transparent; position:absolute; left:0; top:6px;}
.ftCon a{ opacity:.35; line-height:20px; transition:all 0.3s linear;}

.ftBot{ padding:.35rem 0; border-top:1px solid rgba(255,255,255,0.18);}
.ftLef{ float:left; width:calc(100% - 260px);}
.ftLogo{ float:left; max-width:24%; padding:3px 20px 3px 0; margin-right:20px; border-right:1px solid rgba(255,255,255,0.18); opacity:.5;}
.ftLogo img{ display:block; width:100%; height:auto;}
.ftText{ overflow:hidden; font-size:14px; line-height:24px; color:#FFFFFF; opacity:.35;}
.ftText a{ color:#FFFFFF;}
.ftText a:hover{ text-decoration:underline;}
.ftShare{ float:right; font-size:0; margin:0 -8px;}
.ftShare li{ padding:0 8px; position:relative; vertical-align:middle;}
.ftShare li a{ display:block; width:46px; height:46px; border:1px solid #FFFFFF; opacity:.46; background-repeat:no-repeat; background-position:center center; border-radius:50%;}
.ftShareIco1{ background-image:url(../imgs/ftIco1.png);}
.ftShareIco2{ background-image:url(../imgs/ftIco2.png);}
.ftShareIco3{ background-image:url(../imgs/ftIco3.png);}
.ftShareIco4{ background-image:url(../imgs/ftIco4.png);}
.ftWx{ position:absolute; left:50%; transform:translateX(-50%); bottom:100%; padding-bottom:15px; opacity:0; visibility:hidden; margin-bottom:10px; transition:all .3s;}
.ftWx:after{ display:block; content:""; width:0; height:0; border-top:8px solid #FFFFFF; border-left:8px solid transparent; border-right:8px solid transparent; position:absolute; left:50%; transform:translateX(-50%); bottom:8px;}
.ftWx img{ width:100px; border:5px solid #FFFFFF;}
.ftWx.active{ opacity:1; visibility:visible; margin:0;}
.ftShare li a:hover{ opacity:1; background-color:#ed4040; border-color:#ed4040;}

.onLine{ position:fixed; right:0; top:50%; z-index:2;}
.onLine li{ position:relative; margin:5px 0;}
.onLine li a{ display:block; width:60px; height:60px; background-position:center center; background-repeat:no-repeat; background-size:cover; background-color:rgba(230,0,18,0.9); transition:all .3s;}
.onIco1{ background-image:url(../imgs/onIco1.png);}
.onIco2{ background-image:url(../imgs/onIco2.png);}
.onIco3{ background-image:url(../imgs/onIco3.png);}
.onBox{ position:absolute; right:100%; bottom:0; padding-right:.22rem; opacity:0; visibility:hidden; transform:translateX(-10px); transition:all .3s;}
.onCon{ background:#FFFFFF; border-radius:.06rem; box-shadow:0 0 .2rem rgba(0,0,0,0.06); padding:15px 20px; font-size:14px; color:#666666; line-height:30px; text-align:center; position:relative; white-space:nowrap;}
.onCon:after{ display:block; content:""; width:0; height:0; border-left:10px solid #FFFFFF; border-top:10px solid transparent; border-bottom:10px solid transparent; position:absolute; left:100%; bottom:20px;}
.onWx{ width:3.1rem; overflow:hidden; margin:0 -.1rem;}
.onWx li{ float:left; width:50%; padding:0 .1rem; margin:0;}
.onWx img{ width:100%; height:auto; margin:0 auto 5px;}
.onLine li.active a{ background-color:rgba(51,51,51,0.9);}
.onLine li.active .onBox{ opacity:1; visibility:visible; transform:translateX(0);}
.onLine li:first-child .onBox{ bottom:auto; top:0;}
.onLine li:first-child .onCon:after{ bottom:auto; top:20px;}
#fp-nav{ z-index:1;}
#fp-nav ul li{ height:24px;}
#fp-nav ul li a span{ display:block; top:auto; bottom:0; margin:0 auto; width:1px; height:100%; background:rgba(255,255,255,0.35); transition:all .3s;}
#fp-nav ul li a.active{ background:url(../imgs/ico_car.png) center center no-repeat; background-size:contain;}
#fp-nav ul li a.active span{ width:1px; height:0; margin:0 auto;}
#fp-nav.red ul li a span{ background:rgba(0,0,0,0.18);}
#fp-nav.red ul li a.active{ background-image:url(../imgs/ico_car2.png);}
#fp-nav ul li:hover a:not(.active) span{ width:1px; height:100%; margin:0 auto; background:#e60012;}
#fp-nav ul li:hover a.active span{ width:1px; height:0%; margin:0 auto;}

.pageImg{ overflow:hidden;}
.pageImg .imgBg{ animation:pulse 24s linear infinite;}
.pageText{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:1; color:#FFFFFF; padding:.3rem 0 10%;}
.pageTit{ font-size:42px; line-height:140%; max-width:600px; margin:.2rem 0;}
.pageDes{ font-size:16px; line-height:30px; max-width:577px; margin:.2rem 0 .4rem;}
.pageBtn{ font-size:0;}
.pageBtn a{ display:inline-block; vertical-align:middle; width:150px; height:40px; line-height:36px; border-radius:20px; color:#FFFFFF; border:2px solid #FFFFFF; font-size:18px; text-align:center; margin:.1rem; transition:all .3s;}
.pageBtn a:first-child{ background:#FFFFFF; color:#89a9c0; margin-left:0;}
.pageBtn a:hover{ box-shadow:2px 2px 5px rgba(0,0,0,0.2); transform:translateY(-2px);}

@media (max-width:1600px){
	.header{ padding:0 2%;}
	.logo{ height:80px;}
	.logo img{ height:40px;}
	.navList > li{ margin:0 20px;}
	.navList > li > a{ height:80px; line-height:80px; background-size:30px;}
	.navRig{ line-height:80px;}
	.navSub{ width:800px; padding:30px 40px 40px;}
	.navSubTit{ font-size:26px; line-height:32px; max-width:320px;}
	.navSubLef{ font-size:14px;}
	.navList2 li a{ font-size:14px;}
	.navList2 li a span{ width:24px;}
	.searchTit{ font-size:36px; margin-bottom:.6rem;}
	.searchInput{ font-size:16px;}
	.menuList li h3{ margin-bottom:.2rem;}
	.menuList li h3 a{ font-size:20px;}
	.menuSub p{ margin:5px 0;}
	.menuSub p a{ font-size:14px;}
	.footBg{ padding:0 2%;}
	.ftTop{ padding:.35rem 0;}
	.ftTit{ font-size:16px;}
	.ftBot{ padding:.2rem 0;}
	.onLine li a{ width:50px; height:50px;}
	.onCon{ line-height:20px;}
	.onCon:after{ bottom:15px;}
	.onLine li:first-child .onCon:after{ top:15px;}
	.pageTit{ font-size:32px;}
	.pageDes{ font-size:14px; line-height:28px;}
	.pageBtn a{ width:130px; font-size:16px;}
}
@media (max-width:1400px){
	.navList > li{ margin:0 15px;}
	.navRig{ margin:0 -10px;}
	.navRig li{ padding:0 10px;}
	.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);}
	.navSubTit{ font-size:22px;}
	.ftShare li a{ width:40px; height:40px; background-size:cover;}
}
@media (max-width:1200px){
	.navList{ display:none;}
	.ftTop{ display:none;}
	.ftBot{ border:none;}
	.ftLef{ float:none; width:100%;}
	.ftLogo{ float:none; margin:0 auto .1rem; border:none; max-width:50%;}
	.ftLogo img{ width:auto; max-width:100%; margin:0 auto;}
	.ftText{ text-align:center; margin:.1rem 0;}
	.ftShare{ float:none; text-align:center; margin-top:.1rem;}
}
@media (max-width:991px){
	.logo{ height:60px;}
	.logo img{ height:34px;}
	.navRig{ line-height:60px;}
	.searchTit{ font-size:.34rem;}
	.searchClose{ top:.2rem; right:.4rem;}
	.menuList li{ display:block; width:100%; padding:0; margin-bottom:.2rem;}
	.menuList li h3{ margin:0;}
	.menuSub{ font-size:0;}
	.menuSub p{ display:inline-block; vertical-align:middle; padding-right:.1rem;}
	.menuSub p a{ display:block;}
	.onLine{ top:auto; bottom:0;}
	.onLine li{ margin:0; margin-top:2px;}
	.pageText{ padding:.3rem 0 20%;}
	.pageTit{ font-size:28px;}
}
@media (max-width:640px){
	.header{ padding:0 15px;}
	.logo a{ width:34px; overflow:hidden;}
	.footBg{ padding:0 15px;}
	.onWx{ width:4rem;}
	.pageTit{ font-size:.38rem;}
}
@media (max-width:460px){
	.logo{ height:50px;}
	.navRig{ line-height:50px;}
	.navRig i{ font-size:13px;}
	.navRigIco1{ background-size:12px auto; background-position:right center;}
	.navRigIco2{ background-size:10px auto;}
	.navBtn span{ margin-left:7px; width:20px;}
	.searchInput{ font-size:14px;}
	.searchIco{ background-size:16px auto;}
	.menuList li h3 a{ font-size:18px;}
	.ftLogo{ max-width:70%;}
	.onLine li a{ width:40px; height:40px;}
	.onCon{ padding:10px 15px;}
	.onCon:after{ bottom:10px;}
	.onLine li:first-child .onCon:after{ top:10px;}
	.onWx{ font-size:12px;}
	.pageBtn a{ width:100px; height:36px; line-height:34px; font-size:14px; border-width:1px;}
		
}