/* line 3, ../../sass/app/home.scss */
#main.index .acc {
  -moz-transition: -moz-transform 0.2s ease-in;
  -o-transition: -o-transform 0.2s ease-in;
  -webkit-transition: -webkit-transform 0.2s ease-in;
  transition: transform 0.2s ease-in;
}
/* line 5, ../../sass/app/home.scss */
#main.index .acc.stop {
  -moz-transition: -moz-transform 0.5s linear;
  -o-transition: -o-transform 0.5s linear;
  -webkit-transition: -webkit-transform 0.5s linear;
  transition: transform 0.5s linear;
}
/* line 9, ../../sass/app/home.scss */
#main.index .transparent-reference {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  z-index: 0;
}
/* line 18, ../../sass/app/home.scss */
#main.index .banner-container {
  width: 100%;
  height: 100vh;
  overflow: hidden;
  margin-bottom: 2.5vw;
}
/* line 19, ../../sass/app/home.scss */
#main.index .banner-container.mobi {
  display: none;
}
/* line 28, ../../sass/app/home.scss */
#main.index .banner-container .bg,
#main.index .banner-container .mask {
  width: 100%;
  height: inherit;
  position: absolute;
  left: 0;
  top: 0;
}
/* line 36, ../../sass/app/home.scss */
#main.index .banner-container .bg {
  z-index: 1;
  object-fit: cover;
}
/* line 40, ../../sass/app/home.scss */
#main.index .banner-container .mask {
  z-index: 2;
}
/* line 44, ../../sass/app/home.scss */
#main.index .banner-container .info {
  height: inherit;
  position: relative;
  z-index: 9;
}
/* line 49, ../../sass/app/home.scss */
#main.index .banner-container .info .slogan {
  position: absolute;
  bottom: 8.5vw;
  left: 0;
  font-size: 3vw;
  line-height: 1.5;
  color: #ffffff;
}
/* line 58, ../../sass/app/home.scss */
#main.index .banner-container .info .slogan .t:nth-child(1) {
  font-size: 50px;
}
/* line 61, ../../sass/app/home.scss */
#main.index .banner-container .info .slogan .t:nth-child(2) {
  font-size: 32px;
}
/* line 68, ../../sass/app/home.scss */
#main.index .cases {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
/* line 72, ../../sass/app/home.scss */
#main.index .cases > .item {
  margin-bottom: 1.6vw;
  position: relative;
}
/* line 76, ../../sass/app/home.scss */
#main.index .cases > .item .wrapper {
  width: 100%;
  height: inherit;
  overflow: hidden;
  -moz-transition: box-shadow 0.3s;
  -o-transition: box-shadow 0.3s;
  -webkit-transition: box-shadow 0.3s;
  transition: box-shadow 0.3s;
  perspective: 3000;
  -webkit-perspective: 3000;
}
/* line 90, ../../sass/app/home.scss */
#main.index .cases > .item.hover .info {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -webkit-transform: scale(1);
  transform: scale(1);
}
/* line 99, ../../sass/app/home.scss */
#main.index .cases > .item.hover .hover-cover {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
}
/* line 106, ../../sass/app/home.scss */
#main.index .cases > .item .anim,
#main.index .cases > .item .back,
#main.index .cases > .item .front,
#main.index .cases > .item .bg,
#main.index .cases > .item .info,
#main.index .cases > .item .hover-cover {
  width: 100%;
  height: inherit;
}
/* line 115, ../../sass/app/home.scss */
#main.index .cases > .item .front {
  position: absolute;
  left: 0;
  top: 0;
  backface-visibility: hidden;
}
/* line 121, ../../sass/app/home.scss */
#main.index .cases > .item .front {
  z-index: 2;
  background-color: #CCCCCC;
}
/* line 125, ../../sass/app/home.scss */
#main.index .cases > .item .bg,
#main.index .cases > .item .hover-cover {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}
/* line 132, ../../sass/app/home.scss */
#main.index .cases > .item .hover-cover {
  z-index: 3;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  object-fit: cover;
  -moz-transition: opacity 0.7s;
  -o-transition: opacity 0.7s;
  -webkit-transition: opacity 0.7s;
  transition: opacity 0.7s;
}
/* line 138, ../../sass/app/home.scss */
#main.index .cases > .item .info {
  position: relative;
  z-index: 5;
  background-color: rgba(0, 0, 0, 0.6);
  padding: 3.2vw;
  color: #ffffff;
  line-height: 1.3;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
  -moz-transition: opacity 0.5s, -moz-transform 0.5s;
  -o-transition: opacity 0.5s, -o-transform 0.5s;
  -webkit-transition: opacity 0.5s, -webkit-transform 0.5s;
  transition: opacity 0.5s, transform 0.5s;
}
/* line 148, ../../sass/app/home.scss */
#main.index .cases > .item .info .text {
  pointer-events: none;
}
/* line 154, ../../sass/app/home.scss */
#main.index .cases > .item .info .t1 {
  font-size: 18px;
  font-weight: bold;
}
/* line 158, ../../sass/app/home.scss */
#main.index .cases > .item .info .t2 {
  font-size: 14px;
}
/* line 161, ../../sass/app/home.scss */
#main.index .cases > .item .info .cates {
  font-size: 14px;
  margin-top: 12px;
  line-height: 1.5;
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-start;
  align-content: flex-start;
}
/* line 169, ../../sass/app/home.scss */
#main.index .cases > .item .info .cates .item {
  margin-right: 20px;
}
/* line 175, ../../sass/app/home.scss */
#main.index .cases > .item .info-m {
  display: none;
}
/* line 177, ../../sass/app/home.scss */
#main.index .cases > .item .info-m .t1 {
  font-size: 14px;
  margin-top: 8px;
  line-height: 1.3;
  font-weight: bold;
}
/* line 183, ../../sass/app/home.scss */
#main.index .cases > .item .info-m .t2 {
  font-size: 12px;
  line-height: 1.25;
  margin-top: 2px;
  font-weight: 300;
}
/* line 189, ../../sass/app/home.scss */
#main.index .cases > .item .info-m .cates {
  font-size: 12px;
  margin-top: 6px;
  line-height: 1.5;
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-start;
  align-content: flex-start;
}
/* line 197, ../../sass/app/home.scss */
#main.index .cases > .item .info-m .cates .item {
  margin-right: 10px;
  color: #999999;
}

/* line 207, ../../sass/app/home.scss */
.mask-anim {
  width: 100vw;
  height: 100vh;
  background-color: #000000;
  color: #ffffff;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-flow: column nowrap;
  flex-flow: column nowrap;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center;
  position: fixed;
  left: 0;
  top: -100vh;
  z-index: 999;
  -moz-transition: -moz-transform 0.6s;
  -o-transition: -o-transform 0.6s;
  -webkit-transition: -webkit-transform 0.6s;
  transition: transform 0.6s;
}
/* line 221, ../../sass/app/home.scss */
.mask-anim.active {
  transform: translateY(100vh);
}
/* line 224, ../../sass/app/home.scss */
.mask-anim .en {
  font-size: 60px;
}
/* line 227, ../../sass/app/home.scss */
.mask-anim .cn {
  font-size: 40px;
  margin-top: 10px;
}

@media screen and (max-width: 992px) {
  /* line 235, ../../sass/app/home.scss */
  #main.index .banner-container {
    display: none;
  }
  /* line 237, ../../sass/app/home.scss */
  #main.index .banner-container.mobi {
    display: block;
  }
  /* line 241, ../../sass/app/home.scss */
  #main.index .banner-container .info .slogan {
    bottom: 6vw;
  }
  /* line 243, ../../sass/app/home.scss */
  #main.index .banner-container .info .slogan .t:nth-child(1) {
    font-size: 30px;
  }
  /* line 246, ../../sass/app/home.scss */
  #main.index .banner-container .info .slogan .t:nth-child(2) {
    font-size: 18px;
  }
  /* line 252, ../../sass/app/home.scss */
  #main.index .cases {
    margin-top: 48px;
  }
  /* line 254, ../../sass/app/home.scss */
  #main.index .cases > .item {
    margin-bottom: 24px;
  }
  /* line 256, ../../sass/app/home.scss */
  #main.index .cases > .item .info-m {
    display: block;
  }
}
