@charset "utf-8";
/*电脑端的banner样式*/
.priceBanner{
	background:url(../img/anlibanner.png);
	background-size:cover;
	background-position:0 center;
	height:500px}
.priceBanner1{ position:relative; height:500px}
.index_banner_box{ position:absolute; top:26%; left:50%; transform:translateX(-50%); text-align:center}
.index_banner_box_title{font-size:36px;color:#FFF;font-weight:bold;}
.index_banner_box_title2{font-size:20px;color:#FFF;margin-top:16px}

.index_banner_img{
	width:560px;
	height:233px;
	background:url(../img/anli1.png);
	position:absolute;
	bottom:0;
	left:50%;
	transform:translateX(-50%)}


.anli{ background:#f8f8f8; padding-top:40px;}
.anli-box { width: 100%; }
.anli_ul{ overflow:hidden; margin-top:20px; margin-left: 15px; margin-right: 15px;}
.anli_ul li{ margin-top:20px; padding:0px 15px;} 

/* 网站搭建 */
.anli_ul_div{ border-radius:4px; background:#FFF; position:relative; overflow: hidden;}
.anli_ul_div:hover{
	transform: translateY(-5px);
	box-shadow: 0 0 10px 0 #ccc;
}
.anli_ul_div_img{ height:280px; width:100%; position:relative; overflow:hidden}
.anli_ul_div_img .img{ width:100%; height:100% !important; object-fit: contain; background: #e5e5e5;}
.anli_ul_div_img .logo{ width:100px; height:100px; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); border-radius:50%}
.anli_ul_div_title{ 
	padding: 0 10px;
	margin-top:15px; 
	text-align:center; 
	font-size:15px; 
	color:#333333;
	padding-bottom:15px; 
	white-space: nowrap;  
	overflow: hidden; 
	text-overflow: ellipsis;
}
.anli_ul_div_desc{ margin:0 30px; text-align:justify; margin-top:20px; line-height:22px; color:#999999; font-size:14px; padding-bottom:30px}
.anli_ul_div_t{ opacity:0; position:absolute; top:100%; left:0; z-index:10; width:100%; height:155px; cursor:pointer; background:rgba(0,0,0,0.5);transition: all ease 0.3s;}
.anli_ul_div_t_1{ position:relative; width:100%; height:100%}
.anli_ul_div_t_1_1{ position:absolute; width:130px; left:50%; top:50%; transform:translate(-50%,-50%)}
.anli_ul_div_t_1_1 img{ width:120px; height:120px; display:block;transition: all ease 0.3s;}
.anli_ul_div_img:hover .anli_ul_div_t{ opacity:1;top:0;}

/* 商城搭建 */
.anli_ul_div_mall{     
	float: left;
    width: 240px;
    height: 484px;
    background: url(/static/images/monile_bg.png) no-repeat center;
    background-size: 100% 100%;
    position: relative;
	margin-bottom: 20px;
}
.anli_ul_div_mall_img img{     
	position: absolute;
    width: 208px;
    height: 370px !important;
    top: 56px;
    left: 50%;
    margin-left: -103px;
}

.anli_ul_div_mall_qr {
	position: absolute;
    width: 208px;
    height: 372px;
    top: 56px;
    left: 50%;
    margin-left: -103px;
    opacity: 0;
    background: white;
	-webkit-transform: scale(.3); 
    -moz-transform: scale(.3);
    -ms-transform: scale(.3);
    -o-transform: scale(.3);
    transform: scale(.3); 
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.anli_ul_div_mall:hover .anli_ul_div_mall_qr,
.anli_ul_div_mall:focus .anli_ul_div_mall_qr,
.anli_ul_div_mall:active .anli_ul_div_mall_qr {
	opacity: 1;
	-webkit-transform: scale(1); 
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); 
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.anli_ul_div_mall_qr img {
	width: 208px;
    height: 208px;
    position: absolute;
    top: 25%;
}

/* 商城插件 */
/* 商城插件开始 */
.plugin {
    text-align: center;
    background: #F8F8F8;
    padding-top: 40px;
	border-radius: 4px;
    /* padding-bottom: 60px; */
}

.plugin .title,.anli .title {
	font-size: 32px;
	color: #333;
	text-align: center;
	line-height: 55px;
}

.plugin .des,.anli .des {
	font-size: 16px;
	color: #999;
	line-height: 40px;
	text-align: center;
	margin-bottom: 20px;
}

.plugins {
    background-color: #fff;
    width: 90%;
    margin: 20px auto 0;
    position: relative;
}

.plugins .plugins-header {
    height: 92px;
    border-bottom: 2px solid #F2F6FA;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #545454;
    font-size: 20px;
	gap: 40px;
	flex-wrap: wrap;
}

.plugins .plugins-header>div {
    /* width: 232px; */
	text-align: center;
    cursor: pointer;
    height: 92px;
    line-height: 92px;
}

.plugins .plugins-header>div:hover {
	color: #0170ff;
}

.plugins .plugins-header .active {
	color: #0170ff;
    border-bottom: 2px solid #0170ff;
}
.plugins .plugin-line {
    width: 119px;
    height: 8px;
    background: #3699FF;
    position: absolute;
    left: 75px;
    top: 87px;
}
 .plugins .plugins-list {
    /* padding: 13px 25px 40px; */
	justify-content: start;
    display: flex;
    flex-wrap: wrap;
	gap: 40px;
    padding: 40px;
}
.plugins .plugins-list .plugins-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #545454;
}
.plugins .plugins-list .plugins-item a {
    color: #545454;
}
.plugins .plugins-list .plugins-item div {
	width: 110px;
	font-size: 14px;
	white-space: nowrap;  
    overflow: hidden;    
    text-overflow: ellipsis; 
}
.plugins .plugins-list .plugins-item img {
    width: 72px;
    height: 72px !important;
    border-radius: 4px;
    background: rgb(51, 153, 255);
    margin-bottom: 20px;
}
/* 商城插件结束 */

.mall-procedure-list {
    margin-top: 40px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 520px;
}

.mall-procedure-list img {
	height: 100% !important;
    width: auto;
    margin: 0 20px;
    display: block;
}


.moveList_dl_dd_page{
	height:140px;
	border-top:1px solid #f0f0f0;
	padding-top:50px;
	position:relative;
	padding-bottom:50px;
	width:100%}
.moveList_dl_dd_page ul{
	position:absolute;
	height:40px;
	left:50%;
	transform:translateX(-50%);
	overflow:hidden;}
.moveList_dl_dd_page ul a,.moveList_dl_dd_page ul span{
	float:left;
	width:38px;
	height:38px;
	line-height:38px;
	border:1px solid #ececec;
	margin:0 5px;
	color:#333333;
	font-size:14px;
	text-align:center;
	border-radius:4px}
.moveList_dl_dd_page ul a.page-num-current{
	width:40px;
	height:40px;
	line-height:40px;
	background:#0170ff;
	color:#FFF;
	border:none}
.moveList_dl_dd_page ul a.border_none{
	border:none}
.moveList_dl_dd_page ul a{
	display:block;}
.moveList_dl_dd_page ul a:hover{
	background:#0170ff;
	color:#FFF;
}
.temp_dl_dt_ul {
	width: 100%;
	overflow:hidden;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 15px;
	padding: 0px;
}
.temp_dl_dt_ul_li {
    line-height: 36px;
    width: 18%;
    float: left;
    text-align: center;
    border: 1px solid #ddd;
    color: #999999;
    cursor: pointer;
    font-size: 14px;
    font-weight: normal;
	flex: 0 1 18%;
	border-radius: 4px;
	background: white;
	margin: 0;
}
.temp_dl_dt_ul_li a{
	display: block;
     color: #999999;
}
.temp_dl_dt_ul_li.active{
	background:#0170ff;
	border: 1px solid #0170ff;
	color:#ffffff;
}
.temp_dl_dt_ul_li.active a{
	color:#ffffff;
}	
.temp_dl_dt_ul_li:hover{
	background:#0170ff;
	color:#ffffff;
}
.temp_dl_dt_ul_li:hover a{
	color:#ffffff;
}

@media (max-width: 768px) {

	.anli_ul_div_mall .anli_ul_div_mall_qr {
		opacity: 1;
		background: rgba(0,0,0,0.5);
		-webkit-transform: scale(1); 
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1); 
	}

	.plugins {
		width: 100%;
	}

	.plugins .plugins-list {
		justify-content: space-around;
	}

	.plugins .plugins-list .plugins-item div {
		width: 100px;
		font-size: 13px;
	}

	.plugin .title,.anli .title {
		font-size: 20px;
	}
	
	.plugin .des,.anli .des {
		font-size: 14px;
	}

	.plugins .plugins-header {
		height: 60px;
		font-size: 14px;
		gap: 20px;
	}

	.plugins .plugins-header>div {
		height: 60px;
		line-height: 60px;
	}
}

@media only screen and (min-width: 320px) and (max-width: 1024px) {

	.temp_dl_dt_ul {
		justify-content: space-between;
		padding: 0 2%;
		gap: 0;
	}

	.temp_dl_dt_ul_li {
		width: 46%;
		flex: 0 1 46%;
		margin: 2%;

	}

	.anli_ul_div_img {
		height: 170px;
	}

	.anli_ul{ 
		margin-left: 10px;
		margin-right: 10px;
	}

	.anli_ul li{ 
		padding:0px 10px;
	} 
  
}

@media (max-width: 1200px) {
	.mall-procedure-list {
	  display: none;
	}
}

@media (min-width: 1200px) {
	.mall-procedure-list {
	  height: 480px;
	  display: flex;
	}
}

@media (min-width: 1700px) {
	.mall-procedure-list {
	  height: 520px;
	  display: flex;
	}
}