@charset "utf-8"; /* CSS Document */ @media screen and (min-width:960px){ .header-PC{display: block} .header-M{display: none;} } @media screen and (max-width:959px){ .header-PC{display: none} .header-M{display: block; height: 50px;} } .icon-country:before { font-size: 1.8em; } .icon-menu:before { font-size: 2em } .icon-close:before { font-size: 1.8em; } .Country:before{position: absolute;top: -15px;} /*搜索框字体颜色*/ -webkit-input-placeholder { /* WebKit browsers */ color: #999; } -moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #999; } -moz-placeholder { /* Mozilla Firefox 19+ */ color: #999; } -ms-input-placeholder { /* Internet Explorer 10+ */ color: #999; } /*PC端*/ .header-PC .top{height: 42px; background-color:#252525; color:#FFF;} .header-Product .top{position: fixed; top:0px; width:100%; z-index: 99999;} .header-PC .top-L{width:50%; text-align:left; font-size: 0.875em; line-height: 40px; float: left; position: relative;} .header-PC .top-L img{margin-top: 13px; width:24px; height: 16px;} .header-PC .top-L img:hover, .header-PC .top-L span:hover{cursor: pointer;} .header-PC .top-L a{color:#FFF;} .header-PC .top-L a:hover{color:rgba(255,255,255,0.8);} /*.header-PC .top-L{display:inline-block; margin-left:5px; line-height: 28px;}*/ .top-old{display: inline-block; margin-left:5px; margin-right: 4px; width:1px; height:9px; background-color:rgba(255,255,255,0.8);} .header-PC .top-R{width:50%; text-align: right; float: left; font-size: 1em; line-height: 39px;} .header-PC .top-R a{color:#FFF;} .header-PC .top-R a:hover{color:#009fdf} .header-PC .logo{width:16%; float: left; height: 60px; left:0px; vertical-align:middle; line-height: 60px;} .header-PC .logo img{vertical-align: middle; max-width: 100%;} .header-PC .top-country{background-color:#f1f1f1; display: block; color:#333333; padding:15px 0 0; border-top: 1px solid rgba(255,255,255,0.6); font-size: 0.875em; top:40px; box-shadow: 5px 5px 10px rgba(0,0,0,0.2);width:250px; position: absolute; font-weight: 600;} .header-PC .top-country li{width:220px; margin-left: 1%;margin-right:2.25%; border-bottom: 1px solid rgba(0,0,0,0.1); padding-top:0.8vw; padding-bottom: 0.8vw; line-height: 19px;} .header-PC .top-country li a {color: #333;} .header-PC .top-country li a:hover {color: #009fdf;} .header-PC .top-country li:nth-child(5n){margin-right:0px;} .header-PC .top-country li p{display: inline-block;} .header-PC .top-country li p:last-child{margin-left:10%;vertical-align:top} .header-PC .top-country li:last-child{border-bottom: none;} .header-PC .top-country ul:after{width:10px; height: 5px; content: ""; background:url(../images/countries/arrow.png); position: absolute; top:-20px; left:7px; z-index: 99999} .header-PC .nav .navfl{float:right; width:84%; text-align: right;} .header-PC .nav-bg{background-color:#efefef; border-bottom: 1px solid rgba(0,0,0,0.5);} .header-PC .top-country .close{width:100%; overflow: hidden; text-align: center;} .header-PC .top-country .icon-close{width:3em; height: 3em; border-radius: 1.5em; display: inline-block; background-color:#333; color:#FFF; line-height: 3em; font-size: 10px; margin-top:20px;} .header-PC .top-country .icon-close:hover{cursor: pointer;} /*国家*/ .top-country .countries{display:inline-block; width:28px; height: 19px; background:url("../images/countries/countries.png") no-repeat; } .top-country .AE{background-position: 0px 0px;} .top-country .AR{background-position: -29px 0px;} .top-country .AT{background-position: -58px 0px;} .top-country .AU{background-position: -87px 0px;} .top-country .AZ{background-position: -116px 0px;} .top-country .BD{background-position: -145px 0px;} .top-country .BE{background-position: -174px 0px;} .top-country .BG{background-position: -203px 0px;} .top-country .BL{background-position: -232px 0px;} .top-country .BO{background-position: -261px 0px;} .top-country .BR{background-position: -290px 0px;} .top-country .CA{background-position: -319px 0px;} .top-country .CH{background-position: -348px 0px;} .top-country .CL{background-position: -377px 0px;} .top-country .ZH{background-position: -406px 0px;} .top-country .CO{background-position: -435px 0px;} .top-country .CS{background-position: -464px 0px;} .top-country .CY{background-position: -493px 0px;} .top-country .DB{background-position: -522px 0px;} .top-country .DE{background-position: -551px 0px;} .top-country .KR{background-position: 0px -20px;} .top-country .KH{background-position: -29px -20px;} .top-country .JP{background-position: -58px -20px;} .top-country .JQ{background-position: -87px -20px;} .top-country .IT{background-position: -116px -20px;} .top-country .IR{background-position: -145px -20px;} .top-country .IQ{background-position: -174px -20px;} .top-country .IN{background-position: -203px -20px;} .top-country .IL{background-position: -232px -20px;} .top-country .IE{background-position: -261px -20px;} .top-country .ID{background-position: -290px -20px;} .top-country .HU{background-position: -319px -20px;} .top-country .HK{background-position: -348px -20px;} .top-country .GR{background-position: -377px -20px;} .top-country .GH{background-position: -406px -20px;} .top-country .FR{background-position: -435px -20px;} .top-country .ES{background-position: -464px -20px;} .top-country .EG{background-position: -493px -20px;} .top-country .EE{background-position: -522px -20px;} .top-country .DK{background-position: -551px -20px;} .top-country .KSA{background-position: 0px -40px;} .top-country .KW{background-position: -29px -40px;} .top-country .KZ{background-position: -58px -40px;} .top-country .LA{background-position: -87px -40px;} .top-country .LB{background-position: -116px -40px;} .top-country .LK{background-position: -145px -40px;} .top-country .LT{background-position: -174px -40px;} .top-country .MA{background-position: -203px -40px;} .top-country .MDV{background-position: -232px -40px;} .top-country .MM{background-position: -261px -40px;} .top-country .MX{background-position: -290px -40px;} .top-country .MY{background-position: -319px -40px;} .top-country .NG{background-position: -348px -40px;} .top-country .NL{background-position: -377px -40px;} .top-country .NO{background-position: -406px -40px;} .top-country .NP{background-position: -435px -40px;} .top-country .NZ{background-position: -464px -40px;} .top-country .PE{background-position: -493px -40px;} .top-country .PG{background-position: -522px -40px;} .top-country .PH{background-position: -551px -40px;} .top-country .ZA{background-position: 0px -60px;} .top-country .VN{background-position: -29px -60px;} .top-country .UY{background-position: -58px -60px;} .top-country .US{background-position: -87px -60px;} .top-country .UK{background-position: -116px -60px;} .top-country .UA{background-position: -145px -60px;} .top-country .TW{background-position: -174px -60px;} .top-country .TR{background-position: -203px -60px;} .top-country .TN{background-position: -232px -60px;} .top-country .TH{background-position: -261px -60px;} .top-country .SYR{background-position: -290px -60px;} .top-country .SK{background-position: -319px -60px;} .top-country .SGL{background-position: -348px -60px;} .top-country .SG{background-position: -377px -60px;} .top-country .SE{background-position: -406px -60px;} .top-country .RU{background-position: -435px -60px;} .top-country .RO{background-position: -464px -60px;} .top-country .PT{background-position: -493px -60px;} .top-country .PL{background-position: -522px -60px;} .top-country .PK{background-position: -551px -60px;} .top-country .ZM{background-position: 0px -80px;} .header-PC .nav .navfl{float:right; width:84%; text-align: right;} .header-PC .nav-bg{background-color:#efefef; border-bottom: 1px solid rgba(0,0,0,0.5);} /*原样式*/ .topnav{width:100%;padding:90px 0 104px 0;background:#002855;position:absolute;top:28px;left:0px;z-index:9999;display:none;} @media screen and (min-width:1480px){ .w1440{width:1440px; margin-left: auto; margin-right: auto;} } @media screen and (max-width:1479px){ .w1440{width:98%; margin-left: auto; margin-right: auto;} } .header-Index .nav{width:100%;height:60px;background-color: transparent;position:absolute; z-index: 99;} .header-Product .nav{width:100%;height:60px;background-color: #FFF;position:fixed; z-index: 9999; top:40px; box-shadow: 0px 0px 15px #999;} .nav .top{position:absolute;left:24px;} .nav .top .zg{font-size:16px;color:#002855;line-height:60px;} .nav .top .zg i{display:inline-block;width:23px;height:22px;background:url(../images/china.png);vertical-align:middle;margin-right:6px; ;} .navcon{width:990px;margin:0 auto} /*.nav .logo{position:absolute;left:50%;top:19px;transform:translate(-34%,0%);z-index:999;}删除*/ .nav .navfl{float:left;} .nav .navfl .navul{float:left; width:100%; } .nav .navfl .navul li{display:inline-block;line-height:60px;} @media screen and (min-width:1280px){ .nav .navfl .navul li{padding-left:30px;} } @media screen and (max-width:1279px){ .nav .navfl .navul li:first-child{padding-left:0px;} .nav .navfl .navul li{padding-left:15px;} } @media screen and (max-width:980px){ .nav .navfl .navul li{padding-left:10px;} } .nav .navfl .navul li:first-child{margin-left:0px;} .nav .navfl .navul li a{font-size:1em;} .nav .navfl .navul .products a{font-size:1em;} .nav .navfl .navul li span{display: inline-block; } .nav .navfl .navul li .arrow{ vertical-align: bottom; line-height:55px; font-size: 16px; margin-left:5px;transform:rotate(180deg); -ms-transform:rotate(180deg); /* IE 9 */ -moz-transform:rotate(180deg); /* Firefox */ -webkit-transform:rotate(180deg); /* Safari 和 Chrome */ -o-transform:rotate(180deg); } .nav .navfl .navul li .arrow-down{ transform:rotate(360deg); -ms-transform:rotate(360deg); /* IE 9 */ -moz-transform:rotate(360deg); /* Firefox */ -webkit-transform:rotate(360deg); /* Safari 和 Chrome */ -o-transform:rotate(360deg); vertical-align: bottom; line-height:55px; font-size: 16px; margin-left:5px; } .nav .navfl .navul li a:hover{color:#009fdf;} .nav .navfl .navul li .menu_a{color:#444;} .nav .navfl .navul li .menu_a:hover{color:#009fdf;} .nav .navrh .rhlist li.lispan{margin-right:50px;} .nav .navfl .navul li.ahover a,.nav .navrh .rhlist li.ahover a{color:#009fdf} .nav .navfl .navul li .navlist{width:100%;position:absolute;left:0;right:0;display:none;z-index:999999;} .nav .navfl .navul li .navlist .listfl{width:55%;height:331px;background:#efefef;float:left;} .nav .navfl .navul li .navlist .listfl .navicon{float:right;width:540px;margin-top:69px;} .nav .navfl .navul li .navlist .listfl a{display:inline-block;width:25%;text-align:center;line-height:40px; float: left; margin-bottom: 20px;} .nav .navfl .navul li .navlist .listfl a img{display:inline-block; width:42px;} .nav .navfl .navul li .navlist .listfl a p{font-size:14px;color:#444;text-align:center; margin-bottom: 12px;} .nav .navfl .navul li .navlist .listrh{width:45%;height:331px;background:#e3e3e3;float:right;} .nav .navfl .navul li .navlist .listrh .navimg{margin:30px 24px 0;} .nav .navfl .navul li .navlist .listrh .navimg .liimg{float:left;} .nav .navfl .navul li .navlist .listrh .navimg .liimg img{width:281px;} .nav .navfl .navul li .navlist .listrh .navtit{height:118px;float:left;margin-left:20px; text-align: left;} .nav .navfl .navul li .navlist .listrh .navtit p{line-height:normal;} .nav .navfl .navul li .navlist .listrh .navtit .ntit{font-size:14px;color:#444;margin-top:20px; margin-bottom: 16px;} .nav .navfl .navul li .navlist .listrh .navtit .nline{width:23px;height:2px;background:#26a6e1;margin:10px 0 50px 0;} /*头部新增 s*/ .nav .navfl .navul li .navlist1{background:#efefef;padding:59px 0 56px 0;} .nav .navfl .navul li .navlist1 dd{width:575px;margin:0 auto;} .nav .navfl .navul li .navlist1 dd .ddfl{float:left;} .nav .navfl .navul li .navlist1 dd .ddfl a{display:block;font-size:14px;color:#444;line-height:normal;margin-bottom:18px;} .nav .navfl .navul li .navlist1 dd .ddfl a:hover{color:#009fdf;} .nav .navfl .navul li .navlist1 dd .ddfl a:first-child{margin-top:15px;} .nav .navfl .navul li .navlist1 dd .ddfl a:last-child{margin-bottom:0px;} .nav .navfl .navul li .navlist1 dd .ddrh{float:right;} .nav .navfl .navul li .navlist2{background:#efefef;padding:59px 0 56px 0;} .nav .navfl .navul li .navlist2 dd{width:520px;margin:0 auto;} .nav .navfl .navul li .navlist2 dd .ddfl{float:left;} .nav .navfl .navul li .navlist2 dd .ddfl a{display:block;font-size:14px;color:#444;line-height:normal;margin-bottom:18px;} .nav .navfl .navul li .navlist2 dd .ddfl a:hover{color:#009fdf;} .nav .navfl .navul li .navlist2 dd .ddfl a:first-child{margin-top:15px;} .nav .navfl .navul li .navlist2 dd .ddfl a:last-child{margin-bottom:0px;} .nav .navfl .navul li .navlist2 dd .ddrh{float:right;} /*头部新增 e*/ .nav .navrh{float:right;} .nav .navrh .rhlist{float:left;} .nav .navrh .rhlist li{display:inline-block;line-height:60px;margin-right:50px;} .nav .navrh .rhlist li:last-child{margin-right:0px;} .nav .navrh .rhlist li a{font-size:16px;color:#002855;} .nav .navrh .rhlist li span{display:inline-block;width:1px;height:24px;background:#002855;line-height:40px;vertical-align:middle;} .nav .navrh .rhlist li:hover a{color:#009fdf;} .header-PC .Searchbox{position:absolute;right:56px;top:20px; height: 60px; background-color: #FFF;} .header-PC .Searchbox .icon{cursor:pointer;} .header-PC .Searchbox .icon img{vertical-align:middle;margin:-3px 10px 0 0;} .header-PC .search{display:none;background:#fff;width:100%; height:60px; position:absolute;right:0px;top:28px;z-index:888;} .header-PC .search .ipt{width:80%;height:30px;line-height:30px;text-indent:1em;} .header-PC .search .searchbtn{color:#fff; cursor:pointer; width:70px; height:30px; border-radius:13px; background:#002855; position:absolute; right:0px; top:0px;} #wap-search-in {height: 30px; line-height: 30px; margin-top:15px; border: none; width: 40%; margin-left:30%; } #wap-search-btn{} .header-PC .search button{color:#444; background-color: transparent; font-size: 24px; line-height: 60px;} /*.topnav{width:100%;padding:90px 0 104px 0;background:#002855;position:absolute;top:90px;left:0px;z-index:999;display:none;}删除*/ .topul li{width:20%;float:left;margin-right:6.6%;} .topul li:nth-child(4n){margin-right:0px;} .topul li p{font-size:24px;color:#fff;} .topul li dl{margin-top:48px;} .topul li dl dd{margin-bottom:22px;} .topul li dl a{float:left;font-size:18px;color:#fff;} .topul li dl a:nth-child(2n){float:right;font-size:18px;color:#009fdf;padding-bottom:8px;border-bottom:1px solid #008eca;} /*手机端*/ .header-M .header-fixed{height: 50px; line-height: 50px; position: fixed; top:0px; width:100%; background-color:#FFF; z-index: 9; margin-bottom: 50px;} .header-M .logo{width:130px; margin:auto; height: 50px; line-height: 50px;} .header-M .logo img{vertical-align: middle; display: inline-block;} .header-M .Country{border-radius: 1.5em; position: absolute; top:50%; left:8%; z-index: 1; line-height: 50px; text-align: center; color:#333; margin-left:-3px; margin-top:-10px; cursor: pointer;} .m-Country{width:100%; height: 100%; position: fixed; top:50px; left:0; background-color:#FFFFFF; z-index: 2; line-height: 30px;} .m-Menu{width:100%; height: 100%; position: fixed; top:50px; left:0; background-color:#2c5c8f; z-index: 999999;} .header-M .Menu{position: absolute; top:0px; right:8%; color:#333; margin-right:-3px;cursor: pointer;} .Country img{margin-right:5px;} .m-Menu li{border-bottom:1px solid #204f7e; position: relative; opacity: 0} .m-Menu li li{line-height: 38px; opacity: 1} .m-Menu li li a{margin-top:-1px; padding-left:0px; line-height: 36px; display: inline-block} .m-Menu li a{padding-left:8%; color: #FFF; text-decoration: none; line-height: 45px; font-size: 1em; display: block;} .m-Menu li .arrow, .m-Menu li .arrow-r{ color:#FFF; position: absolute; right:8%; font-size: 1.4em; line-height: 30px;} .m-Menu li .arrow{top:7px;} .m-Menu li .arrow-r{top:9px;} .nav .arrow, .m-Menu li .arrow{ transform:rotate(180deg); -ms-transform:rotate(180deg); /* IE 9 */ -moz-transform:rotate(180deg); /* Firefox */ -webkit-transform:rotate(180deg); /* Safari 和 Chrome */ -o-transform:rotate(180deg); } .nav .arrow, .m-Menu li .arrow-r{ transform:rotate(360deg); -ms-transform:rotate(360deg); /* IE 9 */ -moz-transform:rotate(360deg); /* Firefox */ -webkit-transform:rotate(360deg); /* Safari 和 Chrome */ -o-transform:rotate(360deg); } .m-Menu li, .SingIn-button, .search{ -webkit-animation-name: fadeInUp; animation-name: fadeInUp; -webkit-animation-duration: 1s; animation-duration: 1s; animation-fill-mode:forwards ; -webkit-animation-fill-mode:forwards ; } .m-Menu li:nth-child(1){ animation-delay:0s; -webkit-animation-delay: 0s; } .m-Menu li:nth-child(2){ animation-delay:0.1s; -webkit-animation-delay: 0.1s; } .m-Menu li:nth-child(3){ animation-delay:0.2s; -webkit-animation-delay: 0.2s; } .m-Menu li:nth-child(4){ animation-delay:0.3s; -webkit-animation-delay: 0.4s; } .m-Menu li:nth-child(5){ animation-delay:0.4s; -webkit-animation-delay: 0.4s; } .m-Menu li:nth-child(6){ animation-delay:0.5s; -webkit-animation-delay: 0.5s; } .S-Menu{width:100%; background-color:#2e6297; overflow: hidden;} .S-Menu li{border-bottom: 1px solid #285887; padding-left:10%; padding-top:0; color:#FFF; font-size: 0.9em;} .S-Menu li:last-child{border-bottom: none;} .S-Menu li{ -webkit-animation-name: fadeInUp; animation-name: fadeInUp; -webkit-animation-duration: 0s; animation-duration: 0s; animation-delay:0s; -webkit-animation-delay: 0s; } .m-Menu .Close{position: absolute; top:5%; right:8%; color:#333; font-size: 20px; border:2px solid #999; width:42px; height: 42px; border-radius: 21px; text-align: center; box-shadow: 0px 0px 2px #999;} .m-Menu .SingIn-button a{display: inline-block; width:70px; height: 30px; border:1px solid #FFF; color:#FFF; border-radius: 1.6em; margin-left:5px; margin-right:5px; text-align: center; text-decoration: none; margin-top:30px; line-height: 28px; font-size: 1em} .m-Menu .SingIn-button a:hover{border:1px solid #FFF; background-color:#FFF; color: #333;} .m-Menu .search{width:84%; margin:30px auto 0; position: relative; opacity: 0;} .m-Menu .search .form-control{width:90%; height: 32px; line-height: 32px; border:1px solid rgba(220,221,221,0.7); vertical-align: middle; border-radius:1.8em; padding-left:5%; padding-right:5%; font-size: 0.9em; background-color:#FFF;} .m-Menu .search .updown_search_btn{line-height: 35px; background:none; border:none; position: absolute; right:2%; top:0px; font-size: 1.8em; vertical-align: middle; color:#333;} .m-Menu .SingIn-button{opacity: 0} .m-Menu .SingIn-button{ animation-delay:0.53s; -webkit-animation-delay: 0.53s; } .m-Menu .search{ animation-delay:0.55s; -webkit-animation-delay: 0.55s; } .m-Country{padding-top:2%;} .m-Country ul{width:90%; margin:auto;} .m-Country li{width:18%; float: left; margin-right:2.25%; border-bottom: 1px solid rgba(0,0,0,0.1); padding-top:0.8vw; padding-bottom: 0.8vw; line-height: 19px;} .m-Country li p{display: inline-block;} @media screen and (min-width:641px){ .m-Country li:nth-child(5n){margin-right:0px;} } @media screen and (max-width:640px){ .m-Country li{width:23%; margin-right:2%;} .m-Country li:nth-child(4n){margin-right:0px;} } @-webkit-keyframes fadeInUp { 0% { top:1000px; -webkit-transform:translate3d(0, 100%, 0); transform:translate3d(0, 100%, 0) } 100% { opacity:1; -webkit-transform:none; transform:none } } @keyframes fadeInUp { 0% { opacity:0; -webkit-transform:translate3d(0, 100%, 0); transform:translate3d(0, 100%, 0) } 100% { opacity:1; -webkit-transform:none; transform:none } } /*头部导航栏变色*/ .theme-white .navfl .navul li a{color:#FFF;} .theme-black .navfl .navul li a{color:#000;} .theme-white .logo-white{display: block} .theme-white .logo-black{display: none; } .theme-black .navfl .navul li a{color:#000;} .theme-black .logo-white{display: none} .theme-black .logo-black{display: block; } .all-logo, .all-logo-black{position: relative;} @media screen and (min-width:960px){ .logo{position: absolute; left:0; top:0;} } /*公共样式*/ .search input {height: 30px; line-height: 30px; border:none; width:40%;} .banner-other{margin-top:60px; width:100%;} @media screen and (max-width:959px){ .banner-other{margin-top:0px; width:100%;} }