body {
  background: url(../image/newProback.png) no-repeat left top/100%
    100%;
}
.yy-document-manage-box {
  min-width: 1370px;
  /*background: url(../image/newProback.png) no-repeat left top/100%  100%;*/

  padding-bottom: 150px;
  position: relative;
  padding-top: 91px;
  overflow: hidden;
}
.yy-doc-bank1 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /* margin-top: 91px; */
}
.yy-doc-bank1-li1 {
  font-size: 50px;
  font-weight: 500;
  color: #2d2f36;
  height: 70px;
  line-height: 70px;
  letter-spacing: 5px;
}
.yy-doc-bank1-li2 {
  font-size: 50px;
  font-weight: 500;
  color: #2d2f36;
  height: 70px;
  line-height: 70px;
  margin-top: 6px;
  position: relative;
  letter-spacing: 5px;
}
.yy-triangle {
  position: absolute;
  width: 94.43px;
  height: 75.93px;
  top: -137px;
  left: 103px;
}
.yy-doc-bank1-li3 {
  font-weight: normal;
  color: #787d87;
  font-size: 18px;
  height: 25px;
  line-height: 25px;
  margin-top: 19px;
  letter-spacing: 5px;
}
.yy-doc-bank1-li4 {
  font-weight: 500;
  color: #ffffff;
  font-size: 16px;
  position: relative;
  z-index: 3;
  /*background-color: #3370FF; */
  /*background: url(../image/btn-tiyan.png) no-repeat center;*/
  border-radius: 27px 27px 27px 27px;
  height: 46px;
  line-height: 46px;
  text-align: center;
  width: 180px;
  margin-top: 36px;
  cursor: pointer;
  border: 3px solid #f1f3fc;
  box-shadow: 0px 3px 8px 3px rgb(41 88 197 / 20%);
}
.tiyanjt {
  margin-left: 10px;
  width: 14px;
  height: 14px;
}
.yy-doc-bank1-li5 {
  margin-top: 43px;
  position: relative;
  z-index: 30px;
}
.first-screen {
  width: 1200px;
  height: 630px;
  position: relative;
  z-index: 30;
}
.yy-positiong-img1 {
  position: absolute;
  right: 0px;
  top: 220px;
}
.imag1 {
  width: 164.67px;
  height: 265.25px;
}
.qj-left_bottom {
  position: absolute;
  left: 0px;
  top: 743px;
  width: 121.96px;
  height: 172.57px;
}
.yy-leftTop {
  position: absolute;
  width: 386px;
  height: 351px;
  left: 0px;
  top: 0px;
}
.yy-bk1-right {
  width: 432.13px;
  height: 370.99px;
  position: absolute;
  left: 884px;
  bottom: 375px;
}
.yy-bk1-left {
  width: 582.59px;
  height: 499.18px;
  position: absolute;
  left: -160px;
  bottom: 167px;
}
.yy-bk1-rightBottom {
  position: absolute;
  top: 251px;
  right: -71px;
  width: 440px;
  height: 436px;
}
.yy-doc-bank2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: 166px;
  position: relative;
}
.yy-doc-bank2-li1 {
  height: 56px;
  font-size: 40px;
  font-weight: 500;
  color: #2d2f36;
  line-height: 56px;
  position: relative;
  z-index: 30px;
}
.yy-doc-bank2-li2 {
  display: flex;
  align-items: center;
  /* justify-content: center;
  width: 556px; */
  height: 48px;
  border-radius: 27px 27px 27px 27px;
  opacity: 1;
  border: 1px solid #dce7fa;
  font-size: 18px;
  font-weight: 400;
  color: #898d9d;
  line-height: 48px;
  margin-top: 32px;
  position: relative;
  z-index: 30px;
}
.yy-bank2-li2-btn {
  width: 182px;
  height: 48px;
  text-align: center;
  cursor: pointer;
}
.activeOn {
  background: #3370ff !important;
  box-shadow: 0px 2px 14px 1px rgba(39, 93, 214, 0.4);
  border-radius: 27px 27px 27px 27px;
  opacity: 1;
  color: #ffffff !important;
}
.yy-btn-img {
  /* width: 100%; */
  /* height: 100%; */
  /* object-fit:fill */
  width: 18px;
  height: 18px;
  margin-bottom: 5px;
}
.yy-doc-bank2-li3 {
  margin-top: 90px;
  position: relative;
  z-index: 30;
  display: flex;
}
.yy-doc-bank2-li3 div:last-child {
  margin-right: 0px !important;
}
.yy-bank2-img {
  margin-right: 164px;
}
.yy-bank2-imgOn {
  position: relative;
}
.yy-bank2-imgOn img{
  opacity: 1!important;
}
.yy-bk2-jt {
  position: absolute;
  width: 553px;
  left: -86px;
  top: 48px;
  z-index: 20;
}
.yy-mohu-left {
  position: absolute;
  left: -49px;
  bottom: -31px;
  width: 339.72px;
  height: 286.81px;
}
.yy-mohu-right {
  position: absolute;
  width: 485px;
  height: 379px;
  right: -108px;
  bottom: -102px;
}
.yy-ellipse {
  position: absolute;
  width: 99px;
  height: 99px;
  right: -14px;
  top: -19px;
  display: none;
}
.yy-bank2-img1 {
  /* position: relative; */
}
.yy-check-history {
  position: absolute;
  width: 401.62px;
  height: 222.95px;
  bottom: 80px;
  right: -80px;
  z-index: 40;
  opacity: 0;
}
.yy-write-editor {
  position: absolute;
  width: 379px;
  height: 274.13px;
  z-index: 50;
  bottom: 63px;
  right: -141px;
  opacity: 0;
}
.img-info {
  width: 763px;
  height: 466.02px;
  margin-top: 25px;
  position: relative;
  z-index: 30;
}
.yy-bank2-img2 {
  /* position: relative; */
}
.iconFontSize {
  font-size: 24px;
  color: #B2B8C4
}
.yy-zhuangshi {
  position: absolute;
  width: 125px;
  /* height: 58px; */
  top: 221px;
  right: 278px;
  z-index: 30;
  opacity: 0;
}
.yy-relation {
  position: absolute;
  width: 294.28px;
  right: -62px;
  bottom: 97px;
  z-index: 30;
  opacity: 0;
}
.yy-bank2-img3 {
  /* position: relative; */
}
.yy-notes-zs {
  position: absolute;
  width: 309px;
  bottom: 80px;
  right: -29px;
  z-index: 30;
  opacity: 0;
}
.img-middle {
  width: 904px !important;
  height: 510px !important;
  margin-top: 0px !important;
}
.yy-bk2-img {
  width: 904px;
  height: 510px;
  position: relative;
  z-index: 20;
}
.yy-bank2 {
  position: absolute;
  width: 100%;
  left: 0px;
  top: -300px;
  height: 1540.78px;
}
.yy-bk2-left {
  position: absolute;
  left: -518px;
  width: 763px;
  height: 466px;
  top: 411px;
}
.yy-bk2-right {
  position: absolute;
  right: -518px;
  width: 763px;
  height: 466px;
  top: 411px;
}
.yy-bk2-inwrite {
  position: absolute;
  width: 475.62px;
  height: 274.13px;
  left: 581px;
  top: 172px;
  z-index: 40;
}
.yy-bk2-mohu {
  position: absolute;
  width: 485px;
  height: 379px;
  left: 505px;
  top: 226px;
  z-index: 30;
}
.yy-bk2-mohu2 {
  position: absolute;
  width: 339.72px;
  height: 286.81px;
  left: -49px;
  bottom: -31px;
}
.yy-polygon {
  position: absolute;
  width: 81.14px;
  height: 73.63px;
  right: -53px;
  top: -65px;
}
.yy-doc-bank3 {
  display: flex;
  /* align-items: center;
  justify-content: center; */
  margin-top: 384px;
  position: relative;
}
.yy-bank2-li1 {
  position: relative;
  min-width: 1040px;
}
.yy-bk3-left {
  max-width: 1014px;
  animation: left-adm 1s;
  /* width: 100%; */
  /* height: 563px; */
  /* min-width: 854px; */
}
.yy-bank2-li2 {
  margin-left: 120px;
  display: flex;
  flex-direction: column;
  margin-top: 42px;
  /* align-items: center; */
}
.heightNum {
  height: 105px !important;
  padding-bottom: 0px!important;
}
.yy-li2-top {
  font-size: 36px;
  font-weight: 500;
  color: #2d2f36;
  margin-bottom: 30px;
}
.yy-green {
  color: #61c1a4;
}
.yy-li2-content1 {
  width: 452px;
  height: 51px;
  border-radius: 0px 0px 0px 0px;
  opacity: 1;
  padding: 21px 24px;
  display: flex;
  position: relative;
  /* animation: literature 2s infinite;
  -webkit-animation-delay:0s */
}
.bgcolor {
  background: #f3faf8;
}
.bgcolor .iconFontSize {
  font-size: 24px;
  color: #61C1A4!important
}
.bgcolor > .literature1 {
  animation: literature1 5s infinite;
}
.bgcolor > .yy-li2-content1-left {
  /* animation: literature1 4s infinite; */
  color: #61c1a4;
  opacity: 0.8;
}
.bgcolor1 {
  background: #f4f9fe;
}
.bgcolor1 .iconFontSize{
  color: #69CAD9;
}
.bgcolor1 > .literature1 {
  animation: literature1 4s infinite;
}
.bgcolor1 > .yy-bank4-content1-left {
  color: #69cad9;
  opacity: 0.8;
}
.bgcolor2 {
  background: #f5f6fc;
}
.bgcolor2 .iconFontSize{
  color: #7188EF;
}
.bgcolor2 > .literature1 {
  animation: literature1 4s infinite;
}
.bgcolor2 > .yy-bank4-content1-left {
  color: #7188ef;
  opacity: 0.8;
}
/*.literature2 {*/
/*  animation: literature2 4s infinite;*/
/*}*/
/*.literature3 {*/
/*  animation: literature3 4s infinite;*/
/*}*/
@keyframes literature1 {
  0% {
    width: 0px;
    /* background-color: #f3faf8; */
  }
  100% {
    width: 500px;
    /* background-color: inherit; */
  }
}
/*@keyframes literature2 {*/
/*  0% {*/
/*    width: 0px;*/
/*    !* background-color: inherit; *!*/
/*  }*/
/*  33.1% {*/
/*    width: 0px;*/
/*    !* background-color: #f3faf8; *!*/
/*  }*/
/*  66% {*/
/*    width: 500px;*/
/*    !* background-color: #f3faf8; *!*/
/*  }*/
/*  66.1% {*/
/*    width: 0px;*/
/*    !* background-color: inherit; *!*/
/*  }*/
/*  100% {*/
/*    width: 0px;*/
/*    !* background-color: inherit; *!*/
/*  }*/
/*}*/
/*@keyframes literature3 {*/
/*  0% {*/
/*    width: 0px;*/
/*    !* background-color: inherit; *!*/
/*  }*/
/*  66% {*/
/*    width: 0px;*/
/*    !* background-color: #f3faf8; *!*/
/*  }*/
/*  100% {*/
/*    width: 500px;*/
/*    !* background-color: #f3faf8; *!*/
/*  }*/
/*}*/
.yy-li2-content1-left {
  height: 100%;
  margin-right: 16px;
  margin-top: -5.5px;
}
.yy-search {
  width: 24px;
  height: 24px;
  margin-top: 5px;
}
.yy-bk3-jindut {
  /* content: ""; */
  position: absolute;
  /* width: 100px; */
  height: 3px;
  left: 0px;
  bottom: 0px;
  background: #61c1a4;
  border-radius: 0px 0px 0px 0px;
  opacity: 0.8;
}
.yy-li2-content1-right-txt1 {
  font-size: 18px;
  font-weight: 400;
  color: #414754;
}
.yy-li2-content1-right-txt2 {
  font-size: 15px;
  font-weight: 400;
  color: #808795;
  white-space: normal;
  word-break: break-all;
}
.yy-li2-content2 {
  width: 452px;
  /*height: 51px;*/
  /* background: #F3FAF8; */
  border-radius: 0px 0px 0px 0px;
  opacity: 1;
  padding: 21px 24px;
  display: flex;
  position: relative;
}
.yy-li2-bottom {
  width: 140px;
  height: 42px;
  background: #61c1a4;
  box-shadow: 5px 10px 30px 1px rgba(92, 184, 156, 0.5);
  border-radius: 6px 6px 6px 6px;
  opacity: 1;
  text-align: center;
  line-height: 42px;
  font-size: 16px;
  font-weight: 400;
  color: #ffffff;
  margin-top: 31px;
  cursor: pointer;
}
.yy-li2-jt {
  width: 14px;
  height: 14px;
  margin-left: 10px;
}
.yy-doc-bank4 {
  display: flex;
  margin-top: 311px;
  position: relative;
}
.yy-bank4-li1 {
  position: relative;
  min-width: 1040px;
}

.yy-bank4 {
  max-width: 1014px;
  /*transition: all 1.5s;*/
  animation: left-adm 1s;
  /*margin-left: 0px!important;*/
  /* min-width: 854px; */
  /* width: 100%; */
}
@keyframes left-adm {
  0% {
    /* background-color: #f3faf8; */
    margin-left: -1380px;
    opacity: 0;
  }
  100% {
    margin-left:inherit;
    opacity: 1;
    /* background-color: inherit; */
  }
}
.yy-bank4-li2 {
  margin-left: 120px;
  display: flex;
  flex-direction: column;
  margin-top: 42px;
}
.yy-bank4-li2-top {
  font-size: 36px;
  font-weight: 500;
  color: #2d2f36;
  margin-bottom: 30px;
}
.blue {
  color: #5fc4d4;
}
.yy-bank4-content1-left {
  height: 100%;
  margin-right: 16px;
  margin-top: -5.5px;
}
.yy-bank4-content1 {
  /* margin-top: 30px; */
  width: 452px;
  height: 51px;
  /* background: #F3FAF8; */
  border-radius: 0px 0px 0px 0px;
  opacity: 1;
  padding: 21px 24px;
  display: flex;
  position: relative;

}
.yy-bank4-content2 {
  /* margin-top: 30px; */
  width: 452px;
  height: 52px;
  /* background: #f4f9fe; */
  border-radius: 0px 0px 0px 0px;
  opacity: 1;
  padding: 21px 24px;
  display: flex;
  position: relative;
}
.yy-bk4-jindut {
  /* content: ""; */
  position: absolute;
  /* width: 200px; */
  height: 3px;
  background: #69cad9;
  border-radius: 0px 0px 0px 0px;
  opacity: 0.8;
  left: 0px;
  bottom: 0px;
}
.yy-li4-bottom {
  width: 140px;
  height: 42px;
  background: #5fcbde;
  box-shadow: 5px 10px 30px 1px rgba(92, 184, 156, 0.5);
  border-radius: 6px 6px 6px 6px;
  opacity: 1;
  text-align: center;
  line-height: 42px;
  font-size: 16px;
  font-weight: 400;
  color: #ffffff;
  margin-top: 31px;
  cursor: pointer;
}
.yy-doc-bank5 {
  display: flex;
  margin-top: 311px;
  position: relative;
}
.blueOn {
  color: #7188ef;
}
.yy-bank5-content2 {
  width: 452px;
  height: 105px;
  /* background: #f5f6fc; */
  border-radius: 0px 0px 0px 0px;
  opacity: 1;
  padding: 21px 24px;
  display: flex;
  position: relative;
  padding-bottom: 0px;
}
.yy-bk5-jindut {
  /* content: ""; */
  position: absolute;
  left: 0px;
  bottom: 0px;
  /* width: 359px; */
  height: 3px;
  background: #7188ef;
  border-radius: 0px 0px 0px 0px;
  opacity: 0.8;
}
.yy-btn5 {
  background: #7188ef !important;
  box-shadow: 5px 10px 30px 1px rgba(122, 133, 238, 0.44) !important;
}

/* 动画 */
.yy-img1-animate {
  /* animation:firstImg 2s; */
  transition: opacity 2s;
  opacity: 1;
}
/* 小屏 */
@media screen and (max-width: 1700px) {
  .small-screen {
    transform: translateX(-90px);
  }
  .yy-bank2-img {
    margin-right: 126px;
  }
}
@media screen and  (max-width: 1440px){
  .yy-bank2-li2 {
    margin-left: 80px;
  }
  .yy-bank4-li2 {
    margin-left: 80px;
  }
}
@media screen and (max-width: 1620px) {
  .small-screen {
    transform: translateX(-200px);
  }
  .yy-bank4-li2{
    margin-left: 80px;
  }
  .yy-bank2-img {
    margin-right: 100px;
  }
}