
.container{
  position: relative;
  width: 100%;
}
.header{
  position: fixed;
  top: 0;
  z-index: 999;
  width: 100%;
  display: flex;
  background: rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
}
.nav{
  display: flex;
  flex: 1;
  justify-content: space-between;
  height: 17.0667vw;
  padding: 0 5.3333vw;
  align-items: center;
}
.logo{
  display: flex;
}
.logo-img{
  display: flex;
  width: 19.4667vw;
  height: 100%;
  object-fit: cover;
}
.nav-bar{
  display: flex;
  color: #fff;
  border: 1px solid #fff;
  font-size: 3.2vw;
  border-radius: 26.6667vw;
  cursor: pointer;
  width: 26.1333vw;
  height: 9.6vw;
  align-items: center;
  justify-content: center;
}
.jt-img{
  width: 3.2vw;
  height: 3.2vw;
}
/* banner-1 */
.swiper {
  position: relative;
  /* width: 100vw; */
  width: 100%;
  height: 100vh;
  background-position: center center;
  background-image: url(../../image/mobile/indexBg.jpg);
  /* background-size: 100% auto; */
  /* background-repeat: no-repeat; */
  background-color: rgba(0, 0, 0,1);

}
.bannerInfo {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  /* height: 100%; */
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.mb_index_text {
  display: flex;
  width: 73.6vw;
}
.playIndexVideoBtn {
  display: flex;
  margin-top: 8vw;
}
.playIndexVideoBtn img{
  width: 14.4vw;
  cursor: pointer;
}
.topVideoBox {
  background-color: rgba(0, 0, 0,1);
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 100000;
  display: none;
}

.topVideo {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
}
.topVideo video {
  width: 100%;
  display: block;
}
.closeVideo {
  width: 5.3333vw;
  margin-top: 5.3333vw;
  cursor: pointer;
  display: block;
  transition: all 0.5s;
}
/* content */
.content{
  margin-top: 32px;
  padding: 0 24px;
}
.example-desc{
  display: flex;
  flex-direction: column;
  width: 100%;
  justify-content: center;
  align-items: center;
}
.desc-1{
  display: flex;
  color: #000;
  font-size: 4.8vw;
}
.desc-2{
  display: flex;
  color: #000;
  font-size: 3.2vw;
  padding-top: 1.0667vw;
  opacity: 0.6;
}
.example-tag{
  display: flex;
}
.tag{
  padding: 24px 0 4px 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.tag-item{
  display: flex;
  padding: 2.1333vw 0;
  width: calc( 25% - 4.2667vw);
  margin-bottom: 3.2vw;
  align-items: center;
  justify-content: center;
  font-size: 3.2vw;
  line-height: 3.2vw;
  color: rgba(0, 0, 0, 0.60);
  border: 0.5px solid #B2B3CF;
  cursor: pointer;
  font-weight: 500;
}
.tag-active{
  background: rgba(255, 45, 85, 0.10);
  border: 0.5px solid #FF2D55 !important;
  color: #FF2D55 !important;
}
/* lunbo */
.lb{
  display: flex; 
  width: 100%;
  margin-top: 2.1333vw;
}
.lb-item{
  display: flex;
  position: relative;
  width: 100%;
  /* height: 128.5333vw; */
}
.lb-img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  
}
.lb-data{
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.data-info{
  display: flex;
  padding: 5.3333vw 5.3333vw;
}
.info-desc{
  display: flex;
  padding-left: 2.1333vw;
  flex-direction: column;
}
.info-img{
  height: 7.4667vw;
  width: 6.9333vw;
  display: flex;
}
.info-title{
  display: flex;
  padding: 1.0667vw 0;
  color: #fff;
  font-size: 4.2667vw;
}
.info-span1{
  display: flex;
  color: #fff;
  font-size: 3.2vw;
  padding-bottom: 4.2667vw;
}
.data-data{
  display: flex;
}
.data-data-item{
  display: flex;
  flex-direction: column;
  color: #fff;
}
.data-sx{
  padding: 0 3.2vw;
  height: 100%;
  display: flex;
  align-items: center;
}
.s1{
  font-size: 3.2vw;
}
.s2{
  font-size: 6.4vw;
  font-weight: 500;
}
.s3{
  font-size: 3.2vw;
}
.lb-qh{
  display: flex;
  justify-content: center;
  /* margin-top: 4.2667vw; */
  padding: 6.4vw 0;
}
.qh-item{
  display: flex;
  width: 3.7333vw;
  height: 0.5333vw;
  margin-right: 1.6vw;
  background-color: #D9D9D9;
  cursor: pointer;
}
.qh-active{
  background-color: #FF2D55 !important;
}
.banner-hide{
  display: none !important;
}
/* lianxiwomen */
.lxwm{
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 8.5333vw 6.4vw;
  background-color: #FFF9F9;
}
.lxwm-title{
  color: #000;
  font-size: 4.8vw;
  line-height: 4.8vw;
}
.lx-img{
  width: 53.3333vw;
  object-fit: cover;
}
.lxwm-tag{
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  padding: 3.2vw 0 9.6vw 0;
}
.lxwm-tag-item{
  display: flex;
  color: #000;
  opacity: 0.6;
  font-size: 3.2vw;
  line-height: 3.2vw;
  padding: 0 2.1333vw;
}
.bor{
  border-left: 1px solid rgba(0, 0, 0, 0.6);
  border-right: 1px solid rgba(0, 0, 0, 0.6);
}
.zx{
  display: flex;
  color: #FF2D55;
  font-size: 3.7333vw;
  line-height: 3.7333vw;
  padding: 8.5333vw 0 4.2667vw 0;
}
.ms{
  color: #000;
  opacity: 0.6;
  display: flex;
  font-size: 4.2667vw;
  line-height: 4.2667vw;
}
/* footer */
.footer{
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 9.6vw 6.4vw;
  color: #B2B3CF;
  background-color: #000;
}
.footer-lxwm{
  display: flex;
  font-size: 4.2667vw;
  line-height: 4.2667vw;
  padding-bottom: 3.2vw;
}
.footer-other{
  font-size: 3.7333vw;
  padding-bottom: 1.0667vw;
}
.ewm{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.ewm-item{
  display: flex;
  width: calc( 33.3% - 11.7333vw);
  flex-direction: column;
}
.ewm-txt{
  font-size: 3.2vw;
  padding-top: 3.2vw;
  line-height: 3.2vw;
  display: flex;
  justify-content: center;
}
.jl{
  margin-top: 6.4vw;
}
.footer-logo{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: 16vw;
}
.footer-logo img{
  width: 53.3333vw;
  object-fit: cover;
}
.footer-bottom{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: 4.2667vw;
  color: #B2B3CF;
  font-size: 3.7333vw;
}
.right-content {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 50vw;
  background-color: #fff;
  z-index: 9999;
}
.right-content span{
  color: #192544;font-weight: 500;font-size: 16px;
}
.right-content img{
  width: 16px;
}
.show{
  display: block;
}
.no-show{
  display: none;
}