﻿﻿@charset "utf-8";
/* CSS Document */
@font-face{
    font-family:"MiSans_r";
    src:url("Mi-R.ttf");
}
@font-face{
    font-family:"MiSans_b";
    src:url("Mi-B.ttf");
}

*{padding: 0px;margin: 0px;font-family:"MiSans_b";}
*, ::after, ::before { box-sizing: border-box;}
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, fieldset, button, input, textarea, th, td { margin: 0; padding: 0; list-style: none; }
html{ background:#fff;} 
li {list-style: none;}
a {text-decoration: none;}
body,html {height: 100%;width: 100%;font-size: 14px;}

img{vertical-align: middle;}


.container {width: 100%; max-width:1530px; padding:0 15px; margin:0 auto;}
.container1 {width: 100%; max-width:1280px; padding:0 15px; margin:0 auto;}
.container2 {width: 100%; max-width:1360px; padding:0 15px; margin:0 auto;}

@media (max-width: 576px) {
  .container {max-width: 540px;}
}

@media (max-width: 768px) {
  .container {max-width: 720px;}
}

@media (max-width: 992px) {
  .container {max-width: 960px;}
}

@media (max-width: 1200px) {
  .container {max-width: 1140px;}
}


/* header */
.header{width: 100%;box-sizing: border-box;box-sizing: border-box;padding: 0 5%;position: fixed;top: 0;left: 0;z-index: 20;transition: all .3s;}
.header .box{width: 100%;display: flex;justify-content: space-between;align-items: center;}
.header .box .logo{display: block;}
.header .box .logo img{display: block;width: 200px;}
.header .box .logo .logo02{display: none;}
.header .box .nav{display: flex;justify-content: flex-start;;align-items: center;}
.header .box .nav ul{display: flex;justify-content: flex-start;align-items: center;}
.header .box .nav ul li{position: relative;}
.header .box .nav ul li>a{display: block;height: 90px;line-height: 90px;font-size: 16px;color: #fff;position: relative;box-sizing: border-box;padding: 0 30px;}
.header .box .nav ul li .nav02{width:140%;position:absolute;background: rgba(255,255,255,.95);position: absolute;left: 50%;top:85px;z-index: 999;transform-origin: 0 0 0;transform: scaleY(0.2) translateX(-50%);
	transition: all 0.3s ease 0s;opacity: 0;visibility: hidden;border-radius: 0 0 15px 15px;overflow: hidden; padding-bottom:20px;}
.header .box .nav ul li .nav02 a{display: block;width: 100%;font-size: 15px;color: #666;line-height: 45px;position: relative;text-align: center;}
.header .box .nav ul li .nav02 a:hover{color: #2b67f1;background: #fff;}
.header .box .nav ul li:hover .nav02{display: block; font-size:36px; color:#1571ff; margin-top:5px;}
.header .box .nav ul li:hover .nav02{opacity: 1;visibility:visible;transform: translateY(0px) translateX(-50%);}


.header:hover{background: #fff;}
.header:hover .box .logo .logo01{display: none;}
.header:hover .box .logo .logo02{display: block;}
.header:hover .box ul li>a{color: #333333;}
.header:hover .box .nav ul{color: #333333;}
.header:hover .box .nav ul a{color: #333333;}
.header:hover .box .nav ul span{background-color: #333333;}

.div1.header{background: #fff;}
.div1.header .box .logo .logo01{display: none;}
.div1.header .box .logo .logo02{display: block;}
.div1.header .box ul li a{color: #333333;}
.div1.header .box .nav ul{color: #333333;}
.div1.header .box .nav ul a{color: #333333;}
.div1.header .box .nav ul span{background-color: #333333;}


@media (max-width: 1680px) {
	.header .box .logo img{width:180px;}
	.header .box .nav ul li>a{padding: 0 20px;}
}

.header:hover .box .nav li:hover>a{color: #2b67f1;}

 
/* ibanner */
.ibanner { width:100%;position: relative;height: 100vh;}
.ibanner .text { position: absolute;left: calc((100% - 80%)/2);top: 35%; text-transform:uppercase;z-index: 2;}
.ibanner .swiper { width:100%;height: 100%; overflow: hidden;}
.ibanner .text dd {overflow: hidden;}
.ibanner .text h3 {font-size: 72px; font-weight: bold; color: #fff; line-height: 12.7rem; font-family: Arial; }
.ibanner .text h3,.ibanner .text h4 {opacity: 0;transform: translateY(170%);transition: transform .9s ease-out .5s; transition: transform .9s ease-out .5s; will-change: transform; }
.ibanner .swiper-slide-active  .text h3 ,.ibanner .swiper-slide-active  .text h4{transform: translateY(0%); opacity: 1;  }
.ibanner .text h4 { font-size: 30px; color: #fff; margin: 0px 0 0.8rem;font-weight:500;font-family:"MiSans_r";}
.ibanner .text h5 {font-size: 20px;margin-bottom: 2.4rem; color: #fff;}
.ibanner .imgbox ,.ibanner .box{height: 100%;width: 100%;}
.ibanner .imgbox img { width:100%;height: 100%;object-fit: cover;}
.ibanner .swiper-pagination {bottom: 38px;left: 50%;transform: translate(-50%,-50%);}
.ibanner .swiper-pagination-bullet {transition: 0.5s; width: 16px; height: 16px; border-radius: 50%; background: #fff; margin: 0 5px!important; opacity: 1;}
.ibanner .swiper-pagination-bullet-active { opacity: 1; background:#2b67f1;}
.ibanner .swiper-slide-active img { animation: mysacle 4s ease both; }
@keyframes mysacle { 0% { transform: scale(1.1); } }
.ibanner .imgbox::after { content: ""; display: inline-block; width: 100%; height: 70%; background: linear-gradient(to top ,rgba(0,0,0,0.2),rgba(0,0,0,0)); position: absolute; left: 0; bottom: 0px; }
.ibanner .ibanner_prev { background-image: none; width: 60px; height: 60px; border-radius: 50%; border:1px solid #fff; display: flex; justify-content: center; align-items: center;}
.ibanner .ibanner_next { background-image: none; width: 60px; height: 60px; border-radius: 50%; border:1px solid #fff; display: flex; justify-content: center; align-items: center;}
.ibanner .ibanner_prev:hover {background:#f6a20f; border:none;}
.ibanner .ibanner_next:hover {background:#f6a20f; border:none;}
.ibanner .ibanner_prev {left:50px;}
.ibanner .ibanner_next {right:50px;}


.i_tit{ width:100%; position:relative; padding-bottom:20px;}
.i_tit h1{ font-size:22px; font-weight:bold; color:#2b67f1;}
.i_tit h2{ font-size:42px; font-weight:bold; color:#333;}


.i01{padding:120px 0;background-repeat:no-repeat;background-position:center center;background-size:cover;background-image:url(i01bg.jpg);background-attachment:fixed !important;}
.i01 .con{ width:100%; position:relative; z-index: 6;}
.i01 .re{ width:75%;}
.i01 .con .text{ width:100%; font-size: 18px;line-height: 35px; color: #333; margin-top:20px;font-family:"MiSans_b";}
.i01 .con dl { padding-top:70px; margin-bottom:30px;display: flex;align-items: center;}
.i01 .con dl dd{ width:33%;}
.i01 .con dl dd h4 {display: flex;}
.i01 .con dl dd h4 strong { font-weight: bold; font-size:50px;margin-right: 0.8rem;color:#333; line-height: 1em; }
.i01 .con dl dd h4 span{ font-size:18px; position:relative; top:-10px; color: #333;}
.i01 .con dl dd h5{font-size: 16px; position: relative; margin-top:0; padding-top: 6px; color: #333; }
.i01 .more { width:200px; height:50px; line-height:50px; background:#2b67f1; color:#fff; text-align:center; font-size:16px; border-radius:25px; margin-top:60px;}
.i01 .more a { display:block; color:#fff; border-radius:25px;}
.i01 .more a:hover { background:#682313; border-radius:25px;}
@media (max-width: 1680px) {
	.i01 .re{ width:65%;}
	.i01 .con .text{ width:100%;}
}


.i02{ width:100%; position:relative; padding:60px 0; background:url(i02bg.jpg) no-repeat;}
.i02 .con {display: flex;width: 100%;padding:0;height: 480px;}
.i02 .con .item {flex: 1;overflow: hidden;transition: .5s;margin: 5px;height: 450px;text-align: center; position:relative;}
.i02 .con .item .img {width: 110%;height: 100%;object-fit: cover;transition: .5s;}
.i02 .con .item .txt {font-size: 16px;font-weight: bold;display: block;text-align: left;height: 30px;line-height:30px;color: #000;transition: all 0.3s; position:absolute; top:82%;left: 10%;}
.i02 .con .item .txt font{font-size: 13px;line-height: 30px;font-weight: normal;margin-top: 2%;}
.i02 .con .item .txt img{display: block; width:60px;margin: 0 0 20px;}
.i02 .con .item .txt .more { width:100px; height:30px; line-height:30px; border-radius:15px; margin-top:10px; background:#2b67f1; color:#fff; text-align:center; font-size:12px;}
.i02 .con .item .txt .more a { display:block; color:#fff; border-radius:20px;}
.i02 .con .item:hover {flex: 1 1 15%;}
.i02 .con .item:hover .img {width: 100%;height: 100%;transition: .5s;opacity: 1;}
.i02 .con .item:hover .txt {height: 100%;line-height:40px;color: #333;opacity: 1;z-index: 999;margin-left: 0;transition: all 0.3s;}

/* i03 */
.i03 {width:100%; position:relative;background: #f5f5f5; padding:60px 0;}
.i03 .box{margin-top: 30px; display:flex;flex-wrap: wrap;}
.i03 .box .item{width:32%; margin-right:1.3%; background:#fff;}
.i03 .box .item .img{ width:100%; position:relative;} 
.i03 .box .item .img img{position:absolute;left:3%;top:3%;width:94%;height:94%;}
.i03 .box .item .img .hezi{padding-bottom: 67% !important;}
.i03 .box .item .tit{padding: 30px 20px;color: #333;font-size: 22px;line-height: 30px;height: 120px;}
.i03 .box .item .time{padding:18px 40px;background:rgba(43,103,241,0.1);align-items: center;display:flex;flex-wrap: wrap;}
.i03 .box .item .time .le{color: #8b8b8b;line-height: 1;}
.i03 .box .item .time .re{width:38px;height:38px; background:#2b67f1;border-radius:38px;line-height:36px;color:#333;margin-left:auto;text-align:center;display: flex;justify-content:center;align-items: center;}
.i03 .box .item .time .re img{transition:0.5s all;}
.i03 .box .item a:hover .time .re{background:#173a8a;}
.i03 .box .item a:hover .time .re img{transform:rotateZ(45deg);}


 /* footer */
.footer { width:100%;position: relative;background:#015e9f;}
.footer .box {display: flex;}
.footer .box .fo01 { width:20%; margin-right:10%;padding: 80px 0;}
.footer .box .fo01 img { width:200px; margin-bottom:20px;}
.footer .box .fo01 p{ display:block;font-size: 14px;color:rgba(255,255,255,.5);line-height:30px;}
.footer .box .fo02 { width:70%;padding: 80px 0;}
.footer .box .fo02 ul {display: flex;justify-content: space-between;}
.footer .box .fo02 ul li { width:auto;}
.footer .box .fo02 ul li h3 {margin-bottom: 45px;}
.footer .box .fo02 ul li h3 a { display: inline-block; font-size: 18px; color: #fff; font-weight: bold; position:relative;}
.footer .box .fo02 ul li h3 a:before{ content:""; position:absolute; width:50px; height:1px; background:rgba(255,255,255,.5); left:0;bottom:-20px; transition:.5s; z-index:1;}
.footer .box .fo02 ul li p a{ display:block;font-size: 14px;color:rgba(255,255,255,.5);line-height:30px;}
.footer .box .fo02 ul li p a:hover {color:rgba(255,255,255,1);}
.footer .fo03 { width:100%; position:relative; padding:20px 0;background:#023457; color:rgba(255,255,255,.5);}
.footer .fo03 .con{display: flex;justify-content: space-between;align-items: center;}
.footer .fo03 .con .le {width: 50%;}
.footer .fo03 .con .le a{ margin-right:5px;}
.footer .fo03 .con .re { width:50%;color:rgba(255,255,255,.5); text-align:right;}
.footer .fo03 .con .re a {font-size: 14px;color:rgba(255,255,255,.5); line-height:25px;}

.n_banner{width: 100%;position: relative; z-index:-1;}
.n_banner img{width: 100%;display: block;}

.n_menu{width: 100%; position:relative;box-shadow: -2px 2px 20px #dcdcdc;}
.n_menu ul{width: 100%;display: flex;z-index:1;}
.n_menu ul li{width: auto; padding:0; margin-right:30px; height: 70px;line-height: 70px;transition: all .4s ease;}
.n_menu ul li a{width: 100%; display:block;font-size: 18px;color: #333;font-weight: 500; text-align:center;}
.n_menu ul li:hover a, .n_menu ul li.active a{ border-bottom:2px solid #2b67f1;}


.n_main{color:#333; margin:60px 0;}
.n_main .n_title{ font-size:36px; text-align:center;margin: 0 auto 50px;}

/* 关于我们 */
.n_about{width: 100%;position: relative;}
.n_about .n_txt{ color:#333; font-size:16px; line-height:30px; min-height:350px; line-height:30px; text-align:justify;}
.n_about .n_txt img{ max-width:100%;}

.n_tit { width:100%; position:relative; margin-bottom:30px;}
.n_tit h1{margin-bottom: 20px;font-size:35px;line-height: 30px;color: #333;}
.n_tit h2{ width:65px;height:2px; background:#004572;}

.ab01{width: 100%;position: relative;padding:0 0 60px;background:url(ab01bg.jpg) no-repeat;}
.ab01 .con{ width:100%; position:relative; z-index: 6;display: flex;}
.ab01 .con .le{ width:40%; margin-right:5%;}
.ab01 .con .le .img{width: 100%;position: relative;}
.ab01 .con .le .img img{width: 100%;}
.ab01 .con .le dl { padding-top:70px; margin-bottom:30px;display: flex;align-items: center;}
.ab01 .con .le dl dd{ width:33%;}
.ab01 .con .le dl dd h4 {display: flex;}
.ab01 .con .le dl dd h4 strong { font-weight: bold; font-size:50px;margin-right: 0.8rem;color:#333; line-height: 1em; }
.ab01 .con .le dl dd h4 span{ font-size:18px; position:relative; top:-10px; color: #333;}
.ab01 .con .le dl dd h5{font-size: 16px; position: relative; margin-top:0; padding-top: 6px; color: #333; }
.ab01 .con .re{ width:55%; border-top:2px solid rgba(43,103,241,0.5);}
.ab01 .con .re .txt{ width:100%; font-size: 18px;line-height: 35px; color: #333; margin-top:20px;font-family:"MiSans_b";}


.ab02{width: 100%;position: relative;padding:60px 0;}
.ab02 ul{display: flex;flex-wrap:wrap; justify-content: space-between;align-items: center; }
.ab02 ul li{width:24%; display:block; position:relative; overflow:hidden }
.ab02 ul li:after{ content:""; position:absolute; height:0; right:0; bottom:0; left:0; transition:.5s; z-index:1}
.ab02 ul li .img{position:relative;width:100%;overflow: hidden;}
.ab02 ul li .img img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%; transition:.5s;}
.ab02 ul li .hezi{ padding-bottom:138% !important}
.ab02 ul li .con{ position:absolute; left:0; right:0; bottom:0; padding:0 3rem 2.75rem; z-index:2; transition:.5s; transform:translateY(calc(2.5rem + 48px))}
.ab02 ul li .con .h6{ font-family:POPPINS-light; font-size:1.125rem; color:#fff; text-transform:uppercase}
.ab02 ul li .con h2{ font-size:1.5rem; color:#fff; margin:.375rem 0 2.5rem}
.ab02 ul li .con p{font-size: 15px;color:#fff;line-height:24px;height:48px;opacity:.7;}
.ab02 ul li .shuzi{ position:absolute; top:12%; left:0; right:0; padding:0 12% 0 0; text-align:right; font-size: 3rem; -webkit-text-stroke: .5px rgba(255,255,255,.8); font-family:POPPINS-BOLD; z-index:2}
.ab02 ul li:hover .con{ transform:translateY(0)}
.ab02 ul li:hover .img img{ transform:scale(1.05)}
.ab02 ul li:hover:after{ height:100%; background:rgba(0,40,123,0.8)}

.n_news { padding:0px 0 90px;}
.n_news ul{ width:100%; position:relative; margin-top:30px;}
.n_news ul li{box-sizing: border-box;padding:30px 0 30px 28px;margin-bottom: 48px;box-shadow: 0px 0px 20px rgba(0,45,80,.1); background: #fff;}
.n_news ul li a{ width:100%; display: flex;flex-wrap: wrap;}
.n_news ul li .img{ width:25%; position:relative; background:#f2f2f2;} 
.n_news ul li .img img{position:absolute;left:0;top:0;width:100%;height:100%;}
.n_news ul li .img .hezi{padding-bottom: 65% !important;}
.n_news ul li .txt{width: 65%;box-sizing: border-box;padding:25px 40px 0 52px;}
.n_news ul li .txt .tim{margin:36px 0; font-size:16px;font-weight: bold;line-height:20px;color: #aaa;}
.n_news ul li .txt .tit{ font-size:24px;height: 20px;line-height: 20px;color: #333; }
.n_news ul li .txt .sum{height: 56px; line-height: 28px;color: #555;}
.n_news ul li .icon{width: 10%;border-left: 1px dashed #ccc;padding-left: 60px;display: flex;flex-wrap: wrap;align-items: center;}
.n_news ul li .icon .yuan{width: 52px;height: 52px;border-radius: 100%;border: 1px solid #ce0c18;display: flex;flex-wrap: wrap; align-items: center;justify-content: center;color: #ce0c18;cursor: pointer;}
.n_news ul li .icon .yuan img{ width:20px;}
.n_news ul li:hover .txt .tit{color: #004572;}
.n_news ul li:hover .txt .sum{color: #004572;}
.n_news ul li:hover .yuan{background:rgba(206,12,24,0.1);border: 1px solid rgba(206,12,24,0.1);}

.n_chanpin {width:100%;position: relative; z-index: 9;padding-bottom:60px;}
.n_chanpin .itemBox {width: 100%;display: flex;flex-wrap:wrap; align-items: center; margin-top:30px;}
.n_chanpin .itemBox .item {width: 23%;margin-right: 2.6%;margin-bottom: 40px;box-shadow: 0 0 10px 0 #ccc; background:#fff;}
.n_chanpin .itemBox .item:nth-child(4n){ margin-right:0;}
.n_chanpin .itemBox .item .img{ width:100%; position:relative;} 
.n_chanpin .itemBox .item .img img{position:absolute;left:5%;top:5%;width:90%;height:90%;}
.n_chanpin .itemBox .item .img .hezi{padding-bottom: 65% !important;}
.n_chanpin .itemBox .item .tit { height:60px;line-height:60px;font-size: 16px; text-align:center; color: #333; border-top:1px solid #ddd; position:relative;}
.n_chanpin .itemBox .item .tit:before{ content: ""; display: block; position: absolute; left: 0; bottom: 0; width: 0; height: 2px; background: #004572; transition: .5s;}
.n_chanpin .itemBox .item :hover .tit:before { width:100%;}


.n_zhao {width:100%;position: relative; z-index: 9;padding-bottom:60px;}
.n_zhao .n_txt{ font-size:16px; line-height:30px; text-align:justify;}
.n_zhao .con {width: 100%; margin-top:90px;}
.n_zhao .con ul li {background: #f6f7f9;margin-bottom: 10px;}
.n_zhao .con ul li.on .top {background: #0059aa;color: #fff;}
.n_zhao .con ul li.on .top p {color: #fff;}
.n_zhao .con ul li.on .top .ico {background-image: url(ico02.png);-webkit-transform: rotate(180deg);transform: rotate(180deg);}
.n_zhao .con ul li .top {display: flex;align-items: center;height: 70px;cursor: pointer;transition: all 0.5s;}
.n_zhao .con ul li .top h3 {width: 100%;padding: 0 50px;}
.n_zhao .con ul li .top p {flex-shrink: 0;width: 41%;display: flex;align-items: center;padding: 0 50px;color: #999;transition: all 0.5s;}
.n_zhao .con ul li .top .ico {flex-shrink: 0;width: 116px;height: 100%;padding: 0 50px;background: transparent url(ico01.png) no-repeat center / 16px auto;transition: all 0.5s;}
.n_zhao .con ul li .bot {display: none;padding: 50px 50px 80px;}
.n_zhao .con ul li .bot .txt {color: #666;line-height: 30px; font-size:14px;}
 
.n_lianx{width:100%;position: relative; z-index: 9;padding-bottom:60px;}
.n_lianx .box{ display:flex;flex-wrap: wrap;}
.n_lianx .box .item{width: 33.33333%;}
.n_lianx .box .item>div{padding:30px;border: 1px solid #ddd;margin: 0 -1px -1px 0;height: 100%;}
.n_lianx .box .item .tit{font-size: 20px;font-weight: bold;line-height: 1;}
.n_lianx .box .item .icon{margin: 30px 0;height: 140px;}
.n_lianx .box .item .icon img{height: 100%;}
.n_lianx .box .item .tel .n{color: #666;line-height: 1;margin-bottom: 5px;}
.n_lianx .box .item .tel .t{font-size: 18px;font-weight: bold;line-height: 28px;min-height:56px;}
.n_lianx .box .item .tps{color: #666;line-height: 1.625;margin-top: 10px;}



