@charset "utf-8";
/*------------------------------------------------
--css     CRM营销落地页
--by      市场部 Sivan 2022-03-22
--version  v1.0.0
--update   2022-03-22
--ps       本页面不考虑其他端设备，采取固定宽高的模式，尽可能减少Dom以及启用GPU的CSS3动画
--约定     在已设定的宽度和高度之【外】绘制设定元素的边框及内边距 box-sizing: content-box W3C盒子模型 

-------------------------------------------------*/
body {
	background-color: #3729cc;
}

/*---crm BANNER---*/
.crm_banner_w {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
	max-width:2560px;
	height: 900px;
	margin: auto;
	position: relative;
	z-index: 0;
	left: 0;
	right: 0;
	top: 0;
	background: #E8F8F8 url(banner_crmx20220930.jpg) no-repeat center center;
	background-size: cover;
}

.banner_btn{
	display: block;
	width:320px;
	height:240px;
	margin: auto;
	position: absolute;
	top:310px;
	bottom:0;
	left:0;	
}

.crm_banner_w .logo_nr{ width:90%; margin:0 auto; padding:1.4rem 0; background:url(footer_logo.png) no-repeat 0 20px}
@media screen and (max-width:1440px) {

}

/* Banner 表单*/
.form_w{
	height: 900px;
	margin: auto;
	position: relative;
}


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


.form_w .bannerForm{
	width:500px;
	height:530px;
	padding:40px;
	margin: auto;
	position: absolute;
	top:-100px;
	bottom:0;
	right:0;	

	background-color: #00b831; 
	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:#00b831 url(banner_form_bg.png) no-repeat center center;
	background-size: cover;

	-webkit-border-radius: 24px;
	-moz-border-radius: 24px;
	border-radius: 24px;

}

.form_w .form_tt{
	font-size: 36px;
	color:#FFF;
	text-align: center;
}
.form_w .form_item{
	position: relative;
	padding-bottom: 8px;
}
.form_w label{
	height: 64px;
	line-height: 64px;
	position: absolute;
	left:24px;
	font-size: 16px;
	color:#000;
}
.form_w .input{
	font-size: 16px;
	color:#000;
	padding-left:72px;
	width: 100%;
	height: 64px;
	line-height: 64px;
	border:2px solid transparent;
	border-radius: 8px;	
}

.form_w .error_tips {
	padding-left: 72px;
	font-size: 12px;
	color: #fff;
	margin-top: 2px;
	visibility: hidden;
	background:transparent url(from_icon_error.png) no-repeat 52px center;
	background-size: contain;	
}
/*提交按钮*/
.form_w .btn_w{
	text-align: center;
	margin: 8px auto 8px auto;
}	
.form_w .form_submit{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;

	text-align: center;
	margin:0 auto;

	cursor: pointer;
	font-size: 24px;
	color:#FFF;
	width: 99%;
	height: 72px;
	background-image: -moz-linear-gradient( 180deg, rgb(16,94,45) 0%, rgb(32,134,72) 100%);
	background-image: -webkit-linear-gradient( 180deg, rgb(16,94,45) 0%, rgb(32,134,72) 100%);
	background-image: -ms-linear-gradient( 180deg, rgb(16,94,45) 0%, rgb(32,134,72) 100%);
	-webkit-border-radius: 64px;
	-moz-border-radius: 64px;
	border-radius: 64px;
}
.form_w .form_submit:hover{
	opacity: 0.8;
}

.form_w .tips_w{
	text-align: center;
	color:#074A20;
	opacity: 0.88;
}

/*数据滚动*/
.form_w .clue_w{}
.form_w  .clue_w{
	font-size: 14px;
	color:#FFF;
	height:24px;
	line-height: 24px;
	overflow: hidden;
	margin: 16px auto 16px auto;
	width:240px;
	padding: 0 8px;
	background-color: rgb(49, 61, 70,0.16);
	border-radius: 88px;
	opacity: 0.88;

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

	-webkit-animation: scroll 16s infinite; 
}
.form_w .clue_w .icon_peaker{
	display: block;
	display: inline-block;
	width: 32px;
	height: 32px;
}

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


@keyframes scroll {
	0% {
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}

	10% {
		-webkit-transform: translateY(-24px);
		transform: translateY(-24px);
	}
	20% {
		-webkit-transform: translateY(-48px);
		transform: translateY(-48px);
	}
	30% {
		-webkit-transform: translateY(-72px);
		transform: translateY(-72px);
	}
	40% {
		-webkit-transform: translateY(-96px);
		transform: translateY(-96px);
	}
	50% {
		-webkit-transform: translateY(-120px);
		transform: translateY(-120px);
	}
	60% {
		-webkit-transform: translateY(-144px);
		transform: translateY(-144px);
	}
	70% {
		-webkit-transform: translateY(-168px);
		transform: translateY(-168px);
	}
	80% {
		-webkit-transform: translateY(-192px);
		transform: translateY(-192px);
	}
	90% {
		-webkit-transform: translateY(-216px);
		transform: translateY(-216px);
	}
	100% {
		-webkit-transform: translateY(-240px);
		transform: translateY(-240px);
	}
}

/*-----主体----*/

.main {
	max-width: 2560px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
	background:url(cp_bg.jpg) no-repeat  center 160px;

}
/*产品功能*/
.cp_w{
	position: relative;
	z-index: 2;
	margin: -120px 0 32px 0;
	color:#FFF;
}
/*产品楼层*/
.p_w{
	line-height: 1.8;
	font-size: 16px;
	padding: 88px 64px;
	margin-bottom: 16px;
	background-color: #4637e5;
	-webkit-border-radius: 32px;
	-moz-border-radius: 32px;
	border-radius: 32px;
	overflow: hidden;
}

.p_w .f_l{
	width:50%;
}
.p_w .f_r{
	width:50%;
}

.p_w .text_w{
	width:45%;
}
.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;
}
.p1{

}

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

.tt_w{
	padding: 64px 0 32px 0;   
	text-align:center;
	line-height:1.2
}
.tt_w em{
	color:#14bf57;
}



/*---- VS ----*/
.vs_w{
	max-width:100%;
	min-height:700px;
	padding:64px 0 0 0;
	overflow:hidden;
	position: relative;
	z-index: 0;
	margin-top:-200px;
}

.vs_w .btn_w{
	text-align: center;
	margin: auto;
	position: absolute;
	bottom: 56px;
	left: 0;
	right: 0;
}
/*---- 为什么选择EC ----*/
.why_w{
	max-width:100%;
	min-height:640px;
	padding:0 0 32px 0;
	overflow:hidden;
	position: relative;
	z-index: 0;

	text-align: center;
	background: url(why_bg.jpg) no-repeat center center;
	background-size: cover;
}
.why_w .tt_w{
	color:#FFF;
}
.why_w .list_w{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content:center;
	margin:0 -16px;
}
.why_w .list_w li{
	position: relative;
	text-align: center;
	max-width:25%;
	text-align: center;
	overflow: hidden;
	max-width: 25%;
	margin: 12px;

	background-image: -moz-linear-gradient( 0deg, rgb(193,224,224) 0%, rgb(255,255,255) 100%);
	background-image: -webkit-linear-gradient( 0deg, rgb(193,224,224) 0%, rgb(255,255,255) 100%);
	background-image: -ms-linear-gradient( 0deg, rgb(193,224,224) 0%, rgb(255,255,255) 100%);
	box-shadow: 0px 32px 48px 0px rgba(48, 41, 215, 0.24);
	border-radius: 32px;

	overflow: hidden;

}
.why_w .list_w li img{
	width: 100%;
	border-radius: 16px;
	overflow: hidden;
}
.why_w ul  h4{
	font-size: 18px;
	font-weight: normal;
	padding:24px 16px 24px 16px;
}


/*---- 企业都在使用 ----*/
.customer_w{
	max-width: 100%;
	min-height: 740px;
	padding:64px 0;
	color:#000;
	background-color: #eef4f4;
}
.customer_w .tt_w{
	color:#000;
}

/*---- 解决方案 ----*/
.solution_w{
	padding:64px 0;
	background: #E8F8F8 url(case_bg.jpg) no-repeat center center;
	background-size: cover;


}
.solution_w .tt_w{
	color:#FFF;
}
.solution_w .btn_w{
	margin:32px  auto;
	text-align: center;
}

.solution_w ul{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content:center;
}

.solution_w ul li{
	width: 30%;
	max-width: 400px;
	height: 480px;
	margin: 12px;
	border-radius: 32px;
	overflow: hidden;
	color:#FFF;
	background-color:#14bf57;
}
.solution_w ul li:nth-child(1){
	background-image: -moz-linear-gradient( -45deg, rgb(32,163,244) 0%, rgb(71,197,255) 100%);
	background-image: -webkit-linear-gradient( -45deg, rgb(32,163,244) 0%, rgb(71,197,255) 100%);
	background-image: -ms-linear-gradient( -45deg, rgb(32,163,244) 0%, rgb(71,197,255) 100%);
}
.solution_w ul li:nth-child(2){
	background-image: -moz-linear-gradient( -45deg, rgb(7,153,90) 0%, rgb(29,194,94) 100%);
	background-image: -webkit-linear-gradient( -45deg, rgb(7,153,90) 0%, rgb(29,194,94) 100%);
	background-image: -ms-linear-gradient( -45deg, rgb(7,153,90) 0%, rgb(29,194,94) 100%);
}
.solution_w ul li:nth-child(3){
	background-image: -moz-linear-gradient( -45deg, rgb(214,39,39) 0%, rgb(244,73,73) 100%);
	background-image: -webkit-linear-gradient( -45deg, rgb(214,39,39) 0%, rgb(244,73,73) 100%);
	background-image: -ms-linear-gradient( -45deg, rgb(214,39,39) 0%, rgb(244,73,73) 100%);
}
.solution_w ul li:nth-child(4){
	background-image: -moz-linear-gradient( -45deg, rgb(238,114,29) 0%, rgb(240,162,55) 100%);
	background-image: -webkit-linear-gradient( -45deg, rgb(238,114,29) 0%, rgb(240,162,55) 100%);
	background-image: -ms-linear-gradient( -45deg, rgb(238,114,29) 0%, rgb(240,162,55) 100%);
}
.solution_w ul li:nth-child(5){
	background-image: -moz-linear-gradient( -45deg, rgb(51,69,240) 0%, rgb(79,97,248) 100%);
	background-image: -webkit-linear-gradient( -45deg, rgb(51,69,240) 0%, rgb(79,97,248) 100%);
	background-image: -ms-linear-gradient( -45deg, rgb(51,69,240) 0%, rgb(79,97,248) 100%);
}
.solution_w ul li:nth-child(6){
	background-image: -moz-linear-gradient( -45deg, rgb(14,131,208) 0%, rgb(16,164,239) 100%);
	background-image: -webkit-linear-gradient( -45deg, rgb(14,131,208) 0%, rgb(16,164,239) 100%);
	background-image: -ms-linear-gradient( -45deg, rgb(14,131,208) 0%, rgb(16,164,239) 100%);
}
.solution_w .img_w{
	overflow: hidden;
}

.solution_w .text_w{
	padding:24px 24px;

}
.solution_w .text_w h2{
	font-size: 32px;
	padding: 0 0 16px 0;
}
.solution_w .text_w p{
	min-height: 100px;
	font-size: 16px;
	line-height: 1.4;
	padding-bottom: 24px;
	opacity: 0.8;
}
.solution_w .text_w .btn{
	margin-left: -2px;
	padding: 0 24px;
	font-size: 16px;
	height:42px;
	line-height: 38px;
}

/*---- 媒体报道 ----*/
.media_w{
	height: 800px;
	padding:32px 0;
	background-color: #eef4f4;
}
.media_w .con{
	background: url(scrm_bg.png) no-repeat left center;
	background-size: auto;
}	
.media_w .tt_w{

}
.media_w .btn_w{
	margin:32px  auto;
	text-align: center;
}

.media_w .list_w{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content:center;
	margin:0 -16px;
}
.media_w .list_w li{
	position: relative;
	text-align: center;
	max-width:25%;
	text-align: center;
	overflow: hidden;
	max-width: 25%;
	margin: 12px;
	border-radius: 16px;

	overflow: hidden;

}
.media_w .list_w li img{
	width: 100%;
	border-radius: 16px;
	overflow: hidden;
}
.media_w ul  p{
	font-size: 18px;
	font-weight: normal;
	padding:8px  16px;
}


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

/* 底部行为召唤 action_w */
.action_w{
	height:300px;

	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: url(footer_call_bg.jpg) no-repeat center center;
	background-size: cover;


}

.action_box{
	padding-top:64px;
}
.action_box .action_tt{
	font-size: 40px;
	color:#FFF;
	text-align: left;
}

.action_box .form{

}

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




.action_box .form-content{
	margin:0 auto;
	text-align: center;
	overflow: hidden;
}


.action_box .form-item{
	float: left;
	position: relative;
	display: inline-block;
	min-width:320px;
	padding-right: 8px;
}
.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(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;
}	
.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:#FFF;
	min-width: 240px;
	height: 64px;
	background-color: #e89933;
	background-image: -moz-linear-gradient( 0deg, rgb(231,151,48) 0%, rgb(248,206,129) 100%);
	background-image: -webkit-linear-gradient( 0deg, rgb(231,151,48) 0%, rgb(248,206,129) 100%);
	background-image: -ms-linear-gradient( 0deg, rgb(231,151,48) 0%, rgb(248,206,129) 100%);
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
.action_box .btn-submit:hover{
	opacity: 0.8;
}



/*数据滚动*/
.action_box .clue_w{}
.action_box  .clue_w{
	font-size: 14px;
	color:#FFF;
	height:24px;
	line-height: 24px;
	overflow: hidden;
	margin:16px 0 8px 0;
	width:210px;
	padding: 0;
}
.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;
}