@charset "UTF-8";
.diySidex {
  width: 250px;
  height: calc(100vh - 56px);
  border-right: 1px solid rgb(225, 225, 225);
  box-sizing: border-box;
  background: #fff;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.diySidex .maxImg {
  width: 300px;
  background: #fff;
  position: absolute;
  top: 106px;
  left: 300px;
  box-shadow: 0 0 10px 0px #000;
  z-index: 999;
}
.diySidex .maxImg img {
  max-width: 100%;
  max-height: 100%;
}
.diySidex .left {
  width: 60px;
  background: #3d3d3d;
}
.diySidex .left .leftli {
  padding: 10px 0 3px;
}
.diySidex .left .leftli p {
  font-size: 12px;
  font-weight: 400;
  color: rgb(255, 255, 255);
  line-height: 32px;
  text-align: center;
}
.diySidex .left .leftli img {
  width: 20px;
  height: 20px;
  display: block;
  margin: auto;
}
.diySidex .left .leftlis {
  background: #58585d;
}
.diySidex .right {
  background: #fff;
  width: 100%;
  height: calc(100vh - 56px);
  overflow-y: auto;
}
.diySidex .right .loading-mask-img {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 12px;
}
.diySidex .el-tabs__nav-scroll {
  background: #000;
}
.diySidex .el-tabs--left {
  color: #fff;
}
.diySidex .el-tabs__item.is-left {
  color: rgb(173, 172, 172);
}
.diySidex .el-tabs__item.is-left.is-active {
  color: #fff;
}
.diySidex .imgAll {
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
}
.diySidex .imgAll .imgAll_nav {
  height: 40px;
}
.diySidex .imgAll .imgLi {
  margin-bottom: 10px;
  background: #fff;
  width: 100%;
  border: 1px solid #a59f9f;
  height: 60px;
  display: flex;
  align-items: center;
  position: relative;
}
.diySidex .imgAll .imgLi img {
  align-items: center;
  display: block;
  margin: auto;
  max-width: 100%;
  max-height: 100%;
}
.diySidex .imgAll .listBtn {
  margin-bottom: 10px;
}
.diySidex .imgAll .listBtn .listBtn_li {
  cursor: pointer;
  padding: 5px;
  background: #d8d8d8;
  margin: 5px 5px 0 0;
  text-align: center;
  border-radius: 5px;
  display: inline-block;
  color: #2c3e50;
  font-size: 12px;
}
.diySidex .imgAll .listBtn .listBtn_lis {
  background: #0086ff;
  color: #ffffff;
}
.diySidex .upImg .upImgDiv {
  margin: 20px auto;
  width: 100%;
  height: 400px;
  background-image: -webkit-linear-gradient(left top, #fff, #fff7f7, #fff, #fffafa, #ffffff, #fbf5f5);
  text-align: left;
  border: 1px solid #ddd;
  color: #066ad1;
  overflow-y: auto;
  font-size: 12px;
  font-family: 宋体;
  padding: 10px;
  box-sizing: border-box;
}
.diySidex .upImg .upImgDiv .imgLi {
  margin-bottom: 10px;
  background: #fff;
  width: 100%;
  border: 1px solid #a59f9f;
  height: 100px;
  display: flex;
  align-items: center;
}
.diySidex .upImg .upImgDiv .imgLi img {
  align-items: center;
  display: block;
  margin: auto;
  max-width: 100%;
  max-height: 100%;
}
.diySidex .xiangce .upImgDiv {
  margin: 20px auto;
  width: 100%;
  height: 400px;
  background-image: -webkit-linear-gradient(left top, #fff, #fff7f7, #fff, #fffafa, #ffffff, #fbf5f5);
  text-align: left;
  border: 1px solid #ddd;
  color: #066ad1;
  overflow-y: auto;
  font-size: 12px;
  font-family: 宋体;
  padding: 10px;
  box-sizing: border-box;
}
.diySidex .xiangce .upImgDiv .imgLi {
  margin-bottom: 10px;
  background: #fff;
  width: 100%;
  border: 1px solid #a59f9f;
  height: 100px;
  display: flex;
  position: relative;
  margin-bottom: 20px;
  align-items: center;
}
.diySidex .xiangce .upImgDiv .imgLi p {
  width: 100%;
  position: absolute;
  bottom: -15px;
}
.diySidex .xiangce .upImgDiv .imgLi .imgLis {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #1e83e2;
  opacity: 0.3;
}
.diySidex .xiangce .upImgDiv .imgLi .delBtn {
  position: absolute;
  top: 5px;
  right: 5px;
}
.diySidex .xiangce .upImgDiv .imgLi img {
  align-items: center;
  display: block;
  margin: auto;
  max-width: 100%;
  max-height: 100%;
}
.diySidex .floatImg {
  background: #fff;
  border: 1px solid #a59f9f;
  height: 60px;
  display: flex;
  align-items: center;
  position: fixed;
  z-index: 999;
  top: 0;
  pointer-events: none;
  left: 0;
}
.diySidex .floatImg img {
  align-items: center;
  display: block;
  margin: auto;
  max-width: 100%;
  max-height: 100%;
}
@charset "UTF-8";
.footerC[data-v-1b41da19] {
  width: calc(100vw - 600px);
  margin-left: 50px;
  position: absolute;
  z-index: 2;
}
.footerC .footerC-li[data-v-1b41da19] {
  display: inline-block;
  min-width: 60px;
  text-align: center;
  margin: 5px 2px;
  line-height: 30px;
  background: #333;
  color: #eee;
  cursor: pointer;
}
.footerC .footerC-li .slt[data-v-1b41da19] {
  border: 1px solid #000;
  height: 100px;
  display: block;
  background: #bbb;
  top: 0px;
}
.footerC .footerC-li .slt > div > div[data-v-1b41da19] {
  margin: auto;
  display: block;
}
.footerC .addP[data-v-1b41da19] {
  font-size: 25px;
  text-align: center;
}
.footerC .navBool[data-v-1b41da19] {
  background: #0086ff !important;
  color: #ffffff !important;
}
.footerC .propertyNav_btn[data-v-1b41da19] {
  cursor: pointer;
}
.leftBtn[data-v-1b41da19] {
  position: absolute;
  top: 35%;
  left: 20px;
  opacity: 0.5;
  cursor: pointer;
  width: 50px;
  background: #6f6f6f;
  line-height: 30px;
  border-radius: 5px;
  font-size: 16px;
  color: #ffffff;
  padding: 5px;
  z-index: 2;
}
.rightBtn[data-v-1b41da19] {
  padding: 5px;
  color: #ffffff;
  font-size: 16px;
  border-radius: 5px;
  line-height: 30px;
  background: #6f6f6f;
  cursor: pointer;
  position: absolute;
  opacity: 0.5;
  top: 35%;
  width: 50px;
  right: 280px;
  z-index: 2;
}
.diyContentBox[data-v-1b41da19] {
  padding-bottom: 30px;
  position: relative;
  height: 100%;
}
.diyContentBox .uncheck-status[data-v-1b41da19] {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}
.diyContentBox #dragBOX[data-v-1b41da19] {
  position: relative;
  z-index: 2;
}
.diyContentBox .frameNum[data-v-1b41da19] {
  background: #0086ff;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: absolute;
  top: -20px;
  z-index: 99999;
  text-align: center;
  line-height: 50px;
}
.diyContentBox .hover[data-v-1b41da19] {
  cursor: pointer;
}
.diyContentBox .heng[data-v-1b41da19] {
  width: 100%;
  height: 2px;
  background: rgb(76, 219, 245);
  position: absolute;
  top: 5px;
  left: 5px;
  cursor: move;
  opacity: 0;
}
.diyContentBox .zong[data-v-1b41da19] {
  width: 2px;
  height: 100%;
  background: rgb(76, 219, 245);
  top: 5px;
  position: absolute;
  left: 5px;
  cursor: move;
  opacity: 0;
}
.property[data-v-1b41da19] {
  position: absolute;
  padding: 5px;
  top: 0;
  right: 0;
  width: 250px;
  height: calc(100vh - 60px);
  overflow: auto;
  background: #f0f0f0;
  z-index: 999;
}
.property .is-fixedP[data-v-1b41da19] {
  padding: 10px;
  font-size: 12px;
  border-top: 1px solid rgb(196, 196, 196);
}
.property .is-fixedP .el-input[data-v-1b41da19] {
  width: 55px;
}
.property h1[data-v-1b41da19] {
  color: #323232;
  margin: 10px 10px 2px;
  font-size: 13px;
}
.property .allListCz[data-v-1b41da19] {
  width: 20px;
  cursor: pointer;
  border: 1px dashed #c4c4c4;
}
.property .allListCz[data-v-1b41da19]:hover {
  border: 1px dashed #0086ff;
}
.property .ptitle[data-v-1b41da19] {
  text-align: left;
  margin-left: 10px;
}
.property .propertyBox[data-v-1b41da19] {
  position: relative;
}
.property .propertyBox .property-li-err[data-v-1b41da19] {
  position: absolute;
  cursor: pointer;
  right: 20px;
  z-index: 10;
}
.property .property-ul h1[data-v-1b41da19] {
  background: rgb(121, 120, 120);
  text-align: left;
  font-size: 18px;
  color: #f0f0f0;
  padding-left: 20px;
}
.property .property-ul > .property-content[data-v-1b41da19] {
  padding: 5px 0px 5px 5px;
}
.property .property-ul > .property-content .title[data-v-1b41da19] {
  text-align: center;
}
.property .propertyNav[data-v-1b41da19] {
  cursor: pointer;
  margin-top: 10px;
  padding: 0px 10px 5px;
  overflow: hidden;
}
.property .propertyNav div[data-v-1b41da19] {
  width: 88px;
  height: 23px;
  background: #d8d8d8;
  line-height: 23px;
  text-align: center;
  margin: 4px;
  float: left;
  color: #6f6f6f;
  font-size: 12px;
  position: relative;
}
.property .propertyNav .addP[data-v-1b41da19] {
  width: auto;
  font-size: 20px;
  background: transparent;
}
.property .propertyNav .addP[data-v-1b41da19]:hover {
  color: #0086ff;
}
.property .propertyNav_btn[data-v-1b41da19] {
  height: 40px;
  padding-top: 10px;
  padding-left: 10px;
  display: block;
  border-top: 1px solid #c4c4c4;
}
.property .navBool[data-v-1b41da19] {
  background: #0086ff !important;
  color: #ffffff !important;
}
.property .shuzhi[data-v-1b41da19] {
  padding-left: 20px;
  text-align: left;
}
.property .property-btn[data-v-1b41da19] {
  overflow: hidden;
  padding: 10px;
}
.property .property-btn img[data-v-1b41da19] {
  width: 100%;
}
.property .property-btn .property-lis[data-v-1b41da19] {
  text-align: center;
  font-size: 10px;
}
.property .property-li[data-v-1b41da19] {
  padding-left: 20px;
  text-align: left;
  cursor: pointer;
}
.property .property-li[data-v-1b41da19]:hover {
  color: turquoise;
}
.property .property-li-err[data-v-1b41da19] {
  padding-left: 10px;
  line-height: 30px;
  text-align: left;
  cursor: pointer;
  margin-bottom: 10px;
}
.property .property-li-err[data-v-1b41da19]:hover {
  color: #f82e2e;
}
.content .div[data-v-1b41da19] {
  cursor: move;
}
.content .div .index[data-v-1b41da19] {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  display: flex;
  opacity: 0.8;
  justify-content: center;
  /*x轴对齐方式*/
  align-items: center;
  /*y轴对滴方式*/
  color: #fff;
  text-align: center;
}
.content .div .index span[data-v-1b41da19] {
  background: #646464;
  padding: 5px;
  border-radius: 50%;
  display: block;
}
.content .div .iall[data-v-1b41da19] {
  position: absolute;
  width: 80px;
  height: 80px;
  top: 50%;
  left: 50%;
  margin-top: -40px;
  margin-left: -40px;
  line-height: 20px;
}
.content .div .btnAdd[data-v-1b41da19] {
  position: absolute;
  font-size: 20px;
  top: 0%;
  right: 0%;
  background: #000;
  opacity: 0.5;
  color: #f0f0f0;
  border-radius: 50%;
  padding: 3px;
  cursor: pointer;
}
.content .div .btnDel[data-v-1b41da19] {
  font-size: 20px;
  top: 0%;
  background: #000;
  opacity: 0.5;
  color: #f0f0f0;
  border-radius: 50%;
  padding: 3px;
  left: 0%;
  position: absolute;
  cursor: pointer;
}
.content .div .btnXR[data-v-1b41da19] {
  font-size: 20px;
  bottom: 0%;
  background: #000;
  opacity: 0.5;
  color: #f0f0f0;
  border-radius: 50%;
  padding: 3px;
  right: 0%;
  position: absolute;
  cursor: pointer;
}
.content .div .btnXL[data-v-1b41da19] {
  background: #000;
  opacity: 0.5;
  color: #f0f0f0;
  border-radius: 50%;
  padding: 3px;
  font-size: 20px;
  bottom: 0%;
  left: 0%;
  position: absolute;
  cursor: pointer;
}
.content .div .rotate[data-v-1b41da19] {
  position: absolute;
  background: #000;
  color: #ffffff;
  right: -40px;
  top: 50%;
  border-radius: 50%;
  margin-top: -11px;
  padding: 3px;
  cursor: Move;
}
.content .div .footer[data-v-1b41da19] {
  position: absolute;
  width: 100px;
  height: 60px;
  background: #000;
  left: 0;
  bottom: -80px;
}
.content .div .el-icon-rank[data-v-1b41da19] {
  position: absolute;
  cursor: pointer;
  top: 50%;
  left: 50%;
  margin-left: -15px;
  margin-top: -15px;
  background: #000;
  opacity: 0.5;
  color: #f0f0f0;
  border-radius: 50%;
  padding: 3px;
}
.imgType[data-v-1b41da19] {
  width: 200px;
  height: 200px;
  position: absolute;
  border-radius: 40px;
  right: 400px;
  background: #000;
  cursor: move;
  opacity: 0.8;
  top: 300px;
}
.imgType i[data-v-1b41da19] {
  color: #f0f0f0;
  position: absolute;
  font-size: 60px;
  cursor: pointer;
}
.imgType i[data-v-1b41da19]:hover {
  color: aqua;
}
.imgType .btnL[data-v-1b41da19] {
  left: 0;
  margin-top: -30px;
  top: 50%;
}
.imgType .btnR[data-v-1b41da19] {
  right: 0;
  top: 50%;
  margin-top: -30px;
}
.imgType .btnB[data-v-1b41da19] {
  bottom: 0;
  left: 50%;
  margin-left: -30px;
}
.imgType .btnT[data-v-1b41da19] {
  top: 0;
  left: 50%;
  margin-left: -30px;
}
.imgType .btnAdd[data-v-1b41da19] {
  font-size: 30px;
  top: 40%;
  margin-top: -15px;
  right: 30%;
}
.imgType .btnDel[data-v-1b41da19] {
  font-size: 30px;
  top: 40%;
  margin-top: -15px;
  left: 30%;
}
.imgType .btnXR[data-v-1b41da19] {
  font-size: 30px;
  bottom: 30%;
  margin-top: -15px;
  right: 30%;
}
.imgType .btnXL[data-v-1b41da19] {
  font-size: 30px;
  bottom: 30%;
  margin-top: -15px;
  left: 30%;
}
.footer[data-v-1b41da19] {
  position: absolute;
  bottom: 10px;
  width: calc(100vw - 450px);
  right: 40px;
}
.diyContentBox .el-collapse-item__wrap {
  background-color: #f0f0f0;
}
.allSelect {
  border: 1px dashed rgb(22, 80, 240);
  position: absolute;
  background: rgba(17, 0, 243, 0.2);
}
.allSelect1 {
  border: 2px solid #000;
  position: absolute;
  display: none;
  background: transparent;
  z-index: 9999999;
  cursor: move;
}
.allSelect1 .rotate {
  position: absolute;
  bottom: -15px;
  border-radius: 50%;
  background: #000;
  color: #fff;
  right: -15px;
}
.allSelect1 .rotate i {
  font-size: 30px;
}
.diyContentBox .el-loading-spinner {
  top: 20%;
}
.diyContentBox .el-dialog__body {
  padding: 14px 20px;
}
.context-menu .menu_item__available {
  color: #000000;
  font-size: 16px;
}
.context-menu {
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.5) !important;
  border: 1px solid #f1f1f1;
  border-radius: 5px;
}
.upload-demo .el-upload-list {
  background: #f1f1f1;
}
.diyContentBox .el-loading-spinner {
  top: 35%;
}
.diyContentBox .el-loading-mask {
  font-size: 40px;
}
.diyContentBox .el-loading-mask .el-loading-spinner .el-loading-text {
  font-size: 23px;
  font-weight: bold;
}
.homeDiy {
  overflow: hidden;
  width: 100%;
  height: 100vh;
  background: #bbb;
}
.homeDiy .nav {
  height: 56px;
  background: #3d3d3d;
  box-sizing: border-box;
  overflow: hidden;
  color: #fff;
  display: flex;
}
.homeDiy .nav img {
  padding: 16px 60px 15px 100px;
  width: 90px;
}
.homeDiy .nav > div span {
  cursor: pointer;
  line-height: 56px;
  font-size: 16px;
  margin-right: 30px;
}
.homeDiy .left {
  float: left;
  height: calc(100vh - 56px);
}
.homeDiy .left ::-webkit-scrollbar {
  width: 10px;
  height: 15px;
}
@charset "UTF-8";
.diySidex {
  width: 250px;
  height: calc(100vh - 56px);
  border-right: 1px solid rgb(225, 225, 225);
  box-sizing: border-box;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.diySidex .maxImg {
  width: 300px;
  height: 300px;
  background: #fff;
  position: absolute;
  top: 106px;
  left: 300px;
  box-shadow: 0 0 10px 0px #000;
  z-index: 999;
}
.diySidex .maxImg img {
  max-width: 100%;
  max-height: 100%;
}
.diySidex .left {
  width: 60px;
  background: #3d3d3d;
}
.diySidex .left .leftli {
  padding: 10px 0 3px;
}
.diySidex .left .leftli p {
  font-size: 12px;
  font-weight: 400;
  color: rgb(255, 255, 255);
  line-height: 32px;
  text-align: center;
}
.diySidex .left .leftli img {
  width: 20px;
  height: 20px;
  display: block;
  margin: auto;
}
.diySidex .left .leftlis {
  background: #58585d;
}
.diySidex .right {
  background: #fff;
  width: 100%;
  height: calc(100vh - 56px);
  overflow-y: auto;
}
.diySidex .el-tabs__nav-scroll {
  background: #000;
}
.diySidex .el-tabs--left {
  color: #fff;
}
.diySidex .el-tabs__item.is-left {
  color: rgb(173, 172, 172);
}
.diySidex .el-tabs__item.is-left.is-active {
  color: #fff;
}
.diySidex .imgAll {
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
}
.diySidex .imgAll .selectedAllBtn {
  margin-bottom: 10px;
  font-size: 14px;
  display: flex;
  line-height: 16px;
  justify-content: space-between;
}
.diySidex .imgAll .selectedAllBtn .selectedbtn {
  display: flex;
  cursor: pointer;
}
.diySidex .imgAll .selectedAllBtn .selectedbtn i {
  z-index: 2;
  width: 14px;
  height: 14px;
  border: 1px solid #333333;
  border-radius: 100%;
  margin-right: 2px;
}
.diySidex .imgAll .selectedAllBtn .selectedbtn i.el-icon-check {
  font-size: 14px;
  color: #1e83e2;
  border: 1px solid #1e83e2;
}
.diySidex .imgAll .imgAll_nav {
  height: 30px;
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}
.diySidex .imgAll .imgAll_nav .el-button {
  padding: 7px 10px;
}
.diySidex .imgAll .imgLi {
  margin-bottom: 10px;
  background: #fff;
  width: 100%;
  border: 1px solid #a59f9f;
  height: 60px;
  display: flex;
  align-items: center;
  position: relative;
}
.diySidex .imgAll .imgLi .checkout {
  position: absolute;
  z-index: 2;
  bottom: 0;
  left: 0;
  width: 100%;
  line-height: 16px;
  background: rgba(0, 134, 255, 0.9);
  opacity: 0.9;
  color: rgb(255, 255, 255);
  text-align: center;
  font-size: 12px;
}
.diySidex .imgAll .imgLi img {
  align-items: center;
  display: block;
  margin: auto;
  max-width: 100%;
  max-height: 100%;
}
.diySidex .imgAll .imga {
  position: relative;
}
.diySidex .imgAll .imga i {
  position: absolute;
  cursor: pointer;
  left: 5px;
  top: 5px;
  z-index: 2;
  width: 18px;
  height: 18px;
  border: 1px solid #999999;
  border-radius: 100%;
  background: rgba(255, 255, 255, 0.75);
}
.diySidex .imgAll .imga i.el-icon-check {
  font-size: 18px;
  color: #ffffff;
  border: 1px solid #1e83e2;
  background: #1e83e2;
}
.diySidex .imgAll .imga i.el-icon-close {
  position: absolute;
  cursor: pointer;
  right: 5px;
  bottom: 50px;
  display: none;
  left: auto;
  top: auto;
  background: red;
  color: #ffffff;
  text-align: center;
  line-height: 18px;
  border: 0;
}
.diySidex .imgAll .imga:hover .el-icon-close {
  display: block;
}
.diySidex .imgAll .listBtn {
  margin-bottom: 10px;
}
.diySidex .imgAll .listBtn .listBtn_li {
  cursor: pointer;
  padding: 5px;
  background: #d8d8d8;
  margin: 5px 5px 0 0;
  text-align: center;
  border-radius: 5px;
  display: inline-block;
  color: #2c3e50;
  font-size: 12px;
}
.diySidex .imgAll .listBtn .listBtn_lis {
  background: #0086ff;
  color: #ffffff;
}
.diySidex .upImg .upImgDiv {
  margin: 20px auto;
  width: 100%;
  height: 400px;
  background-image: -webkit-linear-gradient(left top, #fff, #fff7f7, #fff, #fffafa, #ffffff, #fbf5f5);
  text-align: left;
  border: 1px solid #ddd;
  color: #066ad1;
  overflow-y: auto;
  font-size: 12px;
  font-family: 宋体;
  padding: 10px;
  box-sizing: border-box;
}
.diySidex .upImg .upImgDiv .imgLi {
  margin-bottom: 10px;
  background: #fff;
  width: 100%;
  border: 1px solid #a59f9f;
  height: 100px;
  display: flex;
  align-items: center;
}
.diySidex .upImg .upImgDiv .imgLi .el-image,
.diySidex .upImg .upImgDiv .imgLi .pageImgNotCheck {
  align-items: center;
  display: block;
  margin: auto;
  width: 100%;
  height: 100%;
}
.diySidex .xiangce .upImgDiv {
  margin: 20px auto;
  width: 100%;
  height: 400px;
  background-image: -webkit-linear-gradient(left top, #fff, #fff7f7, #fff, #fffafa, #ffffff, #fbf5f5);
  text-align: left;
  border: 1px solid #ddd;
  color: #066ad1;
  overflow-y: auto;
  font-size: 12px;
  font-family: 宋体;
  padding: 10px;
  box-sizing: border-box;
}
.diySidex .xiangce .upImgDiv .imgLi {
  margin-bottom: 10px;
  background: #fff;
  width: 100%;
  border: 1px solid #a59f9f;
  height: 100px;
  display: flex;
  position: relative;
  align-items: center;
}
.diySidex .xiangce .upImgDiv .imgLi .imgLis {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #1e83e2;
  opacity: 0.3;
}
.diySidex .xiangce .upImgDiv .imgLi .delBtn {
  position: absolute;
  top: 5px;
  right: 5px;
}
.diySidex .xiangce .upImgDiv .imgLi img {
  align-items: center;
  display: block;
  margin: auto;
  max-width: 100%;
  max-height: 100%;
}
.diySidex .floatImg {
  background: #fff;
  border: 1px solid #a59f9f;
  height: 60px;
  display: flex;
  align-items: center;
  position: fixed;
  z-index: 999;
  top: 0;
  pointer-events: none;
  left: 0;
}
.diySidex .floatImg img {
  align-items: center;
  display: block;
  margin: auto;
  max-width: 100%;
  max-height: 100%;
}
.loading-mask-img {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 12px;
}
.loading-mask-img i {
  width: auto;
  height: auto;
  border-radius: 0;
  margin: 0;
  border: 0 !important;
  display: inline;
}
.footerC[data-v-487840c8] {
  width: calc(100vw - 600px);
  margin-left: 50px;
  position: absolute;
  top: calc(100vh - 210px);
}
.footerC .footerC-li[data-v-487840c8] {
  display: inline-block;
  text-align: center;
  margin: 5px 5px;
  background: #333;
  color: #eee;
  cursor: pointer;
}
.footerC .footerC-li .slt[data-v-487840c8] {
  border: 1px solid #000;
  height: 100px;
  display: none;
  position: absolute;
  top: -120px;
}
.footerC .footerC-li .footerC-diyAll[data-v-487840c8] {
  position: relative;
}
.footerC .footerC-li .footerC-diyAll .footerC-li-error[data-v-487840c8] {
  width: 100%;
  height: 100%;
  background: rgba(235, 23, 8, 0.5);
  position: absolute;
  font-size: 12px;
  top: 0;
  left: 0;
}
.footerC .footerC-li:hover .slt[data-v-487840c8] {
  /*display: block;*/
}
.footerC .addP[data-v-487840c8] {
  font-size: 25px;
  text-align: center;
}
.footerC .navBool[data-v-487840c8] {
  border: 2px solid #0086ff !important;
  background: #0086ff !important;
  color: #ffffff !important;
}
.footerC .propertyNav_btn[data-v-487840c8] {
  cursor: pointer;
}
.leftBtn[data-v-487840c8] {
  position: absolute;
  top: 35%;
  left: 20px;
  opacity: 0.5;
  cursor: pointer;
  width: 50px;
  background: #6f6f6f;
  line-height: 30px;
  border-radius: 5px;
  font-size: 16px;
  color: #ffffff;
  padding: 5px;
}
.rightBtn[data-v-487840c8] {
  padding: 5px;
  color: #ffffff;
  font-size: 16px;
  border-radius: 5px;
  line-height: 30px;
  background: #6f6f6f;
  cursor: pointer;
  position: absolute;
  opacity: 0.5;
  top: 35%;
  width: 50px;
  right: 280px;
}
.diyContentBox[data-v-487840c8] {
  padding-bottom: 30px;
  position: relative;
  height: 100%;
}
.diyContentBox .frameNum[data-v-487840c8] {
  background: #0086ff;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: absolute;
  top: -20px;
  z-index: 99999;
  text-align: center;
  line-height: 50px;
}
.diyContentBox .hover[data-v-487840c8] {
  cursor: pointer;
}
.diyContentBox .heng[data-v-487840c8] {
  width: 100%;
  height: 2px;
  background: rgb(76, 219, 245);
  position: absolute;
  top: 5px;
  left: 5px;
  cursor: p;
}
.diyContentBox .zong[data-v-487840c8] {
  width: 2px;
  height: 100%;
  background: rgb(76, 219, 245);
  top: 5px;
  position: absolute;
  left: 5px;
  cursor: p;
}
.property[data-v-487840c8] {
  position: absolute;
  padding: 5px;
  top: 0;
  right: 0;
  width: 250px;
  height: calc(100vh - 60px);
  overflow: auto;
  background: #f0f0f0;
  z-index: 999;
}
.property h1[data-v-487840c8] {
  color: #323232;
  margin: 10px 10px 2px;
  font-size: 13px;
}
.property .allListCz[data-v-487840c8] {
  width: 20px;
  cursor: pointer;
  border: 1px dashed #c4c4c4;
}
.property .allListCz[data-v-487840c8]:hover {
  border: 1px dashed #0086ff;
}
.property .ptitle[data-v-487840c8] {
  text-align: left;
  margin-left: 10px;
}
.property .propertyBox[data-v-487840c8] {
  position: relative;
}
.property .propertyBox .property-li-err[data-v-487840c8] {
  position: absolute;
  cursor: pointer;
  right: 20px;
  z-index: 10;
}
.property .property-ul h1[data-v-487840c8] {
  background: rgb(121, 120, 120);
  text-align: left;
  font-size: 18px;
  color: #f0f0f0;
  padding-left: 20px;
}
.property .property-ul > .property-content[data-v-487840c8] {
  padding: 5px 0px 5px 5px;
}
.property .property-ul > .property-content .title[data-v-487840c8] {
  text-align: center;
}
.property .propertyNav[data-v-487840c8] {
  cursor: pointer;
  margin-top: 10px;
  padding: 0px 10px 5px;
  overflow: hidden;
}
.property .propertyNav div[data-v-487840c8] {
  width: 88px;
  height: 23px;
  background: #d8d8d8;
  line-height: 23px;
  text-align: center;
  margin: 4px;
  float: left;
  color: #6f6f6f;
  font-size: 12px;
}
.property .propertyNav .addP[data-v-487840c8] {
  width: auto;
  font-size: 20px;
  background: transparent;
}
.property .propertyNav .addP[data-v-487840c8]:hover {
  color: #0086ff;
}
.property .propertyNav_btn[data-v-487840c8] {
  height: 40px;
  padding-top: 10px;
  padding-left: 14px;
  display: block;
  border-top: 1px solid #c4c4c4;
}
.property .navBool[data-v-487840c8] {
  background: #0086ff !important;
  color: #ffffff !important;
}
.property .shuzhi[data-v-487840c8] {
  padding-left: 20px;
  text-align: left;
}
.property .property-btn[data-v-487840c8] {
  overflow: hidden;
  padding: 10px;
}
.property .property-btn img[data-v-487840c8] {
  width: 100%;
}
.property .property-btn .property-lis[data-v-487840c8] {
  text-align: center;
  font-size: 10px;
}
.property .property-li[data-v-487840c8] {
  padding-left: 20px;
  text-align: left;
  cursor: pointer;
}
.property .property-li[data-v-487840c8]:hover {
  color: turquoise;
}
.property .property-li-err[data-v-487840c8] {
  padding-left: 10px;
  line-height: 30px;
  text-align: left;
  cursor: pointer;
  margin-bottom: 10px;
}
.property .property-li-err[data-v-487840c8]:hover {
  color: #f82e2e;
}
.content .div[data-v-487840c8] {
  cursor: pointer;
}
.content .div .iall[data-v-487840c8] {
  position: absolute;
  width: 64px;
  height: 64px;
  top: 50%;
  left: 50%;
  margin-top: -32px;
  margin-left: -32px;
}
.content .div .btnAdd[data-v-487840c8] {
  position: absolute;
  font-size: 20px;
  top: 0%;
  right: 0%;
  background: #000;
  opacity: 0.5;
  color: #f0f0f0;
  border-radius: 50%;
  padding: 3px;
  cursor: pointer;
}
.content .div .btnDel[data-v-487840c8] {
  font-size: 20px;
  top: 0%;
  background: #000;
  opacity: 0.5;
  color: #f0f0f0;
  border-radius: 50%;
  padding: 3px;
  left: 0%;
  position: absolute;
  cursor: pointer;
}
.content .div .btnXR[data-v-487840c8] {
  font-size: 20px;
  bottom: 0%;
  background: #000;
  opacity: 0.5;
  color: #f0f0f0;
  border-radius: 50%;
  padding: 3px;
  right: 0%;
  position: absolute;
  cursor: pointer;
}
.content .div .btnXL[data-v-487840c8] {
  background: #000;
  opacity: 0.5;
  color: #f0f0f0;
  border-radius: 50%;
  padding: 3px;
  font-size: 20px;
  bottom: 0%;
  left: 0%;
  position: absolute;
  cursor: pointer;
}
.content .div .rotate[data-v-487840c8] {
  position: absolute;
  background: #000;
  color: #ffffff;
  right: -40px;
  top: 50%;
  border-radius: 50%;
  margin-top: -11px;
  padding: 3px;
  cursor: Move;
}
.content .div .footer[data-v-487840c8] {
  position: absolute;
  width: 100px;
  height: 60px;
  background: #000;
  left: 0;
  bottom: -80px;
}
.content .div .el-icon-rank[data-v-487840c8] {
  position: absolute;
  cursor: pointer;
  top: 50%;
  left: 50%;
  margin-left: -15px;
  margin-top: -15px;
  background: #000;
  opacity: 0.5;
  color: #f0f0f0;
  border-radius: 50%;
  padding: 3px;
}
.content .div .tishi[data-v-487840c8] {
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  position: absolute;
  color: #f0f0f0;
  background: rgba(229, 60, 76, 0.7);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
}
.content .div .tishi p[data-v-487840c8] {
  text-align: center;
  line-height: 20px;
}
.imgType[data-v-487840c8] {
  width: 200px;
  height: 200px;
  position: absolute;
  border-radius: 40px;
  right: 400px;
  background: #000;
  cursor: move;
  opacity: 0.8;
  top: 300px;
}
.imgType i[data-v-487840c8] {
  color: #f0f0f0;
  position: absolute;
  font-size: 60px;
  cursor: pointer;
}
.imgType i[data-v-487840c8]:hover {
  color: aqua;
}
.imgType .btnL[data-v-487840c8] {
  left: 0;
  margin-top: -30px;
  top: 50%;
}
.imgType .btnR[data-v-487840c8] {
  right: 0;
  top: 50%;
  margin-top: -30px;
}
.imgType .btnB[data-v-487840c8] {
  bottom: 0;
  left: 50%;
  margin-left: -30px;
}
.imgType .btnT[data-v-487840c8] {
  top: 0;
  left: 50%;
  margin-left: -30px;
}
.imgType .btnAdd[data-v-487840c8] {
  font-size: 30px;
  top: 40%;
  margin-top: -15px;
  right: 30%;
}
.imgType .btnDel[data-v-487840c8] {
  font-size: 30px;
  top: 40%;
  margin-top: -15px;
  left: 30%;
}
.imgType .btnXR[data-v-487840c8] {
  font-size: 30px;
  bottom: 30%;
  margin-top: -15px;
  right: 30%;
}
.imgType .btnXL[data-v-487840c8] {
  font-size: 30px;
  bottom: 30%;
  margin-top: -15px;
  left: 30%;
}
.footer[data-v-487840c8] {
  position: absolute;
  bottom: 10px;
  width: calc(100vw - 450px);
  right: 40px;
}
.change-template-module[data-v-487840c8] {
  background: #ffffff;
  padding: 2px 2px 20px;
}
.change-template-module .no-data[data-v-487840c8] {
  width: 100%;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: #999999;
}
.change-template-module .el-divider__text[data-v-487840c8] {
  padding: 0 5px;
}
.change-template-module .title[data-v-487840c8] {
  text-align: center;
  font-size: 12px;
  color: #999999;
}
.change-template-module .change-template-item[data-v-487840c8] {
  width: 100%;
  display: flex;
  -moz-column-gap: 10px;
       column-gap: 10px;
  padding: 0 5px;
  box-sizing: border-box;
  flex-wrap: wrap;
  justify-content: center;
}
.change-template-module .change-template-item li[data-v-487840c8] {
  box-sizing: border-box;
  cursor: pointer;
}
.change-template-module .change-template-item li .template-con[data-v-487840c8] {
  width: 100%;
  border: 1px solid #f1f1f1;
  box-sizing: content-box;
}
.change-template-module .change-template-item li .frame-num[data-v-487840c8] {
  text-align: center;
  font-size: 12px;
  color: #999999;
  margin-top: 5px;
}
.bjzp .bp-p[data-v-487840c8] {
  font-size: 16px;
  margin-bottom: 10px;
}
.bjzp .bp-p span[data-v-487840c8] {
  font-weight: 600;
  color: #ff6600;
}
.bjzp .tu_center[data-v-487840c8] {
  display: flex;
  flex-wrap: wrap;
}
.bjzp .tu_center .tucheng[data-v-487840c8] {
  display: flex;
  align-items: center;
  position: relative;
  margin-right: 20px;
  width: 220px;
  background: #d8d8d8;
}
.bjzp .tu_center .tucheng .tu[data-v-487840c8] {
  width: 220px;
}
.bjzp .tu_center .tucheng .yxz[data-v-487840c8] {
  width: 20px;
  height: 20px;
  position: absolute;
  right: 2px;
  top: 2px;
}
.diyContentBox .el-collapse-item__wrap {
  background-color: #f0f0f0;
}
.allSelect {
  border: 1px dashed rgb(22, 80, 240);
  position: absolute;
  background: rgba(17, 0, 243, 0.2);
}
.allSelect1 {
  border: 2px solid #000;
  position: absolute;
  display: none;
  background: transparent;
  z-index: 9999999;
  cursor: move;
}
.allSelect1 .rotate {
  position: absolute;
  bottom: -15px;
  border-radius: 50%;
  background: #000;
  color: #fff;
  right: -15px;
}
.allSelect1 .rotate i {
  font-size: 30px;
}
.diyContentBox .el-loading-spinner {
  top: 20%;
}
.diyContentBox .el-dialog__body {
  padding: 14px 20px;
}
.homeDiys {
  overflow: hidden;
  width: 100%;
  height: 100vh;
  background: #bbb;
}
.homeDiys .nav {
  height: 56px;
  background: #3d3d3d;
  box-sizing: border-box;
  overflow: hidden;
  color: #fff;
  display: flex;
}
.homeDiys .nav img {
  padding: 10px 60px;
  float: left;
}
.homeDiys .nav > div {
  float: left;
}
.homeDiys .nav > div span {
  cursor: pointer;
  line-height: 56px;
  font-size: 16px;
  margin-right: 30px;
}
.homeDiys .left {
  float: left;
  height: calc(100vh - 56px);
}
.homeDiys .left ::-webkit-scrollbar {
  width: 10px;
  height: 15px;
}