:root{
    --blue:#093c8a;
} 
*{
    margin:0px;
    padding:0px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    -webkit-appearance: none;
}
img,a{
    -webkit-touch-callout: none;
    text-decoration: none;
    max-width: 100%;
}
body{
    width: 100%;
    min-width:320px;
    max-width:640px;
    margin:0 auto;
    background: #fff;
    font-size:14px;
    font-family: -apple-system,Helvetica,sans-serif;
    line-height:1.5;
    color:#666;
    padding-bottom: 3rem;
}
ul,li{
    list-style:none;
}
.df{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.cl{
    clear: both;
}
/* 头部 start */
header{
	width: 100%;
    min-width:320px;
    max-width:640px;
    position: fixed;
    background-color: #ffffff;
    z-index:777;
    box-shadow:0 1px 2px rgb(0, 0, 0,.2);
    display: flex;
}
.head{
	position: relative;
    width:10rem;
    flex:.5;
}
.head .nav_btn{
    position: absolute;
    right:10px;
    top:10px;
    z-index: 999;
}
.logo{
    flex:1;
	display:flex;
    justify-content: center;
    align-items: center;
    padding:.2rem 1rem;
}
.logo img{
    width:100%;
}
.nav_btn{
	width: 40px;
	height: 40px;
	margin-right: 10px;
	flex-direction:column;
	justify-content: center;
	cursor: pointer;
}
.nav_btn i{
	font-style: normal;
	display: none;
}
.nav_btn span{
	width: 30px;
	height: 4px;
	border-radius: 2px;
	background: var(--blue);
	display: block;
	margin: 4px 0;
}
header .close span{
	display: none;
}
header .close i{
	display: block;
	font-size: 30px;
	color: #fff;
}
.close:focus, .close:hover{
    opacity: 1 !important;
}
.nav{
	position: absolute;
	width: 100%;
	height: 0;
	background: rgba(9,60,138,.7);
	z-index: 888;
	transition: all 0.3s;
	overflow: hidden;
	max-width: 640px;
}
.navopen{
    height:400vh;
}
.nav>ul{
	height: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.nav>ul>li{
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1;
    justify-content: center;
    width: 100%;
    border-bottom: 1px solid rgba(255,255,255,.1);
    padding: 1rem 0;
	position:relative;
}
.nav>ul>li>a{
	font-size: 1.4rem;
    color: #fff;
    display: block;
    text-align: center;
}
.nav>ul>li>span{
	position: absolute;
    right: 0;
    top: 1.6rem;
    font-size: 1.8rem;
    color: #fff;
    width: 10%;
    transform: translateY(-50%);
    cursor: pointer;
}
.nav>ul>li .nav-son{
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    visibility: hidden;
    height: 0;
}
.nav>ul>li .nav-son.open-son{
    visibility: visible;
    height: auto;
}
.nav>ul>li .nav-son li{
    display:flex;
    justify-content: center;
    align-items: center;
    width:33.33%;
    text-align: center;
}
.nav>ul>li .nav-son li span{
    color:#fff;
    font-size:1rem;
}
.nav>ul>li .nav-son li a{
    font-size:.8rem;
    color:#fff;
    display: block;
    padding:.3rem 0;
}
.swiper-pagination-bullet{
    width:18px !important;
    border-radius:4px !important;
    height:4px !important;
    opacity: .8 !important;
    background: #fff;
}
.swiper-pagination-bullet-active{
    background: var(--blue) !important;
    width:24px !important;
}
.banner img{
    width:100%;
}
/* 产品中心 */
.probox{
    padding-top:1.5rem;
}
.probox-tag{
    padding:.5rem 0;
    display: flex;
    flex-wrap: wrap;
    justify-content:center;
    width:100%;
}
.probox-tag a{
    font-size:.8rem;
    color:#747474;
    padding:.4rem .5rem;
    background: #eeeeee;
    color:#747474;
    margin:.3rem .2rem;
    white-space:nowrap
}
.probox-tag a.active{
    background: var(--blue);
    color:#fff;
}
.probox-tag p{
    height:.3rem;
    background: var(--blue);
    width:96%;
    margin:0 auto;
}
.probox-ul ul li{
    float:left;
    width:46%;
    margin:.5rem 2%;
}
.probox-ul ul li a:nth-child(1){
    width:100%;
    height:9rem;
    display:flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    background: rgba(216, 216, 216,.3);
}
.probox-ul ul li a:nth-child(1) img{
    max-width:100%;
}
.probox-ul ul li a:nth-child(2){
    margin-top:.4rem;
    font-size:1rem;
    color:#000000;
    text-align: center;
    display:block;
    height:1.5rem;
    overflow: hidden;
}

/* 优势 */
.adva{
    height:26rem;
    background: url(../images/adva.gif) repeat-x center;
    margin-top:2rem;
    padding-top:2rem;
}
.adva .tbox>a{
    font-size:1.3rem;
}
.adva .tbox>p{
    font-size:.7rem;
}
.adva-body{
    display:flex;
    width:100%;
}
.adva-l{
    display:flex;
    flex-direction: column;
    justify-content: space-around;
    width:38%;
    height:20rem;
}
.adva-pic{
    display: flex;
    justify-content: center;
    align-items: center;
}
.adva-l ul{
    display:flex;
    flex-direction: column;
    align-items: center;
}
.adva-l ul li:nth-child(1) img{
    width:3rem;
}
.adva-l ul li:nth-child(2){
    font-size:.8rem;
    width:3.5rem;
    font-weight: bold;
    text-align: center;
}
.adva-l:nth-child(1) ul:nth-child(1) li:nth-child(2){
    width:4rem;
}
.adva-pic img{
    width:100%;
}
/* 关于我们 */
.about{
    background: url(../images/about.jpg) no-repeat top center;
    background-size: 100%;
    padding-top:2.5rem;
}
.about .tbox p{
    font-size:.8rem;
    color:rgb(255, 255, 255,.8);
    margin-top:0;
}
.about .tbox a{
    font-size:1.3rem;
    font-weight: normal;
    color:#fff;
}
.about-body{
    background: #fff;
    margin:1rem auto;
    width:90%;
    padding:.8rem;
    box-shadow: 0px 1px 8px rgba(0,0,0,.2);
}
.about-body p{
    color:#7b7b7b;
    font-size:.9rem;
    opacity: .8;
    padding:.5rem 0;
}
.case{
    padding-top:1.5rem;
}
.case .probox-ul{
    padding-top:.5 rem;
}
/* 新闻 */
.news{
    background: #f9f9f9;
    margin-top:1rem;
    padding-top: 1.5rem;
}
.news-top{
    display:flex;
    justify-content: space-between;
    padding:1rem 3% 0 3%;
}
.news-pic{
    width:30%;
}
.news-pic img{
    width:100%;
}
.news-info p{
    font-size:.8rem;
    color:#848d9a;
    height:2.4rem;
    overflow: hidden;
}
.news-info span{
    font-size:.8rem;
    color:#848d9a;
}
.news-info a{
    font-size:1rem;
    color:#4a4a4a;
}
.news-info{
    display:flex;
    flex-direction: column;
    flex:1;
    padding-left:.8rem;
    justify-content: space-between;
    height:5rem;
}
.news-ul ul li{
    height:3.2rem;
    line-height:3.2rem;
    border-bottom: 1px solid #e5e5e5;
    margin:.5rem 2%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: flex;
    justify-content: space-between;
}
.news-ul ul li a{
    font-size:.9rem;
    color:#4a4a4a;
    position: relative;
    flex:1;
}
.news-ul ul li span:nth-child(1){
    font-size:12px;
    color:#4a4a4a;
    padding-right:.5rem;
}

.bar-page{
    width:100%;
    height:16rem;
    overflow: hidden;
    display:flex;
    justify-content: center;
    align-items: center;
    background: url(/images/bar1.jpg);
	background-size:100%;
}
.bar-page h1{
	display:none;
    font-size:1.5rem;
    color:#fff;
    font-weight: normal;
}
.history{
    background:var(--blue);
    color: #fff;
    font-weight: bold;
    height: 5vh;
    line-height: 5vh;
    text-align: center;
    margin:2% 2%;
}
.page-view{
    padding:0 2%;
}
.page{
    padding-bottom: 1rem;
}
.view-top {
    line-height: 4vh;
    text-align: center;
    margin:1rem 0;
}
.view-title h1{
    font-size: 1.3rem;
    line-height: 1.2;
}
.view-content{
    margin: 2vh 4%;
    line-height: 3vh;
}

/* 分页 */
.pagination{
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
}
.pager{
    display: flex;
    justify-content: center;
    margin:1rem 0;
}
.pager li {
    display: inline;
}
.pager li span,
.pager li a
{
    margin:0 8px;
    border:none;
    color:var(--blue);
}
.pagination > .active > span:focus , .pagination .page-item span{
    background: var(--blue) !important;
}
.pagination > .disabled > span{
    background: white !important;
    color:#666666;
}
/* 上下篇 */
.view-tool{
    border-top:1px #e2e2e2 solid;
    text-align: left;
    padding:10px 15px 10px 0;

}
.view-tool ul li{
    color:#464646;
    height:30px;
    line-height:30px;
    margin:0px 20px 0px 20px;
    font-size:14px;
	overflow:hidden;
}
.view-tool ul li a{
    font-size:14px;
    color:#464646;
}


/* 公用标题 */
.tbox{
    text-align: center;
}
.tbox a{
    font-size:1.4rem;
    color:#000;
}
.tbox p{
    font-size:.8rem;
    color:#8a8a8a;
    margin-top:.4rem;
}


/* 底部 */
.flexbox{
    position: fixed;
    z-index: 9999;
    bottom: 0;
    width:100%;
    max-width: 640px;
    background: #222e3b;
    box-shadow: 0px 0px 6px #3d3d3d;
}
.flexbox ul{
    display:flex;
    justify-content: center;
    margin-bottom:0px;
}
.flexbox ul li{
    flex:1;
    border-left:1px solid #222e3b;
}
.flexbox ul .active{
    background-color:var(--blue) ;
    border-left:1px solid var(--blue);
}
.flexbox ul li a{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size:.8rem;
    color:#fff;
    margin-bottom: .5rem;
}
.flexbox ul li a span{
    margin-top:.2rem;
    font-size:1.2rem;
    color:#fff;
}