.projectbox[data-v-146d869c] {
  height: 100%;
}
@-webkit-keyframes xyspin-146d869c {
0%,
  50% {
    -webkit-transform: skew(10deg, 10deg);
}
100% {
    -webkit-transform: skew(0deg, 0deg);
}
25%,
  75% {
    -webkit-transform: skew(-10deg, -10deg);
}
}
@keyframes xyspin-146d869c {
0%,
  50% {
    -webkit-transform: skew(10deg, 10deg);
            transform: skew(10deg, 10deg);
}
100% {
    -webkit-transform: skew(0deg, 0deg);
            transform: skew(0deg, 0deg);
}
25%,
  75% {
    -webkit-transform: skew(-10deg, -10deg);
            transform: skew(-10deg, -10deg);
}
}
.animated[data-v-146d869c] {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.project[data-v-146d869c] {
  width: 100%;
  min-height: 100%;
  background: #f0f2f5 url(../assets/background.5825f033.svg) no-repeat 50%;
  background-size: 100%;
  padding: 110px 0 144px;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.project .container[data-v-146d869c] {
  width: 90%;
  margin: 0px auto;
  text-align: center;
  font-size: 30px;
}
.project .container h1[data-v-146d869c] {
  height: 42px;
  line-height: 42px;
}
.project .container .item[data-v-146d869c] {
  margin: 10px 0px;
}
.project .container .item .card[data-v-146d869c] {
  height: 138px;
  zoom: 1;
  line-height: 90px;
  background: #ecf5ff;
  font-size: 18px;
  -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
          box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
}
.project .container .item .card .title[data-v-146d869c] {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
}
.project .container .item .xyspin[data-v-146d869c] {
  -webkit-animation-name: xyspin-146d869c;
  animation-name: xyspin-146d869c;
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
  background: -webkit-gradient(linear, left top, right top, from(#355c7d), color-stop(#6c5b7b), to(#c06c84));
  background: linear-gradient(to right, #355c7d, #6c5b7b, #c06c84);
  color: #FFF;
}
.project .container .item:hover .card[data-v-146d869c] {
  position: relative;
  z-index: 10;
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
  background: -webkit-gradient(linear, left top, right top, from(#355c7d), color-stop(#6c5b7b), to(#c06c84));
  background: linear-gradient(to right, #355c7d, #6c5b7b, #c06c84);
  color: #FFF;
  -webkit-animation-name: xyspin-146d869c;
  animation-name: xyspin-146d869c;
}