@charset "utf-8";
/*------------------------------------------------
--css      shangmai 尚脉CRM
--by       市场部 统筹&审核 by Dicke  文案&协调 by 镇源    设计&前端 by Sivan 
--version  v1.0.0
--update   2022-12-06 2023-01-31
--ps       本页面不考虑其他端设备，采取固定宽高的模式，尽可能减少Dom以及启用GPU的CSS3动画
--约定     在已设定的宽度和高度之【外】绘制设定元素的边框及内边距 box-sizing: content-box W3C盒子模型 

-------------------------------------------------*/
body {
	background-color: #FFF;
}
/*---NAV---*/
#shangmai_nav{
	margin:auto;
	position: absolute;
	z-index: 99;
	left:0;
	right:0;
	top: 0;
	width: 100%;
	padding: 16px 0 0 0;
	transition: all 0.8s ease
}

#shangmai_nav .con{
	display: flex;
	flex-wrap: wrap;
	justify-content:space-between;
	align-items: center;	
}

#shangmai_nav .logo_con{
	/* 	max-width: 600px; */
	/* 	float: left; */
	flex: 1;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;	
}
#shangmai_nav .logo{
	padding-right:16px;
}
#shangmai_nav .logo img{
	max-width: 1.8rem
}
#shangmai_nav .logo.logo_qw img{
	max-width: 130px;
}
#shangmai_nav a img:hover{
	opacity: 0.9;
}

#shangmai_nav .nav_con{
	
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;	
	flex: 0 0 auto;
}




@media screen and (max-width:750px) {

	#shangmai_nav .logo_con{
		/*! max-width: 1.2rem; */

		/*! float: none; */
	}
	#shangmai_nav .nav_con{
		/*! float: right; */	
	}
	
	#shangmai_nav .logo.logo_qw img{
	display: none;
}
	

}

@media screen and (max-width:375px) {

}


.nav_con .btn_return{
	display: flex;
  flex-wrap: nowrap;
	justify-content: center;
	align-items: center;	
	
	padding:0 0.16rem;
	color:#181818;
	height: 44px;
	line-height: 44px;
	text-align: center;
	font-size: 16px;
}
.nav_con .btn_return:hover{
	color:#54BF1B;
}
.nav_con .icon_return{
	display: inline-block;
	width:24px;
	height:24px;
	background: url(../fonts/icon_return_h.svg) no-repeat center 4px;
}
.nav_con .btn_return:hover .icon_return{
	color:#54BF1B;
	background: url(../fonts/icon_return_h.svg) no-repeat center 4px;
}

.nav_con .btn_login{
	display: inline-block;
	width:72px;
	height:32px;
	line-height: 32px;
	text-align: center;
	font-size:14px;
	color:#FFFF;
	background: linear-gradient( -90deg,#95e071 0%, #54bf1b 100%);
	border-radius: 4px;
	box-shadow: 0px 24px 32px 0px rgba(64, 214, 56, 0.16);

}
.nav_con .btn_login:hover{
	opacity: 0.9;
}


/*---BANNER---*/
.shangmai_banner_w {
	display: flex;
	flex-wrap: wrap;
	align-items: center;

	width: 100%;
	max-width:25.6rem;
	min-height: 610px;
	margin: auto;
	position: relative;
	z-index: 2;
	left: 0;
	right: 0;
	top: 0;
	background: #E8F8F8 url(../fonts/83ba1926832d42f788aa820b14a3c28e.svg) no-repeat center center;
	background-size: contain;
}
.shangmai_banner_w .banner_text li p{
	display: inline-block;
	/*! height:0.42rem; */
}
.shangmai_banner_w .banner_btn{
	font-size: 18px;
	display: block;
	width:160px;
	height:56px;
	line-height: 52px;
	text-align: center;
	margin:0.32rem 0;
	color:#000;
	border:2px #000 solid;
	border-radius:32px;
}

.shangmai_banner_w .banner_btn:hover{
	color:#54BF1B;
	border:#54BF1B 2px solid;
}



.shangmai_banner_w .banner_text {
	width: 40%;
	max-width: 40%;
}
.shangmai_banner_w .banner_img {
	/*! width: 60%; */
	max-width: 60%;	
	/*! margin:0 auto; */
}

.shangmai_banner_w .banner_img .img_cp{
	max-width: 120%;
 margin:24px -40px 0 0;
}


@media screen and (max-width:1200px) {
	.shangmai_banner_w .banner_text {
		width: 100%;max-width: 100%;
	}
	.shangmai_banner_w .banner_img  {
		width: 100%;max-width: 100%;
	}
	.shangmai_banner_w .banner_img .img_cp{
		margin-left:auto;margin-right:auto;
	}
	.shangmai_banner_w .banner_img .img_cp{
		max-width: 100%;
		margin-right:auto;
	}

	.shangmai_banner_w .banner_text h4{
		font-size: 0.32rem;
	}
	.shangmai_banner_w .banner_text h4 br{
		display: none
	}

}






@media screen and (max-width:1440px) {

	.shangmai_banner_w .banner_text{

	}

}
@media screen and (max-width:1200px) {
	.shangmai_banner_w .banner_text{
		text-align: center;
		max-width: 100%;
		margin:2.4rem auto 0.16rem auto;
	}
	.shangmai_banner_w .banner_text li{
		font-size: 18px;
		padding-left: 24px;
	}
	.shangmai_banner_w .banner_text li i{
		position: absolute;
		left:-4px;
		top: 0;
		width: 24px;
		height: 24px;
		display: inline-block;
		background: url(../fonts/icon_gou.svg) no-repeat center center;
		background-size: contain;
	}


	.shangmai_banner_w .banner_btn{
		margin:0.24rem auto;
		display:none;
	}

}
@media screen and (max-width:992px) {


}

@media screen and (max-width:750px) {


}

@media screen and (max-width:375px) {

}



@media screen and (max-width:1200px) {
	.shangmai_banner_w .banner_img{
		margin: 0.16rem auto 0.16rem auto;
		text-align: center;
	}
}




/* Banner 表单*/
.banner_form_w{
	margin:auto;
	position: absolute;
	z-index: 2;
	left:0;
	right:0;
	bottom:-1.3rem;
	
	

}
@media screen and (max-width:1200px) {
	.banner_form_w{
		margin: 0.32rem auto 1.6rem auto;
		position: relative;
		z-index: 2;
		top:0;
		left:0;
		right:0;
		bottom:0;
	}
}

.form_w{
	width:100%;
	color:#FFF;
  border-radius: 0.16rem;
	padding:0.48rem 0.24rem 0.64rem 0.24rem;
	background-image: -moz-linear-gradient( 180deg, rgb(0,184,49) 0%, rgb(109,201,55) 100%);
	background-image: -webkit-linear-gradient( 180deg, rgb(0,184,49) 0%, rgb(109,201,55) 100%);
	background-image: -ms-linear-gradient( 180deg, rgb(0,184,49) 0%, rgb(109,201,55) 100%);
	background: #95E071 url(../fonts/32e2a0753b3148ab8e3528383ca823b8.svg) no-repeat center center;
	background-size: auto;

}




.p_w .img_w{
/* 	width:auto;
	max-width: 55% */
}
.p_w .p_tt{
	padding-bottom:40px;
	position: relative;
	z-index: 1;
}
.p_w .p_tt i{
	display: block;
	position: absolute;
	z-index: -1;
	left: -16px;
	top: -16px;
	width: 48px;
	height: 48px;
	border-radius: 56px;
	background-color: rgb(20, 191, 87);
}


.p_w .p_text{
/* 	max-width: 550px; */
}
.p_w .p_text P{
	display: flex;
	flex-wrap: nowrap;
	align-items: center;

	font-size:18px;
	padding: 0 0 18px 0;  
}
.p_w .p_text b{
	display: flex;
	display: inline-block;
	width:auto;
	text-align: center;
	min-width:100px;
	height:40px;
	line-height: 36px;
	font-size:16px;
	padding:0 4px;
	border:2px solid #FFF;
	border-radius: 8px;
}
.p_w .p_text span{
	padding-left: 10px;
	height:40px;
	font-size: 16px;
	line-height: 1.2;
	opacity: 0.8;

	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.title_w{
	padding:16px 0 16px 0;
	text-align:center;
}
.title_w h1{
	padding:16px 0;
}
.title_w p{
	font-size: 18px;
}

.tt{
	text-align:center;
	line-height:1.4
}

.tt .color_green{
	color:#52C018;
}


/*---- P0 ----*/
.p0{

	padding:64px 0 32px 0;
}

.ul_compete{
	  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  /*! align-items: center; */ 
	margin:32px -1%;
}

.ul_compete .li_list{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	position: relative;
	z-index: 1;
	flex: 1 1 25%;
	margin:0 1%;
	padding: 0.32rem;
	background:#F3F5F8 url(../images/list_bg.png) no-repeat;
	background-size: cover;
	-webkit-box-shadow: 0px 8px 32px rgba(0, 0, 0, 0.04) 16px 0 rgba(150, 160, 170, 0.16);
	-moz-box-shadow: 0px 8px 32px rgba(0, 0, 0, 0.04) 16px 0 rgba(150, 160, 170, 0.16);
	box-shadow: 0px 8px 32px rgba(0, 0, 0, 0.04) 16px 0 rgba(150, 160, 170, 0.16);
	-webkit-border-radius: 8px;	
	-moz-border-radius: 8px;	
	border-radius: 8px;	
}
.ul_compete h5{
	
}
.ul_compete h5 em{
	color:#52C018;
}
.ul_compete p{
	padding-top: 16px;
}



/*---- P1 ----*/
.p1{
  padding:0.48rem 0 0.16rem 0;
}

.p1 .img_w {
	width: 100%;
	max-width: 100%;
	margin:0 auto;
	text-align: center;
}

.p1 .img_w .img_cp{
	margin:0 auto;
}



/*---- P2 ----*/

.p2{
  padding:0 0 0 0;
}

.p2 .img_w {
	width: 100%;max-width: 100%;
	margin: 0 auto;
	text-align: center;
}

.p2 .img_w .img_cp{
	margin:0 auto;
}





/*---- P3 ----*/
.p3{
 padding:0 0 0.16rem 0;
}

.p3 .title_w{
	padding:64px 0 16px 0;
	text-align:center;
}


.p3 .text_w {
	width: 100%;max-width: 100%;
	margin: 0 auto;
	text-align: center;
}
.p3 .img_w {
	width: 100%;max-width: 100%;
	margin: 0 auto;
	text-align: center;
}


/*---- P4 ----*/
.p4{
 //padding-bottom: 0.8rem;
}



.p4 .text_w{
	text-align: center;
}
.p4 .text_w {
	width: 100%;max-width: 100%;
	margin: 0 auto;
	text-align: center;
}
.p4 .img_w {
	width: 100%;max-width: 100%;
	margin: 0 auto;
	text-align: center;
}
.p4 .img_w .img_cp{
	margin:0.32rem auto;
}

.p6{
	
}

.p6 .title_w{
	padding:32px 0 32px 0;
	text-align:center;
}

.p7{
	
}

.p8{
	
}

.p9{
	padding: 0.32rem 0 0.88rem 0 ;
}

.p9 .tips{
	font-family: "num", Helvetica, arial, sans-serif;
	padding-top: 0.08rem;
}

/*-----------底部表单-----------*/

/* 底部行为召唤 action_w */
.action_w{
	min-height:3rem;
	padding:0.32rem 0;
	background-image: -moz-linear-gradient( 180deg, rgb(0,184,49) 0%, rgb(109,201,55) 100%);
	background-image: -webkit-linear-gradient( 180deg, rgb(0,184,49) 0%, rgb(109,201,55) 100%);
	background-image: -ms-linear-gradient( 180deg, rgb(0,184,49) 0%, rgb(109,201,55) 100%);
	background: #95E071 url(../images/action_bg.jpg) no-repeat center center;
	background-size: cover;


}

.action_box{
	padding:0.88rem 0;
}
.action_box .action_tt{
	font-size: 0.56rem;
	color:#FFF;
	text-align: left;
}

.action_box .footer_form{

}

@media screen and (max-width:992px) {
	.action_box .action_tt{
		text-align: center;
	}
}

/*正则验证（通过与错误提示)*/
.footer_form .tips_true { 
	position: absolute;
	z-index: 1; 
	top: -42px; 
	right: 20px; 
	display: block;
	height: 18px; 
	width: 18px; 
	background: transparent url(../images/shiyong_icon_tips_true.png) no-repeat center center;
}
.footer_form .tips_false { width:100%;line-height: 24px; font-style: normal; overflow: hidden; color: #FFF; }
.footer_form .tips_false .icon_false { display: block; display: inline-block; margin-right: 5px; width: 18px; height: 18px; vertical-align: middle; background: transparent url(../images/shiyong_icon_tips_false.png) no-repeat center center; }
.footer_form .tips_info { 
	position: relative; 
	visibility: hidden;
	width: 100%; height: auto;
	margin: 0; 
	font-size: 14px;
	color: #fff;
	margin-top: 2px;

}
.footer_form .tips_info span { color: #f8353a; }




.action_box .form-content{
	display: flex;
	flex-wrap: wrap;

	align-items: stretch;
	margin: 0 -1%;


	margin:0 auto;
	text-align: center;
	overflow: hidden;
}


.action_box .form-item{
	float: left;
	position: relative;
	display: inline-block;
	min-width: 2.4rem;
	flex: 1 1 20%;
	padding:0 0.08rem 0 0; 
}

@media screen and (max-width:992px) {
	.action_box .form-item{
		display: block;
		float: none;
		flex: 1 1 100%;
		width:100%;
		padding:0 0.08rem 0 0;
	}
	.action_box .btn_w{
		display: block;
		float: none;
		flex: 1 1 100%;
		width:100%;
		padding:0 0.08rem 0 0;
	}

}

.action_box label{
	height: 64px;
	line-height: 64px;
	position: absolute;
	left:24px;
	font-size: 16px;
	color:#000;
}
.action_box .input{
	font-size: 16px;
	color:#000;
	padding-left:72px;
	width: 100%;
	height: 64px;
	line-height: 64px;
	border:2px solid transparent;
	border-radius: 8px;	
}

.action_box .error-tips {
	text-align: left;
	padding-left: 72px;
	font-size: 14px;
	color: #FFF;
	margin-top: 6px;
	visibility: hidden;
	background:transparent url(../images/from_icon_error.png) no-repeat 48px center;
	background-size: contain;	
}
/*提交按钮*/
.action_box .btn_w{
	display: inline-block;
	float: left;
	text-align: center;
	margin: 0 auto;
	flex: 1 1 20%;
	padding:0 0.16rem 0 0; 
}

@media screen and (max-width:992px) {
	.action_box .btn_w{
		display: block;
		float: none;
		flex: 1 1 100%;
		width:100%;
		padding:0 0.08rem 0 0;
	}

}

.action_box .btn-submit{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;

	text-align: center;
	margin:0 auto;

	cursor: pointer;
	font-size: 24px;
	color:#FFFF;
	min-width:3.8rem;
	height: 64px;
	
  color: #54BF1B;
	background-color: #FFFFC6;

	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
.action_box .btn-submit:hover{
	opacity: 0.8;
}

@media screen and (max-width:992px) {
	.action_box .btn-submit{
		width:100%;
	}
}

/*数据滚动*/
.action_box  .clue_w{
	font-size: 14px;
	color:#FFF;
	height:24px;
	line-height: 24px;
	overflow: hidden;
	margin:0.16rem 0 0.32rem 0;
	width:210px;
	padding: 0;
}

@media screen and (max-width:992px) {
	.action_box  .clue_w{
		margin:16px auto;
	}

}

.action_box .clue_w .clue_item{
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;

	-webkit-animation: scroll 16s infinite; 
}

.action_box .clue_w  span{
	display: block;
	display: inline-block;
	height:24px;
	line-height: 24px;
	padding:0 4px;
}


.action_box .tips_w{
	text-align: left;
	color:#074A20;
	opacity: 0.88;
}