.demoCase_pic {
    width: 100%;
}

.democase_bg {
    /* background: url(/Data/Icon/Normal/blll.jpg); */
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
}

.demoCase_pic > img {
    width: 100%;
}

.card-img-top {
    height: 216px;
}

.demoCase_content {
    width: 1100px;
    margin: 0 auto;
}

    .demoCase_content > div:first-child > div {
        padding: 50px 0;
        font-weight: bold;
        font-size: 24px;
        color: #333;
        line-height: 24px;
        height: 24px;
    }

    .demoCase_content > div:first-child {
        border-bottom: 2px solid #666666;
    }


.demoCase_content_left {
    width: 14%;
    padding: 40px 0px 20px;
}

.card-body > div:first-child {
    font-size: 18px;
    text-align: center;
}

.card-body > div:nth-child(n+2) {
    font-size: 12px;
    margin-top: 10px;
    text-align: center;
    color: #777777;
}
/* 下拉框 */
/* 下拉按钮样式 */
.dropbtn {
    background-color: #cf0000;
    color: white;
    /* padding: 16px; */
    height: 48px;
    font-size: 16px;
    width: 200px;
    border: none;
    cursor: pointer;
}

.liBackground {
    background: #cf0000 !important;
}

/* 容器 <div> - 需要定位下拉内容 */
.dropdown {
    z-index: 2;
    position: relative;
    display: inline-block;
}

/* 下拉内容 (默认隐藏) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

    /* 下拉菜单的链接 */
    .dropdown-content a {
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
        z-index: 99;
        font-size: 14px;
    }

        /* 鼠标移上去后修改下拉菜单链接颜色 */
        .dropdown-content a:hover {
            background-color: #f1f1f1;
            font-size: 14px;
        }

/* 在鼠标移上去后显示下拉菜单 */
.dropdown:hover .dropdown-content {
    display: block;
}

/* 当下拉内容显示后修改下拉按钮的背景颜色 */
.dropdown:hover .dropbtn {
    background-color: red;
}

.demoCase_content_left > div {
    /* border-radius: 4px; */
    height: 48px;
    /* background-color: #ccc; */
    /* border: 1px solid #cccccc; */
}

.shifanbtn {
    color: #ffffff;
    background-color: #cf0000;
}

    .shifanbtn a {
        color: #ffffff;
    }

.demoCase_content_left > :last-child {
    background-color: #F4F4F4;
}
/* .btn-secondary{
    background-color: #ccc !important;
    border: #ccc !important;
    color: #333 !important;
} */
.demoCase_content_left > div:hover {
    cursor: pointer;
    /* background-color: red; */
    /* color: #ffffff; */
}

.demoCase_content_left > div:first-child {
    /* background-color: brown; */
    margin-bottom: 2px;
}

.demoCase_content_right {
    width: 84%;
    padding: 40px 0px 20px;
}

.demoCase_content_class > div {
    width: 50%;
}

    .demoCase_content_class > div:first-child > div {
        width: 120px;
        height: 40px;
        border-radius: 4px;
        color: #fff;
        background-color: #cccccc;
        /* border: 1px solid #cccccc; */
    }

        .demoCase_content_class > div:first-child > div:hover {
            cursor: pointer;
            /* background-color: brown; */
            /* color: #ffffff; */
        }

.demoCase_content_class_card {
    z-index: 98;
    flex-wrap: wrap;
    width: 100%;
}

    .demoCase_content_class_card > div {
        width: 32%;
        -webkit-transition: all .2s linear;
        /*渐变效果*/
        transition: all .2s linear;
        position: relative;
        z-index: 1;
        /* padding-bottom: 20px; */
        cursor: pointer;
        box-shadow: 0 0 10px #e6e6e6;
        margin: 5px;
        height: 300px;
    }

        .demoCase_content_class_card > div:hover {
            z-index: 2;
            /*设置在顶层显示*/
            -webkit-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
            /*添加阴影*/
            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
            -webkit-transform: translate3d(0, -2px, 0);
            /*向上浮动*/
            transform: translate3d(0, -2px, 0);
            /*border-bottom: 1px solid rgb(235, 69, 69);*/
        }

.demoCase_content_class_card {
    padding-bottom: 48px;
    /* border-bottom: 1px solid #DFDFDF; */
    margin-top: 48px;
}

    .demoCase_content_class_card > div > img {
        height: 70%;
    }

.democase_pag > div {
    margin: 40px 20px 20px;
    width: 34px;
    border-radius: 50%;
    border: 1px solid #bfbfbf;
    height: 34px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .democase_pag > div:hover {
        cursor: pointer;
        border: 1px solid #ec282e;
        background: #ec282e;
    }
/*产品方案 start*/
.terrace_content {
    width: 100%;
    position: relative;
}

.allWhite {
    color: white;
}

    .allWhite .short-line-up {
        border-bottom: 1px solid white !important;
    }

    .allWhite .short-line-down {
        border-top: 1px solid white !important;
    }

    .allWhite.head-line .icon, .allWhite.head-line .head-title {
        color: white !important;
    }

.content_bg {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.content_bg_top, .content_bg_bottom {
    width: 100%;
    height: 50%;
}

.content_bg_top {
    display: flex;
    align-items: flex-end;
    background-color: #d33c3c;
}

    .content_bg_top img {
        width: 100%;
    }

.content_bg_bottom {
    background-color: #fdeaea;
}

.terrace_cards {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    position: relative;
}

.div_transform45 {
    transform: rotate(45deg);
    -ms-transform: rotate(45deg); /* IE 9 */
    -moz-transform: rotate(45deg); /* Firefox */
    -webkit-transform: rotate(45deg); /* Safari 和 Chrome */
    -o-transform: rotate(45deg); /* Opera */
}

.div_transform_-45 {
    transform: rotate(-45deg);
    -ms-transform: rotate(-45deg); /* IE 9 */
    -moz-transform: rotate(-45deg); /* Firefox */
    -webkit-transform: rotate(-45deg); /* Safari 和 Chrome */
    -o-transform: rotate(-45deg); /* Opera */
}

.terrace_card {
    -webkit-transition: all .2s linear;
     transition: all .2s linear; 
    position: relative;
    top: 5%;
    z-index: 1;
    color: #98643e;
    cursor: pointer;
    box-shadow: 0 0 10px #e6e6e6;
    margin: 70px;
    height: 300px;
    background-color: white;
    padding: 5px;
    box-sizing: border-box;
}
.terrace_card_100 {
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.terrace_card_within {
    position: relative;
    top: calc(-25% + 7px);
    left: calc(-25% + 7px);
    width: calc(150% - 14px);
    height: calc(150% - 14px);
}

.card_within_top, .card_within_bottom {
    width: 100%;
    height: 50%;
    text-align: center;
}
.card_within_bottom {
    padding-top: 20px;
}
.terrace_card_noList {
    position: relative;
    top: 5%;
    z-index: 1;
    margin: 70px;
    height: 300px;
}

.terrace_card_w1 {
    width: 100%;
}

    .terrace_card_w1 > div {
        width: 20%;
    }

.terrace_card_w2 {
    width: 66.66%;
    position: absolute;
}

    .terrace_card_w2 > div {
        width: 30%;
    }

.terrace_card:hover {
    z-index: 2;
    box-shadow: 0 0 10px 10px #595959;
}
/*产品方案 end*/