*{margin:0;padding:0;font-family: Helvetica,Pingfang SC,Microsoft YaHei,STHeiti,Verdana,Arial,Tahoma,sans-serif;}
.clear{clear:both;}
.clearfix{zoom:1}
.clearfix:after{content:"";clear:both;display:block}
body{color:#5c5c5c;text-decoration:none;font-size:12px;word-break:normal;width:100%;margin:0 auto;font-family:'PingFangSC','helvetica neue','hiragino sans gb','arial','microsoft yahei ui','microsoft yahei','simsun','sans-serif'!important}
body.create-body{min-width:1200px;position: fixed;left: 0;top: 0;bottom: 0;width: 100%;}
img,input,select{vertical-align:middle}
a{text-decoration:none;color:#5C5C5C;outline:none;}
img{border:0}
li,ul{list-style:none outside}
b,h1,h2,h3,h4,h5,h6{font-weight:400}
table{border-collapse:collapse;border-spacing:0;}
li{list-style:none}
i,b,em{font-style:normal;}
.cursor{cursor:pointer;}
.bor0{border:0 !important;}
/*超出一行省略*/
.one-overflow{ width:100%;overflow: hidden;/*超出部分隐藏*/white-space: nowrap;/*不换行*/text-overflow:ellipsis;/*超出部分文字以...显示*/}
.iblock{display:inline-block;}
.block{display:block;}
.absolute{position:absolute;}
.module-img{cursor:pointer;}
.r10{right:10px;}
.wp20{width:20%;}
.wp100{width:100% !important;}
.w150{width:150px !important;}
.w300{width:300px !important;}
.hp100{height:100% !important;}
.fl{float:left;}
.fr{float:right;}
.fz12{font-size:12px;}
.fz14{font-size:14px;}
.fz24{font-size:24px !important;}
.tc{text-align:center;}
.tr{text-align:right;}
.flex{display:flex !important;}
.flex1{flex:1;}
.space-around{justify-content:space-around;}
.relative{position:relative;}
.pl0{padding-left:0 !important;}
.pl10{padding-left:10px;}
.pt0{padding-top:0;}
.pt10{padding-top:10px;}
.pr10{padding-right:10px;}
.pr20{padding-right:20px;}
.pb10{padding-bottom:10px;}
.mt10{margin-top:10px !important;}
.ml10{margin-left:10px !important;}
.mb10{margin-bottom:10px;}
.mr10{margin-right:10px;}
.c-888{color:#888;}
.c-999{color:#999;}
.theme-color{color:#fd3d53;}
.theme-bgc{background:#fd3d53;}
.plr10{padding-left:10px;padding-right:10px;}
.weight{font-weight:bold;}
.radius{border-radius:10px;overflow:hidden;}
.module-borb1{border-bottom:1px solid #e9e7ec;}
.el-scrollbar__wrap{
  overflow-x: hidden !important;
}
.space-between{justify-content: space-between;}
.align-middle{vertical-align:middle;}
.diy-page{
	/* position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 99; */
	width:100%;
	height:100%;
	background-color: #eef0f4;
}
.modal-items{
	padding:20px;
}
.modal-item{
	width: 200px;
	float: left;
	margin-right: 14px;
	margin-bottom: 20px;
	text-align: center;
}
.modal-items .modal-item:nth-child(4n){
	margin-right:0;
}
.modal-item .image{
	width: 200px;
	height: 355px;
	border-radius: 4px;
	margin-bottom: 10px;
	cursor: pointer;
	position: relative;
}
.modal-item .image img{
	border-radius: 4px;
	height: 100%;
	width: 100%;
	border: 1px solid #e3e2e5;
}
.modal-item .image:hover img {
    border: none;
}
.modal-item .image:hover .preview {
    display: block;
    -webkit-animation: showPreview .8s 1;
    animation: showPreview .8s 1;
}

.modal-item .image .preview{
	display: none;
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.4);
	border-radius: 4px;
}
.modal-item .image .preview .qr-code{
	display:none;
	width: 140px;
	height: 165px;
	padding: 20px;
	margin: 55px 30px 10px;
	background: #fff;
	border-radius: 4px;
	color: #9797a1;
	text-align: center;
}
.modal-item .image .preview button{
	margin-top:150px;
	margin-bottom: 10px;
	width: 140px;
	height: 30px;
	color: #fff;
	border-radius: 4px;
	background: #2589ff;
	border: none;
}
.modal-item  p{
	color: #595961;
}



.ant-btn {
    line-height: 1.499;
    position: relative;
    display: inline-block;
    font-weight: 400;
    white-space: nowrap;
    text-align: center;
    background-image: none;
    -webkit-box-shadow: 0 2px 0 rgba(0,0,0,.015);
    box-shadow: 0 2px 0 rgba(0,0,0,.015);
    cursor: pointer;
    -webkit-transition: all .3s cubic-bezier(.645,.045,.355,1);
    transition: all .3s cubic-bezier(.645,.045,.355,1);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    height: 32px;
    padding: 0 15px;
    font-size: 12px;
    border-radius: 5px;
    color: #595961;
    background-color: #fff;
    border: 1px solid #e3e2e5;
}

.ant-btn {
    height: 30px;
    padding: 0 20px;
}

.ant-layout, .ant-layout * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

[type=reset], [type=submit], button, html [type=button] {
    -webkit-appearance: button;
}
.ant-btn-primary {
    color: #fff;
    background-color: #2589ff;
    border-color: #2589ff;
    text-shadow: 0 -1px 0 rgba(0,0,0,.12);
    -webkit-box-shadow: 0 2px 0 rgba(0,0,0,.045);
    box-shadow: 0 2px 0 rgba(0,0,0,.045);
}

.diy-header {
    position: relative;
    z-index: 100;
    height: 50px;
    padding: 10px;
    background: #f8f9fa;
    border-bottom: 1px solid #e9e7ec;
    -webkit-box-shadow: 2px 6px 6px #eee;
    box-shadow: 2px 6px 6px #eee;
	box-sizing:border-box;
	top:0;
}
.diy-header .template-type .template-type-bg {
    display: inline-block;
    border-radius: 4px;
    cursor: pointer;
}
.diy-header .template-type {
    font-size: 14px;
    font-weight: 400;
    color: #595961;
    line-height: 30px;
    height: 30px;
}
.diy-header .template-type .template-type-bg {
    display: inline-block;
    border-radius: 4px;
    cursor: pointer;
}
.diy-header .template-type .template-type-bg img {
    width: 20px;
    line-height: 20px;
}
.diy-header .template-type .m-r-xs {
    margin-left: 8px;
    vertical-align: text-top;
}
.diy-header .template-type .template-type-bg .templateTitle {
    display: inline-block;
    min-width: 30px;
}
.diy-header .template-type .template-type-bg .icon-sd-changetemplte {
    width: 20px;
    margin-right: 7px;
    margin-left: 20px;
    font-size: 15px;
    z-index: -1;
    color: #97979c;
    position: relative;
}
.diy-header .template-oper {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 350px;
    flex: 0 0 350px;
    text-align: right;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.diy-header .template-tips {
    width: 70px;
    text-align: center;
    height: 30px;
    line-height: 30px;
    border-radius: 4px;
    -webkit-transition: .2s linear;
    transition: .2s linear;
	cursor:pointer;
}
.diy-header .template-tips img {
    width: 20px;
    height: 20px;
    margin-right: 5px;
    vertical-align: text-top;
}
.diy-header .template-oper .release {
    width: 70px;
    text-align: center;
    line-height: 30px;
    background: #2589ff;
    border-radius: 4px;
}
.diy-content-box{
	display:flex;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 50px;
}
.module-body{
	min-width: 686px;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 320px;
	right: 360px;
}
.module-setting{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	width: 360px;
	padding: 2px 10px;
	background: #f8f9fa;
	z-index: 102;
}
.module-panel {
    width: 320px;
    background: #f8f9fa;
    height: 100%;
    position: relative;
}
.module-panel dl dt{
	position: relative;
	padding: 0 10px;
	height: 40px;
	line-height: 40px;
}
.module-panel dl dt:before{
	position: absolute;
	content: " ";
	display: block;
	left: 10px;
	right: 0;
	bottom: 0;
	height: 1px;
	background-color: #e9e7ec;
	width: 290px;
}
.module-panel dl dt span{
	font-size: 12px;
	color: #595961;
	font-weight: 700;
}
.module-panel dl dd .ul{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-left: 10px;
}
.module-panel dl dd .li{
	width: 90px;
	height: 90px;
	text-align: center;
	font-size: 12px;
	color: #595961;
	line-height: 20px;
	position: relative;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	margin-right: 10px;
}
.module-panel dl dd .li img{
	display: block;
	width: 74px;
	height: 45px;
	margin: 15px auto 2px;
}
.module-mobile-content{
	max-width: 375px;
	width: 375px;
	margin: 60px auto;
	min-height: 667px;
	background-color: #fff;
	-webkit-box-shadow: 0 0 28px 0 #ccc;
	box-shadow: 0 0 28px 0 #ccc;
	position: relative;
}
.mobile-head{
	position: relative;
	height: 64px;
	width: 375px;
	background: url(../images/mobile-bg.png) no-repeat 50%/100% 100%;
}
.mobile-head .name{
	position: absolute;
	top: 22px;
	left: 50%;
	width: 170px;
	height: 42px;
	line-height: 42px;
	text-align: center;
	font-size: 15px;
	font-weight: 600;
	color: #35323b;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	-webkit-transform: translate(-50%);
	transform: translate(-50%);
}
.module-setting .title{
	padding-left: 10px;
	width: 100%;
	height: 50px;
	line-height: 50px;
	font-size: 14px;
	font-weight: 600;
	color: #595961;
}
.scroll-content{
	padding-bottom:50px;
}
.inside-title{
	padding: 9px 16px 9px 12px;
	font-weight: 600;
	font-size:12px;
	color: #595961;
	line-height: 22px;
	background: #eef0f4;
	border-radius: 5px;
}
.inside-setting-content{
	padding: 20px 10px;
	overflow: hidden;
	color: #595961;
}
.btn-page-setting{
	position: fixed;
	top: 120px;
	z-index: 3;
	left: calc((100% - 1045px)/2 + 254px);
	text-align: center;
	width: 40px;
	height: 40px;
	line-height: 40px;
	font-size: 20px;
	background: #fff;
	border-radius: 20px;
}

.ghostClass {
	background-color: blue !important;
}

.chosenClass {
	background-color: red !important;
	opacity: 1 !important;
}

.dragClass {
	background-color: blueviolet !important;
	opacity: 1 !important;
	box-shadow: none !important;
	outline: none !important;
	background-image: none !important;
}

.flex-content dl{
	display:flex;
	margin-bottom:10px;
}
.flex-content dl dt{
	padding-right: 10px;
	font-size: 12px;
	color:#595961;
	line-height: 32px;
}
.flex-content dl dd{
	flex:1;
}
.flex-content dl dd input{
	width: 100%;
	line-height: 32px;
	height: 32px;
}
.img-tabs{
	display:flex !important;
	margin-right:5px;
	margin-bottom:10px;
}
.img-tabs label{
	flex: 1;
	text-align: center;
	background: #fff;
	-webkit-transition: color .3s,background .3s,border-color .3s;
	transition: color .3s,background .3s,border-color .3s;
}
.img-tabs .el-radio-button__inner{
	width:100%;
}
 .img-tabs i{
	display:inline-block;
	 width:28px;
	 height:28px;
 }
/*  .img-tabs li.one{
	  border-left: 1px solid #e3e2e5;
	  border-radius: 5px 0 0 5px;
  } */
 .img-tabs label.one i{
	 background:url(../images/diy/img-one.png) no-repeat center;
	 background-size:contain;
 }
 .img-tabs label.two i{
 	 background:url(../images/diy/img-two.png) no-repeat center;
 	 background-size:100%;
 }
 .img-tabs label.three i{
 	 background:url(../images/diy/img-swiper.png) no-repeat center;
 	 background-size:100%;
 }
.img-tabs label.four i{
	background:url(../images/diy/img-swiper.png) no-repeat center;
	background-size:100%;
}

 .img-tabs.goods label.one i{
 	 background:url(../images/diy/goods-style1.png) no-repeat center;
 	 background-size:contain;
 }
 .img-tabs.goods label.two i{
 	 background:url(../images/diy/goods-style2.png) no-repeat center;
 	 background-size:100%;
 }
 .img-tabs.goods label.three i{
 	 background:url(../images/diy/goods-style3.png) no-repeat center;
 	 background-size:100%;
 }
 .img-tabs.goods label.four i{
 	 background:url(../images/diy/goods-style4.png) no-repeat center;
 	 background-size:contain;
 }
 .img-tabs.goods label.five i{
 	 background:url(../images/diy/goods-style5.png) no-repeat center;
 	 background-size:100%;
 }
 
/* .img-tabs label.one.is-active i{
 	 background:url(../images/diy/img-one-active.png) no-repeat center;
 	 background-size:100%;
 } */
 
/* .img-tabs label.two.is-active i{
 	 background:url(../images/diy/img-two-active.png) no-repeat center;
 	 background-size:100%;
 } */
 
/* .img-tabs label.three.is-active i{
 	 background:url(../images/diy/img-swiper-active.png) no-repeat center;
 	 background-size:100%;
 } */
 .addImg-lists li{
	 padding: 15px 10px 20px;
	 border-radius: 4px;
	 margin-bottom: 10px;
	 min-height: 80px;
	 background: #f0f2f5;
 }
  .addImg-lists li h5{
	  font-size: 14px;
	  color: #595961;
  }
  .addImg-lists li dt{
	  margin-top:10px;
	  margin-bottom:6px;
  }
  .imgModule{
	  margin-left:20px;
	  width:80px;
	  height:80px;
  }
  .imgSize{
	  display:inline-block;
	  width: 100%;
	  
  }
  .imgtext{
	  position: absolute;
	  left: 0;
	  bottom: 0;
	  z-index: 2;
	  width: 100%;
	  font-size: 12px;
	  color: #999;
	  text-align: center;
	  line-height: 24px;
  }
  .module-mask{
	  position:relative;
	  -webkit-box-shadow: 0 2px 50px 5px rgba(50,59,77,.5);
	  box-shadow: 0 2px 50px 5px rgba(50,59,77,.5);
	  cursor:pointer;
  }
  .module-mask.active,.module-mask:hover{
	  border: 2px solid #2589ff;
  }
  .module-mask.active .module-handle,.module-mask:hover .module-handle{
  	  display:inline-block;
  }
  .center-title{
	  padding: 0 10px;
	  line-height: 40px;
	  height:40px;
  }
  .module-handle{
	display:none;
	position: absolute;
	 top: 0;
	 left: 373px;
	 z-index: 2;
	 line-height: 36px;
	 width: 150px;
	line-height: 36px;
  }
  .module-handle span{
	  display: inline-block;
	  margin-left: 10px;
	  padding: 0 10px;
	  background: #fff;
	  cursor:pointer;
  }
  .module-handle em{
	  margin-right: 10px;
	  font-size:12px;
	  color:#595961;
	  font-style: normal;
	  vertical-align: middle;
  }
  .module-handle i{
	  display: inline-block;
	  font-size:18px;
	  color:#b0b0ba;
	  vertical-align: middle;
  }
  .nav-style1,.nav-style2,.discount-style1,.discount-style2{
	  display:inline-block;
	  width: 28px;
	  height: 28px;
	  background-size: 80%;
	  background-repeat: no-repeat;
	  background-position: 50%;
	  margin: 4px auto;
  }
   .nav-style1{
	   background:url(../images/diy/nav-style1.png) no-repeat center;
	   background-size:contain;
   }
   .nav-style2{
   	   background:url(../images/diy/nav-style2.png) no-repeat center;
   	   background-size:contain;
   }
   .nav-style1.active{
   	   background:url(../images/diy/nav-style1-active.png) no-repeat center;
   	   background-size:contain;
   }
   .nav-style2.active{
   	   background:url(../images/diy/nav-style2-active.png) no-repeat center;
   	   background-size:contain;
   }
    .tab-default-ul{
		margin-bottom:10px;
		/* padding:10px 0; */
/* 		background:#fff; */
		overflow:hidden;
	}
	.tab-default-ul li p{
		text-align: center;
	}
   .tab-default-ul li span{
	   display:inline-block;
	   margin-bottom:6px;
	    width: 50px;
	    height: 50px;
		background:url(../images/diy/wutu.png) no-repeat center;
		background-size:contain;
   }
   .tab-default-ul-style2 li{
	   float:left;
	   margin-bottom:6px;
	   width:25%;
	   text-align:center;
   }
   .radio-label .el-radio-button__inner{
	   width: 100%;
	   padding:0;
   }
   .nav-items .li{
	   position:relative;
	   display:flex;
	   padding: 10px;
	   border-radius: 4px;
	   margin-bottom:10px;
	   background: #f0f2f5;
   }
   .nav-items .li .flex-content{
	   flex:1;
	   margin-right:20px;
   }
   .nav-items .li .flex-content dt{
	   line-height:30px;
   }
   .nav-items .li .img-div{
	   position:relative;
	   display:inline-block;
	   margin-top: 26px;
	   width:70px;
	   height:70px;
	   background-color: #f8f9fa;
	   border-radius: 4px;
	   -webkit-box-sizing: content-box;
	   box-sizing: content-box;
	   overflow: hidden;
   }
   .nav-items .li .img-div div{
	   width:100%;
	   height:100%;
   }
   .img-div button{
	   opacity:0;
	   position: absolute;
	   top: 0;
	   z-index: 2;
	   width: 100%;
	   height: 100%;
	   border: 0;
	   box-sizing: border-box;
   }
   .module-box{
	   height: 100%;
	   display: flex;
	   display: flex;
	   -webkit-box-orient: vertical;
	   -webkit-box-direction: normal;
	 /*  overflow: hidden; */
	   -ms-flex-direction: column;
	   flex-direction: column;
   }
   .scroll-flex{
	   flex: 1;
	    height: calc(100% - 70px);
   }
   .scroll-flex .el-tabs__content{
	   height: calc(100% - 60px);
   }
   .tab-default-ul li.more{
	   display: flex;
	   -webkit-box-orient: vertical;
	   -webkit-box-direction: normal;
	   -ms-flex-flow: column;
	   flex-flow: column;
	   -webkit-box-align: center;
	   -ms-flex-align: center;
	   align-items: center;
	   /* display: -webkit-box; */
	   display: -ms-flexbox;
	   margin-left: 6%;
   }
    .tab-default-ul li.more p{
		width:60px;
	}
	/* 上传图片 */
	.avatar-uploader .el-upload {
		width: 70px;
		height: 70px;
	    border: 1px dashed #d9d9d9;
	    border-radius: 6px;
	    cursor: pointer;
	    position: relative;
	    overflow: hidden;
	  }
	  .avatar-uploader .el-upload:hover {
	    border-color: #409EFF;
	  }
	 .avatar-uploader-icon {
	    font-size: 20px !important;
	    color: #8c939d;
	    width: 70px;
	    height: 70px;
	    line-height: 70px;
	    text-align: center;
	  }
	  .avatar {
	    width: 70px;
	    height: 70px;
	    display: block;
	  }
	  .avatar-uploader.bgUp .el-upload{
		  width:100%;
		  box-sizing:border-box;
	  }
	  .avatar-uploader.bgUp .avatar {
		  width:100%;
	  }
	  .store-logos{
		  display:inline-block;
		  margin-left:10px;
		  margin-right:6px;
		  width:40px;
		  height:40px;
		  border-radius:100%;
		  overflow:hidden;
		  background-color:#ddd;
	  }
	  .store-names{
		  display:inline-block;
		  vertical-align:top;
		  line-height:40px;
	  }
	 /* 滚动公告 */
	  .textArr{
		height:30px;
		line-height:30px;
		overflow: hidden;
	  }
	  .slice-enter-active.top {
		animation: bounce-in 4s infinite;
	  }
	  @keyframes bounce-in {
		  0% {
		  transform:translateY(25px) ;
		  }
		  40% {
		  transform: translateY(0px);
		  }
		  80% {
		  transform: translateY(0px);
		  }
		  100% {
		  transform:translateY(-25px);
		  }
	  }
	  .slice-enter-active.left{
		  animation: bounce-left 4s infinite;
	  }
	  @keyframes bounce-left {
		  0% {
		  transform:translateX(200px) ;
		  }
		  40% {
		  transform: translateX(0px);
		  }
		  80% {
		  transform: translateX(0px);
		  }
		  100% {
		  transform:translateX(-200px);
		  }
	  }
	  .slice-enter-active .iconfont{
		  position:relative;
		  padding-left:10px;
		  padding-right:10px;
		  font-size:18px;
		  color:rgb(33, 33, 33);
		  opacity: .7;
	  }
	  .slice-enter-active .iconfont:after{
		  content:'';
		  width:1px;
		  background:#212121;
		  opacity:.2;
		  position:absolute;
		  right:0;
		  top:0;
		  bottom:0;
	  }
	  .slice-enter-active em{
		  display: inline-block;
		  padding-left: 10px;
		  font-style: normal;
		  font-size: 14px;
		  vertical-align: top;
	  }
	  .swiper-style2-div,.swiper-style3-div{
		  display:flex;
		/*  padding-left:10px; */
		  overflow:hidden;
	  }
	  .swiper-style2-div span{
		  margin-right:10px;
		  flex:1;
	  }
	  .swiper-style2-div span:last-child,.swiper-style3-div span:last-child{
		  margin-right:0;
	  }
	  .swiper-style3-div span{
		  margin-right:10px;
		  width:200px;
		  flex: 0 0 200px;
	  }
	  .btn-delete{
		  position:absolute;
		  right:10px;
		  cursor:pointer;
		}
		.imgLists-items li,.goodsLists-items li{
			position:relative;
			display:inline-block;
			margin-right:10px;
			margin-bottom:10px;
			width:100px;
			border:1px solid #f3f3f3;
			cursor:pointer;
			vertical-align:top;
		}
		.imgLists-items li.active b,.goodsLists-items li.active b{
			display:inline-block;
		}
		.imgLists-items li em{
			display:inline-block;
			width:100%;
			height:100px;
		}
		.imgLists-items li b,.goodsLists-items li b{
			display:none;
			position:absolute;
			left:0;
			top:0;
			z-index:2;
			width:100%;
			height:100%;
			background:rgba(0,0,0,.4);
			text-align:center;
		}
		.imgLists-items li i,.goodsLists-items li i{
			font-size:36px;
			color:#fff;
			line-height: 100px;
		}
		.goodsLists-items .img-box{
			display: inline-block;
			margin: 5px;
			width: 90px;
			height: 90px;
		}
		.goods-name{
			padding: 0 4px;
			line-height: 32px;
			font-size: 12px;
			box-sizing: border-box;
			border-top: 1px dashed #e3e3e3;
		}
		.goods-item-div{
			line-height:30px;
		}
		.goods-item-div .el-checkbox{
			margin-top:8px;
		}
		.btn-addGoods{
			padding: 7px 7px !important;
			color: #2589ff !important;
			font-size: 12px !important;
			border: 0 !important;
		}
		
		.addGoods-module{
			padding:10px;
			background:#f0f2f5;
		}
		.goods-price .rmb,.goods-price .pri{
			font-size:15px;
		}
		.goods-price .dot-pri,.goods-price .ori-pri{
			font-size:13px;
		}
		.goods-price .rmb,.goods-price .pri,.goods-price .dot-pri{
			font-weight:bold;
			color:#fa6868;
		}
		.goods-tit{
			padding-bottom: 6px;
			font-size: 14px;
			color: #383d41;
		}
		.goods-text-module{
			padding-top:10px;
		}
		.goods-text-module del{
			margin-left: 4px;
			color:#9e9e9e;
		}
		.goods-text-module .icon-cart{
			font-size:20px;
			color:#fa6868;
		}
		.goods-sale span{
			display: inline-block;
			margin-right: 4px;
			vertical-align: top;
			line-height: 22px;
		}
		.goods-items-style2{
			padding:10px 10px 0 0;
			overflow:hidden;
		}
		.goods-items-style2 li{
			display:inline-block;
			padding-left:10px;
			width:50%;
			vertical-align:top;
			box-sizing:border-box;
		}
		.goods-text{
			padding:10px;
		}
		.goods-sale-style2{
			color:#9e9e9e;
		}
		.goods-items-style2 .icon-cart{
			font-size:18px;
		}
		.goods-items-style4 li{
		/* 	display:flex; */
			display: box;
			display: -webkit-box;
			margin-bottom:10px;
		}
		.goods-items-style4 img{
			width:100px;
			height:100px;
		}
		.goods-items-style4 .goods-text{
			padding-top:0;
			padding-bottom:0;
			box-flex: 1;
			-webkit-box-flex: 1;
		}
		.goods-items-style4 .goods-text-module{
			padding-top:26px;
		}
		.goods-items-style5 {
			overflow:hidden;
		}
		.goods-items-style5 li{
			width:100px;
			flex-shrink: 0;
		}
		.goods-items-style5 .goods-tit{
			font-size:12px;
		}
		.right-goods-lists li{
			position:relative;
			display:inline-block;
			margin-right:8px;
			width:56px;
			height:56px;
			vertical-align:top;
		}
		.right-goods-lists li span{
			display:inline-block;
			width:100%;
			height:100%;
		}
		.right-goods-lists li i{
			display:none;
			position:absolute;
			right:0;
			top:0;
			cursor:pointer;
		}
		.right-goods-lists li.active i{
			display:inline-block;
		}
		.goods-default-img{
			padding:10px;
			padding-bottom:0;
			box-sizing:border-box;
		}
		.btn-goods{
			margin-top:-3px !important;
			padding: 0 !important;
			line-height: 30px !important;
			height: 30px;
			width: 86px;
			font-size: 12px !important;
			color: #fff !important;
			background: #fd3d53 !important;
			border: none !important;
			border-radius: 2px !important;
			vertical-align: top;
		}
		.img-box{
			display:inline-block;
			width: 100%;
			height: 166px;
		}
		.goods-items-style2 .img-box{
			height:166px;
		}
		.goods-items-style3 .img-box{
			height:107px;
		}
		.goods-items-style3 li{
			width:33.3%;
		}
		.goods-items-style3 .goods-text,.goods-items-style5 .goods-text{
			padding:10px 0;
		}
		.goods-items-style4 li .img-box{
			display:inline-block;
			width:100px;
			height:100px;
		}
		.goods-items-style5 li .img-box{
			display:inline-block;
			width:90px;
			height: 90px;
		}
		.article-items .li h5{
			display: flex;
			justify-content:space-between;
			padding-left:10px;
			cursor:pointer;
		}
		.article-items .li:hover{
			background:#fff;
		}
		.article-items .li b{
			display:inline-block;
			width: 40px;
			height:40px;
			border-radius:4px;
			vertical-align:middle;
		}
		.article-items .li em{
			font-size:12px;
			color:#595961;
			line-height:40px;
			width:80%;
		}
		.article-items .li i{
			padding-right:10px;
			font-size:12px;
			color:#9797a1;
			line-height:40px;
		}
		.article-items .li span i{
			font-size: 16px;
			vertical-align: middle;
		}
		.articleLists-items li{
			position:relative;
			display: inline-block;
			margin-right: 10px;
			margin-bottom: 10px;
			width: 194px;
			border: 1px solid #bedcff;
			padding: 5px 7px;
			border-radius: 3px;
			cursor:pointer;
			
		}
		.articleLists-items li .article-name{
			padding-left:10px;
			line-height:30px;
			font-size:12px;
		}
		.articleLists-items li i{
			display:none;
			position:absolute;
			right:0;
			bottom:0;
		}
		.articleLists-items li.active i {
		    display: inline-block;
		    font-size: 12px;
		    z-index: 2;
		    color:#fff;
		    width: 14px;
		    text-align: center;
		}
		.articleLists-items li.active i:after {
		    content: "";
			border-width: 16px;
			border-style: solid;
			border-color: transparent transparent transparent #2589ff;
			position: absolute;
			left: 1px;
			bottom: -16px;
			z-index: -1;
			transform: rotate(45deg);
		}
		.article-ul li{
			margin:10px;
		}
		.article-ul li h5{
			margin-top: 5px;
			font-size: 16px;
			color:#333;
			line-height:36px;
		}
		.article-ul li p{
			display:flex;
			justify-content:space-between;
		}
		.article-ul li p span{
			font-size:12px;
			color:#666;
		}
		.article-ul li p b{
			font-size:12px;
			color:#999;
		}
		.img-box{
			display:inline-block;
			width:100%;
			height:165px;
			background:url(../images/defaultImg.png) no-repeat center;
			background-size:cover;
		}
		.moduleArticle .nav-style1{
			background:url(../images/diy/article-style1.png) no-repeat center;
			background-size:contain;
		}
		.moduleArticle .nav-style2{
			background:url(../images/diy/article-style2.png) no-repeat center;
			background-size:contain;
		}
		.article-ul.style2 li{
			display:flex;
			padding-bottom:10px;
			border-bottom:1px solid #e0e0e0;
		}
		.article-ul.style2 li:last-child{
			border:0;
		}
		.article-ul.style2 .article-text{
			display:flex;
			flex:1;
			justify-content:space-between;
			flex-direction:column;
			padding-right:10px;
		}
		.article-ul.style2 li .img-box{
			width:120px;
			height:90px;
		}
		.article-ul.style2 li h5{
			font-size: 14px;
			color: #333;
			line-height: 22px;
		}
		.articleLists-items .img-box{
			display:inline-block;
			width:40px;
			height:40px;
			border-radius:4px;
		}
		.video-default-img{
			display: inline-block;
			width: 100%;
			height: 180px;
			background: url(../images/diy/video.png) no-repeat center;
			background-size: cover;
		}
		.video-avatar{
			width: 350px;
			height: 190px;
		}
		/* .video-module{
			padding: 0 10px;
			background: #000;
			margin: 0 10px;
		}*/
		.video-source{
			margin-bottom: 10px;
			padding: 10px;
			background: #f0f2f5;
			border-radius: 4px;
		}
		.video-source .tit{
			line-height:28px;
		}
		.video-out-module dl,.edit-module .li{
			padding: 10px;
			margin-bottom: 10px;
			background: #f0f2f5;
		}
		.video-out-module dl textarea{
			height: 80px;
		}
		.btn-sel-video-img{
			display:inline-block;
			width:100%;
			height:180px;
			line-height:180px;
			background:#fff;
			text-align:center;
		}
		.btn-sel-video-img i{
			font-size: 18px;
			color:#9797a1;
		}
		.text-tips{
			font-size:12px;
			color:#9797a1;
		}
		.upVideo-dl dt{
			width:60px;
			text-align:right;
		}
		.video-avatar{
			width:250px;
			height:150px;
		}
		.videoLists-items li{
			position:relative;
			width:200px;
		}
		.videoLists-items li .img-box{
			width:190px;
			height:120px;
		}
		.videoLists-items li p{
			line-height: 30px;
			padding: 0 6px;
			box-sizing: border-box;
		}
		.video-items .img-box{
			display:inline-block;
			width: 320px;
			height:180px;
		}
		.video-items li{
			margin-bottom:10px;
			padding:10px;
			background:#f0f2f5;
		}
		.video-cover-img img{
			display: inline-block;
			margin-top: 65px;
			width:50px;
			line-height:190px;
			cursor:pointer;
		}
		.right-module-bg .li{
			margin-bottom: 10px;
			padding: 15px 10px 10px;
			background: #f0f2f5;
			border-radius: 4px;
		}
		.video-icon{
			display:inline-block;
			position: absolute;
			left: 50%;
			top: 50%;
			-webkit-transform: translate(-50%,-50%);
			transform: translate(-50%,-50%);
			width: 60px;
			height: 60px;
			background:url(../images/diy/play.png) no-repeat center;
			background-size: cover;
			margin-top:-10px;
		}
		.videoLists-items li i{
			line-height:140px;
		}
		.activity-head-tabs{
			display: flex;
			justify-content: space-between;
			align-items: center;
			width: 100%;
			height: 60px;
			text-align: center;
			overflow:hidden;
		}
		.activity-head-tabs h5{
			font-size: 14px;
		}
		.activity-head-tabs.li-two li{
			width:50%;
			border-right: 1px solid #ededed;
		}
		.activity-head-tabs.li-two li:last-child{
			border-right:0;
		}
		.activity-head-tabs.li-two li.active h5{
			color:#ef1033;
		}
		.activity-head-tabs.li-more li{
			min-width: 90px;
		}
		.activity-goods-items li{
			position:relative;
			margin-bottom:10px;
		}
		.activity-goods-items li:last-child{
			/* margin-bottom:0; */
		}
		.activity-goods-items li .img-box{
			display:inline-block;
			width:100px;
			height:100px;
		}
		.activity-goods-items li .activity-text-text{
			display: inline-block;
			margin-left:10px;
			position:relative;
			width: 205px;
			height:100px;
			vertical-align: top;
		}
		.activity-module{
			margin: 0 15px;
			padding-left:10px;
			padding-right:10px;
			box-shadow: 0 0 13px 4px rgba(73,73,73,.05);
		}
		.activity-module.border{
			border:1px solid #e0e0e0;
			box-shadow:none;
		}
		.activity-module.radius{
			border-radius:4px;
		}
		.activity-text-text .tit{
			display: inline-block;
			margin-bottom: 6px;
			font-size: 14px;
			color: #212121;
			line-height: 24px;
			width:100%;
		}
		.activity-text-text .total-group{
			display: inline-block;
			margin-top: 4px;
			line-height: 24px;
			font-size:12px;
			color:#999;
		}
		.activity-btn{
			padding: 7px 15px !important;
			font-size: 12px !important;
			color: #fff !important;
			border-radius: 2px !important;
			border: 0 !important;
			background: #f53d53 !important;
		}
		.goods-desc{
			position: absolute;
			border: 0;
			width: 100%;
			bottom:6px;
		}
		.goods-desc .sale-price{
			font-family: -webkit-body;
			font-size: 14px;
			font-weight: bold;
			line-height: 26px;
		}
		.total-progress .el-progress__text{
			display:none;
		}
		.discount-style1{
			   background:url(../images/diy/goods-style4.png) no-repeat center;
			   background-size:contain;
		}
		.discount-style2{
			   background:url(../images/diy/goods-style5.png) no-repeat center;
			   background-size:contain;
		}
		.activity-goods-items.style2 li{
			display:inline-block;
			width:149px;
		}
		.activity-goods-items.style2 li:nth-child(even){
			margin-left:20px;
		}
		.activity-goods-items.style2 li .img-box{
			width: 100%;
			 height: 149px;
		}
		.activity-goods-items.style2 li .goods-desc{
			position:relative;
			bottom:-6px;
		}
		.activity-goods-items.style2 li .iconfont{
			font-size:20px;
		}
		.activity-goods-items.style2 li .sale-price{
			font-size:18px;
		}
		.activity-active{
			color:#2589ff;
		}
		.curActivity b{
			display:inline-block;
			background:#fd3d53;
			color:#fff;
		}
		.curActivity{
			font-size:12px;
			color:#fd3d53;
		}
		.activity-header-specical{
			padding: 15px 0 10px;
			margin-bottom: 10px;
			border-bottom: 1px solid #e3e3e3;
		}
		.activity-header-specical dt{
			font-size:14px;
			font-weight:bold;
			color:#000;
		}
		.activity-header-specical dd{
			font-size:12px;
		}
		.activity-header-specical b{
			display: inline-block;
			margin: 0 3px;
			background: #2e2d48;
			border-radius: 2px;
			color: #fff;
			line-height: 16px;
			padding: 0 2px;
		}
		.activity-goods-items.style2 li .activity-text-text{
			margin-bottom:10px;
			width: 140px;
			height:auto;
		}
		.activity-goods-items.style2 li .goods-desc{
			width: 150px;
			right: 4px;
		}
		.activity-end{
			margin-top: 70px;
			padding-bottom: 35px;
			font-size: 14px;
			color: #9e9e9e;
			text-align: center;
		}
		.scroll_right{
			position: absolute;
			top: 0;
			right: 0;
			width: 50px;
			height: 60px;
			z-index: 100;
			pointer-events: none;
			background-image: -webkit-gradient(linear,left top,right top,from(hsla(0,0%,100%,0)),color-stop(92%,#fff));
			background-image: linear-gradient(90deg,hsla(0,0%,100%,0),#fff 92%);
		}
		.underline-price{
			font-size:12px;
			color:#9e9e9e;
			text-decoration: line-through;
		}
		.activity-title{
			font-weight: bold;
			font-size: 14px;
			line-height: 40px;
		}
		.total-people{
			display:inline-block;
			padding:0 3px;
			font-size:12px;
			color:#fd3d53;
			line-height:20px;
			background-color: rgba(239, 16, 51, 0.1);
		}
		.el-form-item__label{
			line-height: 30px !important;
		}
		.el-form-item{
			margin-bottom:10px !important;
		}
		.el-input__inner{
			line-height:30px !important;
			height:30px !important;
		}
		.page-tit.border input{
			border:1px solid #fd3d53;
		}
		
		/* 底部导航 */
		.nav-box{
			position: absolute;
			bottom: 0;
			width: 100%;
			top: 70px;
			background: #f2f2f6;
			padding: 20px;
			box-sizing:border-box;
			overflow:auto;
		}
		.nav-box .tit{
			position: absolute;
			left: 0;
			top: 32px;
			width: 100%;
			font-size: 16px;
			font-weight: bold;
			color: #444;
			text-align: center;
		}
		.mobile-model{
			position:relative;
			display:inline-block;
			width:375px;
			height:100%;
			background:#fff;
		}
		.mobile-model .header{
			display:inline-block;
			width:100%;
		}
		.mobile-footer{
			position:absolute;
			left:0;
			bottom:0;
			z-index:2;
			width:100%;
			border-top:1px solid #e1e1e1;
		}
		.mobile-footer ul{
			display:flex;
			justify-content:space-around;
			text-align:center;
		}
		.mobile-footer img{
			margin-top:5px;
			width:24px;
			height:24px;
		}
		.nav-operate{
			margin-left:30px;
			max-width:627px;
		}
		.operate-tips{
			padding: 10px 18px;
			font-size: 12px;
			color: #595961;
			line-height: 20px;
			background: #fff7ee;
			border: 1px solid #ffe6c6;
			border-radius: 4px;
			white-space: pre-wrap;
		}
		.nav-color{
			margin-top:10px;
			padding:5px 14px;
			background:#fff;
		}
		.nav-color .title{
			display:inline-block;
			margin-right:20px;
			font-size:12px;
			color:#444;
		}
		.color-circle{
			display:inline-block;
			border-radius: 8px;
			width: 12px;
			height: 12px;
			margin-top: 7px;
			border: 2px solid #fff;
		}
		.circle .color-circle:nth-child(2){
			margin-left: -6px;
			background:#999;
		}
		.nav-num{
			margin-top:10px;
		}
		.nav-num li{
			display:inline-block;
			margin-bottom:10px;
			margin-right: 10px;
			width:200px;
			border: 1px solid #e3e2e5;
			vertical-align:top;
		}
		.nav-num li:nth-child(3n){
			margin-right:0;
		}
		.nav-num li h5{
			display: flex;
			justify-content:space-between;
			padding: 0 19px 0 9px;
			width:100%;
			height: 39px;
			background: #efefef;
			border-radius: 4px 4px 0 0;
			line-height: 39px;
			box-sizing:border-box;
		}
		.nav-num li .cont{
			padding:20px 10px 10px 8px;
			background:#fff;
		}
		.nav-num li .cont dl{
			display:flex;
			margin-bottom:15px;
			font-size:12px;
			color:#595961;
		}
		.nav-num li .cont dl:last-child{
			margin-bottom:0;
		}
		.nav-num li .cont dl dt{
			width:46px;
		}
		.nav-num li .cont dl dt:after{
			content:'';
			width: 4px;
			height: 4px;
			border-radius: 2px;
			background-color: #ff5050;
			display: inline-block;
			vertical-align: middle;
			margin-left: 4px;
		}
		.nav-num li .cont dl dd{
			display:inline-block;
			width:140px;
		}
		el-input{
			padding:4px 11px;
			border:1px solid #e3e2e5;
			width:140px;
			height: 32px;
			box-sizing:border-box;
		}
		.el-input input{
			box-sizing:border-box;
		}
		.icon-div div{
			display:inline-block;
			margin-right: 10px;
			width:38px;
			height:38px;
			border:1px solid #e3e2e5;
			border-radius: 4px;
		}
		.icon-div div img{
			width:100%;
		}
		.btn-add-nav{
			display:inline-block;
			background: #fff;
			border: 1px dashed #e3e2e5 !important;
			border-radius: 4px;
			font-size: 12px;
			color: #595961;
			cursor: pointer;
			width: 210px;
			height: 60px;
			line-height: 60px;
			text-align: center;
		}
		.nav-num .el-icon-close{
			font-size:22px;
			color:#ddd;
			line-height:39px;
		}
		.edit-link{
			display:flex;
			justify-content:space-between;
			padding:5px 10px !important;
			width:100%;
			border:1px solid #DCDFE6;
			box-sizing:border-box;
			border-radius:4px;
			/* background:#fff !important;
			width:auto; */
		}
		.edit-link:hover{
			border-color:#409EFF;
			cursor:pointer;
		}
		.edit-link:hover .btn{
			color:#409EFF;
		}
		.btn-edit-cl{
			border:0;
		}
		.color-lists span{
			display:inline-block;
			margin-right:15px;
			width:20px;
			height:20px;
			border-radius:4px;
			text-align:center;
			vertical-align:top;
		}
		.color-lists span i,.un-sel i{
			color:#fff;
		}
		.color-dialog-tit{
			margin-bottom:15px;
		}
		.color-lists dl{
			margin-bottom:20px;
		}
		.color-lists dt{
			margin-right:10px;
		}
		.un-sel{
			background-color:rgb(178, 177, 175);
		}
		.btn-sel-icon{
			padding-top:0 !important;
		}
		.icons-dl dt{
			margin-bottom:5px;
			font-size: 12px;
			color:#555;
		}
		.icons-dl dd li{
			position:relative;
			display:inline-block;
			margin-right: 24px;
			margin-bottom:20px;
			width:40px;
			height:40px;
			vertical-align:top;
			border: 1px solid #e0e0e0;
			border-radius: 4px;
			overflow:hidden;
			box-sizing:border-box;
		}
		.icons-dl dd li:last-child{
			margin-right:0;
		}
		.icons-dl dd li img{
			width:100%;
		}
		.icons-dl dd li i{
			display: none;
			position: absolute;
			right: 0;
			bottom: 0;
			width: 14px;
			height: 14px;
			transition: background-image 1s linear;
			background:url(../images/diy/yes.png) no-repeat center;
			background-size: 14px 14px;
		}
		.icons-dl dd li.active{
			border:1px solid #2589ff;
		}
		.icons-dl dd li.active i{
			display:block;
		}
		.nav-dialog .el-dialog__body{
			padding-top:0 !important;
		}
		.nav-name-overflow{
			white-space: nowrap;
			max-width: 89px;
			overflow: hidden;
			text-overflow: ellipsis;
		}
		/* 主题色系 */
		.theme-module{
			display:inline-block;
			padding: 20px;
			background: #fff;
			border-radius: 6px;
			box-sizing:border-box;
			vertical-align: top;
		}
		.theme-module.center{
			margin-left:10px;
		}
		.theme-box .left{
			width:360px;
			height:620px;	
		}
		.theme-box h4{
			margin-bottom:10px;
			font-size:12px;
			font-weight:bold;
		}
		.theme-box .radios{
			margin-bottom:20px;
		}
		.theme-box .item{
			margin-bottom: 20px;
			padding-bottom: 20px;
			border-bottom: 1px solid #f3f3f3;
		}
		.theme-box .item:last-child{
			border:0;
		}
		.color-card{
			display:inline-block;
			border-radius:4px;
			border:1px solid #e3e3e3;
			font-size:0;
			overflow:hidden;
		}
		.color-card i{
			display:inline-block;
			width:24px;
			height:24px;
		}
		.color-picker{
			display:inline-block;
			padding:2px 8px 2px 2px;
			background:#eee;
			height: 26px;
			box-sizing: border-box;
			line-height: 26px;
			border-radius:4px;
			overflow:hidden;
		}
		.color-picker em{
			display:inline-block;
			vertical-align: top;
		}
		.color-picker .el-color-picker--mini{
			width:22px;
			height:22px;
		}
		.color-picker .el-color-picker--mini .el-color-picker__trigger{
			width: 100% !important;
			height:100% !important;
			padding:0 !important;
			border:0 !important;
		}
		.color-picker .el-color-picker__color{
			border:0 !important;
		}
		.cont-color-select em{
			display:inline-block;
			margin:2px;
			width:24px;
			height:24px;
			line-height: 22px;
			border:1px solid #e3e3e3;
			border-radius:4px;
			box-sizing:border-box;
			text-align:center;
			vertical-align:top;
		}
		.cont-color-select em:first-child{
			background:#fff;
		}
		.cont-color-select em i{
			font-size:12px;
		}
		.cont-color-select em:first-child i{
			color:#409EFF;
		}
		.cont-color-select em:last-child{
			background:#000;
		}
		.cont-color-select em:last-child i{
			color:#fff;
		}
		.theme-demo-item{
			display:inline-block;
			width:300px;
			font-size:0;
			border:1px solid #e3e3e3;
		}
		.theme-demo-item .header-bg{
			display:inline-block;
			width:100%;
			height:51px;
			background-size:contain;
		}
		.theme-demo-item .detail-page{
			position:relative;
			display:inlien-block;
			width:100%;
			height:482px;
			background:url(../../common/images/theme/bg-1.png) no-repeat center top;
			background-size:contain;
		}
		.middle-det-bg{
			display:inline-block;
			width:100%;
			height:76px;
			background-image: url(../../common/images/theme/middle-1.png);
			background-size:100%;
			background-repeat:no-repeat;
		}
		.middle-det-bg{
			position:absolute;
			left:0;
			top:213px;
		}
		.bottom-button-bg{
			position:absolute;
			right:0;
			bottom:0;
		}
		.bottom-button-bg button{
			display:inline-block;
			width:89px;
			height:39px;
			line-height:39px;
			font-size:12px;
			color:#fff;
			text-align:center;
			border:0;
		}
		.btn-selCol{
			padding:0 !important;
			border:0 !important;
		}
		.tits{
			border-bottom: 1px solid #e3e3e3;
			padding-bottom: 10px;
			margin-bottom: 10px;
		}
		.pop-cont{
			padding:20px 14px;
		}
		.pop-cont .color-card{
			margin-right:4px;
		}