.detailImg{margin-bottom: 0.26rem;}

.sec1{
    background: url('../../img/case/zybioCalendar2023/bj1.jpg') no-repeat center;
    background-size: cover;
    background-position:center;
    height: 9.16rem;
    position: relative;
}
.sec1 .imgbox{width: 50%; margin: 0 auto; position: relative; top:50%; transform: translateY(-50%)}
.sec1 .imgbox .img1{animation: animate2 5s ease-in-out 0.5s infinite alternate;}
.sec1 .imgbox .img2{width: 100%; left: 0; position: absolute; z-index: 2; top:0;animation: animate 5s ease-in-out 0.5s infinite alternate;}
@keyframes animate {
    0%{transform: translateY(0);}
    10%{transform: translateY(0);}
    90%{transform: translateY(-30%);}
    100%{transform: translateY(-30%);}
}
@keyframes animate2 {
    0%{transform: translateY(0);}
    10%{transform: translateY(0);}
    90%{transform: translateY(30%);}
    100%{transform: translateY(30%);}
}
.sec2{height: 9.18rem;}
.sec3{height: 7.74rem;}
.sec4{height: 9.14rem;}
.sec5{height: 9.3rem;}
.sec6{
    background: url('../../img/case/zybioCalendar2023/bj1.jpg') no-repeat center;
    background-size: cover;
    background-position:center;
    height: 7.3rem;
    padding-top:1rem;
    position: relative;
}
.sec6 .page .prev,.sec6 .page .next{width: 0.4rem !important;transform:translateY(-50%); cursor: pointer; z-index: 4; transition: transform 0.5s ease;  }
.sec6 .page .prev{left:0.3rem;}
.sec6 .page .next{right:0.3rem;}
.sec6 .page .prev img{transform: rotateY(-180deg);}
.sec6 .page .btn:hover{transform: scale(1.04) translateY(-50%);}
.sec7{height: 9.2rem;}
.sec8{height: 6.6rem;}
.sec9{height: 7.4rem;}
.sec10{height: 7.56rem;}

@media all and (max-width: 767px) {
    .sec1 {height: 8.16rem;}
    .sec1 .imgbox{width: 90%;}
    .sec2,
    .sec3,
    .sec4,
    .sec5,
    .sec7,
    .sec8,
    .sec9,
    .sec10 {height: auto;}
    .sec6{height: 4rem;}

}