/*! #app start */
.app-wrap {
  padding-top: 1rem;
  padding-bottom: 0.6rem;
}
.app-wrap input,
.app-wrap button {
  background-color: rgba(0, 0, 0, 0);
  border: none;
  outline: none;
  margin: 0;
  padding: 0;
}
.app-wrap .icon-box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1em;
  height: 1em;
  transition: 0.3s;
}
.app-wrap .tr-x {
  transform: rotateY(180deg);
}
.app-wrap .tr-y {
  transform: rotateY(180deg);
}
.app-wrap .cn-wh,
.app-wrap .cn-w,
.app-wrap .cv-wh,
.app-wrap .cv-w {
  width: 100%;
}
.app-wrap .cn-wh,
.app-wrap .cn-h,
.app-wrap .cv-wh,
.app-wrap .cv-h {
  height: 100%;
}
.app-wrap .cn-wh,
.app-wrap .cn-w,
.app-wrap .cn-h {
  object-fit: contain;
}
.app-wrap .cv-wh,
.app-wrap .cv-w,
.app-wrap .cv-h {
  object-fit: cover;
}
.app-wrap .pic-box {
  width: 100%;
  height: 100%;
}
.app-wrap .pic-box img {
  max-width: 100%;
  max-height: 100%;
}
.app-wrap.wrap,
.app-wrap .wrap {
  padding-left: 0.6rem;
  padding-right: 0.6rem;
  max-width: 100%;
  overflow: hidden;
}
.app-wrap .area {
  margin: 0 auto;
  width: 100%;
  max-width: 16rem;
}
.app-wrap [data-eps] {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  max-height: 0; /*! autoprefixer: off */
  -webkit-box-orient: vertical;
  -webkit-box-orient: vertical;
  max-width: 100%;
}
.app-wrap [data-eps="1"] {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.app-wrap .mod-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.app-wrap .mod-head.center {
  justify-content: center;
}
.app-wrap .mod-head.center .mod-name,
.app-wrap .mod-head.center .mod-title {
  text-align: center;
}
.app-wrap .mod-name {
  font-family: "Poppins-Medium";
  color: #6cf;
}
.app-wrap .mod-title {
  margin-top: 0.06rem;
  line-height: 1.2;
  font-family: "MiSans-Semibold";
}
.app-wrap .mod-right {
  margin-left: auto;
}
.app-wrap .app {
  display: flex;
  justify-content: space-between;
}
.app-wrap .app-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex: 1;
  max-width: 6.85rem;
  min-height: 6rem;
}
.app-wrap .app-info {
  line-height: 2.166;
  color: #333;
  margin-top: 0.35rem;
}
.app-wrap .app-info * {
  line-height: inherit;
}
.app-wrap .app-pic {
  max-width: 100%;
  width: 8rem;
  height: 6rem;
}
.app-wrap .app-desc {
  line-height: 2.5;
  color: #666;
}
.app-wrap .app-desc * {
  line-height: inherit;
}
@media (max-width: 750px) {
  .app-wrap .app {
    flex-direction: column;
  }
  .app-wrap .app-pic {
    margin-top: 0.5rem;
  }
} /*! #app end */

/* #app-swp start */
 .app-swp-wrap{display: flex;align-items: center;padding-bottom: 1rem;}
.app-swp-wrap input, .app-swp-wrap button{background-color: transparent;border: none;outline: none;margin: 0;padding: 0;}
.app-swp-wrap .icon-box{display: flex;align-items: center;justify-content: center;width: 1em;height: 1em;transition: 0.3s;}
.app-swp-wrap .tr-x{transform: rotateY(180deg);}
.app-swp-wrap .tr-y{transform: rotateY(180deg);}
.app-swp-wrap .cn-wh, .app-swp-wrap .cn-w, .app-swp-wrap .cv-wh, .app-swp-wrap .cv-w{width: 100%;}
.app-swp-wrap .cn-wh, .app-swp-wrap .cn-h, .app-swp-wrap .cv-wh, .app-swp-wrap .cv-h{height: 100%;}
.app-swp-wrap .cn-wh, .app-swp-wrap .cn-w, .app-swp-wrap .cn-h{object-fit: contain;}
.app-swp-wrap .cv-wh, .app-swp-wrap .cv-w, .app-swp-wrap .cv-h{object-fit: cover;}
.app-swp-wrap .pic-box{width: 100%;height: 100%;}
.app-swp-wrap .pic-box img{max-width: 100%;max-height: 100%;}
.app-swp-wrap.wrap, .app-swp-wrap .wrap{padding-left: 0.6rem;padding-right: 0.6rem;max-width: 100%;overflow: hidden;}
.app-swp-wrap .area{margin: 0 auto;width: 100%;max-width: 16rem;}
.app-swp-wrap [data-eps]{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;max-height: 0;/*! autoprefixer: off */ -webkit-box-orient: vertical;/* autoprefixer: on */ -webkit-box-orient: vertical;max-width: 100%;}
.app-swp-wrap [data-eps="1"]{display: block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.app-swp-wrap .sw-pic{width: 100%;height: 100%;}
.app-swp-wrap .sw-item{position: relative;height: 2.6rem;/* width: calc((100% - .6rem) / 4); */ width: auto; flex-shrink: initial;}
.app-swp-wrap .sw-cover{position: absolute;top: 0;left: 0;display: flex;align-items: flex-end;width: 100%;height: 100%;}
.app-swp-wrap .sw-title{display: flex;align-items: flex-end;justify-content: center;width: 100%;height: 0.7rem;padding: 0.2rem;color: #fff;background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);}
.app-swp-wrap .swp-prev, .app-swp-wrap .swp-next{display: flex;align-items: center;justify-content: center;width: 0.54rem;height: 0.54rem;border-radius: 50%;padding: 0.1rem;background-color: #fff;flex-shrink: 0;border: solid 0.01rem #66ccff;cursor: pointer;transition: 0.3s;}
.app-swp-wrap .swp-prev:hover, .app-swp-wrap .swp-next:hover{background-color: #66ccff;}
.app-swp-wrap .swp-prev:hover .icon-box, .app-swp-wrap .swp-next:hover .icon-box{filter: grayscale(1) brightness(10);}
.app-swp-wrap .swp-prev{margin-right: 0.2rem;}
.app-swp-wrap .swp-next{margin-left: 0.2rem;}
/* #app-swp end */

/* #relate start */
 .relate-wrap{padding-top: 1rem;padding-bottom: 1rem;background-color: #faf9f9;}
.relate-wrap input, .relate-wrap button{background-color: transparent;border: none;outline: none;margin: 0;padding: 0;}
.relate-wrap .icon-box{display: flex;align-items: center;justify-content: center;width: 1em;height: 1em;transition: 0.3s;}
.relate-wrap .tr-x{transform: rotateY(180deg);}
.relate-wrap .tr-y{transform: rotateY(180deg);}
.relate-wrap .cn-wh, .relate-wrap .cn-w, .relate-wrap .cv-wh, .relate-wrap .cv-w{width: 100%;}
.relate-wrap .cn-wh, .relate-wrap .cn-h, .relate-wrap .cv-wh, .relate-wrap .cv-h{height: 100%;}
.relate-wrap .cn-wh, .relate-wrap .cn-w, .relate-wrap .cn-h{object-fit: contain;}
.relate-wrap .cv-wh, .relate-wrap .cv-w, .relate-wrap .cv-h{object-fit: cover;}
.relate-wrap .pic-box{width: 100%;height: 100%;}
.relate-wrap .pic-box img{max-width: 100%;max-height: 100%;}
.relate-wrap.wrap, .relate-wrap .wrap{padding-left: 0.6rem;padding-right: 0.6rem;max-width: 100%;overflow: hidden;}
.relate-wrap .area{margin: 0 auto;width: 100%;max-width: 16rem;}
.relate-wrap [data-eps]{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;max-height: 0;/*! autoprefixer: off */ -webkit-box-orient: vertical;/* autoprefixer: on */ -webkit-box-orient: vertical;max-width: 100%;}
.relate-wrap [data-eps="1"]{display: block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.relate-wrap .mod-head{display: flex;align-items: center;justify-content: space-between;}
.relate-wrap .mod-head.center{justify-content: center;}
.relate-wrap .mod-head.center .mod-name, .relate-wrap .mod-head.center .mod-title{text-align: center;}
.relate-wrap .mod-name{font-family: "Poppins-Medium";color: #66ccff;}
.relate-wrap .mod-title{margin-top: 0.06rem;line-height: 1.2;font-family: "MiSans-Semibold";}
.relate-wrap .mod-right{margin-left: auto;}
.relate-wrap .relate-title{line-height: 1.2;text-align: center;color: #222;font-family: "MiSans-Semibold";}
.relate-wrap .relate-box{margin-top: 0.55rem;}
.relate-wrap .relate-item{display: flex;flex-direction: column;height: 4.6rem;padding: 0.3rem;background-color: #fff;transition: 0.3s;}
.relate-wrap .relate-item:hover{box-shadow: 0.05rem 0.05rem 0.1rem rgba(0, 0, 0, 0.1333333333);}
.relate-wrap .relate-item:hover .relate-name{color: #66ccff;}
.relate-wrap .relate-pic{height: 3.2rem;padding: 0.1rem;max-width: 100%;}
.relate-wrap .relate-name{margin-top: auto;text-align: center;color: #333;line-height: 1.2;transition: 0.3s;}
.relate-wrap .swp-wrap{display: flex;align-items: center;}
.relate-wrap .swp-prev, .relate-wrap .swp-next{display: flex;align-items: center;justify-content: center;width: 0.54rem;height: 0.54rem;border-radius: 50%;padding: 0.1rem;background-color: #fff;flex-shrink: 0;background-color: #fff;pointer-events: auto;transition: 0.3s;}
.relate-wrap .swp-prev:hover, .relate-wrap .swp-next:hover{background-color: #66ccff;}
.relate-wrap .swp-prev:hover .icon-box, .relate-wrap .swp-next:hover .icon-box{filter: grayscale(1) brightness(10);}
.relate-wrap .swp-prev{margin-right: 0.3rem;}
.relate-wrap .swp-next{margin-left: 0.3rem;}
/* #relate end */

.video-swp-wrap{
 

 position: relative;padding-top: 1rem;padding-bottom: 1.2rem;}
.video-swp-wrap input, .video-swp-wrap button{background-color: transparent;border: none;outline: none;margin: 0;padding: 0;}
.video-swp-wrap .icon-box{display: flex;align-items: center;justify-content: center;width: 1em;height: 1em;transition: 0.3s;}
.video-swp-wrap .tr-x{transform: rotateY(180deg);}
.video-swp-wrap .tr-y{transform: rotateY(180deg);}
.video-swp-wrap .cn-wh, .video-swp-wrap .cn-w, .video-swp-wrap .cv-wh, .video-swp-wrap .cv-w{width: 100%;}
.video-swp-wrap .cn-wh, .video-swp-wrap .cn-h, .video-swp-wrap .cv-wh, .video-swp-wrap .cv-h{height: 100%;}
.video-swp-wrap .cn-wh, .video-swp-wrap .cn-w, .video-swp-wrap .cn-h{object-fit: contain;}
.video-swp-wrap .cv-wh, .video-swp-wrap .cv-w, .video-swp-wrap .cv-h{object-fit: cover;}
.video-swp-wrap .pic-box{width: 100%;height: 100%;}
.video-swp-wrap .pic-box img{max-width: 100%;max-height: 100%;}
.video-swp-wrap.wrap, .video-swp-wrap .wrap{padding-left: 0.6rem;padding-right: 0.6rem;max-width: 100%;overflow: hidden;}
.video-swp-wrap .area{margin: 0 auto;width: 100%;max-width: 16rem;}
.video-swp-wrap [data-eps]{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;max-height: 0;/*! autoprefixer: off */ -webkit-box-orient: vertical;/* autoprefixer: on */ -webkit-box-orient: vertical;max-width: 100%;}
.video-swp-wrap [data-eps="1"]{display: block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.video-swp-wrap .mod-head{display: flex;align-items: center;justify-content: space-between;}
.video-swp-wrap .mod-head.center{justify-content: center;}
.video-swp-wrap .mod-head.center .mod-name, .video-swp-wrap .mod-head.center .mod-title{text-align: center;}
.video-swp-wrap .mod-name{font-family: "Poppins-Medium";color: #66ccff;}
.video-swp-wrap .mod-title{margin-top: 0.06rem;line-height: 1.2;font-family: "MiSans-Semibold";}
.video-swp-wrap .mod-right{margin-left: auto;}
.video-swp-wrap .hover-line{position: relative;}
.video-swp-wrap .hover-line::after{content: "";position: absolute;bottom: -0.02rem;left: 0;width: 0;height: 0.02rem;background-color: #66ccff;transition: 0.3s;}
.video-swp-wrap .hover-line:hover::after{width: 100%;}
.video-swp-wrap .hover-shadow{cursor: pointer;transition: 0.3s;}
.video-swp-wrap .hover-shadow:hover{box-shadow: 0.02rem 0.02rem 0.05rem rgba(0, 0, 0, 0.5333333333), -0.02rem -0.02rem 0.05rem rgba(0, 0, 0, 0.2) inset, 0.02rem 0.02rem 0.05rem rgba(255, 255, 255, 0.5333333333) inset;}
.video-swp-wrap .hover-pic .pic-box{max-width: 100%;max-height: 100%;overflow: hidden;}
.video-swp-wrap .hover-pic .pic-box img{transition: 0.5s;}
.video-swp-wrap .hover-pic:hover .pic-box img{transform: scale(1.05);}
.video-swp-wrap .video-swp-main{margin-top: 0.6rem;}
.video-swp-wrap .vs-item{position: relative;width: 12rem;height: 6.4rem;opacity: 0.6;transition: 0.3s;}
.video-swp-wrap .vs-item.swiper-slide-active{opacity: 1;}
.video-swp-wrap .vs-item.swiper-slide-active .video-cover{opacity: 1;}
.video-swp-wrap .video-cover{position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;opacity: 0;transition: 0.3s;}
.video-swp-wrap .video-title{display: flex;align-items: center;justify-content: center;position: absolute;bottom: 0;left: 0;width: 100%;height: 1rem;padding: 0.2rem;color: #fff;background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);}
.video-swp-wrap .video-state{display: flex;align-items: center;justify-content: center;width: 1rem;height: 1rem;border-radius: 50%;padding: 0.1rem;background-color: #fff;background-color: #66ccff;cursor: pointer;}
.video-swp-wrap .swp-ctrl{position: absolute;bottom: 1.2rem;left: 0;width: 100%;height: 6.4rem;z-index: 10;pointer-events: none;}
.video-swp-wrap .swp-ctrl-inner{display: flex;justify-content: space-between;align-items: center;width: 100%;height: 100%;pointer-events: none;}
.video-swp-wrap .swp-prev, .video-swp-wrap .swp-next{display: flex;align-items: center;justify-content: center;width: 0.54rem;height: 0.54rem;border-radius: 50%;padding: 0.1rem;background-color: #fff;background-color: #fff;pointer-events: auto;transition: 0.3s;}
.video-swp-wrap .swp-prev:hover, .video-swp-wrap .swp-next:hover{background-color: #66ccff;}
.video-swp-wrap .swp-prev:hover .icon-box, .video-swp-wrap .swp-next:hover .icon-box{filter: grayscale(1) brightness(10);}
.video-dialog, .video-dialog .dialog{position: fixed;top: 0;left: 0;display: flex;justify-content: center;align-items: center;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.5333333333);opacity: 0;pointer-events: none;transform: translateY(100%);z-index: 60;}
.video-dialog.dialog-show, .video-dialog .dialog.dialog-show{opacity: 1;pointer-events: auto;transform: translateY(0);}
.video-dialog.dialog-show .dialog-inner, .video-dialog .dialog.dialog-show .dialog-inner{animation: dialog-show 0.5s forwards;}
@keyframes dialog-show{0%{transform: scale(0) translateY(100%);}
30%{transform: scale(0.001, 0.001) translateY(0);}
60%{transform: scale(0.001, 1) translateY(0);}
100%{transform: scale(1, 1) translateY(0);}
}
.video-dialog .dialog-inner{position: relative;transition: 0.5s;}
.video-dialog .dialog-main{padding: 0.3rem;min-width: 5rem;min-height: 2rem;border-radius: 0.08rem;background-color: #fff;}
.video-dialog .dialog-cancel{position: absolute;top: 0.1rem;right: 0.1rem;width: 1em;height: 1em;color: #666;background-size: 100%;transition: 0.3s;cursor: pointer;}
.video-dialog .dialog-cancel::after{content: "✕";display: flex;justify-content: center;align-items: center;width: 100%;height: 100%;font-weight: bold;transition: 0.3s;}
.video-dialog .dialog-cancel:hover{transform: scale(1.1);color: #333;text-shadow: 0.02rem 0.02rem 0.05rem rgba(0, 0, 0, 0.1333333333);}
.video-dialog .cn-wh, .video-dialog .cn-w, .video-dialog .cv-wh, .video-dialog .cv-w{width: 100%;}
.video-dialog .cn-wh, .video-dialog .cn-h, .video-dialog .cv-wh, .video-dialog .cv-h{height: 100%;}
.video-dialog .cn-wh, .video-dialog .cn-w, .video-dialog .cn-h{object-fit: contain;}
.video-dialog .cv-wh, .video-dialog .cv-w, .video-dialog .cv-h{object-fit: cover;}
.video-dialog .pic-box{width: 100%;height: 100%;}
.video-dialog .pic-box img{max-width: 100%;max-height: 100%;}
.video-dialog .dialog-inner{max-width: 95vw;max-height: 90vh;}
.video-dialog .pic-box{min-width: 50vw;border-radius: 0.05rem;overflow: hidden;}
@media (max-width: 750px){.video-swp-wrap .vs-item{height: auto;}
}