.designer-banner {
  position: relative;
}
/* .banner-left{
  position: absolute;
  top: 22%;
  left: 22%;
} */
.designer-content {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 97px;
}

.newbanner {
  /* height: 583px; */
}
#designToVELeapCommunity{
  /* position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-10%,-50%); */
}
.designer-content > span:nth-child(1) {
  display: inline-block;
  width: 56px;
  height: 8px;
  background: linear-gradient(90deg, #ffffff, #79adfc);
  margin-right: 24px;
}
.designer-content > span:nth-child(2) {
  font-size: 28px;
  font-weight: 500;
  color: #000000;
  letter-spacing: 2px;
}
.designer-content > span:nth-child(3) {
  display: inline-block;
  width: 56px;
  height: 8px;
  background: linear-gradient(90deg, #79adfc, #ffffff);
  margin-left: 24px;
}
.designer-p {
 display: flex;
 justify-content: center;
 align-items: center;
  font-size: 20px;
  font-weight: 400;
  color: #333333;
  line-height: 30px;
  margin: 24px auto;
  letter-spacing: 2px;
}
.designer-four {
  width: 1200px;
  display: flex;
  justify-content: space-between;
  margin: 78px auto;
}
.ae-func {
  width: 280px;
  height: 260px;
  border: 2px solid #dde3ed;
  border-radius: 8px;
  background-image: url(../img/designer/icon_aegn.svg);
  background-size: 96px 108px;
  background-repeat: no-repeat;
  background-position: 50% 40%;
  position: relative;
  cursor: pointer;
  transition: all .4s;
}
.ae-func:hover {
  box-shadow: 0 0 16px rgba(0, 39, 103, 0.16);
  cursor    : pointer;
  transform : translate(-10px, -15px);
}
.ae-func p {
  font-size: 16px;
  position: absolute;
  bottom: 45px;
  left: 50%;
  text-align: center;
  transform: translateX(-50%);
}
.ae-material {
  background-image: url(../img/designer/icon_aesc.svg);
}
.ae-unit {
  background-image: url(../img/designer/icon_aecj.svg);
}
.ae-principle {
  background-image: url(../img/designer/icon_aeth.svg);
}
/* 试用教程 */
.ae-principle > p {
  width: 150px;
  position: absolute;
  bottom: 45px;
  left: 50%;
  transform: translateX(-50%);
}
.designer-use {
  height: 614px;
  background: #f3f8ff;
}
.designer-use-p {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 20px;
  font-weight: 400;
  color: #333333;
  line-height: 30px;
  margin: 24px auto;
  letter-spacing: 2px;

}
.use-top {
  padding-top: 79px;
}
.use-download {
  width: 1200px;
  margin: 76px auto;
  list-style: none;
  display: flex;
}
.use-download > li {
  width: 560px;
  height: 290px;
  background: #ffffff;
  border-radius: 8px;
  display: flex;
  transition: all .4s;
}
.use-download > li:hover{
  box-shadow: 0 0 16px rgba(0, 39, 103, 0.16);
  cursor    : pointer;
  transform : translate(-10px, -15px);
}
.use-download > li:nth-child(1) {
  margin-right: 80px;
}
.use-export-img {
  width: 162px;
  height: 147px;
  margin: 69px 35px;
  background-image: url(../img/designer/ct_01.svg);
  background-repeat: no-repeat;
  background-size: 162px 147px;
}
.use-export-rigth {
  height: 147px;
  margin-top: 77px;
}
.use-export-rigth > p:nth-child(1) {
  margin: 0;
  font-size: 20px;
  font-weight: bold;
  color: #333333;
  line-height: 30px;
}
.use-export-rigth > p:nth-child(2) {
  width: 245px;
  margin-top: 5px;
  font-size: 16px;
  font-weight: 400;
  color: #333333;
  line-height: 28px;
  opacity: 0.8;
}
.use-export-bottom {
  margin-top: -6px;
}
.use-export-bottom > a {
  cursor: pointer;
  font-size: 20px;
  font-weight: 400;
  color: #00a1ff;
  line-height: 30px;
  margin-right: 23px;
}
.use-clean-img {
  width: 156px;
  height: 147px;
  margin: 69px 35px;
  background-image: url(../img/designer/ct_02.svg);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
/* 常见模板 */
.template-four {
  width: 1200px;
  margin: 87px auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.template-tel {
  width: 560px;
  height: 120px;
  background: #ffffff;
  border: 2px solid #dde3ed;
  border-radius: 8px;
  margin-bottom: 64px;
  cursor: pointer;
  transition: all .4s;
}
.template-tel:hover{
  box-shadow: 0 0 16px rgba(0, 39, 103, 0.16);
  cursor    : pointer;
  transform : translate(-10px, -15px);
}
.template-tel > ul {
  margin: 0;
  position: relative;
}
.template-left {
  width: 8px;
  height: 20px;
  background: #00a1ff;
  position: absolute;
  left: 32px;
  top: 50px;
}
.template-bz-img {
  background-image: url(../img/designer/icon_bzmb_nor.svg);
  background-repeat: no-repeat;
}
.template-bz-img1 {
  background-image: url(../img/designer/icon_bzmb_sel.svg);
  background-repeat: no-repeat;
  display: none;
}
.template-dt-img {
  background-image: url(../img/designer/icon_dtmb_nor.svg);
  background-repeat: no-repeat;
}
.template-dt-img1 {
  background-image: url(../img/designer/icon_dtmb_sel.svg);
  background-repeat: no-repeat;
  display: none;
}
.template-syj-img {
  background-image: url(../img/designer/icon_sxjmb_nor.svg);
  background-repeat: no-repeat;
}
.template-syj-img1 {
  background-image: url(../img/designer/icon_sxjmb_sel.svg);
  background-repeat: no-repeat;
  display: none;
}
.template-dc-img {
  background-image: url(../img/designer/icon_jjtxdc_nor.svg);
  background-repeat: no-repeat;
}
.template-dc-img1 {
  background-image: url(../img/designer/icon_jjtxdc_sel.svg);
  background-repeat: no-repeat;
  display: none;
}
.template-img-pos {
  width: 48px;
  height: 48px;
  position: absolute;
  top:36px;
  left: 66px;
  background-size: 100% 100%;
}
.template-bz-content {
  font-size: 28px;
  font-weight: 500;
  color: #333333;
  position: absolute;
  top: 39px;
  left: 121px;
  letter-spacing: 1px;
}
/* 设计师分享 */

.designer-share {
  height: 1073px;
  background: #f3f8ff;
}
.share-top {
  width: 1200px;
  height: 270px;
  margin: 88px auto 47px auto;
  background-image: url(../img/designer/ct_cjfx.svg);
  background-repeat: no-repeat;
}
.share-bottom {
  width: 1200px;
  height: 270px;
  margin: 0 auto;
  background-image: url(../img/designer/ct_xyd.svg);
  background-repeat: no-repeat;
}
.share-top-cj {
  font-size: 20px;
  font-weight: 600;
  color: #333333;
  padding: 97px 0 28px 136px;
  margin: 0;
  letter-spacing: 1px;
}
.share-content {
  width: 423px;
  font-size: 16px;
  font-weight: 500;
  color: #333333;
  line-height: 24px;
  opacity: 0.6;
  margin-left: 136px;
  margin-top: 0;
  letter-spacing: 1px;
}
.share-p {
  width: 480px;
}
.come-ve {
  display: block;
  width: 280px;
  height: 64px;
  background: #ffbf7a;
  border-radius: 8px;
  font-size: 17px;
  font-weight: 400;
  color: #002d59;
  margin: 89px auto;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bolder;
}
.come-icon {
  display: inline-block;
  width: 28px;
  height: 28px;
  margin-left: 8px;
  background-image: url(../img/designer/icon_btn.svg);
  background-repeat: no-repeat;
}
.banner-btn {
  width: 280px;
  height: 64px;
  background: #ffbf7a;
  border-radius: 8px;
  font-size: 17px;
  font-weight: 400;
  color: #002d59;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 90px;
  font-weight: bolder;
}
.banner-left span {
  display: block;
}
.banner-left span:first-child {
  font-size: 32px;
  font-weight: 400;
  color: rgba(255, 255, 255, 1);
}
.banner-left span:nth-child(2) {
  width: 48px;
  height: 12px;
  background: #ffffff;
  margin-top: 35px;
}
.banner-left span:last-child {
  width: 355px;
  font-size: 16px;
  font-weight: 400;
  color: rgba(255, 255, 255, 1);
  line-height: 30px;
  margin-top: 35px;
  letter-spacing: 1px;
}
.center_t{
  width: 800px;
  display: flex;
  align-items: center;
  position: absolute;
  top: 20%;
  left: 22%;
}