* { padding: 0; margin: 0; -moz-box-sizing: border-box; box-sizing: border-box; } body{ overflow: hidden; } a{ color: #333; } /* start 鍏冪礌娓愰殣 娓愮幇鏍峰紡 */ .flex-table{ display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: flex-start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-items: stretch; -moz-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } /* start 婊氬姩 鍩虹鏍峰紡 */ .slide{ width: 100%; height: 783px; display: inline-block; } .slide li{ width: 100%; height: 100%; } .slick-prev, .slick-next { cursor: pointer; width: 58px; height: 58px; right: 100px; border: none; background: rgba(0, 0, 0, 0.3); border-radius: 50%; text-align: center; position: relative; vertical-align: top; margin-bottom: 5px; -webkit-transition: all .3s; -o-transition: all .3s; -moz-transition: all .3s; transition: all .3s; z-index: 9999; } .slick-prev:hover, .slick-next:hover{ background-color: #1d67ae; } .slick-prev { position: absolute; top: 50%; left: 50px; margin-top: -29px; background: rgba(0, 0, 0, 0.3) no-repeat center; -o-background-size: 26px; background-size: 26px; background-image: url(../images/left-w.png); } .slick-next { position: absolute; top: 50%; margin-top: -29px; right: 50px; background: rgba(0, 0, 0, 0.3) no-repeat center; -o-background-size: 26px; background-size: 26px; background-image: url(../images/right-w.png); } .slick-dots{ bottom: 80px; text-align: center; } .slick-dots li{ width: 60px; height: 5px; border-radius: 0; margin-right: 5px; background: rgba(255, 255, 255, 0.5); -webkit-opacity: 1; -moz-opacity: 1; -ms-opacity: 1; -o-opacity: 1; opacity: 1; } .slick-dots li.slick-active{ background: #1d67ae; } /* end 婊氬姩 鍩虹鏍峰紡 */ body:before{ content: ''; color: #cc0000; width: 100%; height: 20px; top: 0; left: 0; position:fixed; z-index: 999999999; display: none; } .w{ width: 1800px; height: auto; margin: 0 auto; } header{ height: 81px; position: fixed; color: #fff; z-index: 99999; width: 100%; top: 0; } header .bg{ background: #000; border-bottom: 1px #fff solid; opacity: 0.5; position: absolute; width: 100%; height: 100%; z-index: 0; left: 0; top:0; } header .w{ position: relative; z-index: 1; display: flex; align-items: center; height: 100%; } header a.logo img{ width: 247px; height: 58px; } header nav.pc{ flex:1; margin-left: 106px; } header nav.pc > ul{ display: flex; align-items: center; justify-content: flex-start; } header nav.pc > ul li{ position: relative; } header nav.pc > ul li > a{ height: 80px; line-height: 80px; display: inline-block; padding: 0 30px; color: #fff; font-weight: 300; box-sizing: border-box; transition: all 0.3s; } header nav.pc > ul li > a:hover,header nav.pc > ul li > a.on{ color: #fff; border-bottom: 2px #fff solid; } header nav.pc > ul li .sub-nav{ width: 380px; background: #fff; position: absolute; top: 80px; left: 0; padding: 20px 20px 30px 20px; display: none; } header nav.pc > ul li:last-child .sub-nav{ right: 0; left: auto; } header nav.pc > ul li .sub-nav .n{ display: inline-flex; display: flex; align-items: flex-start; } header nav.pc > ul li .sub-nav p{ flex: 1; padding: 0 20px 0 5px; display: inline-block; width: 100%; } header nav.pc > ul li .sub-nav p a{ font-size: 14px; display: inline-block; width: 100%; line-height: 30px; position: relative; padding-left: 12px; } header nav.pc > ul li .sub-nav p a:before{ content: ' '; position: absolute; width: 3px; height: 3px; background: #666; left: 0; top: 13px; } header nav.pc > ul li .sub-nav p a:hover{ color: #0068b6; } header nav.pc > ul li .sub-nav p a:hover:before{ background: #0068b6; } header nav.pc > ul li .sub-nav img{ width: 150px; } header .tel{ font-size: 22px;font-weight: 300; } header .tel i{ font-size: 24px; } .mobile-nav{ position: fixed; top: 0; left: 0; width: 100%; height: 60px; display: flex; z-index: 999999999; display: none; } .mobile-nav span{ flex:1; height: 60px; display: inline-block; } .mobile-nav .nav-btn{ display: flex; align-items: center; cursor: pointer; margin-right: 12px; } .mobile-nav .nav-btn i{ color: #fff; font-size: 28px; } nav.mobile{ position: fixed; width: 100%; height: 100%; overflow: hidden; background: #fff; opacity: 0.9; z-index: 100; top: 60px; padding: 5%; display: none; } nav.mobile > a{ display: inline-block; width: 100%; font-size: 16px; padding: 8px 0; border-bottom: 1px #eaeaea solid; color: #0068b6; } nav.mobile dl{ font-size: 14px; display: none; } nav.mobile dl a{ font-size: 14px; color: #666; border-bottom: 1px #f1f1f1 solid; display: inline-block; width: 100%; line-height: 36px; } .banner{ height: auto; overflow: hidden; background-image: linear-gradient(#555,#fff); font-size: 0; } .banner .bg{ width: 100%; height: 783px; background-image: url(../images/z001.png); background-size: cover; background-position: center; padding: 0 150px; box-sizing: border-box; } .banner .bg span{ display: inline-block; color: #fff; font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, Tahoma, sans-serif; text-align: left; width: 100%; } .banner .bg span.t1{ margin-top: 260px; font-size: 46px; font-weight: bolder; } .banner .bg span.t2{ margin-top: 0px; font-size: 28px; font-weight: 300; } .banner .bg span.t3{ margin-top: 30px; font-size: 16px; font-weight: 300; text-transform: uppercase; } .banner .bg a{ margin-top: 68px; color: #fff; font-size: 16px; display: inline-block; } .banner .bg span,.banner .bg a{ opacity: 0; opacity: 1\0; -webkit-transform: translateY(30px); -moz-transform: translateY(30px); -ms-transform: translateY(30px); -o-transform: translateY(30px); transform: translateY(30px); } .banner .slick-active .bg span.t1 { -webkit-animation: fadeInDown 1s cubic-bezier(.25, .74, .22, .99) forwards; -moz-animation: fadeInDown 1s cubic-bezier(.25, .74, .22, .99) forwards; -o-animation: fadeInDown 1s cubic-bezier(.25, .74, .22, .99) forwards; animation: fadeInDown 1s cubic-bezier(.25, .74, .22, .99) forwards; } .banner .slick-active .bg span.t2 { -webkit-animation: fadeInDown 1s 0.2s cubic-bezier(.25, .74, .22, .99) forwards; -moz-animation: fadeInDown 1s 0.2s cubic-bezier(.25, .74, .22, .99) forwards; -o-animation: fadeInDown 1s 0.2s cubic-bezier(.25, .74, .22, .99) forwards; animation: fadeInDown 1s 0.2s cubic-bezier(.25, .74, .22, .99) forwards; } .banner .slick-active .bg span.t3 { -webkit-animation: fadeInDown 1s 0.4s cubic-bezier(.25, .74, .22, .99) forwards; -moz-animation: fadeInDown 1s 0.4s cubic-bezier(.25, .74, .22, .99) forwards; -o-animation: fadeInDown 1s 0.4s cubic-bezier(.25, .74, .22, .99) forwards; animation: fadeInDown 1s 0.4s cubic-bezier(.25, .74, .22, .99) forwards; } .banner .slick-active .bg a { -webkit-animation: fadeInDown 1s 0.6s cubic-bezier(.25, .74, .22, .99) forwards; -moz-animation: fadeInDown 1s 0.6s cubic-bezier(.25, .74, .22, .99) forwards; -o-animation: fadeInDown 1s 0.6s cubic-bezier(.25, .74, .22, .99) forwards; animation: fadeInDown 1s 0.6s cubic-bezier(.25, .74, .22, .99) forwards; } .index-about{ background: #f9f9f9 url(../images/001.jpg); background-size: cover; background-position: center; background-attachment: fixed; padding: 90px 0; } .index-about .w{ display: flex; align-items: center; } .index-about .w video{ width: 60%; height: 500px; background-color: #000; } .index-about .w .txt{ width: 40%; padding-left: 80px; box-sizing: border-box; } .index-about .w .txt span{ display: inline-block; width: 100%; line-height: 100%; } .index-about .w .txt span.en{ font-size: 52px; color: #1d67ae; font-weight: bolder; } .index-about .w .txt span.cn{ font-size: 38px; color: #0c0c0c; font-weight: bolder; margin-top: 20px; } .index-about .w .txt .c{ font-size: 14px; color: #444545; line-height: 29px; margin-top: 33px; } .index-about .w .txt .c p{ text-indent: 2em; margin-bottom: 10px; } .index-about .w .txt a{ display: inline-block; padding: 10px 0px; font-size: 15px; font-weight: bolder; color: #fff; background-color: #1d67ae; margin-top: 53px; position: relative; text-align: center; transition: all 0.5s; width: 160px; } .index-about .w .txt a:before{ content: ' '; position: absolute; width: 0%; height: 100%; background-color: #618d2a; z-index: 1; left: 0; top: 0; transition: all 0.5s; } .index-about .w .txt a span{ position: relative; z-index: 10; } .index-about .w .txt a:hover{ letter-spacing: 3px; } .index-about .w .txt a:hover:before{ width: 100%; } .mt-b{ margin-top: 80px; } .mt-s{ margin-top: 30px; } .mb-b{ margin-bottom: 50px; } .mb-s{ margin-top: 20px; } .index-title{ text-align: center; } .index-title span{ display: inline-block; width: 100%; line-height: 100%; } .index-title span:first-child{ font-size: 36px; color: #050505; font-weight: bolder; } .index-title span:last-child{ font-size: 16px; color: #616161; font-weight: 300; margin-top: 20px; } .sub-title{ text-align: center; } .sub-title span{ display: inline-block; width: 100%; line-height: 100%; } .sub-title span:first-child{ font-size: 32px; color: #050505; font-weight: bolder; } .sub-title span:last-child{ font-size: 14px; color: #616161; font-weight: 300; margin-top: 15px; text-transform: uppercase; } .index-pro{ overflow:hidden; padding-bottom: 20px; } .pro-list{ margin: 0 -50px; } .pro-list a{ width: 50%; height: auto; display: inline-block; padding: 0 50px; transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; box-sizing: border-box; float: left; } .pro-list a > div{ transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; box-shadow: 0 0 20px #ccc; } .pro-list a:hover > div{ } .pro-list a .img{ width: 100%; height: 515px; overflow:hidden; } .pro-list a .img img{ width: 100%; min-height: 100%; } .pro-list a:hover .img img{ transform: scale(1.1); } .pro-list a .t{ background-color: #fff; height: 90px; padding: 0 20px; display: -o-flex; display: -moz-flex; display: -ms-flex; display: -webkit-flex; display: flex; align-items: center; position: relative; } .pro-list a .t h2{ -webkit-box-flex: 1; -moz-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; float: left; font-size: 20px; position: relative; z-index: 2; } .pro-list a .t i{ color: #1d67ae; font-size: 16px; transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; z-index: 2; } .pro-list a:hover .t i{ margin-right: -10px; } .pro-list a .t:after{ content: ' '; position: absolute; top: 0; left: 0; width: 0%; height: 4px; background-color: #618d2a; z-index: 1; transition: all 1s; -o-transition: all 1s; -ms-transition: all 1s; -moz-transition: all 1s; -webkit-transition: all 1s; } .pro-list a:hover .t:after{ width: 100%; } .server{ height: auto; overflow: hidden; display: flex; flex-wrap: wrap; margin-top: 60px; } .server .li{ width: 25%; height: 800px; overflow: hidden; padding: 210px 70px; position: relative; transition: all 0.3s; display: inline-block; } .server .li .bg{ background:#000; opacity: 0.5; z-index: 1; width: 100%; height: 100%; left: 0; top: 0; position: absolute; transition: all 1s; } .server .li:hover .bg{ opacity: 0.3; } .server .li .img{ overflow: hidden; width: 100%; height: 100%; left: 0; top: 0; position: absolute; display: flex; align-items: center; justify-content: center; } .server .li .img img{ width: auto; min-height: 100%; transition: all 1s; } .server .li:hover .img img{ transform: scale(1.2); } .server .li .i{ position: relative; z-index: 2; color: #fff; display: flex; align-items: flex-start; flex-direction: column; } .server .li .i *{ line-height: 100%; } .server .li .i span{ display: inline-block; width: 15%; height: 1px; border-bottom: 4px #fff solid; margin-top: 45px; } .server .li .i h5{ font-size: 24px; margin-top: 35px; } .server .li .i em{ font-size: 16px; margin-top: 15px; text-transform: uppercase; } .server .li .i p{ font-size: 14px; margin-top: 35px; line-height: 2; display: none; } .server .li:hover .i p{ display: block; } .server .li .i i{ font-size: 30px; margin-top: 55px; } .index-news{ background-color: #f5f5f5; padding-bottom: 80px; } .index-news-list{ display: flex; display: -o-flex; display: -ms-flex; display: -moz-flex; display: -webkit-flex; align-items: flex-start; justify-content: space-between; } .index-news-list .title-lists{ width: 70%; background-color: #eaeaea; display: flex; flex-wrap: wrap; } .index-news-list .title-lists a{ display: inline-block; width: 50%; height: auto; box-sizing: border-box; border:1px #dcdcdc solid; padding: 70px 50px; position: relative; transition: all .8s; } .index-news-list .title-lists a:nth-child(1){ border-top: 0; border-left: 0; } .index-news-list .title-lists a:nth-child(2){ border-right: 0; border-left: 0; border-top: 0; } .index-news-list .title-lists a:nth-child(3){ border-top: 0; border-bottom: 0; border-left: 0; } .index-news-list .title-lists a:nth-child(4){ border-top: 0; border-bottom: 0; border-right: 0; border-left: 0; } .index-news-list .title-lists a h3{ font-size: 18px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; position: relative; z-index: 2; } .index-news-list .title-lists a i{ font-size: 14px; color: #666; padding: 8px 0; display: inline-block; position: relative; z-index: 2; } .index-news-list .title-lists a p{ font-size: 15px; line-height: 1.8; color: #777; height: 50px; overflow: hidden; position: relative; z-index: 2; } .index-news-list .title-lists a span{ float: right; font-size: 14px; margin-top: 20px; position: relative; z-index: 2; } .index-news-list .title-lists a .img{ width: 100%; height: 100%; background-color: #ddd; position: absolute; top: 0; left: 0; z-index: 1; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); -webkit-transition: all .8s; -o-transition: all .8s; -moz-transition: all .8s; transition: all .8s; overflow: hidden; } .index-news-list .title-lists a .img img{ width: 100%; min-height: 100%; } .index-news-list .title-lists a:hover .img{ -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .index-news-list .title-lists a .img::before { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0, 0, 0, 0.4); z-index: 5; } .index-news-list .title-lists a:hover h3,.index-news-list .title-lists a:hover i,.index-news-list .title-lists a:hover p,.index-news-list .title-lists a:hover span{ color: #fff; } .index-news-list .cat-lists{ width: 30%; height: 400px; box-sizing: border-box; padding-left: 50px; } .index-news-list .cat-lists h4{ font-size: 16px; color: #005c9f; font-weight: bold; background-color: #eaeaea; height: 50px; display: flex; align-items: center; box-sizing: border-box; padding: 0 15px; } .index-news-list .cat-lists h4:before{ content: ' '; height: 16px; width: 4px; background-color: #005c9f; margin-right: 10px; } .index-news-list .cat-lists .c{ background-color: #fff; overflow: hidden; } .index-news-list .cat-lists .c a{ display: inline-block; border-bottom: 1px #f5f5f5 solid; padding: 13px 20px; width: 100%; box-sizing: border-box; position: relative; } .index-news-list .cat-lists .c a h3{ font-size: 15px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width: 100%; } .index-news-list .cat-lists .c a i{ font-size: 13px; color: #666; } .index-news-list .cat-lists .c a:before{ content: ' '; height: 4px; width: 0%; background-color: #005c9f; position: absolute; top: 0; left: 0; transition: all 1s; -o-transition: all 1s; -ms-transition: all 1s; -moz-transition: all 1s; -webkit-transition: all 1s; } .index-news-list .cat-lists .c a:hover:before{ width: 100%; } .btn-more{ display: inline-block; font-size: 15px; color: #fff; background-color: #005c9f; padding: 7px 25px; } .btn-more:hover{ color: #fff; } .footer-func{ display: flex; overflow: hidden; } .footer-func > div,.footer-func > a{ width: 50%; min-height: 200px; } .footer-func > div{ background-image: url(../images/004.jpg); background-size: cover; position: relative; color: #fff; padding: 70px 120px; box-sizing: border-box; } .footer-func > div:before{ content: ' '; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #005c9f; opacity: 0.9; z-index: 1; } .footer-func > div h5,.footer-func > div i,.footer-func > div .form{ z-index: 2; position: relative; display: inline-block; width: 100%; } .footer-func > div h5{ font-size: 22px; line-height: 100%; text-align: center; } .footer-func > div i{ font-size: 15px; text-transform: uppercase; line-height: 100%; text-align: center; margin-top: 5px; } .footer-func > div .form{ display: flex; align-items: center; flex-wrap: wrap; font-size: 14px; margin-top: 15px; } .footer-func > div .form .li{ display: flex; width: 50%; } .footer-func > div .form .li-b{ width: 100%; } .footer-func > div .form .li,.footer-func > div .form .li-b{ padding: 17px 0; align-items: center; display: flex; } .footer-func > div .form .li label,.footer-func > div .form .li-b label{ width: 90px; text-align: right; padding-right: 5px; } .footer-func > div .form .input{ flex: 1; display: flex; align-items: center; } .footer-func > div .form input[type=text]{ height: 36px; background-color: #fff; border-radius: 4px; flex: 1; border:0; padding: 0 10px; } .footer-func > div .form input[type=checkbox]{ width: 17px; height: 17px; border:1px #fff solid; border-radius: 3px; background: none; } .footer-func > div .form textarea{ height: 120px; background-color: #fff; border-radius: 4px; flex: 1; border:0; padding: 10px; } .footer-func > div .form input[type=button]{ border:1px #fff solid; border-radius: 4px; font-size: 15px; color: #fff; padding: 10px 20px; background: none; transition: all 0.05s; } .footer-func > div .form input[type=button]:active{ background: #07548d; } .footer-func > div .form p{ flex: 1; font-size: 14px; padding-left: 25px; } .footer-func > a{ display: flex; align-items: center; flex-direction: column; color: #fff; justify-content: center; background-image: url(../images/002.jpg); background-size: cover; position: relative; } .footer-func > a:before{ content: ' '; position: absolute; width: 100%; height: 100%; background-color: #638c1c; opacity: 0.9; left: 0; top: 0; z-index: 1 } .footer-func > a span{ transition: all 0.5s; } .footer-func > a:hover span{ letter-spacing: 3px; } .footer-func > a span,.footer-func > a i{ z-index: 2; } .footer-func > a span:nth-child(1){ font-size: 22px; } .footer-func > a span:nth-child(2){ font-size: 15px; } .footer-func > a i{ font-size: 24px; line-height: 100%; margin-top: 10px; } footer{ background-color: #3c3c3c; overflow: hidden; color: #fff; padding: 50px 0; } footer a,footer a:hover{ color: #fff; display: inline-block; font-size: 15px; margin-right:20px; } footer .footer-n{ width: 1200px; margin: 0 auto; overflow: hidden; } footer .footer-nav{ border-bottom: 1px #5c5c5c solid; padding-bottom: 25px; } footer .footer-b{ margin-top: 25px; font-size: 13px; display: flex; align-items: flex-start; } footer .footer-b .copy{ display: flex; flex-direction: column; align-items: flex-start; flex: 1; } footer .footer-b .copy span:nth-child(1){ opacity: 0.9; } footer .footer-b .copy span:nth-child(2){ margin-top: 20px; opacity: 0.6; } footer .footer-b .qr{ width: 120px; text-align: center; margin-left: 30px; } footer .footer-b .qr img{ width: 100%; } .subbanner{ overflow: hidden; display: flex; color: #fff; background-color: #f1f1f1; background-image: linear-gradient(#346796,#fff); height: 430px; display: flex; align-items: center; flex-direction: column; justify-content: center; position: relative; background-size: cover; background-position: center; } .subbanner:before{ content: ' '; background: #25599f; opacity: 0.28; z-index: 1; position: absolute; left:0; top: 0; width: 100%; height: 100%; } .subbanner h3{ font-size: 36px; font-weight: bolder; } .subbanner span{ font-size: 14px; font-weight: 300; text-transform: uppercase; } .subbanner *{ z-index: 2; } .subbanner .s-tips{ position: absolute; bottom: 90px; left: 0; width: 100%; text-align: center; z-index: 999; animation:updown 1.5s infinite ease-in-out; -webkit-animation:updown 1.5s infinite ease-in-out; -moz-animation:updown 1.5s infinite ease-in-out; -ms-animation:updown 1.5s infinite ease-in-out; -o-animation:updown 1.5s infinite ease-in-out; } .subbanner .s-tips i{ font-size: 40px; color: #fff; } @keyframes updown{ 0% {bottom:90px;} 50% {bottom:70px;} 100% {bottom:90px;} } @-webkit-keyframes updown{ 0% {bottom:90px;} 50% {bottom:70px;} 100% {bottom:90px;} } @-moz-keyframes updown{ 0% {bottom:90px;} 50% {bottom:70px;} 100% {bottom:90px;} } @-o-keyframes updown{ 0% {bottom:90px;} 50% {bottom:70px;} 100% {bottom:90px;} } .subcat{ height: 55px; overflow: hidden; width: 100%; margin-top: -55px; z-index: 999; line-height: 55px; } .subcat .w{ position: relative; height: 100%; display: flex; } .subcat .w .li{ z-index: 2; flex: 1; } .subcat .w .li a{ position: relative; text-align: center; display: inline-block; border-right: 1px #fff solid; width: 100%; } .subcat .w .li:last-child a{ border-right: 0; } .subcat .w .li a:before{ content: ' '; position: absolute; height: 4px; width: 0; left: 0; top: 0; background:#0068b6; transition: all 1s; } .subcat .w .li a:hover:before,.subcat .w .li a.on:before{ width: 100%; } .subcat .w .li a:hover,.subcat .w .li a.on{ color: #0068b6; } .subcat .w .bg{ width: 100%; height: 100%; background: #fff; opacity: 0.8; z-index: 1; position: absolute; left: 0; top: 0; } .about-about-c{ display: flex; flex-wrap: wrap; align-items: center; } .about-about-c .part{ width: 50%; box-sizing: border-box; height: 100%; } .about-about-c .part:nth-child(1){ padding-right: 30px; } .about-about-c .part:nth-child(2){ padding-left: 30px; } .about-about-c .part video{ background-color: #000; width: 100%; height: 100%; } .about-about-c .part:nth-child(2) span:nth-child(1){ font-size: 14px; color: #8f8f92; position: relative; display: inline-block; padding-top: 30px; } .about-about-c .part:nth-child(2) span:nth-child(1):before{ content: ' '; width: 28px; height: 21px; background-image: url(../images/005.png); position: absolute; top: 0; left: 0; } .about-about-c .part:nth-child(2) span:nth-child(2){ font-size: 15px; color: #333; overflow: hidden; height: 400px; display: inline-block; } .about-about-c .part:nth-child(2) span:nth-child(2) p{ text-indent: 2em; margin-top: 10px; line-height: 1.9; } .about-wenhua{ overflow: hidden; background-image: url(../images/006.jpg); background-size: cover; padding: 120px 0; position: relative; background-attachment: fixed; } .about-wenhua:after{ content: ' '; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #0068b6; opacity: 0.5; z-index: 1; } .about-wenhua *{ z-index: 2; position: relative; } .about-wenhua .c{ font-size: 50px; font-weight: bold; text-align: center; color: #fff; margin-top: 50px; } .about-fazhan{ overflow: hidden; } .about-fazhan .c{ align-items: center; flex-wrap: wrap; display: none; } .about-fazhan .c dl{ width: 50%; box-sizing: border-box; height: 450px; overflow: hidden; } .about-fazhan .c dl:nth-child(1){ background-size: cover; background-position: center; } .about-fazhan .c dl:nth-child(2){ background: #f9f9f9; padding: 40px 50px; } .about-fazhan .c dl img{ width: 100%; min-height: 450px; } .about-fazhan .c dl:nth-child(2) span:nth-child(1){ font-size: 36px; color: #638c1c; width: 100%; display: inline-block; } .about-fazhan .c dl:nth-child(2) span:nth-child(1):after{ content: '骞?; font-size: 16px; margin-left: 10px; } .about-fazhan .c dl:nth-child(2) span:nth-child(2){ font-size: 14px; color: #333; } .about-fazhan .year{ display: flex; align-items: center; justify-content: center; } .about-fazhan .year p{ flex: 1; font-size: 18px; background: url(../images/007.png) top left no-repeat; padding-top: 30px; padding-left: 48px; cursor: pointer; } .about-fazhan .year p.on{ color: #638c1c; font-weight: bolder; } .about-jiegou{ background-image: url(../images/008.jpg); background-size: cover; position: relative; background-attachment: fixed; overflow: hidden; } .about-jiegou:after{ content: ' '; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #0068b6; opacity: 0.9; z-index: 1; } .about-jiegou .w{ z-index: 2; position: relative; } .about-jiegou .c{ text-align: center; } .about-jiegou .c img{ max-width: 100%; width: auto!important; } .about-rongyu{ background: #f5f5f5; overflow: hidden; } .about-rongyu .w{ height: 0px; overflow: hidden; } .about-rongyu-roll li{ background: #fff; display: flex; align-items: center; flex-direction: column; margin: 0 10px; width: 20%; } .about-rongyu-roll .slick-list{ width: 100%; } .about-rongyu-roll li .img{ width: 100%; height: 270px; overflow: hidden; padding: 15px; text-align: center; background-size: contain; background-repeat: no-repeat; background-position: center; } .about-rongyu-roll li .img img{ height: 100%; width: auto; max-width: 100%; } .about-rongyu-roll li span{ border-top: 1px #eaeaea solid; font-size: 15px; padding: 20px 0; display: inline-block; width: 100%; text-align: center; } .about-lianxi{ overflow: hidden; } .about-lianxi .w .c{ height: 450px; overflow: hidden; background: #eaeaea; } .about-lianxi .w .c img{ width: auto; } .server-list{ overflow: hidden; } .server-list li{ margin-top: 60px; position: relative; min-height: 600px; } .server-list li .t{ width: 50%; height: auto; overflow: hidden; padding: 80px 50px 100px 50px; position: relative; z-index: 2; margin-top: 50px; float: left; min-height: 380px; } .server-list li .t *{ z-index: 2; position: relative; } .server-list li .t h2{ font-size: 28px; font-weight: bold; } .server-list li .t h2:before{ position: absolute; content: ' '; width: 5%; height: 4px; background: #1d67ae; left: 0; top: -20px; } .server-list li .t span{ font-size: 16px; font-weight: 300; color: #666666; } .server-list li p{ font-size: 14px; align-content: #444; margin-top: 20px; } .server-list li .t:before{ content: ' '; background: #f5f5f5; opacity: 0.9; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1 } .server-list li .img{ width: 70%; height: 600px; overflow: hidden; position: absolute; right: 0; top: 0; z-index: 1; background-size: cover; background-position: center; } .server-list li:nth-child(even) .t{ float: right } .server-list li:nth-child(odd) .t{ float: left; } .server-list li:nth-child(even) .img{ left: 0; } .server-list li:nth-child(odd) .img{ right: 0; } /* news */ .public-view li { background: #f5f5f5; padding: 30px; margin-bottom: 30px; -webkit-transition: all .3s; -o-transition: all .3s; -moz-transition: all .3s; transition: all .3s; } .public-view li:hover { background: #0068b6; } .public-view li .public-time { width: 100px; height: 100px; background: #0068b6; color: #fff; text-align: center; -webkit-transition: all .3s; -o-transition: all .3s; -moz-transition: all .3s; transition: all .3s; } .public-view li:hover .public-time { background: #fff; color: #0068b6; } .public-view li .public-time span { display: block; font-size: 40px; line-height: 1; font-weight: bold; margin-top: 18px; } .public-view li .public-time p { font-size: 13px; } .public-view li .public-text { padding-left: 30px; width: -webkit-calc(100% - 100px); width: -moz-calc(100% - 100px); width: calc(100% - 100px); } .public-view li .public-text h3 { font-size: 18px; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dotted rgba(0, 0, 0, 0.2); -webkit-transition: all .3s; -o-transition: all .3s; -moz-transition: all .3s; transition: all .3s; } .public-view li:hover .public-text h3 { color: #fff; border-bottom: 1px dotted rgba(255, 255, 255, 0.2); } .public-view li .public-text p { color: #666; font-size: 15px; -webkit-transition: all .3s; -o-transition: all .3s; -moz-transition: all .3s; transition: all .3s; } .public-view li:hover .public-text p { color: #fff; } .public-view li .public-text p:hover { text-decoration: underline; } .public-view li .public-text p span { display: inline-block; padding-left: 24px; background: url(../images/fujian.png) no-repeat left; -o-background-size: 18px; background-size: 18px; } .public-view li:hover .public-text span { background: url(../images/fujian-1.png) no-repeat left; -o-background-size: 18px; background-size: 18px; } .public-view img{ height: auto; } .public-box { width: -webkit-calc(100% - 380px); width: -moz-calc(100% - 380px); width: calc(100% - 380px); } .pubilc-right { width: 380px; padding-left: 30px; } .pubilc-search { background: #f5f5f5; padding: 30px; margin-bottom: 30px; } .pubilc-search h3 { position: relative; color: #0068b6; margin-bottom: 10px; } .pubilc-search h3:before { position: absolute; content: ''; top: 8px; left: -30px; width: 3px; height: 20px; background: #0068b6; } .pubilc-sel { width: 100%; padding: 10px; margin-top: 15px; } .pubilc-sel-two { -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .pubilc-sel-two .pubilc-sel { width: 48%; } .pubilc-input { width: 100%; padding: 13px 15px; margin-top: 15px; font-size: 14px; } .public-button { width: 100%; background: #0068b6; color: #fff; padding: 12px 0; font-size: 14px; margin-top: 15px; } .pubilc-news a { display: block; margin-top: 18px; font-size: 14px; display: -webkit-box; -webkit-line-clamp: 2; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .pubilc-news a:hover i { text-decoration: underline; } .pubilc-news a span { display: inline-block; color: #0068b6; font-weight: bold; } .pagex { text-align: center; margin-top: 50px; } .pagination { text-align: center; font-size: 18px; color: #666666; } .pagination a { vertical-align: middle; display: inline-block; width: 45px; height: 45px; color: #666666; line-height: 45px; text-align: center; border-radius: 50%; margin: 0 10px; border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 50%; -webkit-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; transition: .5s ease-in-out; } .pagination a:hover, .pagination a.active, .pagination span { vertical-align: middle; display: inline-block; width: 45px; height: 45px; line-height: 45px; text-align: center; border-radius: 50%; margin: 0 10px; border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 50%; background-color: #0068b6; color: #ffffff; -webkit-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; transition: .5s ease-in-out; } .news-show{ overflow: hidden; } .cd-main { display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: stretch; -moz-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; overflow: hidden; } .cd-list__full { width: -webkit-calc(100% - 400px); width: -moz-calc(100% - 400px); width: calc(100% - 400px); letter-spacing: 1px; padding-right: 7%; border-right: 1px solid #efefef; padding-bottom: 70px; } .cd-list__title { position: relative; border-bottom: 1px solid rgba(193, 189, 189, 0.4); padding-bottom: 34px; margin-bottom: 40px; } .cd-list__full h3 { color: #111; line-height: 1.6; font-size: 28px; margin-bottom: 14px; margin-top: 0; font-weight: 400; } .cd-list__full span { text-transform: uppercase; font-size: 14px; /* color: rgba(17, 17, 17, 0.5); */ } .cd-list__title .img { position: absolute; top: 0; right: 0; } .cd-list__title .img img { width: 120px; } .cd-list__full h5 { display: block; color: #333; font-size: 22px; margin-bottom: 20px; font-weight: 400; } .cd-list__full h6 { display: block; color: #333; font-size: 18px; margin-bottom: 20px; font-weight: 400; } .cd-list__full p { font-size: 15px; line-height: 2; color: #111; margin-bottom: 20px; text-indent: 2em; } .cd-list__full p img { display: block; max-width: 100%; } .cd-push__full { position: relative; width: 380px; } .cd-push__content { position: relative; width: 100%; top: 0; bottom: auto; } .cd-push__main { /*border-left: 1px solid #efefef;*/ width: 100%; padding-left: 50px; } .cd-push__content.fixed { position: fixed; top: 48px; bottom: auto; } .cd-push__content.pos { position: absolute; bottom: 0; top: auto; } .cd-target__box { letter-spacing: 1px; } .mb-80 { margin-bottom: 50px; } .cd-target__box span { font-size: 20px; line-height: 1.4; color: #111; display: block; margin-bottom: 25px; } .cd-target__list li { margin-bottom: 30px; -webkit-transition: all .4s; -o-transition: all .4s; -moz-transition: all .4s; transition: all .4s; overflow: hidden; } .cd-target__list li:hover span { text-decoration: underline; } .cd-target__list a { display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-transition: color .4s; -o-transition: color .4s; -moz-transition: color .4s; transition: color .4s; font-size: 15px; line-height: 1.8; color: rgba(17, 17, 17, 0.8); overflow: hidden; } .cd-target__list .current a { color: #579632; } .cd-target__list a:hover { color: #579632; } .cd-target__list li .img { position: relative; width: 140px; height: 80px; margin-right: 20px; } .cd-target__list a img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: block; } .cd-target__list a span { width: -webkit-calc(100% - 160px); width: -moz-calc(100% - 160px); width: calc(100% - 160px); height: 54px; display: block; font-size: 15px; line-height: 1.8; color: rgba(17, 17, 17, 0.8); margin-top: 10px; margin-bottom: 0; display: -webkit-box; -webkit-line-clamp: 2; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .topbtm_bar { border-top: 1px solid #efefef; padding-top: 40px; } .topbtm_bar .icon { position: relative; margin: 0 10px; display: inline-block; } .topbtm_bar .icon:before { content: ""; -webkit-transition: ease .5s; -o-transition: ease .5s; -moz-transition: ease .5s; transition: ease .5s; display: block; z-index: 1; width: 30px; height: 30px; border-radius: 50%; border: 1px solid #bebecc; position: absolute; left: -15px; top: 0; } .topbtm_bar .next .icon:before { right: -15px; left: auto; } .topbtm_bar a { width: 48%; height: 30px; line-height: 30px; color: #111; letter-spacing: 0.5px; } .topbtm_bar a p { width: -webkit-calc(100% - 100px); width: -moz-calc(100% - 100px); width: calc(100% - 100px); overflow: hidden; white-space: nowrap; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .topbtm_bar a:hover { color: #036eb8; } .topbtm_bar a.fr { text-align: right; } .topbtm_bar span { margin: 0 10px } .topbtm_bar i { font-style: normal; font-family: "Gasalt-Regular"; font-size: 17px; } .ind-title{ margin-bottom: 10px; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .title-text h3{ font-size: 36px; } .title-text p{ font-size: 25px; color: #666; text-transform: uppercase; } .text-white h3{ color: #fff; } .text-white p{ color: rgba(255, 255, 255, 0.6); } .text-center{ text-align: center; width: 100%; } .recruitment-view { border-top: 1px dotted rgba(0, 0, 0, 0.1); margin-top: 60px; padding-top: 60px; } .recruitment-logo img { max-width: 100%; width: auto; margin-bottom: 20px; } .recruitment-view h3 { font-size: 30px; text-align: center; } .recruitment-title { margin: 60px 0 40px; border-left: 10px solid #009844; } .recruitment-title h4 { display: inline-block; font-size: 17px; color: #fff; background: #005c9f; padding: 4px 30px; } .recruitment-view p { font-size: 15px; margin: 20px 0; line-height: 2; color: #666; } .recruitment-view p strong { font-size: 17px; } .recruitment-view form{ width: 100%; display: block; } .pro-show-banner{ overflow: hidden; background: #005c9f; height: calc(100vh - 100px); color: #fff; display: flex; flex-direction: column; align-items: center; position: relative; } .pro-show-banner span{ font-size: 60px; font-weight: bolder; opacity: .5; margin-top: calc(46vh - 100px); position: relative; z-index: 2; text-transform: uppercase; } .pro-show-banner h1{ font-size: 40px; font-weight: bolder; position: relative; z-index: 2; } .pro-show-banner img{ height: 70vh; right: 1%; top: 15vh; position: absolute; z-index: 1; width: auto; } .pro-show-youshi{ overflow: hidden; } .top-txt{ font-size: 40px; font-weight: bolder; background-image: -webkit-linear-gradient(left,#ea484f,#97487f,#2772ad); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-align: center; color: #1d67ae; margin-top: 20px; } .youshi-lists{ overflow: hidden; display: flex; align-items: flex-start; flex-wrap: wrap; justify-content: space-between; margin: 0 -10px; } .youshi-lists .li{ flex: 1; width: 25%; padding: 0 10px; } .youshi-lists .li i{ display: inline-block; width: 100%; border-bottom: 1px #eaeaea solid; height: 80px; font-size: 136px; color: #ccc; line-height: 80%; overflow: hidden; font-family: Impact; } .youshi-lists .li h4{ font-size: 24px; color: #1d67ae; font-weight: 400; margin-top: 15px; } .youshi-lists .li span{ margin-top: 10px; font-size: 14px; color: #555; line-height: 20px; } .pro-show-pic-txt{ overflow: hidden; } .pro-show-pic-txt .pic-txt dl{ width: 50%; height: 480px; overflow: hidden; background: #f9f9f9; float: left; font-size: 18px; line-height: 2; color: #555; } .pro-show-pic-txt .pic-txt dl img{ width: 100%; } .pro-show-pic-txt .pic-txt dl:first-child{ background: #1d67ae; display: flex; align-items: center; flex-direction: column; justify-content: center; } .pro-show-pic-txt .pic-txt dl:last-child{ padding: 50px 60px; } .pro-show-txt{ font-size: 14px; line-height: 33px; } .pro-show-txt img{ max-width: 100%; margin: 0 auto; margin-bottom: 10px; } .pro-show-txt p{ text-indent: 2em; margin-bottom: 10px; } .pro-show-pics{ overflow: hidden; background: #f9f9f9; } .pro-show-pics-roll li{ background: #fff; display: flex; align-items: center; flex-direction: column; margin: 0 10px; font-size: 14px; position: relative; } .pro-show-pics-roll li .img{ width: 100%; height: 220px; overflow: hidden; } .pro-show-pics-roll li .img img{ width: 100%; min-height: 100%; transition: all 0.5s; } .pro-show-pics-roll li span{ display: block; width: 100%; color: #fff; background: #000; opacity: 0.6; position: absolute; bottom: -40px; left: 0; height: 40px; line-height: 40px; padding: 0 15px; text-align: center; transition: all 0.5s; } .pro-show-pics-roll li:hover span{ bottom: 0px; } .pro-show-pics-roll li:hover .img img{ transform: scale(1.2); } .pro-show-pics-2{ overflow: hidden; } .pro-show-pics-2 .pro-show-pics-2-roll{ display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-start; margin: 0 -10px; } .pro-show-pics-2 .pro-show-pics-2-roll li{ display: inline-block; width: 16.666%; height: 110px; transition: all .5s; overflow: hidden; padding: 10px; } .pro-show-pics-2 .pro-show-pics-2-roll li:hover img{ border:2px #eaeaea solid; } .pro-show-pics-2 .pro-show-pics-2-roll li img{ border:1px #eaeaea solid; width: 100%; height: 100%; box-sizing: border-box; } .pro-show-pics-2 .pro-show-pics-2-roll .slick-prev,.pro-show-pics-2 .pro-show-pics-2-roll .slick-next{ border-radius: 0; width: 40px; height: 40px; background-color: #1d67ae; bottom: -83px; top: auto; } .pro-show-pics-2 .pro-show-pics-2-roll .slick-prev{ left: calc(100% / 2 - 41px); } .pro-show-pics-2 .pro-show-pics-2-roll .slick-next{ right: calc(100% / 2 - 41px); } .pro-show-news .c{ display: flex; align-items: flex-start; margin: 0 -15px; flex-wrap: wrap; justify-content: space-between; } .pro-show-news .c dl{ width: 33.33333%; padding: 0 15px; box-sizing: border-box; } .index-news-lists-small h4{ font-size: 16px; color: #005c9f; font-weight: bold; background-color: #eaeaea; height: 50px; display: flex; align-items: center; box-sizing: border-box; padding: 0 15px; } .index-news-lists-small h4:before{ content: ' '; height: 16px; width: 4px; background-color: #005c9f; margin-right: 10px; } .index-news-lists-small .lists{ background-color: #f9f9f9; overflow: hidden; } .index-news-lists-small .lists a{ display: inline-block; border-bottom: 1px #f5f5f5 solid; padding: 13px 20px; width: 100%; box-sizing: border-box; position: relative; } .index-news-lists-small .lists a h3{ font-size: 15px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width: 100%; } .index-news-lists-small .lists a i{ font-size: 13px; color: #666; } .index-news-lists-small .lists a:before{ content: ' '; height: 4px; width: 0%; background-color: #005c9f; position: absolute; top: 0; left: 0; transition: all 1s; -o-transition: all 1s; -ms-transition: all 1s; -moz-transition: all 1s; -webkit-transition: all 1s; } .index-news-lists-small .lists a:hover:before{ width: 100%; } .tab-change{ display: flex; align-items: center; justify-content: center; } .tab-change a{ display: inline-block; font-size: 14px; color: #005c9f; width: 100px; padding: 6px 0; text-align: center; border:1px solid #005c9f; border-right: 0; } .tab-change a.on{ background: #005c9f; color: #fff; } .tab-change a:last-child{ border-right:1px solid #005c9f; border-bottom-right-radius: 3px; border-top-right-radius: 3px; } .tab-change a:first-child{ border-bottom-left-radius: 3px; border-top-left-radius: 3px; } .dianchi-p1{ overflow: hidden; background-image: url(../images/010.jpg); background-size: contain; background-position: center; background-repeat: no-repeat; } .dianchi-p1 ul{ display: flex; align-items: flex-start; flex-wrap: wrap; } .dianchi-p1 ul li{ width: 50%; margin-bottom: 50px; display: flex; align-items: flex-start; } .dianchi-p1 ul li img{ width: 64px; height: 64px; border-radius: 5px; margin: 0 20px; } .dianchi-p1 ul li .i{ flex: 1; } .dianchi-p1 ul li .i h5{ font-size: 18px; color: #005c9f; font-weight: bolder; } .dianchi-p1 ul li .i span{ font-size: 14px; max-width: 300px; color: #666; } .dianchi-p1 ul li:nth-child(even){ padding-left: 20px; } .dianchi-p1 ul li:nth-child(odd){ padding-right: 20px; } .dianchi-p1 ul li:nth-child(odd){ flex-direction: row-reverse; } .dianchi-p1 ul li:nth-child(odd) .i{ text-align: right; } .dianchi-p2{ overflow: hidden; background-image: url(../images/012.jpg); background-size: cover; min-height: 300px; } .dianchi-p2 ul{ display: flex; align-items: flex-start; flex-wrap: wrap; margin-bottom: 20px; } .dianchi-p2 ul li{ padding: 0 20px; min-height: 100px; color: #fff; width: 16.6666%; } .dianchi-p2 ul li .icon{ display: flex; align-items: center; flex-direction: column; justify-content: center; } .dianchi-p2 ul li .icon i{ color: #fff; font-size: 60px; opacity: 0.8; } .dianchi-p2 ul li span{ font-size: 16px; line-height: 30px; display: inline-block; width: 100%; text-align: center; } .pro-show-banner-2{ overflow: hidden; background: #005c9f; height: calc(100vh - 100px); color: #fff; display: flex; flex-direction: column; align-items: center; position: relative; } .pro-show-banner-2 span{ font-size: 60px; font-weight: bolder; opacity: .5; margin-top: calc(44vh - 100px); position: relative; z-index: 2; text-transform: uppercase; } .pro-show-banner-2 h1{ font-size: 40px; font-weight: bolder; position: relative; z-index: 2; } .pro-show-banner-2 img{ height: 50vh; right: 1%; bottom: -10px; position: absolute; z-index: 1; width: auto; } .pt-b{ padding-top: 80px; } .pt-s{ padding-top: 30px; } .pb-b{ padding-bottom: 80px; } .pb-s{ padding-bottom: 30px; } .mt-b{ margin-top: 80px; } .mt-s{ margin-top: 30px; } .mb-b{ margin-bottom: 50px; } .mb-s{ margin-top: 20px; }