div {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.opacity-style {
    opacity: 0;
}

/*综合部分 start*/
#solution {
    background-image: url("http://yirenwulian.com/EasyHome/zonghe.png");
    background-size: cover;
    background-position: center center;
    height:  calc(100vh - 67px) ;
    width: 100%;
}

#solution .line {
    height: 2px;
    width: 80%;
    margin: 12px auto;
    display: flex;
}

#solution .line div {
    background: #999;
    width: 30%;
    height: 2px;
    margin: 4px auto;

}

.line div:nth-child(1) {
    background: #3489d9 !important;
}

/*综合部分 end*/

/*综合解决方案定制  start*/
#synthetical-solution {
    padding-top: 67px !important;
    /*height: calc(100vh - 67px) !important;*/
}

#synthetical-solution .overlay {
    padding: 0!important;
    position: absolute;
    z-index: -9999;
    top: 7%;
    width: 37%;
    left:  50%;
    transform: translateX(-50%);
    height: 100%;
}

#synthetical-solution .overlay .inner-image {
    width: 100%; /* 让div中的图片充满父容器 */
    height: 100%; /* 让div中的图片充满父容器 */
}

/*综合解决方案定制  end*/
#soft-hardware {
    background-image: url("/static/images/soft-hardware.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;

}

.control {
    opacity: 0;
}

.control-content:hover {
    background: rgba(255, 255, 255, 0.9);
    color: #000 !important;
    transition: all linear 0.3s;

}

.control-content:hover .control {
    opacity: 1;
    transition: all linear 0.3s;
}

#soft-hardware .control-content {
    cursor: pointer;
}

/** 集成交付 **/
#delivery {
    /*height: calc(100vh - 67px) !important;*/
}


/*经典案例*/
#classic-case {
    background-image: url("/static/images/case-bg.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: calc(100vh - 67px) !important;
}

.scroll-container {
    white-space: nowrap; /* 防止文本换行 */
    overflow-x: auto; /* 横向滚动条 */
    width: 100%; /* 容器宽度 */
    scrollbar-width: none; /* 隐藏滚动条 Firefox */
    -ms-overflow-style: none; /* 隐藏滚动条 IE/Edge */
}

.scroll-container::-webkit-scrollbar {
    display: none; /* 隐藏滚动条 Chrome/Safari/Opera */
}

.scroll-item {
    display: inline-block; /* 内联块级元素 */
    /* 每个滚动项的宽度 */
    height: 260px; /* 每个滚动项的高度 */
    background-color: #f2f2f2; /* 背景颜色，可选 */
    margin: 5px 15px; /* 项之间的间距，可选 */

}

.text-line-2 {
    text-transform: capitalize;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.text-line-4 {
    text-transform: capitalize;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}


@media (min-width: 992px) {
    .lg-vh-100 {
        height: calc(100vh - 67px) !important;
    }
}

@media (max-width: 991px) {
    .xs-vh-100 {
        height: 100% !important;
    }
}


/**tail*/
.qrcode-img {
    position: relative;

}

.qrcode-img .qrcode-item {
    width: 120px;
    opacity: 0; /* 设置初始的透明度为0，让其开始时隐藏 */
}

.qrcode-img:hover .qrcode-item {
    position: absolute;
    opacity: 1;
    top: -130px;
    left: -50px;
    transition: all .4s;
}

#solution-item .desc-solution {
   opacity: 0;

    transition: all .3s;
}

#solution-item:hover .desc-solution {
    opacity: 1;
    transition: all .3s;
}