/* ************************ Mobile端 ************************ */

/* ========================= 无他相机 ========================= */
.m-layout .wuta-cam {
  position: relative;
  background: linear-gradient(to bottom, #D8ECFF 0%, #FFFFFF 8rem);
  padding-top: 1.43rem;
}
.m-layout .wc-logo {
  width: 5.12rem;
  /* height: 1.6rem; */
  height: auto;
}
.m-layout .wc-slogan  {
  font-size: .48rem;
  color: #000;
  letter-spacing: .2rem;
}
.en .m-layout .wc-slogan {
  letter-spacing: 0;
}
.m-layout .wc-img {
  width: 4.8rem;
  height: 10rem;
}
.m-layout .wc-download-btn {
  position: fixed;
  left: 50%;
  top: 12.6rem;
  transform: translateX(-50%);
  z-index: 10;
  width: 3.4rem;
  height: .94rem;
  border-radius: .47rem;
  background: linear-gradient( 230deg, #F1E5F8 0%, #C8BCFE 39%, #868AFF 100%);
  font-size: .34rem;
  color: #fff;
  font-weight: 600;
  line-height: normal;
}

/* ========================= 无他直播伴侣 ========================= */
.m-layout .wuta-vcam {
  margin-top: 1.4rem;
}
.m-layout .vc-title {
  font-size: .6rem;
  color: #000;
  line-height: .84rem;
}
.m-layout .vc-title .color {
  margin-left: .13rem;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
  .m-layout .vc-title .color {
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    background-image: url('../../images/v2/color-bg.png');
  }
}
.m-layout .vc-desc {
  margin-top: .05rem;
  font-size: .28rem;
  color: #222222;
  line-height: .4rem;
}
.m-layout .vc-desc .split {
  width: .1rem;
  height: .1rem;
  border-radius: 50%;
  background: #B4AAF8;
  margin: 0 .1rem;
}
.m-layout .vc-video {
  position: relative;
  width: 4.8rem;
  height: 10rem;
}
.m-layout .vc-video .video-poster {
  position: absolute;
  left: .28rem;
  top: .8rem;
  width: 4.25rem;
  height: 8.25rem;
  object-fit: cover;
  border-radius: .7rem;
}
.m-layout .vc-video .border {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.m-layout .vc-video .play {
  position: absolute;
  left: 1.91rem;
  top: 4.43rem;
  width: 1rem;
  height: 1rem;
  pointer-events: none;
}

/* ========================= 功能展示 ========================= */
.m-layout .wuta-features {
  margin-top: 1.4rem;
  margin-bottom: 1.4rem;
}
.m-layout .p1-title{
  font-size: .6rem;
  color: #000;
  line-height: .84rem;
  font-weight: 500;
  text-align: center;
}
.m-layout .p1-desc {
  margin-top: .06rem;
  font-size: .28rem;
  color: #222222;
  line-height: .4rem;
  text-align: center;
}
.m-layout .p1-desc.color {
  color: #A683EC;
  font-weight: 600;
}
.m-layout .features-video {
  margin-top: .5rem;
  width: 6rem;
  height: 3.36rem;
}
.m-layout .wf-part-2 {
  margin-top: 1.4rem;
}
.m-layout .p2-title {
  font-size: .6rem;
  font-weight: 500;
  line-height: .84rem;
  text-align: center;
}
.m-layout .p2-title .color {
  margin-left: .13rem;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
  .m-layout .p2-title .color {
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    background-image: url('../../images/v2/color-bg.png');
  }
}
.m-layout .p2-sub-title {
  margin-top: .06rem;
  font-size: .28rem;
  color: #010101;
  line-height: .4rem;
}
.m-layout .p2-sub-title i {
  display: inline-block;
  width: .08rem;
  height: .08rem;
  border-radius: 50%;
  background: #AA95FD;
  margin: 0 .1rem;
}
.m-layout .features-img {
  margin-top: .4rem;
  width: 5.6rem;
  height: 10rem;
}

/* ========================= Footer ========================= */
.m-footer {
  padding: .44rem .6rem .5rem;
  background: #191919;
}
.m-footer .company,
.m-footer .copyright,
.m-footer .icp-wrap,
.m-footer .icp,
.m-footer .icp2-wrap,
.m-footer .icp2 {
  font-size: .24rem;
  color: #FFFFFF;
  line-height: .48rem;
  font-weight: 500;
}

/* ========================= 模态框 ========================= */
@keyframes mModalBg {
  from {
    background: rgba(0, 0, 0, 0);
  }
  to {
    background: rgba(0, 0, 0, .8);
  }
}
.m-modal {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1000;
  width: 100%;
  height: 100%;
  animation: mModalBg .3s forwards;
  display: none;
}
#vcam-video-modal video {
  width: 80%;
  height: auto;
  max-height: 80%;
  background: #000;
  object-fit: contain;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
#vcam-video-modal .close {
  margin-top: .2rem;
  width: .6rem;
  height: .6rem;
  border: 1px solid #fff;
  border-radius: 50%;
  background: url('../../images/v2/w-close.png') no-repeat center center/.4rem .4rem;
}