.pageApp .container .appList .item {
  text-align: center;
}
.pageApp .container .appList .item .icon img {
  width: 100px;
  filter: brightness(360%);
  opacity: 0.8;
}
.pageApp .container .appList .item .name {
  max-width: 150px;
  margin: 10px auto 0;
  font-size: 19px;
  color: rgba(255, 255, 255, 0.8);
}
.pageApp .container .appList .item:hover .icon img,
.pageApp .container .appList .item.active .icon img {
  filter: none;
  opacity: 1;
}
.pageApp .container .appList .item:hover .name,
.pageApp .container .appList .item.active .name {
  color: var(--active-color);
}
.pageApp .container .caseList .item {
  position: relative;
  aspect-ratio: 1920/720;
}
.pageApp .container .caseList .item:nth-child(2n) .left {
  display: flex;
  justify-content: flex-end;
}
.pageApp .container .caseList .item:nth-child(2n) .img {
  left: 0;
  right: auto;
  text-align: left;
}
.pageApp .container .caseList .item .text {
  width: calc(50% - 80px);
}
.pageApp .container .caseList .item .text .title {
  font-size: 2.5vw;
  color: var(--active-color);
  font-family: Montserrat-SemiBold;
}
.pageApp .container .caseList .item .text .desc {
  font-size: 18px;
  color: var(--deputy-color);
  font-family: Montserrat-Light;
  line-height: calc(27/18);
  margin-top: 20px;
}
.pageApp .container .caseList .item .img {
  width: 50%;
  height: 100%;
  position: absolute;
  right: 0;
  text-align: right;
}
.pageApp .container .caseList .item:hover .img img {
  animation: shake 1.2s linear infinite;
}
@media screen and (max-width: 1024px) {
  .pageApp .container .appList {
    gap: calc(var(--w-padding)/2);
  }
  .pageApp .container .caseList .item .text {
    width: calc(50% - var(--w-padding)/2);
  }
  .pageApp .container .caseList .item .text .desc {
    font-size: 16px;
  }
  .pageApp .container .appList .item .icon img {
    width: 80px;
  }
}
@media screen and (max-width: 768px) {
  .pageApp .container .caseList .item .text .title {
    font-size: 22px;
  }
  .pageApp .container .caseList .item .text .more {
    display: none;
  }
  .pageApp .container .appList .item .icon img {
    width: 60px;
  }
  .pageApp .container .appList .item .name {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  .pageApp .container .appList .item .icon img {
    width: 50px;
  }
  .pageApp .container .appList .item .name {
    font-size: 14px;
    margin: 4px 0 0;
  }
  .pageApp .container .caseList .item .text .title {
    font-size: 16px;
  }
  .pageApp .container .caseList .item .text .desc {
    font-size: 14px;
    margin-top: 7px;
    --lines: 3;
  }
}
