@charset "utf-8";
/* CSS Document */
*{ -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
body {font-size: 14px; font-family: "Helvetica Neue", Helvetica, 微软雅黑, 新細明體, Arial, "Lucida Grande", sans-serif; margin: 0px; padding: 0px; color: #333;}
div,form,img,ul,li,dl,dt,dd,p,input,button,span,h1,h2,h3,h4,h5,h6,label { margin:0; padding:0; border:0;}
ul,li { list-style:none;}
i,em { font-style: normal;}
.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden }
.pr { position: relative;}
a { color:#333; text-decoration:none;}
a:hover { color:#c00;}
body { max-width: 415px; width: 100%; margin: 0px auto; padding-top: 70px;}

/**********首页*********/
.top {transform: scale3d(1, 1, 1); position: fixed; width: 100%; max-width: 415px; z-index: 99;}
.top_nav {
	position: fixed;
	width: 100%;
	height: 70px;
	background: #fff;
	box-shadow: 0px 3px 5px rgb(0,0,0,.08);
	left: 0px;
	right: 0px;
	top: -70px;
	display: flex;
    justify-content: space-between;
    align-items: center;
	}
.top_nav .logo a{
	height: 70px;
	font-size: 20px;
	font-weight: bold;
	display: flex;
    justify-content: center;
    align-items: center;
	padding-left: 10px;
	color: #e61f19;
	}
.top_nav .logo a img { height: 34px; margin-right: 10px;}
.top_nav .logo a span { line-height: 18px;}
.top_nav .logo a span em {
	font-style: normal;
	font-size: 12px;
	line-height: 12px;
	color: #999;
	font-weight: normal;
	}
.top_nav .head_items a{
	display: inline-block;
	padding: 5px 10px;
	background: #1787d3;
	border-radius: 4px;
	color: #fff;
	font-size: 12px;
	}
.top_nav .head_items a:hover { background: #005c9a;}

nav {
	width: 100%;
	background: #1787d3;
	}
nav>ul {
	display: flex;
    justify-content: space-between;
	align-items: center;
	}
nav>ul>li {
	width: 12.5%;
	font-size: 14px;
	text-align: center;
	position: relative;
	}
nav>ul>li a {
	display: block;
	line-height: 18px;
	padding: 10px 5px;
	color: #fff;
	}
nav>ul>.art a { color: #ff0;}
nav>ul>li a:hover { color: #ff0;}

.banner {
	width: 100%;
	height: 310px;
	background: url(../images/banner.jpg) top center no-repeat;
	background-size: 200% 100%;
	margin-top: 56px;
	}
.ban_title {
	color: #fff;
	text-align: center;
	padding-top: 20px;
	}
.ban_title h3 {
	font-size: 38px;
	font-weight: 700;
	text-shadow: 0px 0px 8px rgba(255,255,255,.8);
	}
.ban_title h4 {
	font-size: 20px;
	color: #ffae00;
	padding: 10px 0px;
	font-weight: 700;
	}
.ban_title p { font-size: 14px; padding: 0px 15px;}
.ban_title label { font-weight: normal;}
.ban_title label span {
	background: url(../images/dg.png) left center no-repeat;
	background-size: contain;
	padding-left: 25px;
	line-height: 18px;
	font-size: 12px;
	display: inline-table;
	margin: 10px 5px;
	}

.ban_a { text-align: center;}
.ban_a a{
	display: inline-block;
	background-color: #fc7d3a;
	color: #000;
	border-radius: 5px;
	padding: 0px 20px;
	font-size: 14px;
	line-height: 30px;
	}
	
/**/
.ban_fw {
	background-color: #fff;
	margin: -60px 5px 0px;
	box-shadow: 0px 0px 8px rgba(0,0,0,.25);
	padding: 20px 20px 30px;
	}
.ban_fw h5 {
	font-size: 20px;
	margin: 0px 0px 15px;
	text-align: center;
	color: #050068;
	}
.ban_fw form {}
.ban_fw form input {
	height: 40px;
	line-height: 40px;
    width: 100%;
    display: block;
    padding-left: 20px;
    border-radius: 5px;
    border: 1px solid #4fbcff29;
    font-size: 14px;
	outline: none;
    background: #f1f9ff;
    float: left;
	margin-bottom: 10px;
	}
.ban_fw form select{
	height: 40px;
	line-height: 40px;
    width: 100%;
    display: block;
    padding-left: 20px;
    border-radius: 5px;
    border: 1px solid #4fbcff29;
    font-size: 14px;
    background: #f1f9ff;
    float: left;
    color: #727272;
	outline: none;
	margin-bottom: 10px;
}	

.ban_fw form button{
	width: 100%;
    height: 40px;
    line-height: 40px;
    background: #0864c1;
    box-shadow: 0px 5px 15px rgb(89,104,223,.5);
    border-radius: 5px;
    color: #fff;
    font-size: 18px;
    border: none;
}	

.title {text-align: center;}
.title label {
	font-size: 24px;
	display: block;
	margin-bottom: 10px;
	position: relative;
	line-height: 90px;
	}
.title label:before{
      content: '';
      width: 80%;
      margin-left: -40%;
      height: 1px;
      position: absolute;
      bottom: 13px;
      left: 50%;
      background-color: #dfe9ec;
    }
.title label:after{
      content: '';
      width: 60px;
      height: 7px;
      margin-left: -30px;
      position: absolute;
      left: 50%;
      bottom: 10px;
      background-color: #dfe9ec;
    }
.title label font { color: #145fbc;}
.title label span { color: #fff;}

.more { text-align: center;}
.more a {
	display: inline-block;
	font-size: 16px;
	color: #fff;
	background: #0864c1;
	border-radius: 5px;
	padding: 0px 30px;
	line-height: 40px;
	margin-bottom: 30px;
	}
.more a:hover { box-shadow: 0px 0px 10px rgba(8,100,93,.7); color: #fff; text-decoration: none;}

/**/
.main_cont { margin-top: 10px; margin-bottom: 20px; text-align: center;}
.main_cont img { vertical-align: middle; max-width: 80%; }
.main_cont div {
	display: inline-block;
	vertical-align: middle;
	margin-top: 20px;
	padding: 0px 15px;
	}
.main_cont div p{
	font-size: 14px;
	line-height: 22px;
	text-indent: 2em;
	margin-bottom: 10px;
	}
.main_cont div strong{
	font-size: 16px;
	display: block;
	color: #145fbc;
	line-height: 30px;
	}
	
/**/
.fbcg_bg {
	width: 100%;
	background-color: #f5f7fa;
	}
.fbcg_box { padding: 0px 5px 30px;}
.fbcg_box ul{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	}
.fbcg_box ul li {
	margin: 0px 8px;
	width: calc(33.33334% - 16px);
	transition:transform 0.3s ease;
	position: relative;
	}
.fbcg_box ul li:hover{ transform:translateY(-6px); cursor: pointer;}
.fbcg_box ul li:before {
	content:"";
	position: absolute;
	width: 100%;
	height: 40px;
	background: url(../images/1-4.png) repeat-x;
	left: 0px;
	top: 50%;
	margin-top: -20px;
	}
.fbcg_box .dd1 {
	background: #fff;
	border: 1px dashed #036dc8;
	border-radius: 5px;
	box-shadow: 5px 5px 0px #ddd;
	display: flex;
	padding: 0px 5px 5px;
	}
.fbcg_box .dd1 img { margin-right: 5px; height: 100%; width: 20%;}
.fbcg_box .dd1 div { min-height: 120px;}
.fbcg_box .dd1 div h3 {
	font-size: 15px;
	color: #145fbc;
	text-align: center;
	display: block;
	font-weight: 700;
	margin: 10px 0px 5px;
	}
.fbcg_box .dd1 div span {
	font-size: 13px;
	color: #999;
	display: block;
	}
.fbcg_box .dd2 {
	background: #fff;
	border: 1px dashed #666;
	border-radius: 5px;
	box-shadow: 5px 5px 0px #ddd;
	padding: 15px 10px 10px;
	margin-top: 10px;
	text-align: center;
	line-height: 20px;
	font-size: 13px;
	color: #666;
	}
	
/****/
.what_fw { padding: 10px 0px;}
.what_fw ul{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	}
.what_fw ul li {
	margin: 20px 5px 10px;
	width: calc(33.33334% - 10px);
	transition:transform 0.3s ease;
	background: #fff;
	border-radius: 10px;
	box-shadow: 0px 0px 10px rgba(0,0,0,.08);
	text-align: center;
	display: grid;
	position: relative;
	border: 1px dotted #036dc8;
	}
.what_fw ul li:hover{ transform:translateY(-6px); box-shadow: 0px 0px 20px rgba(0,0,0,.15);}
.what_fw ul li strong {
	font-size: 28px;
	line-height: 80px;
	color: #145fbc;
	}
.what_fw ul li i {
	position: absolute;
	width: 58px;
	height: 58px;
	border-radius: 100%;
	background: #fff;
	text-align: center;
	top: -29px;
	left: 10px;
	}
.what_fw ul li i img {
	height: 40px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform:translate(-50%,-50%);
	}
.what_fw ul li span {
	font-size: 14px; 
	line-height: 20px; 
	padding: 25px 10px 15px;
	min-height: 248px;
	}
.what_fw ul li p {
	font-size: 22px;
	color: #2a88d0;
	margin-bottom: 20px;
	padding: 0px 30px;
	}
.what_fw ul li a {
	width: 100%;
	line-height: 65px;
	color: #fff;
	font-size: 20px;
	background: #2a88d0;
	border-radius: 0px 0px 10px 10px;
	}
.what_fw ul li a:hover { text-decoration: none;}
.what_fw ul li:first-child a { background: #ffa100;}
.what_fw ul li:last-child a { background: #0fa2c0;}

/***/
.lc_bg {
	width: 100%;
	background: url(../images/lc_bg.png) center center no-repeat;
	}
.lc_bg .title label { color: #fff;}
.lc_bg .more a { background: #fc7d3a;}
.lc_bg .more a:hover { box-shadow: 0px 0px 10px rgba(252,125,58,.7);}
.lc_box {
	background: url(../images/lc-ico.png) center center no-repeat;
	height: 385px;
	margin-bottom: 20px;
	background-size: contain;
	}
.lc_box .up_ul {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	}
.lc_box .up_ul li {
	width: 126px;
	margin: 0px 5px;
	text-align: center;
	color: #fff;
	}
.lc_box .up_ul li h3 {
	font-size: 18px;
	line-height: 40px;
	margin: 0px 0px;
	}
.lc_box .up_ul li p { line-height: 20px; font-size: 12px;}
.lc_box .down_ul {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 100px;
	}
.lc_box .down_ul li {
	width: 140px;
	margin: 0px 10px;
	text-align: center;
	color: #fff;
	}
.lc_box .down_ul li h3 {
	font-size: 18px;
	line-height: 40px;
	margin: 0px 0px;
	}
.lc_box .down_ul li p { line-height: 20px; font-size: 12px;}

/*******/
.mk_box {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: 0px 0px 30px;
	}
.mk_box li {
	margin: 5px 3px;
	width: calc(33.3334% - 6px);
	border-radius: 5px;
	transition:transform 0.3s ease;
	}
.mk_box li:hover{ transform:translateY(-6px); box-shadow: 0px 0px 10px rgba(0,0,0,.3);}
.mk_box .mk_tit {
	padding: 10px;
	width: 100%;
	height: 90px;
	border-radius: 5px 5px 0px 0px;
	color: #fff;
	}
.mk_box .mk_tit strong { font-size: 14px; line-height: 24px;}
.mk_box .mk_tit p { font-size: 12px;}
.mk_box .mk_cont {
	padding: 10px;
	border-radius: 0px 0px 5px 5px;
	background: rgba(255,255,255,.7);
	}
.mk_box .mk_cont p { font-size: 14px; margin-bottom: 0px;}
.mk_box .mk_1 { background: #9b9bd2;}
.mk_box .mk_1 .mk_cont p { color: #9b9bd2;}
.mk_box .mk_1 .mk_tit { background: url(../images/mk_img1.png) 90px 50px no-repeat; background-size: 25%;}
.mk_box .mk_2 { background: #14b4e6;}
.mk_box .mk_2 .mk_cont p { color: #14b4e6;}
.mk_box .mk_2 .mk_tit { background: url(../images/mk_img2.png) 90px 50px no-repeat; background-size: 25%;}
.mk_box .mk_3 { background: #96b41e;}
.mk_box .mk_3 .mk_cont p { color: #96b41e;}
.mk_box .mk_3 .mk_tit { background: url(../images/mk_img3.png) 90px 50px no-repeat; background-size: 25%;}
.mk_box .mk_4 { background: #ffa000;}
.mk_box .mk_4 .mk_cont p { color: #ffa000;}
.mk_box .mk_4 .mk_tit { background: url(../images/mk_img4.png) 90px 50px no-repeat; background-size: 25%;}
.mk_box .mk_5 { background: #ff4700;}
.mk_box .mk_5 .mk_cont p { color: #ff4700;}
.mk_box .mk_5 .mk_tit { background: url(../images/mk_img5.png) 90px 50px no-repeat; background-size: 25%;}

/****/
.zstq_bg {
	width: 100%;
	background: #f5f7fa url(../images/road.png) center center no-repeat;
	background-size: contain;
	}
.zs_box {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: 30px 0px;
	}
.zs_box li {
	margin: 0px 5px;
	width: calc(33.3334% - 10px);
	background: url(../images/zs_2.png) no-repeat;
	background-size: 100% 100%;
	position: relative;
	height: 128px;
	padding: 4px;
	}
.zs_box li:after {
	content:"02";
	position: absolute;
	width:40px;
	height: 40px;
	line-height: 40px;
	background: #ffbe5f;
	border-radius: 50%;
	border: 3px solid #fff;
	color: #fff;
	font-size: 20px;
	text-align: center;
	left: 0px;
	top: -25px;
	z-index: 10;
	}
.zs_box li div {
	width: 100%;
	height: 100%;
	background: url(../images/zs_21.png) no-repeat;
	background-size: contain;
	text-align: center;
	}
.zs_box li div h3 {
	font-size: 13px;
	line-height: 20px;
	border-bottom: 1px solid #ffbe5f;
	margin: 0px auto;
	width: 75%;
	padding-top: 8px;
	}
.zs_box li div p {
	font-size: 12px;
	line-height: 15px;
	width: 100%;
	margin: 0px auto;
	padding: 5px 0px 2px;
	}
.zs_box li div strong {
	line-height: 18px;
	font-size: 14px;
	}
.zs_box li:first-child { background: url(../images/zs_1.png) no-repeat; background-size: 100% 100%;}
.zs_box li:first-child:after { content:"01"; background: #ff9264;}
.zs_box li:first-child div { background: url(../images/zs_11.png) no-repeat; background-size: contain;}
.zs_box li:first-child div h3 { border-color: #ff9264;}
.zs_box li:last-child { background: url(../images/zs_3.png) no-repeat; background-size: 100% 100%;}
.zs_box li:last-child:after { content:"03"; background: #6080ff;}
.zs_box li:last-child div { background: url(../images/zs_31.png) no-repeat; background-size: contain;}
.zs_box li:last-child div h3 { border-color: #6080ff;}


/***/
.xz_bg {
	width: 100%;
	background: url(../images/lc_bg.png) center center no-repeat;
	background-size: cover;
	padding: 10px 5px;
	}
.xz_bg .title label { color: #fff; font-size: 22px;}
.xz_bg .more a { background: #0e357f;}
.xz_bg .more a:hover { background: #1787d3;}
.common_box {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	}
.common_box li {
	width: 24%;
	padding: 5px 15px;
	background: #fff;
	text-align: center;
	margin: 5px 0px;
	display: flex;
	justify-content: center;
	}
.common_box li img {
	max-width: 100%;
	height: 30px;
	}

/**/
.problem { padding: 0px 0px 30px;}
.problem h3 {
	font-size: 15px;
	color: #0864c1;
	line-height: 20px;
	font-weight: 700;
	background: url(../images/pr-1.png) left center no-repeat;
	background-size: 5%;
	padding-left:30px;
	margin: 20px 0px 10px;
	}
.problem p {
	width: 100%;
	border: 1px solid #9b9bd2;
	border-radius: 0px 50px 50px 25px;
	padding: 5px 15px 5px 10px;
	font-size: 12px;
	line-height: 20px;
	color: #666;
	}
	
/**/
.foot_cn {
	width: 100%;
	background: url(../images/foot_cn.png) center center no-repeat;
	}
.foot_cn .title label { color: #fff;}
.cn_box {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	padding: 20px 0px;
	}
.cn_box li {
	margin: 0px 5px;
	width: calc(33.3334% - 10px);
	text-align: center;
	color: #fff;
	}
.cn_box li .cn_top { position: relative;}
.cn_box li .cn_top img { width: 95px; height: 95px;}
.cn_box li .cn_top span {
	position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    font-size: 16px;
	}
.cn_box li strong {
	font-size: 16px;
	line-height: 40px;
	}
.cn_box li p {
	font-size: 12px;
	line-height: 18px;
	padding: 0px 5px;
	}
	
/**/
.footer {
	width: 100%;
	background: #333;
	}
.footer .f_tit {
	padding: 30px 0px;
	}
.footer .f_tit .f_tit_l {
	text-align: center;
	color: #a8a8a8;
	padding-bottom: 20px;
	border-bottom: 1px solid #555;
	}
.footer .f_tit .f_tit_l strong a{ font-size: 40px; color: #fff;}
.footer .f_tit .f_tit_l strong a:hover { text-decoration: none;}
.footer .f_tit .f_tit_l p { font-size: 15px;}
.footer .f_tit .f_tit_r {
	display: block;
	padding: 15px 15px 0px;
	}
.foot_inner {
	line-height: 22px;
	color: #a8a8a8;
	font-size: 14px;
	}

.gotop{
	position: fixed;
	bottom: 60px;
	right: 20px;
	width: 40px;
	height: 40px;
	background: url(../images/top.png) center center no-repeat;
	background-size: contain;
	opacity: .6;
	z-index: 4;
	display: none;
	cursor: pointer;
	}

@media screen and (max-width:375px) {
	.what_fw ul li i { width: 48px; height: 48px;}
	.what_fw ul li i img { height: 24px;}
	.what_fw ul li span { line-height: 18px; font-size: 12px; padding: 15px 5px 10px;}
	.xz_bg .title label { font-size: 20px;}
	.fbcg_box .dd1 div span { font-size: 12px;}
	.fbcg_box .dd2 { font-size: 12px; padding: 15px 5px 10px;}
	.lc_box .up_ul li { width: 110px;}
	.lc_box .up_ul li p { line-height: 18px;}
	.lc_box .down_ul { margin-top: 85px;}
	.mk_box .mk_1 .mk_tit, .mk_box .mk_2 .mk_tit, .mk_box .mk_3 .mk_tit, .mk_box .mk_4 .mk_tit, .mk_box .mk_5 .mk_tit{ background-position: 80px 50px;}
	.mk_box .mk_cont p { font-size: 12px;}
	.zs_box li { height: 115px; margin: 0px 2px; width: calc(33.3334% - 4px);}
	.zs_box li div p { width: 100%; line-height: 15px; padding: 5px 0px 2px;}
	.zs_box li:after { top: -30px;}
	.zs_box li div h3 { padding-top: 5px;}
	.problem p { padding: 5px 20px 5px 15px; line-height: 18px;}
	}
@media screen and (max-width:320px) {
	.ban_title label span { margin: 10px 1px;}
	.ban_fw h5 { font-size: 18px;}
	.xz_bg .title label { font-size: 17px;}
	.main_cont div strong { font-size: 14px; line-height: 20px;}
	.fbcg_box ul li {margin: 0px 2px; width: calc(33.33334% - 4px);}
	.fbcg_box .dd1 img { margin-right: 0px;}
	.lc_box { height: 340px;}
	.lc_box .up_ul li { width: 96px;}
	.lc_box .up_ul li h3, .lc_box .down_ul li h3 { font-size: 14px; line-height: 24px;}
	.mk_box .mk_cont { padding: 4px;}
	.zs_box li:after { width: 30px; height: 30px; line-height: 30px; font-size: 16px; top: -22px;}
	.title label { font-size: 22px;}
	.foot_inner { font-size: 12px; line-height: 20px;}
	}

	
