@charset "utf-8"; * { padding: 0; margin: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; outline: none; } html, body { color: #333; font-size: 16px; font-family: "微软雅黑"; /* max-width: 1920px; */ margin-left: auto !important; margin-right: auto !important; text-align: left; overflow-x: hidden; } li { list-style: none; } a { text-decoration: none; } img, input { border: 0; outline: none; } .wap { display: none; } .top>img.wap { display: none; } body .clear { clear: both; height: 0 !important; width: 0 !important; border: none !important; margin: 0 !important; padding: 0 !important; float: none !important; } .px1400 { max-width: 1400px; margin: 0 auto; } .px1650 { max-width: 1650px; margin: 0 auto; } .b-t-search { float: left; } .b-t-search>div { position: relative; border: 1px solid #595959; height: 25px; line-height: 25px; margin-top: 10px; padding: 0 10px; font-size: 0; background: #373535; } .b-t-search>div .search-text { border: none; outline: none; line-height: 25px; height: 25px; width: 125px; vertical-align: middle; background: none; color: #fff; } .b-t-search>div .search-btn { width: 25px; height: 25px; background: url(../images/search.png) no-repeat; background-position: center center; border: none; outline: none; vertical-align: middle; } .head { position: absolute; top: 0; left: 0; width: 100%; z-index: 99999; /* transition: all .7s; */ background: #084ea3; padding-top: 25px; } .head.on { position: fixed; top: 0; padding: 5px 0 0 0; } .head.on .nav>ul>li>a { padding-bottom: 10px; font-size: 14px; } .head.on .nav>ul { margin-top: 15px; } .head-top { position: relative; } .logo { position: absolute; top: 15px; } .logo a { display: block; } .logo a img { vertical-align: middle; } .nav { padding-left: 500px; } .nav-t { text-align: right; font-size: 0; } .nav-search { display: inline-block; background: #fff; border-radius: 5px; padding: 7px 10px; } .nav-search-btn { vertical-align: middle; } .nav-search-text { width: 115px; padding-left: 10px; border-left: 1px solid #084ea3; height: 12px; line-height: 12px; margin-left: 7px; vertical-align: middle; font-size: 12px; } .nav-link { display: inline-block; padding: 7px; margin-left: 10px; } .nav-link a { color: #fff; font-size: 0; line-height: 12px; } .nav-link a img { vertical-align: middle; } .nav-link a span { vertical-align: middle; margin-left: 5px; font-size: 12px; } .nav>ul { font-size: 0; margin-top: 25px; } .nav>ul>li { display: inline-block; width: 11.11%; text-align: center; position: relative; } .nav>ul>li>a { display: block; font-size: 16px; line-height: 22px; padding-bottom: 25px; color: #fff; text-align: center; position: relative; border-bottom: 4px solid transparent; transition: all 0.3s; } .nav>ul>li.active>a { border-color: #f0a402; font-weight: 600; } .nav>ul>li>div { position: absolute; top: 100%; min-width: 160px; /*left: 50%;*/ /*transform: translateX(-50%);*/ background: #fff; z-index: 9999; overflow: hidden; line-height: normal; display: none; box-shadow: 0 0 10px rgba(0, 0, 0, .2); } .nav>ul>li>div>ul { overflow: hidden; } .nav>ul>li>div>ul>li a { display: block; font-size: 14px; border-top: 1px solid #eeeeee; line-height: 53px; transition: .3s; color: #222; } .nav>ul>li>div>ul>li a:hover { color: #084ea3; background: #e4edf9; } .top { max-width: 1920px; margin: 0 auto; position: fixed; right: 10px; top: 18px; width: 25px; height: 25px; z-index: 9999; } .top>img { display: block; width: 100%; } .wap-menu { position: absolute; top: 0; right: 0; z-index: 99999; font-size: 0; } .wap-menu img { height: 25px; } .close-menu { display: none; position: absolute; right: 0; top: 0; } /* nav */ .banner { width: 100%; position: relative; } .banner a { display: block; } .banner>img { display: block; width: 100%; } .banner .slick { position: relative; z-index: 9; } .banner.section .fp-tableCell, .banner.section .slick, .banner.section .slick div, .banner.section .slick a, .banner.section .slick img { display: block; width: 100%; height: 100%; } .banner .slick-slide a { display: block; position: relative; } .banner .slick .slick-slide a::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../images/banner-zzc.png) repeat-x; background-position: center bottom; } .banner .slick-prev, .banner .slick-next { width: 32px; height: 49px; } .banner .slick-prev { left: 110px; background: url(../images/banner-l.png) no-repeat; background-size: 100% 100%; } .banner .slick-next { right: 110px; background: url(../images/banner-r.png) no-repeat; background-size: 100% 100%; } .banner .slick-dots { text-align: right; max-width: 1400px; left: 50%; transform: translateX(-50%); font-size: 0; z-index: 8; bottom: 50px; } .banner .slick-dots li { width: 11px; height: 11px; border-radius: 50%; border: 2px solid #fff; } .banner .slick-dots li.slick-active { border-color: #f0a402; background: #f0a402; } .banner-ul { position: absolute; width: 730px; left: 50%; margin-left: -700px; bottom: 40px; z-index: 9; } .banner-ul li a { display: block; } .banner-ul li a div { width: 68px; height: 68px; border: 1px dashed #fff; text-align: center; line-height: 66px; margin: 0 auto; border-radius: 50%; font-size: 0; } .banner .banner-ul li a div img { display: inline-block; width: auto; vertical-align: middle; } .banner .banner-ul li a:hover div img { transition: all 0.5s; transform: rotateY(360deg); } .banner-ul li a p { text-align: center; color: #fff; font-size: 16px; line-height: 32px; } .next-back { position: absolute; bottom: 60px; left: 50%; transform: translateX(-50%); z-index: 9; } .next-back img { display: block; width: auto !important; height: auto !important; } .pic { padding-top: 75%; position: relative; overflow: hidden; } .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; transition: all 1s; } .pic img:hover { transform: scale(1.05); } .footer { background: #084ea3 url(../images/foot-bj.jpg) no-repeat; background-position: right center; background-size: cover; position: relative; } .section_last .fp-tableCell, .section_last { display: block !important; height: auto !important; } .link { background: #eee; } .link ul li { display: none; padding: 15px 0; } .link ul li:first-child { display: block; } .link ul li span { float: left; line-height: 30px; font-weight: 600; } .link ul li div { overflow: hidden; } .link ul li div a { float: left; font-size: 16px; color: #333; line-height: 16px; padding: 7px 15px; position: relative; } .link ul li div a::before { content: ""; height: 16px; width: 1px; background: #585858; position: absolute; left: 0; } .link ul li div a:first-child::before { content: none; } .link ul li div a:hover { color: #064087; } .link ul li div a:first-child { border-left: 0; } .foot-t { padding: 25px 0; background: url(../images/foot-text.png) no-repeat; background-position: 65% center; border-bottom: 1px solid #fff; border-bottom: 1px solid rgba(255, 255, 255, 0.2); } .foot-t ul { float: left; } .foot-t ul li { float: left; margin-left: 30px; font-size: 0; position: relative; } .foot-t ul li[data-class="cyxt"].on::before { content: ""; position: absolute; top: -25px; left: 50%; transform: translateX(-50%); border-top: 10px solid #fff; border-left: 10px solid transparent; border-right: 10px solid transparent; } .foot-t ul li[data-class="yqlj"].on::before { content: ""; position: absolute; top: -25px; left: 50%; transform: translateX(-50%); border-top: 10px solid #fff; border-left: 10px solid transparent; border-right: 10px solid transparent; } .foot-t ul li[data-class="cylj"].on::before { content: ""; position: absolute; top: -25px; left: 50%; transform: translateX(-50%); border-top: 10px solid #fff; border-left: 10px solid transparent; border-right: 10px solid transparent; } .foot-t ul li:first-child { margin-left: 0; } .foot-t ul li img { vertical-align: middle; } .foot-t ul li a>span { color: #fff; font-size: 14px; vertical-align: middle; margin: 0 10px; } .foot-media { float: right; } .foot-media>div { float: left; margin-left: 20px; position: relative; cursor: pointer; } .foot-media>div:first-child { margin-left: 0; } .foot-media>div img { vertical-align: middle; } .foot-media>div span { vertical-align: middle; color: #fff; font-size: 14px; margin-left: 10px; } .foot-media>div:hover div { display: block; } .foot-media>div div { display: none; position: absolute; left: 15px; transform: translateX(-50%); padding: 5px; background: #fff; border-radius: 5px; margin-top: 25px; } .foot-media>div div::after { content: ""; position: absolute; left: 50%; transform: translateX(-50%); bottom: 100%; border-left: transparent 6px solid; border-right: transparent 6px solid; border-bottom: #fff 6px solid; } .foot-b { padding: 20px 0; } .foot-bl { display: table-cell; vertical-align: middle; } .foot-bl a { display: block; } .foot-bl a img { display: block; max-width: 100%; margin: 0 auto; } .foot-br { display: table-cell; vertical-align: middle; color: #fff; font-size: 12px; line-height: 28px; padding-left: 25px; } .foot-br p img { vertical-align: middle; margin-right: 10px; } .foot-br p div{display:inline-block;} .foot-br div{display:inline-block;margin-right:10px;} .foot-br div img{ vertical-align: middle; margin-right: 10px;} .foot-br div span{ vertical-align: middle;} .bq { text-align: center; color: #fff; font-size: 12px; line-height: 20px; padding: 10px 0; background: #064087; } .bq .copyright{ display: inline-block; vertical-align: middle; } .bq .sydw{ display: inline-block; vertical-align: middle; } .bq img { vertical-align: middle; margin-left: 15px; } .bq p{ display:inline-block; } .bq a{ color:#fff; } .zs { position: fixed; right: 0; top: 50%; transform: translateY(-50%); z-index: 999; } .zs>ul>li { margin-top: 1px; overflow: hidden; margin: 7px 0; } .zs>ul>li>a { float: right; display: block; position: relative; padding-left: 34px; height: 60px; line-height: 60px; font-size: 16px; color: #fff; box-sizing: border-box; transition: all .3s; padding-left: 50px; margin-right: 10px; } .zs>ul>li>a::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 58px; height: 58px; border-radius: 50%; border: 1px solid #fff; background: #084ea3; z-index: 9; } .zs>ul>li:first-child>a::before { background: #084ea3 url(../images/fixedRight1.png) no-repeat; background-position: center center; } .zs>ul>li:first-child+li>a::before { background: #084ea3 url(../images/fixedRight2.png) no-repeat; background-position: center center; } .zs>ul>li:first-child+li+li>a::before { background: #084ea3 url(../images/fixedRight3.png) no-repeat; background-position: center center; } .zs>ul>li:first-child+li+li+li>a::before { background: #084ea3 url(../images/fixedRight4.png) no-repeat; background-position: center center; } .zs>ul>li:first-child+li+li+li+li>a::before { background: #084ea3 url(../images/gotop.png) no-repeat; background-position: center center; } .zs>ul>li>a>img { position: absolute; top: 8px; left: 8px; } .zs>ul>li>a span { display: block; opacity: 0; height: 35px; width: 0; text-align: center; line-height: 32px; margin-top: 15px; border-top: 1px solid #fff; border-bottom: 1px solid #fff; background: #f0a402; transition: all 0.5s; padding-left: 10px; position: relative; z-index: 8; white-space: nowrap; overflow: hidden; } .zs>ul>li:hover a { margin-right: 0; } .zs>ul>li:hover a span { width: 130px; opacity: 1; background-color: #f0a402; } .zs>ul>li:first-child>a:hover::before { background: #f0a402 url(../images/fixedRight1.png) no-repeat; background-position: center center; } .zs>ul>li:first-child+li>a:hover::before { background: #f0a402 url(../images/fixedRight2.png) no-repeat; background-position: center center; } .zs>ul>li:first-child+li+li>a:hover::before { background: #f0a402 url(../images/fixedRight3.png) no-repeat; background-position: center center; } .zs>ul>li:first-child+li+li+li>a:hover::before { background: #f0a402 url(../images/fixedRight4.png) no-repeat; background-position: center center; } .zs>ul>li:first-child+li+li+li+li>a:hover::before { background: #f0a402 url(../images/gotop.png) no-repeat; background-position: center center; } #goTop a{ padding-left: 60px; } .zs>ul>#goTop:hover a{ margin-right: 10px; } @media screen and (max-width:1750px) { .nav>ul>li>a { font-size: 16px; } } @media screen and (max-width:1400px) { .px1400 { padding-left: 10px; padding-right: 10px; margin-left: 0; margin-right: 0; } .logo { left: 10px; } .logo a img { height: 45px; } .nav { padding-left: 420px; } .nav>ul>li>a { font-size: 14px; } .banner-ul { left: 0; margin-left: 0; } .banner-ul { width: 600px; } .banner-ul li a div { width: 58px; height: 58px; line-height: 58px; } } @media screen and (max-width:1320px) { .px1320 { padding-left: 10px; padding-right: 10px; } /* .banner .slick-prev, .banner .slick-next { width: 40px; height: 40px; } */ .banner .slick-prev { left: 15px; } .banner .slick-next { right: 15px; } .nav>ul>li>a { font-size: 12px; padding-bottom: 10px; } .head { padding-top: 10px; } .nav>ul { margin-top: 15px; } .logo a img { height: 37px; } .nav { padding-left: 350px; } } @media screen and (max-width:1200px) { .foot-t { background: none; } } @media screen and (max-width:1024px) { body { padding-top: 60px !important; } .pc { display: none; } .wap { display: block; } .m-head { position: fixed; top: 0; left: 0; right: 0; background: #084ea3; padding: 10px; z-index: 999; box-shadow: 0 5px 5px rgb(0 0 0 / 20%); } .m-logo { font-size: 0; } .m-logo a { font-size: 0; line-height: 40px; } .m-logo img { max-height: 40px; max-width: 80%; vertical-align: middle; } .m-tlink { padding: 10px 15px 0 15px; } .m-tlink a { font-size: 14px; margin-right: 15px; margin: 5px 0; color: #fff; display: inline-block; font-size: 14px; line-height: 24px; background: #fff; color: #004980; line-height: 30px; padding: 0 15px; border-radius: 5px; } .m-search { margin: 0 15px; padding-right: 50px; padding-left: 10px; padding-top: 5px; padding-bottom: 5px; position: relative; line-height: 35px; /* background: #fff; */ margin-top: 15px; border: 1px solid #fff; } .m-search input[type="text"] { display: block; width: 100%; line-height: 25px; background: none; color: #fff; } .m-search input[type="text"]::placeholder { color: #fff; } .m-search input[type="image"] { position: absolute; right: 10px; top: 10px; height: 15px; } .m-nav { position: fixed; top: 60px; right: -100%; bottom: 0; z-index: 999; background: #0555ba; overflow-y: scroll; width: 100%; max-width: 375px; } .m-nav ul { padding: 0 15px; /* border-top: 1px solid rgba(255, 255, 255, 0.2); */ } .m-nav ul li { border-bottom: 1px solid rgba(255, 255, 255, 0.2); position: relative; } .m-nav ul li>span.on { transform: rotateZ(90deg); } .m-nav ul li ul { display: none; } .m-nav ul li ul li { border: none; } .m-nav>ul>li a { display: block; font-size: 14px; line-height: 20px; padding: 15px 0; position: relative; color: #fff; } .m-nav>ul>li ul li a { padding: 10px 0; } .m-nav>ul>li>span { position: absolute; width: 20px; height: 20px; background: url(../images/m-nav_down.png) no-repeat; background-size: 14px 14px; background-position: center center; right: 0; top: 15px; cursor: pointer; display: block; color: #fff; transition: all 0.3s; } .banner .slick-prev { left: 10px; } .banner .slick-next { right: 10px; } .banner .slick-slide a div p { text-align: center; font-size: 18px; bottom: 5px; } .banner .slick, .banner .slick div, .banner .slick div a, .banner .slick img { height: auto; } .banner .slick-dots { bottom: 10px; /* right: 20px; */ width: 100%; text-align: center; left: auto; transform: translateX(0); } .banner-ul { position: static; background: #084ea3; width: auto; padding: 15px 0; } .banner-ul li a p { font-size: 14px; } .banner-ul li a div { width: 50px; height: 50px; line-height: 48px; } .banner-ul li a div img { max-width: 40%; } .link ul li div a { font-size: 14px; } .foot-t ul li { margin-left: 20px; } .zs{top:auto;bottom:50px;} .zs>ul>li{display:none;} .zs>ul>li.goTop{display:block;} } @media screen and (max-width:768px) { .m-nav{ padding: 0 25px; } .banner .slick-prev, .banner .slick-next { width: 20px; height: 30px; } .banner-ul { padding: 5px 0; } .banner-ul li a div { width: 40px; height: 40px; line-height: 38px; } .link ul li span { float: none; display: block; } .foot-t ul li { width: 25%; margin-left: 0; text-align: center; } .foot-t ul, .foot-media { float: none; width: auto; } .foot-media { margin-top: 25px; } .foot-t ul li a>span { margin: 0 5px; } .foot-t ul li[data-class="yqlj"].on::before { top: 100%; border-bottom: 5px solid #fff; border-top: none; border-width: 5px; } .foot-t ul li[data-class="cylj"].on::before { top: 100%; border-bottom: 5px solid #fff; border-top: none; border-width: 5px; } .foot-media { text-align: center; } .foot-media>div { float: none; display: inline-block; } .foot-bl, .foot-br { display: block; text-align: center; padding-left: 0; } .foot-br { margin-top: 15px; } .zs>ul>li{ margin: 3px 0; } .zs>ul>li>a { height: 40px; line-height: 40px; padding-left: 30px; margin-right: 0; } .zs>ul>li>a::before { width: 38px; height: 38px; } .zs>ul>li:first-child>a::before { background: #084ea3 url(../images/fixedRight1.png) no-repeat; background-position: center center; background-size: 20px; } .zs>ul>li:first-child+li>a::before { background: #084ea3 url(../images/fixedRight2.png) no-repeat; background-position: center center; background-size: 20px; } .zs>ul>li:first-child+li+li>a::before { background: #084ea3 url(../images/fixedRight3.png) no-repeat; background-position: center center; background-size: 20px; } .zs>ul>li:first-child+li+li+li>a::before { background: #084ea3 url(../images/fixedRight4.png) no-repeat; background-position: center center; background-size: 20px; } .zs>ul>li:first-child+li+li+li+li>a::before { background: #084ea3 url(../images/gotop.png) no-repeat; background-position: center center; background-size: 20px; } .zs>ul>li:first-child>a:hover::before { background: #f0a402 url(../images/fixedRight1.png) no-repeat; background-position: center center; background-size: 20px; } .zs>ul>li:first-child+li>a:hover::before { background: #f0a402 url(../images/fixedRight2.png) no-repeat; background-position: center center; background-size: 20px; } .zs>ul>li:first-child+li+li>a:hover::before { background: #f0a402 url(../images/fixedRight3.png) no-repeat; background-position: center center; background-size: 20px; } .zs>ul>li:first-child+li+li+li>a:hover::before { background: #f0a402 url(../images/fixedRight4.png) no-repeat; background-position: center center; background-size: 20px; } .zs>ul>li:first-child+li+li+li+li>a:hover::before { background: #f0a402 url(../images/gotop.png) no-repeat; background-position: center center; background-size: 20px; } .zs>ul>li>a span{ height: 30px; line-height: 28px; font-size: 12px; margin-top: 5px; } #goTop a{ padding-left: 40px; } #goTop span{ display: none; } .zs>ul>#goTop:hover a{ margin-right: 0; } } @media screen and (max-width:480px) { .foot-t ul li { float: right; width: 50%; margin-bottom: 15px; } .foot-media>div div { left: 50%; } }