/* 首页新闻资讯 */
.index-index-news{
  .title-tab{
    display: inline-block;
    font-size: .4rem;
    color: #a1a1a1;
    vertical-align: middle;

    &.click-able{
      cursor: pointer;
    }

    &.active{
      color: #333;
    }
  }
}


/* 全局尾部 */
.xfcard-common-footer{
  .web-logo{
    width: 1.3rem;
    height: 0.7rem;
    background: url(/static/images/logo-viwings-txt.png) no-repeat left center;
    background-size: contain;
  }
}


/* 合作企业 */
.home-index-companys{
  background: url(/static/images/xfcard/contactus/contactus.jpg) no-repeat center;
  background-size: cover;

  .block-title{
    font-size: 0.3rem;
    font-weight: bold;
    text-align: center;
    color: #FFF;
  }

  .m-content{
    background: linear-gradient(to top, rgba(0,0,0,.9), rgba(0,0,0,0.2));
    padding: 1rem 0;
  }

  .company-item{
    background: rgba(255,255,255,.7);
    backdrop-filter: blur(0.08rem);
    border-radius: .08rem;
    margin: .1rem;
    padding: .2rem .1rem;
    text-align: center;
  }

  .company-logo{
    height: 40px;
    width: 100%;
  }
}


/* 解决方案 */
.homepage-components-solution{
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  transition: all .6s;

  .show-background{
    
  }

  .block-title{
    font-size: 0.3rem;
    font-weight: bold;
    text-align: center;
    color: #FFF;
    text-shadow: .03rem .03rem 0.05rem rgba(0,0,0,.5);
  }

  .block-subtitle{
    font-size: 0.2rem;
    text-align: center;
    color: #FFF;
    text-shadow: .03rem .03rem 0.05rem rgba(0,0,0,.5);
  }

  .solution-list{
    position: relative;
    height: 4rem;
    display: flex;
    align-items: flex-end;
    justify-content: center;
  }

  .solution-item{
    width: 2rem;
    height: .8rem;
    padding: 0;
    border-radius: .09rem;
    background: rgba(0, 0, 0, .25);
    backdrop-filter: blur(0.04rem);
    transition: all .6s;
    margin-right: .1rem;
    position: relative;
    color: #FFF;
    text-align: center;
    

    &.active{
      width: 2.6rem;
      height: 3.8rem;
      padding: .15rem;
      text-align: left;
      border: .01rem solid #16c87e;

      .icon-container{
        color: rgb(22, 200, 126);
      }


      .icon-container{
        font-size: .2rem;
      }

      .item-title{
        display: inline-block;
      }

      .content-show{
        opacity: 1;
        transition-delay: .6s;
        transform: translateY(0);
        position: relative;
        height: 3.3rem;
      }
    }

    .icon-container{
      width: .5rem;
      height: .5rem;
      line-height: .5rem;
      text-align: center;
      font-size: .3rem;
      display: inline-block;
    }

    .item-title{
      display: block;
      font-size: .16rem;
    }

    .content-show{
      opacity: 0;
      transition: all .6s;
      transform: translateY(.1rem);
      position: absolute;

      height: 0;
      overflow-y: auto;
      line-height: 1.6;
    }
  }
}