@media (min-width: 767px) {
    .d-md-none-1 {
        display: none;
    }
}

@media (max-width: 768px) {
    .d-md-none-2 {
        display: none;
    }
}


.vh-50 {
    min-height: 50vh;
}

.vh-200 {
    min-height: 200vh;
}


.vh-10 {
    min-height: 10vh;
}

.product-maidian {
    color: #b0b0b0;
    font-size: 12px;
}

/* hover效果，鼠标滑动向上偏移  这里的效果不止用于card中，其他的有该效果需求的都可以使用*/
.card-hover {
    text-decoration: none;

    transition: All 0.4s ease-in-out;
    -webkit-transition: All 0.4s ease-in-out;
    -moz-transition: All 0.4s ease-in-out;
    -o-transition: All 0.4s ease-in-out;
}

.card-hover:hover {
    text-decoration: none;

    transform: translate(0, -10px);
    -webkit-transform: translate(0, -10px);
    -moz-transform: translate(0, -10px);
    -o-transform: translate(0, -10px);
    -ms-transform: translate(0, -10px);
    -webkit-box-shadow: 0px 5px 15px #e5e5e5;
    -moz-box-shadow: 0px 5px 15px #e5e5e5;
    box-shadow: 0px 5px 15px #e5e5e5;
}

/* hover扩大阴影效果  默认是shadow-sm  hover后变为shadow-lg*/
.card-shadow-hover {
    /* box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); */
    transition: 0.5s;
}

.card-shadow-hover:hover {
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
    transition: 0.3s;
}





/**=========================
    Case-logo 
=========================**/
.index-case-logo .wrapper {
    /* width: 90%; */
    /* max-width: 1536px; */
    margin-inline: auto;
    position: relative;
    height: 100px;
    /* margin-top: 5rem; */
    overflow: hidden;
    mask-image: linear-gradient(to right,
            rgba(0, 0, 0, 0),
            rgba(0, 0, 0, 1) 20%,
            rgba(0, 0, 0, 1) 80%,
            rgba(0, 0, 0, 0));
}

@keyframes scrollLeft {
    to {
        left: -200px;
    }
}

.index-case-logo .wrapper .item {
    width: 200px;
    height: 100px;
    /* background-color: red; */
    border-radius: 6px;
    position: absolute;
    left: max(calc(200px * 8), 100%);
    animation-name: scrollLeft;
    animation-duration: 30s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

.index-case-logo .item img {
    width: 100%;
}

.index-case-logo .item1 {
    animation-delay: calc(30s / 8 * (8 - 1) * -1);
}

.index-case-logo .item2 {
    animation-delay: calc(30s / 8 * (8 - 2) * -1);
}

.index-case-logo .item3 {
    animation-delay: calc(30s / 8 * (8 - 3) * -1);
}

.index-case-logo .item4 {
    animation-delay: calc(30s / 8 * (8 - 4) * -1);
}

.index-case-logo .item5 {
    animation-delay: calc(30s / 8 * (8 - 5) * -1);
}

.index-case-logo .item6 {
    animation-delay: calc(30s / 8 * (8 - 6) * -1);
}

.index-case-logo .item7 {
    animation-delay: calc(30s / 8 * (8 - 7) * -1);
}

.index-case-logo .item8 {
    animation-delay: calc(30s / 8 * (8 - 8) * -1);
}

/**=========================
      END Case-logo   
  =========================**/