/* 
 重置基础样式
 */
* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	/* Firefox */
	-webkit-box-sizing: border-box;
	/* Safari */
}

iframe {
	display: inherit;
}

img {
	width: 100%;
	border: none;
	vertical-align: middle;
}

a {
	display: inline-block;
	text-decoration: none;
}

button {
	cursor: pointer;
}

ol,
ul,
li {
	list-style: none;
}

/* 
 定义基础样式
 */
body {
	font: 12px/1.5em arial,sans-serif,tahoma,"PingFang SC","Lantinghei SC","Microsoft YaHei","\5b8b\4f53";
	background: #fff;
}

.section {
	position: relative;
	display: block;
	width: 100%;
}

.wrap {
	position: relative;
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 0.625rem;
}

input {
	float: left\9;
	background: none;
	border: none;

	padding: 0.625rem;
}

input.input_txt {
	width: 80%;
	background: #fafafa;
	color: #222;
	margin-right: 0.625rem;
}

input.input_btn {
	background: #0069DD;
	color: #fff;
	padding: 0.625rem 1.25rem;
	cursor: pointer;
}

i.clearfix {
	display: inline-block\9;
	*display: inline;
}
.clearfix {
	position: relative;
	*zoom: 1;
	clear: both;
	width: 100%;
}

.clearfix:before,
.clearfix:after {
	content: "";
	display: table;
	line-height: 0;
	visibility: hidden;
}

.clearfix:after {
	clear: both;
}

/* flex 流体布局兼容 */
.flex {
	display: -webkit-box;
	/* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
	display: -moz-box;
	/* Firefox 17- */
	display: -webkit-flex;
	/* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
	display: -moz-flex;
	/* Firefox 18+ 
	display: -ms-flexbox;*/
	/* IE 10 */
	display: flex;
	/* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
	float: left\9;
	width: 100%;
}

.flex>* {
	display: block;
}

.flex .flex_list,
.flex li {
	float: left;
	display: table-cell;
	text-align: center;
	width: 100%;
	vertical-align: middle;
}

.line_flex {
	float: left\9;
	width: 0;
	height: 10.25rem;
	margin: 0 4%;
	border-left: 1px solid #eee;
}

.flex_3 li {
	width: 29.33%;
	margin: 1rem 2%;
}
.flex_2 li {
	width: 50%;
}

/* 颜色定义 */
.grey {
	background: #fafafa;
}

.grey.blue {
	background: #549adc;
	color: #fff;
}

.blue {
	background: #19A1EE;
}

.red {
	background: #fd5f46;
}

/* 文字颜色 */
.grey.blue h3 {
	color: #fff;
}

.grey.blue p {
	color: #eee;
}

.blue .list_txt span a {
	color: #fff;
	border-color: #fff;
}

.blue .list_txt span a:hover {
	background: #fff;
	color: #0069DD;
}

.redtxt {
	color: #fd5f46;
}

/* 项目标题 section_tit */
.section_tit {
	display: block;
	width: 100%;
	text-align: center;
	margin: 1.25rem 0;
}

.blue .section_tit h2 {
	color: #fff;
}

.blue .section_tit p {
	color: #eee;
}

.blue .section_tit em {
	background: #eee;
}

.section_tit h2 {
	display: block;
	font-size: 2rem;
	line-height: 3.25rem;
	margin-top: 0.75rem;
}

.section_tit p {
	color: #aaa;
	font-size: 0.875rem;
	line-height: 4em;
}

.section_tit em {
	display: inline-block;
	*display: inline;
	width: 5rem;
	height: 1px;
	margin: 0 0.625rem;
	background: #aaa;
	vertical-align: middle;
}

.wrap > h3 {
	display: block;
	width: 100%;
	font-size: 2rem;
	text-align: center;
	line-height: 3rem;
	margin-bottom: 1.5rem;
}

.info_tit p {
	color: #aaa;
}

/* 侧边栏悬浮 */

.sidebar {
	display: block;
	position: fixed;
	right: 1rem;
	font-size: 0.625rem;
	top: 40%;
	z-index: 9999;
	background: #fafafa;
	border: 1px solid #f5f5f5;
	border-top: none;
}

.fixpq li {
	text-align: center;
	display: block;
	width: 100%;
	border-top: 1px solid #eee;
	width: 3rem;
	-webkit-transition: all .15s ease-in-out;
	transition: all .15s ease-in-out
}
.fixpq li a img {
	padding: 0.5rem 0.5rem 0;
}

.fixpq li a {
	position: relative;
	width: 100%;
	font-size: 0.75rem;
	color: #444;
	padding-bottom: 0.5rem;
	text-decoration: none;
	-webkit-transition: all .15s ease-in-out;
	transition: all .15s ease-in-out
	z-index:1;
}
.fixpq li a span {
	position: absolute;
	left: 0;
	top: -1px;
	z-index: -1;
	display: block;
	width: 0;
	height: auto;
	padding: 1.5rem 0;
	border: 0px solid #eee;
	text-align: center;
	word-wrap: normal;
	white-space: nowrap;
	overflow: hidden;
	-webkit-transition: all .15s ease-in-out;
	transition: all .15s ease-in-out
}
.fixpq li.tell a:hover span {
	position: absolute;
	left: -12rem;
	top: -1px;
	background: #fff;
	width: 12rem;
	height: auto;
	
	font-size: 1.5rem;
	border: 1px solid #eee;
}
.fixpq li a em {
	display: block;
	padding: 0.25rem;
	-webkit-transition: all .15s ease-in-out;
	transition: all .15s ease-in-out;
}

.qrbox {
	display: none;
	position: absolute;
	right: 3rem;
	bottom: 0;
	margin-bottom: -1px;
	width: 10rem;
}

/* header */
.header {
	position: fixed;
	top: 0;
	left: 0;

	display: block;
	width: 100%;
	padding: 1.25rem 0;
	z-index: 999;
}

.top_bar {
	background: #fff;
	border-bottom: 1px solid #ededed;
}

/* .headbg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	opacity: 0;
	z-index: -1;
} */


.flex .logo {
	position: absolute;
	left: 0;
	top: 0;
	width: 40%;
	max-width: 18rem;
	min-width: 7.5rem;
	z-index: 2;
	width: 128px\9;
	text-align:left;
}

.top_bar .logo_box li.line_y {
	background: #444;
}
.logo_box li.line_y {
	width: 1px;
	height: 2rem;
	background: #fff;
	padding: 0;
	margin: 0.25rem 0.5rem 0;
}
.logo img {
	width: 100%;
}


/* 导航默认 */



.flex .menu {
	position: relative;
	line-height: 36px;
	height: 2.375rem;
	width: 100%;
	padding: 0 20%;
}
.top_bar .flex .menu {
	width: 60%;
	padding-right: 1%;
}

.flex .menu ul {
	width: auto;
	text-align: center;
    display: inline-block;
	float: none;
}
/* .top_bar .flex .menu ul {
	width: 100%;
	margin: auto;
} */

.menu li {
	position: relative;
	width: auto;
	/* width: 10%\9; */
	min-width: 4rem;
	font-size: 1rem;
	padding: 0 0.25rem;
	margin: 0 0.25rem;
}

.menu li a {
	display: block;
	width: 100%;
	color: #ccc;
	padding-bottom: 2px;
}

.menu li.nav_active a {
	color: #fff;
}

.menu li a:hover {
	color: #fff;
	border-bottom: 2px solid;
	padding-bottom: 0;
}

.menu li.nav_sub a:hover {
	border-bottom: none;
}


.top_bar .menu li a {
	color: #809099;
}

.top_bar .menu li.nav_active>a {
	color: #19A1EE;
}

.top_bar .menu li a:hover {
	color: #19a1ee;
}

.menu li a:hover img {
	transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	/* Internet Explorer */
	-moz-transform: rotate(180deg);
	/* Firefox */
	-webkit-transform: rotate(180deg);
	/* Safari 和 Chrome */
	-o-transform: rotate(180deg);
	/* Opera */
}

.menu li a img {
	max-width: 0.75rem;
	transition: transform 0.5s;
	-moz-transition: transform 0.5s;
	/* Firefox 4 */
	-webkit-transition: transform 0.5s;
	/* Safari and Chrome */
	-o-transition: transform 0.5s;
	/* Opera */
	margin-left: 0.75rem;
}


.submenu {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	margin-top: 2rem;
}

.flex .menu .submenu ul {
	position: absolute;
	top: .5rem;
	left: -3rem;
	background: #fff;
	width: 10rem;
	min-width: auto;
	border: 1px solid #aaa;
}
.submenu li {
	width: 100%;
}
.submenu i {
	position: absolute;
	left: 1rem;
	top: 0;
	width: 0;
	height: 0;
	border-right: 1rem solid transparent;
	border-left: 1rem solid transparent;
	border-bottom: 1rem solid #aaa;
}

.menu .submenu ul li {
	padding: 0.5rem;
	margin: 0.25rem 0 0;
	line-height: 2.5rem;
}

.menu li.nav_active .submenu ul a,
.submenu ul a {
	color: #666;
}

.menu li.nav_active .submenu ul .active a,
.menu li.nav_active .submenu ul a:hover,
.submenu ul .active a,
.submenu ul a:hover {
	background: #0069DD;
	border: none;
	color: #fff;
	padding-bottom: 2px;
}

.top_bar .submenu ul a {
	color: #444;
}

.top_bar .submenu ul .active a,
.top_bar .submenu ul a:hover {
	background: #0069DD;
	border: none;
	color: #fff;
}

/* 导航一键创建输入 */
input.input_txt {
	width: 80%;
	background: #fafafa;
	color: #222;
	border: 1px solid #eee;
	margin-right: 0.625rem;
	margin-right: 2%\9;
	height: 2rem;
}

input.input_btn {
	width: 16%\9;
	background: #19A1EE;
	color: #fff;
	padding: 0 1.25rem;
	padding: 0 1%\9;
	cursor: pointer;
	height: 2rem;
}

.flex .input_label {
	display: none;
	margin: 0.25rem auto 0;
	padding: 0 12%;
}
.top_bar .flex .input_label {
	display: table-cell;
	width: 40%;
	float: left\9;
	padding-left: 1%;
}



/* 登录 用户 代理 导航 */
.flex .userlogin,
.flex .login {
	position: absolute;
	width: 15%;
	right: 0;
	z-index: 2;
}
.frontuser {
	position: absolute;
	right: 0;
}

.flex .login {
	width: 10%;
	min-width: 8rem;
}

.flex .userlogin {
	width: 24%;
	max-width: 9rem;
}

.userlogin li:first-child {
	width: 60%;
	max-width: 100%;
	margin: 0.25rem 0 0;
}

.userlogin li:last-child {
	width: 34%;
}

.userlogin li img {
	position: absolute;
	top: -8px;
	left: 0;

	float: left;
	width: 1.875rem;
	height: 1.875rem;
	border-radius: 2rem;
	margin: 0.25rem 0;
}

.userlogin li p {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	top:-4px;
	padding: 0 0 0 2rem;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;

}
.userlogin li span {
	display: none;
}
.userlogin li.agentclassli {
	position: absolute;
	top: 0;
	left: 2rem;
	max-width: 5rem;
	text-align: left;
}
.userlogin li.agentclassli a {
	text-align: left;
	white-space: nowrap;
}
.userlogin li:nth-of-type(3) {
	display: none;
}

.frontuser li {
	width: 50%;
	padding: 0.25rem 3% 0;
}
.userlogin .frontuser li {
	width: 40%;
}
.userlogin li:first-child {
	width: 60%;
}

.frontuser a {
	display: block;
	height: 2rem;
	line-height: 2rem;
	border-radius: 2px;
}

.userlogin a {
	position: relative;
	color: #aaa;
}

.userlogin a:hover {
	color: #fff;
	text-decoration: underline;
}

.top_bar .userlogin li.agentclassli a:hover {
	color: #0372F7;
}

.top_bar .userphoto {
	color: #19A1EE;
}
.top_bar a .useremail {
	color: #555;
}
.top_bar a:hover .useremail {
	color: #0069DD;
}
.userphoto.btnlogin:hover {
	color: #333;
	text-decoration: none;
}
.btnlogin {
	background: #f5f5f5;
	color: #666;
}

.btnreg {
	background: #0069dd;
	color: #fff;
}

.top_bar .btnreg {
	background: #19A1EE;
}

/*移动端菜单按钮变形三条线*/
.menunav {
	display: inline-block;
	cursor: pointer;
	transition-property: opacity, -webkit-filter;
	transition-property: opacity, filter;
	transition-property: opacity, filter, -webkit-filter;
	transition-duration: .15s;
	transition-timing-function: linear;
	font: inherit;
	color: inherit;
	text-transform: none;
	background-color: transparent;
	border: 0;
	margin: 0;
	overflow: visible;
	position: absolute;
	top: 0.5rem;
	left: 1rem;
	padding: 1.5rem 0.5rem;
	width: 100%;
	max-width: 4rem;
}

.menunav_spin .menunav-inner {
	transition-duration: .3s;
	transition-timing-function: cubic-bezier(.55, .055, .675, .19);
}

.menunav_spin .menunav-inner {
	transition-duration: .3s;
	transition-timing-function: cubic-bezier(.55, .055, .675, .19);
}

.menunav-inner,
.menunav-inner::after,
.menunav-inner::before {
	width: 2.5rem;
	height: 3px;
	background-color: #fff;
	border-radius: 4px;
	position: absolute;
	transition-property: -webkit-transform;
	transition-property: transform;
	transition-property: transform, -webkit-transform;
	transition-duration: .15s;
	transition-timing-function: ease;
	margin: -0.5rem 0;
}

.menunav-inner {
	display: block;
	top: 50%;
	margin-top: -2px;
}

.menunav_spin .menunav-inner::before {
	transition: top .1s .34s ease-in, opacity .1s ease-in;
}

.menunav_spin .menunav-inner::before {
	transition: top .1s .34s ease-in, opacity .1s ease-in;
}

.menunav-inner::before {
	top: -7px
}

.menunav-inner::after,
.menunav-inner::before {
	content: "";
	display: block
}

.menunav_spin .menunav-inner::after {
	transition: bottom .1s .34s ease-in, -webkit-transform .3s cubic-bezier(.55, .055, .675, .19);
	transition: bottom .1s .34s ease-in, transform .3s cubic-bezier(.55, .055, .675, .19);
	transition: bottom .1s .34s ease-in, transform .3s cubic-bezier(.55, .055, .675, .19), -webkit-transform .3s cubic-bezier(.55, .055, .675, .19)
}

.menunav_spin .menunav-inner::after {
	transition: bottom .1s .34s ease-in, -webkit-transform .3s cubic-bezier(.55, .055, .675, .19);
	transition: bottom .1s .34s ease-in, transform .3s cubic-bezier(.55, .055, .675, .19);
	transition: bottom .1s .34s ease-in, transform .3s cubic-bezier(.55, .055, .675, .19), -webkit-transform .3s cubic-bezier(.55, .055, .675, .19)
}

.menunav-inner::after {
	bottom: -7px
}

.menunav-inner::after,
.menunav-inner::before {
	content: "";
	display: block
}

.menunav_spin.is-active .menunav-inner {
	-webkit-transform: rotate(225deg);
	transform: rotate(225deg);
	transition-delay: .14s;
	transition-timing-function: cubic-bezier(.215, .61, .355, 1);
	margin: 0;
}

.menunav_spin.is-active .menunav-inner::before {
	top: 0;
	opacity: 0;
	transition: top .1s ease-out, opacity .1s .14s ease-out;
	margin: 0;
}

.menunav_spin.is-active .menunav-inner::after {
	bottom: 0;
	-webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
	transition: bottom .1s ease-out, -webkit-transform .3s .14s cubic-bezier(.215, .61, .355, 1);
	transition: bottom .1s ease-out, transform .3s .14s cubic-bezier(.215, .61, .355, 1);
	transition: bottom .1s ease-out, transform .3s .14s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s .14s cubic-bezier(.215, .61, .355, 1);
	margin: 0;
}

/* banner 设定 */
.banner {
	height: 32rem;
	padding: 8rem 0;
	background: #262b37 top center no-repeat;
	background-size: 100%;
}

.banner .flex .flex_list {
	width: 50%;
	padding: 0 5%;
	color: #fff;
	text-align: left;
}

.banner .flex .flex_list.case_video {
	text-align: center;
}

.banner .flex_list h3 {
	font-size: 2.5rem;
	line-height: 4rem;
}

.banner .flex_list p {
	font-size: 0.875rem;
	line-height: 2rem;
	margin: 1rem 0;
}

.banner span {
	width: 100%;
}

.banner .btn_free {
	display: inline-block;
	vertical-align: middle;
	color: #fff;
	font-size: 1rem;
	background: #333;
	padding: 0.75rem 1rem;
	margin: 1rem 0.5rem 1rem 0;
	border-radius: 3px;
}

.banner .btn_free:hover {
	background: #000;
}

.banner .btn_free img {
	max-width: 1.25rem;
	margin-right: 0.625rem;
}

/* banner响应式代码 */
@media screen and (max-width:1355px) {
	.menu li {
		padding: 0;
		margin: 0;
	}
}
@media screen and (max-width:1300px) {
	.banner {
		background-size: auto 100%;
	}
}

@media screen and (max-width:1080px) {
	.banner {
		padding: 6rem 0 0;
		height: 28rem;
	}

	.banner span {
		display: inline-block;
		width: auto;
	}
}

@media screen and (max-width:1024px) {
	.logo_box li.line_y,
	.logo_box li:last-child {
		display: none;
	}
	.logo_box li:first-child {
		display: block;
		width: 100%;
	}
	.flex .logo {
		width: 10%;
		max-width: 8rem;
	}
}


@media screen and (max-width:940px) {
	.banner {
		height: 25rem;
	}

	.banner .flex .flex_list {
		width: 100%;
		text-align: center;
		padding: 0 2%;
	}

	.banner .flex .flex_list.case_video {
		display: none;
	}

}

@media screen and (max-width:720px) {

	.banner .flex_list p {
		font-size: 1.25rem;
	}

	.banner .btn_free {
		font-size: 1.25rem;
		line-height: 1.5rem;
		height: 100%;
		padding: 1rem 2rem;
		margin: 0.5rem 0;
	}

}

@media screen and (max-width:640px) {}

@media screen and (max-width:480px) {
	.banner .btn_free img {
		max-width: 1.5rem;
		margin-top: -3px;
	}
}


/* 弹窗 */
.xubox_shade {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/* 尾部 */
.foot_meun {
	padding: 1.25rem 0;
	background: #3b3b3b;
}

.foot_meun b {
	display: block;
	font-size: 1rem;
	line-height: 2.5rem;
	color: #777;
	text-align: left;
}

.foot_meun .flex ul li {
	position: relative;
	text-align: left;
}

.foot_meun ul a {
	display: inline;
	color: #ccc;
	line-height: 2.25rem;
}

.foot_meun ul a:hover {
	color: #eee;
	text-decoration: underline;
}

.foot_meun .flex_list {
	display: table-cell;
	width: 15%;
}

.foot_meun .flex_list.foot_qr {
	width: 25%;
	padding-right: 11%;
	padding-top: 1rem;
}

.foot_qr .qrimg {
	width: 100%;
	padding: 1.5rem 1rem 0;
	background: #fff;
	border-radius: 4px;
}

.qrimg img {
	width: 90%;
	margin-bottom: 1.5rem;
}

.qrimg span {
	display: block;
	text-align: center;
	color: #666;
	font-size: 0.875rem;
	border-top: 1px solid #eee;
	line-height: 2.75rem;
}

.foot_qr p {
	display: inline-block;
	width: 100%;
	color: #777;
	line-height: 0.75rem;
	margin-top: 0.5rem;
	text-align: center;
}

.foot_qr p b {
	display: block;
	color: #aaa;
	text-align: center;
	font-size: 1.5rem;
	font-weight: 400;
}

.foot_meun .flex_list.pro {
	width: 30%;
}

.pro p,
.pro ul {
	display: block;
	width: 100%;
	padding: 0.625rem 1rem;
	background: #363434;
}

.pro ul {
	margin-top: 0.75rem;
}

.pro p {
	text-align: right;
	padding: 0 1rem 1.5rem;
}

.pro p a {
	background: #444;
	padding: 0.25rem 1.5rem;
	border-radius: 1rem;
	color: #666;
}

.pro p a:hover {
	background: #aaa;
	color: #333;
}

.foot_meun .pro ul a {
	display: block;
}

.foot_meun .pro ul span {
	position: absolute;
	right: 00;
	top: 0.5rem;
	color: #999;
}

.footer {
	display: block;
	width: 100%;
	background: #2c2c2c;
	padding: 1.25rem 0;
}

.footer span {
	position: absolute;
	left: 0.625rem;
	display: inline-block;
	width: 12%;
	padding: 1.5rem 0;
	border-right: 1px solid #373c3f;
}

.footer span img {
	width: 100%;
	max-width: 8.75rem;
}

.footer p {
	line-height: 2rem;
	margin-left: 12%;
	padding: 0.625rem 1.5rem;
	color: #aaa;
}

.footer a:hover {
	color: #eee;
}

.footer p a {
	color: #aaa;
}

.footer p a:hover {
	text-decoration: underline;
}

.language {
	position: absolute;
	right: 0.625rem;
	top: 50%;
	margin-top: -1rem;
	height: 2rem;
	line-height: 2rem;
	font-size: 0.875rem;
}

.language a {
	color: #5e5e5e;
	margin-right: 2rem;
	text-decoration: none;
}

.language a em {
	position: absolute;
	right: 0;
	width: 1.5rem;
	height: 1.5rem;
	margin-top: 0.25rem;
	background-image: url(../img/language.png);
	background-position: center center;
	background-repeat: no-repeat;
}

.language a:hover em {
	background-image: url(../img/language-b.png);
}


/* 响应式代码 */
@media screen and (max-width:1400px) {
	input.input_txt {
		width: 76%\9;
	}
	input.input_btn {
		width: 20%;
		padding: 0;
	}
	
}
@media screen and (max-width:1300px) {
	.top_bar .flex .menu {
		width: 60%;
	}
	.top_bar .flex .input_label {
		width: 40%;
		padding-left: 0;
	}
	input.input_txt {
		width: 74%;
	}
	input.input_btn {
		width: 22%;
	}
	
	.flex .login {
		min-width: 6rem\9;
	}
	
	
	.foot_qr p b {
		font-size: 1.25rem;
		font-weight: 600;
	}
	
}
@media screen and (max-width:1280px) {
	.top_bar .flex .input_label {
		padding-right: 14%;
	}
}
@media screen and (max-width:1100px) {
	.top_bar .flex .menu {
		padding-left: 13%;
		padding-right: 0;
	}
	.top_bar .flex .menu li {
		min-width: 3rem;
	}
	
	.flex .userlogin {
		width: 20%;
	}

	.top_bar .frontuser li {
		max-width: 10rem\9;
	}
	
}


@media screen and (max-width:1060px) {
	.top_bar .flex .input_label {
		display: none;
	}
	.top_bar .flex .menu {
		width: 100%;
		padding: 0 15%;
	}
	.menu li,
	.top_bar .flex .menu li {
		min-width: 4.25rem;
		margin: 0;
	}
	.footer {
		padding-bottom: 6rem;
	}

	.footer span {
		width: 15%;
	}

	.footer p {
		margin-left: 15%;
		padding: 0.625rem 1rem;
	}
}

@media screen and (max-width:876px) {
	.menu li,
	.top_bar .flex .menu li {
		min-width: 3.75rem;
		margin: 0;
	}
	.flex .userlogin {
		width: 19%;
	}
	.userlogin li.agentclassli {
		left: 1.25rem;
	}
	.section_tit {
		margin: 1.25rem 0 1rem;
	}
	
	.foot_meun .flex_list.foot_qr {
		width: 28%;
		padding-right: 7%;
	}

	.footer span {
		padding-right: 1.5rem;
	}
}

@media screen and (max-width:840px) {

	.line_flex {
		margin: 0 2%;
	}

	.flex_3 li {
		width: 46%;
		margin: 1rem 2%;
	}

	.footer {
		padding-bottom: 5rem;
	}
}

@media screen and (max-width:790px) {
	.flex_2 li {
		width: 94%;
		margin: 0 3%;
	}
	.flex_2 li:first-child {
		border-bottom: 1px solid #eee;
	}
	
	.footer {
		padding-bottom: 4rem;
	}
}

@media screen and (max-width:750px) {
	.flex .logo {
		margin-top: 0.25rem;
	}
	.menu li,
	.top_bar .flex .menu li  {
		min-width: 3.5rem;
		min-width: 3.5em\9;
		font-size: 0.875rem;
	}
	.flex .login {
		width: 25%;
	}
	.flex .userlogin {
		max-width: 10rem;
	}
	
	.flex .login .frontuser li {
		width: 50%;
	}

	.foot_meun {
		display: none;
		padding:0;
	}

}

@media screen and (max-width:720px) {
	.header {
		height: 6rem;
	}

	.top_bar {
		border: 0;
		background: #19A1EE;
	}

	.flex .logo,
	.flex .menu {
		display: none;
	}


	.flex .menuOn.menu {
		position: fixed;
		top: 6rem;
		left: 0;
		margin: 0;
		width: 100%;
		height: 100%;
		background: rgba(255, 255, 255, 0.9);
		z-index: 998;
		padding: 0 0 12rem;
	}

	.menuOn.menu ul,
	.menuOn.menu li {
		display: block;
		width: 100%;
		text-align: left;
		margin: 0;
		padding: 0;
	}

	.menuOn.menu li {
		background: #fff;
		padding: 0 0.625rem;
		border-bottom: 1px solid #EEEEEE;
	}

	.menuOn.menu li a {
		position: relative;
		text-align: left;
		padding: 0.5rem 0.625rem;
		color: #5E5E5E;
		font-size: 1.75rem;
		line-height: 4.5rem;
		margin: 0.25rem 0;
	}

	.menuOn.menu li a:hover {
		border: none;
	}

	.menuOn.menu li.active a {
		color: #fff;
	}

	.menuOn.menu li.active a:hover {
		background: #0069DD;
	}

	.menuOn.menu li a img {
		position: absolute;
		right: 0.625rem;
		top: 2rem;
	}


	/* 子菜单 */

	.submenu {
		position: relative;
		top: auto;
		left: auto;
		margin-top: 0;
	}

	.flex .menu .submenu ul {
		position: relative;
		top: 0;
		left: 0;
		width: 100%;
		min-width: auto;
		padding: 0;
		margin: 0;
		border: none;
	}

	.submenu i {
		display: none;
	}

	.menuOn.menu .submenu ul li {
		border-bottom: none;
	}

	.menu .submenu ul li {
		margin: 0;
		line-height: 2.5rem;
		background: #fafafa;
		border-top: 1px solid #EEEEEE;
	}

	.submenu ul a:hover {
		border: none;
		background: none;
		color: #0069DD;
	}
	.flex .userlogin,
	.flex .login {
		position: absolute;
		top: 0.25rem;
		right: 0.625rem;
	}
	.flex .userlogin {
		width: 45%;
		max-width: 20rem;
	}

	.frontuser li {
		width: 40%;
		padding: 0 3%;
	}
	
	.frontuser li a {
		height: 3rem;
		font-size: 1.5rem;
		line-height: 3rem;
	}
	
	.userphoto {
		color: #ccc;
	}
	
	.menunav {
		top: 0.25rem;
	}
	.userlogin li:first-child {
		margin-top: -0.25rem;
	}
	.userlogin li.agentclassli {
		left: 2.5rem;
		left: 3rem\9;
		width: 60%;
	}
	.userlogin li.agentclassli a {
		color: #fff;
	}
	
/* 	.top_bar .userphoto {
		color: #fff;
	} */

	.userlogin li img {
		width: 3rem\9;
		height: 3rem\9;
		width: 2.5rem;
		height: 2.5rem;
		top: 3px;
	}

	.userlogin li p {
		display: block;
		width: 100%;
		height: auto;
		padding: 0.5rem 0.875rem 0 2.5rem;
	}
	.top_bar a .useremail {
		color: #eee;
	}
	.top_bar a:hover .useremail {
		color: #fff;
	}
	.btnlogin,
	.btnreg,
	.top_bar .btnreg {
		background: #FFFFFF;
		color: #666;
	}


	.line_flex {
		display: none;
	}

	.section_tit h2 {
		font-size: 2.25rem;
	}

	.section_tit p {
		display: none;
	}

	/* 侧边栏响应 */
	.sidebar {
		width: 100%;
		bottom: 0;
		top: auto;
		left: 0;
		z-index: 1000;
	}

	.sidebar ul {
		position: relative;
		display: flex;
		float: left;
		width: 100%;
		background: #fafafa;
	}

	.sidebar li {
		display: table-cell;
		width: 33.33%;
	}

	.sidebar li a {
		display: block;
		width: 100%;
	}

	.sidebar li a em {
		max-width: 2rem;
		margin: 0 auto;
		padding: 0;
	}
	.fixpq li a img {
		padding: 0.25rem;
		margin: 0.5rem 0 0;
	}
	.qrbox {
		position: fixed;
		right: auto;
		left: 0;
		bottom: auto;
		top: 0;
		width: 100%;
		height: 100%;
		text-align: center;
		padding: 40% 30%;
		background: rgba(0, 0, 0, 0.7);
		z-index:-1000;
	}

	.footer span {
		display: none;
	}

	.footer p {
		margin-left: 0;
		text-align: center;
		line-height: 3rem;
		padding: 0.625rem 0;
	}

	.language {
		position: relative;
	}

	.language a {
		display: block;
		width: 50%;
		max-width: 10rem;
		line-height: 3rem;
		margin: 2rem auto;
		vertical-align: middle;
		border: 1px solid #999;
		text-align: center;
		padding-right: 1.5rem;
	}

	.language a em {
		top: 0.5rem;
		right: auto;
		display: inline-block;
		background-size: 100%;
		margin-left: 0.5rem;
	}

	.footer {
		padding-bottom: 7rem;
	}
}

/* 动作样式 */
/* 应用实例：
em {
	-webkit-transition: all 300ms linear;
	-moz-transition: all 300ms linear;
	-o-transition: all 300ms linear;
	-ms-transition: all 300ms linear;
	transition: all 300ms linear
}
a:hover em {
	-webkit-animation: moveFromRight 300ms ease-in-out;
	-moz-animation: moveFromRight 300ms ease-in-out;
	-ms-animation: moveFromRight 300ms ease-in-out
} */
@-webkit-keyframes moveFromBottom {
	from {
		opacity: 0;
		-webkit-transform: translateY(200%)
	}

	to {
		opacity: 1;
		-webkit-transform: translateY(0%)
	}
}

@-moz-keyframes moveFromBottom {
	from {
		opacity: 0;
		-moz-transform: translateY(200%)
	}

	to {
		opacity: 1;
		-moz-transform: translateY(0%)
	}
}

@-ms-keyframes moveFromBottom {
	from {
		opacity: 0;
		-ms-transform: translateY(200%)
	}

	to {
		opacity: 1;
		-ms-transform: translateY(0%)
	}
}

@-webkit-keyframes moveFromTop {
	from {
		opacity: 0;
		-webkit-transform: translateY(-200%)
	}

	to {
		opacity: 1;
		-webkit-transform: translateY(0%)
	}
}

@-moz-keyframes moveFromTop {
	from {
		opacity: 0;
		-moz-transform: translateY(-200%)
	}

	to {
		opacity: 1;
		-moz-transform: translateY(0%)
	}
}

@-ms-keyframes moveFromTop {
	from {
		opacity: 0;
		-ms-transform: translateY(-200%)
	}

	to {
		opacity: 1;
		-ms-transform: translateY(0%)
	}
}

@-webkit-keyframes moveFromRight {
	from {
		opacity: 0;
		-webkit-transform: translateX(200%)
	}

	to {
		opacity: 1;
		-webkit-transform: translateX(0%)
	}
}

@-moz-keyframes moveFromRight {
	from {
		opacity: 0;
		-moz-transform: translateX(200%)
	}

	to {
		opacity: 1;
		-moz-transform: translateX(0%)
	}
}

@-ms-keyframes moveFromRight {
	from {
		opacity: 0;
		-ms-transform: translateX(200%)
	}

	to {
		opacity: 1;
		-ms-transform: translateX(0%)
	}
}
