body{
    background:url('/ebc-static/image/ebcInteractive/ebcInteractiveHeader.png') no-repeat ;
    background-color: #fff;
    background-size: 100% 980rem;
}
.contentBox{
    max-width: 1200rem;
    margin-inline:auto;
}
.ebcInteractiveTopic{
    padding:calc(80px + 64rem) 0  25rem;
}
.ebcInteractiveTopic>div{
    gap: 48rem;
}

.ebcInteractiveSlide{
    width: 588rem;
    position: relative;
}
.ebcInteractiveTopic .swiper-slide img
{
    width: 588rem;
    height: 392rem;    
    border-radius: var(--ebc-corner-radius-rc08);
    margin-bottom: 16rem;
}
@media (min-width: 996px) {

    
}
.ebcInteractiveTopicNewDesc{
    color: var(--ebc-text-secondary);
    margin:8rem 0;
}
.ebcInteractiveTopicNewTime{
    color: var(--ebc-text-secondary);
}
.ebcInteractive-prev img,
.ebcInteractive-next img{
    width: 32rem;
    height: 32rem;
}
.ebcInteractive-next img{
    transform: rotate(180deg);
}
.ebcInteractive-prev,.ebcInteractive-next{
    position: absolute;
    top:344rem;
    z-index: 2;
}
.ebcInteractive-prev{
    left:492rem;
}
.ebcInteractive-next{
    right:16rem;
}

.swiper-pagination{
    top:356rem;
    left:16rem!important;
    width: fit-content!important;
    bottom: unset!important;
}
.swiper-pagination .swiper-pagination-bullet{
    background-color: rgba(255, 255, 255, 0.48);
    border-radius: 1998px;
    opacity: 0.5;
    width: 16rem;
    height: 2rem;
}
.swiper-pagination .swiper-pagination-bullet-active{
    background-color:#fff;
    opacity: 1;
    width: 32rem;
}

.ebcInteractiveHotListTitle{
    padding:11rem 0 8rem;
    color: var(--ebc-brand-secondary-red);
    background: url('/ebc-static/image/ebcInteractive/ebcInteractiveHeaderListBg.png') no-repeat;
    background-size: 100% 100%;
}
.ebcInteractiveHotList{
    flex:1;
}
.ebcInteractiveHotListItem{
    gap: 16rem  ;
    padding:16rem 0;
    border-bottom:1px dashed rgba(0, 0, 0, 0.12);
}
.ebcInteractiveHotListItem .itemWord{
    color: var(--ebc-text-primary);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ebcInteractiveTopicNewTitle{
    color: var(--ebc-text-primary);
}
.ebcInteractiveHotListItem:hover .itemWord{
    color: var(--ebc-brand-secondary-red);
}
.ebcInteractiveHotListItem .itemTime-yearMonth{
    color: var(--ebc-text-secondary);
    width: 52rem;
}
.ebcInteractiveHotListItem:nth-of-type(1){
    padding:24rem 0 16rem;
}

@media (max-width:996px) {
    body{
        background:url('/ebc-static/image/ebcInteractive/ebcInteractiveHeaderM.png') no-repeat ;
        background-size: 100% 1360rem;
    }
    .ebcInteractiveTopic .contentBox{
        flex-direction: column;
        gap:96rem;
        padding-inline:32rem;
    }
    .ebcInteractiveSlide{
        width: 100%;
    }
    .ebcInteractiveTopic .swiper-slide img{
        width: 686rem;
        height: 456rem;
    }
    .ebcInteractiveTopic{
        padding: 32rem 0 96rem;
    }
    .ebcInteractiveHotListTitle{
        padding: 16rem 0 24rem;
        font-size: 40rem;
        line-height: 56rem;
        background: url('/ebc-static/image/ebcInteractive/ebcInteractiveHeaderListBgM.png') no-repeat;
        background-size: 100% 100%;
    }
    .ebcInteractiveHotListItem{
        gap:32rem;
        padding:32rem 0;
    }
    
    .ebcInteractiveHotListItem:nth-of-type(1){
        padding-top:48rem;
    }
    .swiper-pagination{
    top:420rem;
    width: 100%!important;
    bottom: unset!important;
}
.swiper-pagination .swiper-pagination-bullet{
    background-color: rgba(255, 255, 255, 0.48);
    border-radius: 1998px;
    opacity: 0.5;
    width: 32rem;
    height: 4rem;
    margin-right: 16rem;
}
.swiper-pagination .swiper-pagination-bullet-active{
    background-color:#fff;
    opacity: 1;
    width: 64rem;
}
}


.ebcInteractiveList{
    padding-bottom: 120rem;
}
.ebcInteractiveListTab{
    padding-left: calc(50vw - 600rem);
    margin-bottom: 25rem;
    gap:32rem;
}
.ebcInteractiveListTab>div{
    padding-inline: 8rem;
}
.ebcInteractiveListTab {
    position: sticky;
    top: 80px;
    z-index: 2;
    padding-block: 15rem;
}
.ebcInteractiveListTab.is-pinned {
    background: #fff;
}
.ebcInteractiveListTab .active{
    color: var(--ebc-brand-secondary-red);
    font-weight: 500;
    padding-bottom:4rem;
    border-bottom:2px solid var(--ebc-brand-secondary-red)
}

.ebcInteractiveListPart{
    gap:24rem;
    flex-wrap: wrap;
}
.ebcInteractiveListItem{
    flex:0 0 280rem;
    position: relative;
}
.ebcInteractiveListItem img{
    width: 100%;
    height: 188rem;
    border-radius: 6rem;
}
.ebcInteractiveListItemTitle{
    margin-top: 8rem;
    margin-bottom: 8rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ebcInteractiveListItemTime{
    font-size: 14rem;
    line-height: 18rem;
    color:var(--ebc-text-secondary_white);
    display: flex;
    color: var(--ebc-text-secondary);
    margin-bottom: 5rem;
    margin-top: 1rem;
}
.ebcInteractiveListPagation>*{
    width: 40rem;
    height: 40rem;
    text-align: center;
    line-height: 40rem!important;
    color: var(--ebc-text-secondary);
}
.ebcInteractiveListPagation .pagePrev{
    margin-right: 8rem;
}
.ebcInteractiveListPagation .pageNext{
    margin-left: 8rem;
}
.ebcInteractiveListPagation .activePage{
    border-radius: var(--ebc-corner-radius-full);
    background: rgba(165, 41, 51, 0.10);
    color: var(--ebc-brand-secondary-red);
    font-weight: 500;
}
.ebcInteractiveListPagation .pageNext{
    transform: rotate(180deg);
}
.ebcInteractiveListTab a{
     color: var(--ebc-text-secondary);
}
.ebcInteractiveListTab a:hover,.ebcInteractiveTopicNewTitle:hover,.ebcInteractiveListItem:hover .ebcInteractiveListItemTitle{
    color: var(--ebc-brand-secondary-red);
}
@media (max-width:996px){

    .ebcInteractiveList{
        padding-inline:32rem;
    }
.ebcInteractiveListTab{
    margin-bottom: 32rem;
}
.ebcInteractiveListItem{
    padding:32rem 0;
    flex:1;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.ebcInteractiveListItem img{
    float:right;
    width: 240rem;
    height: 160rem;
    border-radius: 16rem;
}
.ebcInteractiveListItemTitle{
    width: 414rem;
    height: 88rem;
    margin-bottom: 8rem;
    margin-top: 12rem;
}
.ebcInteractiveListItemTime{
    left: 0;
    bottom: 42rem;
    top: unset;
    position: absolute;
    font-size: var(--ebc-fontsize-25);
}
.ebcInteractiveListPagation{
    margin-top: 48rem;
}
.ebcInteractiveListPagation>*{
    width: 80rem;
    height: 80rem;
    line-height: 80rem!important;
}
.ebcInteractiveHotListItem .itemTime-yearMonth{
    color: var(--ebc-text-secondary);
    width: 104rem;
}
}