@charset "utf-8"; body{font-family: "Microsoft YaHei";} .content{width: 1200px; margin: 0 auto;} i,em,b{font-style: normal;} .tit01{text-align: center; } .tit01 h2{font-size: 55px; font-family: "Microsoft YaHei";color: #0c418f;font-weight:normal;position: relative; } .tit01 a{color: #0c418f; } .tit01 p{ font-weight: normal; display: block;font-size:20px;color: #666666;} /**/ .g-guide{ background:#fff; max-height:750px;box-sizing: border-box; font-family:"Microsoft Yahei";clear: both;overflow: hidden;} .guide-video,.guide-con{width:50%;float: left;position: relative;} .guide-video img{width:100%; display: block;} .guide-video i{width: 190px; height: 190px; display: block;background: url(../images/guide-btn.png) no-repeat; position: absolute; left:50%;top:50%;margin-left:-95px;margin-top:-95px; z-index: 1;} .guide-con{} .guide-con img{width:100%; display: block;} .gd-c{ max-width:608px;position: absolute;left:0;top:0;padding:6.25vw 0 0 5vw;} .gd-c em{display: block;font-size: 48px;color:#fff;font-weight: lighter;} .gd-c h3{ font-size: 32px;color: #fafafa;margin:20px 0 45px;} .gd-c p{font-size: 14px;color: #fafafa;font-weight: lighter;line-height: 34px;text-align: justify;} .gd-c ul{margin:3.645vw 0 0; position: relative; clear:both;overflow: hidden; } .gd-c li{padding:0 64px;float: left; text-align: center; position: relative;} .gd-c li::after{content: "";position: absolute;width: 1px;height: 130px;background:#68b1e4;right:0;top:10px;} .gd-c li em{display: block; position: relative;width:90px; height: 90px;overflow: hidden;margin:0 auto 10px;} .gd-c li em img{width:90px;position: absolute;left:0;top:0;-webkit-transition: .35s;-moz-transition: .35s;transition: .35s;} .gd-c li h4{font-size: 20px; color: #fafafa; font-weight: bold;line-height: 34px; } .gd-c li i{ font-size:14px; color: #fafafa;text-align: center; font-weight: lighter;line-height: 26px;height: 26px;display: block;text-transform: uppercase;font-family: "Arial";opacity: 0.66;} .gd-c li:first-child{padding-left:0;} .gd-c li:last-child{padding-right:0;} .gd-c li:last-child::after{width:0;} .gd-c li:hover em img{top:-90px;} @media screen and (max-width:1600px) { .gd-c h3{margin:0px 0 15px;} .gd-c ul{margin:30px 0 0;} } @media screen and (max-width:1401px) { .gd-c{ max-width:538px;padding:30px 0 0 5vw;} .gd-c em{font-size: 40px;} .gd-c h3{ font-size: 28px;margin:0px 0 15px;} .gd-c ul{margin:30px 0 0;} .gd-c li{padding:0 46px;} } /**/ .g-products{height: auto;overflow: hidden; background:#fff;padding:65px 0 80px; box-sizing: border-box; font-family: "Microsoft YaHei";} .g-products .tit01{height:137px;} .products{width:1200px;margin:0 auto;} .pro-nav{width:1200px;height:545px;position: relative;} .nav-clm{width:162px;position: absolute;left:50px;top:104px;z-index: 1;} .nav-clm h3{height:46px;line-height: 46px;text-align: left;font-size: 20px;color: #fff; font-weight: bold;padding:0 20px;border-radius: 16px;display: inline-block;margin-bottom: 20px;} .nav-clm h3 a{color: #fff;} .nav-clm span{height:46px;line-height: 46px;text-align: left;font-size: 20px;color: #fff; font-weight: bold;padding:0 20px;border-radius: 16px;display: block;margin-bottom: 20px;} .nav-clm span a{color: #fff;} .nav-clm h3.cur{background: #0c418f;} .nav-con{width:1200px;} .nav-con dl{width:1200px;height: 545px; position: relative;} .nav-con dl dt{width:1200px;height: 545px;} .nav-con dl dt img{width:100%;display: block;} .nav-con dl dd{position: absolute;right:122px;top:175px;max-width: 330px;} .nav-con dl dd h4{font-size: 18px;color:#000000;font-weight: lighter;padding-bottom: 24px; border-bottom: 1px solid #000; margin-bottom: 20px;} .nav-con dl dd h4 b{font-size: 36px;} .nav-con dl dd h4 a{color: #000000;} .nav-con dl dd p{clear: both;overflow: hidden;margin-bottom: 30px;} .nav-con dl dd p em{width:145px;box-sizing: border-box; font-size: 16px;color: #666666;line-height: 30px;padding-left:32px; display: block;background: url(../images/pro-ico1.png) no-repeat left center;float: left;} .nav-con dl dd p em:nth-child(2n){margin-left:15px;} .nav-con dl dd span{display: block;} .nav-con dl dd span i{display: inline-block; font-size: 17px;color: #0151a3;font-weight: bold;padding-right: 10px;} .pro{width:1200px;margin-top:16px;clear: both;overflow: hidden;} .pro li{margin-right:21px;width:386px;float: left;position: relative;} .pro li img{width:100%;display: block;box-sizing: border-box;border-radius: 10px;border: 1px solid #eee;} .pro li h4{width:100%;margin-top:20px; height: 35px;line-height: 35px;font-size: 16px;color:#333333;font-weight: bold; text-align: center;-webkit-transition: .35s;-moz-transition: .35s;transition: .35s;} .pro li:hover h4{color:#278fd9;} .pro li:hover img{border:2px solid #278fd9;} /**/ .g-super{ height: auto;overflow: hidden;background:#f7f7f7;padding-top:65px; box-sizing: border-box; font-family: "Microsoft YaHei";} .g-super .tit01{height:140px;} .super{width:1400px;height: 792px;margin:0 auto;position: relative;} .super-nav{width:896px;height: 792px;background:rgba(39, 143, 217, 0.9);position: absolute;left:50%;margin-left:-960px;padding-right:68px;box-sizing: border-box;z-index: 1;} .super-nav{text-align: right;} .super-nav li{position: relative;height:198px;border-bottom: 1px solid rgba(255, 255, 255, 0.2);padding-top: 35px;box-sizing: border-box;} .super-nav li::after{content: "";position: absolute;right:-140px;top:-6px;height:198px;width:954px;background:#b5d9f2;border-top-right-radius: 120px;border-bottom-right-radius: 120px;border:6px solid rgba(39, 143, 217, 0.9);border-left:0;opacity: 0;-webkit-transition: 0.35s;-moz-transition:0.35s;transition: 0.35s;} .super-nav li .supert{width:80px;height:75px;position: absolute;right:-88px;top:55px;z-index: 2;display: none;} .super-nav li .supert img{width:80px;height:75px;display: block;} .super-nav li .supertit{position: relative; font-weight: bold; font-size: 28px;color: #fff;height:75px;z-index: 2;display: block;} .super-nav li .supertit em{width:64px;height:56px;overflow: hidden;float: right;margin-left:10px;} .super-nav li .supertit em img{width:100%;display: block;} .super-nav li .supertit i{display: block; font-size: 12px;font-family: Arial, Helvetica, sans-serif;color: rgba(255, 255, 255, 0.3);text-transform: uppercase;} .super-nav li .supertit2{position: relative;font-size: 16px;font-weight: bold; color: #90b4d7;text-transform: uppercase; height:55px;z-index: 2;display: none;} .super-nav li .supertit2 b{ font-size: 32px;color: #0c418f;} .super-nav li p{ font-size: 22px;color: rgba(255, 255, 255, 0.8);position: relative;z-index: 2;} .super-con{} .super-con p{width: 1920px;height: 792px;} .super-con p img{width: 100%;display: block;margin-left: -255px;position: relative;} .super-c {width: 680px;position: absolute;right:0;bottom: 60px;z-index: 1;text-align: right;} .super-c dd h4{font-size: 62px;color:#ffffff;margin-bottom: 10px; } .super-c dd p{font-size: 18px;color: #fff;line-height: 33px;} .super-c .count{clear: both;overflow: hidden;margin-top:40px;float: right;} .super-c .count li{width:114px;border:3px solid rgba(255, 255, 255, 0.5);height:142px;float: left;margin-right: 24px; font-size: 14px;font-family: Arial, Helvetica, sans-serif;text-align: left;padding:12px;box-sizing: border-box;font-weight: normal;color: #fff;white-space: nowrap;} .super-c .count li:last-child{margin-right: 0;} .super-c .count li b{font-size: 42px; font-weight:normal;display: block;} .super-c .count li span{display: block;margin-bottom: 12px; font-size: 16px;} .super-nav li.cur{padding-top:50px;padding-right:40px;} .super-nav li.cur .supertit{display: none;} .super-nav li.cur::after{opacity: 1;} .super-nav li.cur .supert,.super-nav li.cur .supertit2{display: block;} .super-nav li.cur p{ font-size: 18px;color: #0c418f;font-weight: bold;} /**/ .g-partner{height:auto;padding:105px 0 80px; box-sizing: border-box; font-family: "Microsoft YaHei"; position: relative; } .g-partner .tit01{height:150px;} .partner{width:1400px;margin:0 auto;} .partner img{width: 100%;display: block;} .partner img{-webkit-transition: 0.35s;-moz-transition:0.35s;transition: 0.35s;} .partner img:hover{-webkit-transform:scale(1.02);-moz-transform:scale(1.02);-ms-transform:scale(1.02);transform:scale(1.02);} @media screen and (max-width:1401px) { .partner,.super{width:1200px;} .super-c {width: 585px;} } /**/ .g-process{height:880px; position: relative; box-sizing: border-box; background:url(../images/processbg.jpg) no-repeat center top; font-family:"Microsoft Yahei";padding:70px 0 0;} .g-process .tit01{height:155px;} .process{width:1400px; height:456px; position: relative;margin:0 auto;border:1px solid #fff;background: rgba(39, 143, 217, 0.9);} .process ul{} .process li{width:280px;float: left;height: 228px;position: relative;padding:60px 48px 0;box-sizing: border-box;border-right: 1px solid #74b5e3;border-bottom: 1px solid #74b5e3;} .process li .lctit{width:100%;text-align: left;} .process li .lctit h4{height:52px;line-height: 52px; padding-bottom: 12px;margin-bottom: 15px; border-bottom: 1px solid rgba(255, 255, 255,0.66); font-size: 18px;color: #ffffff;} .process li .lctit em{width:54px;height:52px;display: block;margin-right: 10px;margin-left:-7px; position: relative; overflow: hidden; float: left;} .process li .lctit img{width:54px;display: block;position: absolute;left:0;top:0;} .process li .lctit i{font-size: 12px;color: #fff;font-weight: lighter;text-transform: uppercase;display: block;line-height: 25px; } .process li:nth-child(5n){border-right: 0;} .process li:nth-child(n+6){border-bottom: 0;} .process li:nth-child(-n+5)::before{content:'';position:absolute;top:50%;right:-10px;width:0px;height: 0px;z-index: 0;border-left:10px solid #fff;border-top:10px solid rgba(0, 0, 0, 0);border-bottom:10px solid rgba(0, 0, 0, 0);} .process li:nth-child(n+6)::after{content:'';position:absolute;top:50%;right:0px;width:0px;height: 0px;z-index: 0;border-right:10px solid #fff;border-top:10px solid rgba(0, 0, 0, 0);border-bottom:10px solid rgba(0, 0, 0, 0);} .process li:last-child::after{content:'';position:absolute;top:0;left:50%;width:0px;height: 0px;z-index: 0;border-top:10px solid #fff;border-left:10px solid rgba(0, 0, 0, 0);border-right:10px solid rgba(0, 0, 0, 0);margin-left:-5px;} .process li:nth-child(5)::before{border:0;} .process li .lc-c{width:0;height:0;transform:translate(-50%,-50%);margin-left:148.5px;margin-top:123.5px; position: absolute;left:-9px;top:-9px; z-index: 2;opacity: 0;-webkit-transition: .3s;-moz-transition: .3s;transition: .3s;} .process li dl{text-align: center;width:100%;height:100%; display: block;border-radius: 10px;overflow: hidden;box-shadow: 0 0 18px #000000;position: relative;} .process li dt{width:100%;} .process li dt::after{content:'';position:absolute;height:100%;width:100%;top:0;bottom:0;left:0;right:0;background:rgba(255, 255, 255, 0.9);} .process li dt img{width: 100%;display: block;} .process li dd{width: 100%;position: absolute;left:0;top:0;} .process li dd img{width:80px;height:60px;display: block;margin:50px auto 10px;} .process li dd h4{font-size: 23px;color: #278fd9;line-height: 34px;font-weight: bold;} .process li dd i{font-size: 15px;color: #278fd9;font-weight: lighter;text-transform: uppercase;display: block;line-height: 35px; } .process li.cur .lc-c{opacity: 1;width:297px;height:247px;} .process-tel{text-align: center;margin:53px auto 0;width:520px;} .process-tel b{display: block;font-size: 26px;color: #000000;line-height: 30px; font-family: Arial, Helvetica, sans-serif;padding-left:70px;background: url(../images/lc-tel.png) no-repeat left center; float: left;} .process-tel a{float: right; display: block;text-align: center;width:168px;height:48px;line-height: 48px;border-radius: 10px;font-size: 23px;color: #fff;font-weight: normal;background:#0c418f;margin-top:10px;} @media screen and (max-width:1401px) { .process{width: 1200px;} .process li{width:240px;} .process li .lc-c{left:-28px;} .process li .lctit h4{font-size: 16px;white-space:nowrap;} } /**/ .g-news{ height: 690px; padding-top:90px; overflow: hidden; font-family:"Microsoft Yahei";} .g-news .tit01{ height:132px;} .news{width:1400px;position: relative;margin:0 auto;} .new-tit{ height: 82px; margin-left:340px;} .new-tit h3{ width: 170px; height: 48px; float: left; margin-right:12px; text-align: center;} .new-tit h3 a{ display: block; font-size: 18px; color: #333; line-height: 48px; font-weight: bold; border-radius: 2rem; border:2px solid rgba(0, 0, 0, 0);} .new-tit .cur a,.new-tit h3 a:hover,.new-tit span a:hover{ border: 2px solid #3f8bca; color: #3f8bca;} .new-tit span{ width: 170px; height: 48px; float: left; margin-right:12px; text-align: center;display: block;} .new-tit span a{ display: block; font-size: 18px; color: #333; line-height: 48px; font-weight: bold; border-radius: 2rem; border:2px solid rgba(0, 0, 0, 0);} .news-con dl{width: 327px; float: left; margin-right:30px;} .news-con dl:last-child{ margin-right:0;} .news-con dt{ width: 327px; height: 183px; overflow: hidden;} .news-con dt img{ display: block;width: 100%;-webkit-transition: 0.5s;-moz-transition:0.5s;transition: 0.5s;} .news-con dd h3 a{display: block; font-size: 18px; color: #333; line-height: 48px; font-weight: bold; margin:15px 0 5px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} .news-con dd p{ font-size: 14px; line-height: 27px; color: #666;} .news-con dd span a{display: block; width: 52px; height: 32px;background: url(../images/news-ico1.png) no-repeat left center; margin-top:52px;} .news-con dl:hover dt img{-webkit-transform:scale(1.05);-moz-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);} .news-con dl:hover dd h3 a{ color: #3f8bca;} @media screen and (max-width:1401px) { .news{width: 1200px;} .new-tit{ margin-left:240px;} .news-con dl{width: 277px;} .news-con dt{ width: 277px; height: 155px;} } /**/ .g-about{background:#fff;height:auto;font-family:"Microsoft Yahei";box-sizing: border-box; overflow: hidden; position: relative;padding-bottom: 92px;} .g-about img{width:100%;display: block;} .about{width:1200px;margin:55px auto 60px; } .about dl{width:100%; position: relative; } .about dl dt{width:460px;float: left;} .about dl dt h3{font-size: 20px; color: #000000;text-align: left; line-height: 78px;margin-bottom: 18px;} .about dl dt h3 i{display: block;color: #000000; font-size:50px;line-height: 40px; font-weight: bold;} .about dl dt h3 a{color: #000;} .about dl dt span{clear: both;overflow: hidden;} .about dl dt span a{height: 80px; line-height:normal;width: 115px; text-align: center; font-size: 16px; color: #ffffff;position: relative; display: block; float: left;font-weight: normal;border-radius: 10px;margin-right: 19px;background: #278fd9;} .about dl dt span img{width:34px;height:30px;display: block;margin:10px auto;} .about dl dt span a:first-child{background: #0c418f;} .about dl dd{width: 740px;float: right;text-align: justify;} .about dl dd .abt-desc{padding:30px 0;border-top:1px solid #000000;border-bottom: 1px solid #000000;} .about dl dd p{color: #000000;font-size: 14px;line-height: 22px; text-align: justify;opacity: 0.8;margin-bottom: 15px;} .about dl dd h4{color: #000000;font-size: 15px;line-height: 23px;font-weight: bold; text-align: justify;opacity: 0.9;} .about dl dd .abt-more{height:22px;line-height: 22px;font-weight: bold; font-size: 14px;color: #000000;text-align: right;margin-top:20px;display: block;} .about dl dt img{-webkit-transition: .5s;-moz-transition: .5s;transition: .5s;} .about dl:hover dt img{-webkit-transform:scale(1.01);-moz-transform:scale(1.01);-ms-transform:scale(1.01);transform:scale(1.01);} /*友情链接*/ .g-link{ overflow: hidden;background:none;min-height: 60px;background: #002b6d; } .link{width:1200px; margin: 0 auto; height:auto; overflow: hidden;font-family:"Microsoft Yahei";padding:40px 0 30px;} .link h2{font-size:14px ;font-weight:normal; text-transform: uppercase; width: 80px; float: left;height: 23px; line-height: 23px;color: #fff;opacity: 0.6;} .link p{ width: 1120px; overflow: hidden; line-height: 23px; color:#7e7e7e;position: relative;z-index: 1;} .link p a{ color: #fff; font-size: 14px; padding: 0 45px 0 0; text-align: left; opacity: 0.6;} @-webkit-keyframes spin{ from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 50% { -webkit-transform: rotate(180deg); transform: rotate(180deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes spin { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 50% { -webkit-transform: rotate(180deg); transform: rotate(180deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /*animation*/ @-webkit-keyframes hvr-buzz-out { 10% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg); } 20% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg); } 30% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg); } 40% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg); } 50% { -webkit-transform: translateX(2px) rotate(1deg); transform: translateX(2px) rotate(1deg); } 60% { -webkit-transform: translateX(-2px) rotate(-1deg); transform: translateX(-2px) rotate(-1deg); } 70% { -webkit-transform: translateX(2px) rotate(1deg); transform: translateX(2px) rotate(1deg); } 80% { -webkit-transform: translateX(-2px) rotate(-1deg); transform: translateX(-2px) rotate(-1deg); } 90% { -webkit-transform: translateX(1px) rotate(0); transform: translateX(1px) rotate(0); } 100% { -webkit-transform: translateX(-1px) rotate(0); transform: translateX(-1px) rotate(0); } } @keyframes hvr-buzz-out { 10% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg); } 20% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg); } 30% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg); } 40% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg); } 50% { -webkit-transform: translateX(2px) rotate(1deg); transform: translateX(2px) rotate(1deg); } 60% { -webkit-transform: translateX(-2px) rotate(-1deg); transform: translateX(-2px) rotate(-1deg); } 70% { -webkit-transform: translateX(2px) rotate(1deg); transform: translateX(2px) rotate(1deg); } 80% { -webkit-transform: translateX(-2px) rotate(-1deg); transform: translateX(-2px) rotate(-1deg); } 90% { -webkit-transform: translateX(1px) rotate(0); transform: translateX(1px) rotate(0); } 100% { -webkit-transform: translateX(-1px) rotate(0); transform: translateX(-1px) rotate(0); } }