body{
    background: #F6F7F9;
    width:100vw;
    overflow-x:hidden;
    --medias-gap-48:48px;
    --medias-gap-24:24px;
}
.medias-main {
    display: block;
    width: 100%;
    max-width: var(--size-safearea);
    margin: 0 auto;
    padding-top: 116px;
    min-height:100vh;
}

/*产品列表页面*/
.medias-products-main{}
/*产品资源详情页面*/
.medias-products-detail-main{}
/*logo列表页面*/
.medias-logos-main{}

/*大标题*/
.bigTitle{
    align-self: stretch;
    color:#000;
    font-size: 48px;
    font-weight: 600;
    line-height: 130%;
    margin-bottom:var(--medias-gap-48);
}

/*副标题容器*/
.smallTitleContainer{
    display: flex;
    align-items: flex-end;
    gap: 24px;
    align-self: stretch;
    margin-bottom:var(--medias-gap-24);
}

.medias-products-main .smallTitleContainer,.medias-logos-main .smallTitleContainer{
    margin-bottom:var(--medias-gap-48);
}

.medias-logos-main .smallTitleContainer{
    justify-content:space-between;
}

/*副标题名称*/
.smallTitle{
    flex: 1 0 0;
    color:#000;
    font-size: 32px;
    font-weight: 600;
    line-height: 130%;
}

.medias-products-main .smallTitle{
    font-size:48px;
}


/*查看更多按钮*/
.smallTitleContainer .button{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2px;
}

.smallTitleContainer .button .text{
    color: #C03939;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
}

.bigTitle .button svg{
    width: 14px;
    height: 14px;
}

/*产品列表容器*/
.productList{
    display: flex;
    align-items: flex-start;
    align-content: flex-start;
    gap: 24px;
    align-self: stretch;
    flex-wrap: wrap;
    margin-bottom:var(--medias-gap-48);
}

/*产品卡片*/
.productCard{
    display: flex;
    width: calc((var(--size-safearea) - 72px) / 4);/*减去三个间距*/
    flex-direction: column;
    align-items: center;
    gap: 16px;
}
/*联动遮罩*/
.productCard:hover .productCardImgDivMask{
    /*display:flex;*/
    opacity:1;
}
/*图片容器*/
.productCardImgDiv{
    position:relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    flex: 1 0 0;
    align-self: stretch;
    border-radius: 16px;
    background:#FFF;
}

/*遮罩*/
.productCardImgDivMask{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.6);
    border-radius: 16px;
    position:absolute;
    z-index:10;
    opacity:0;
    transition: all 0.25s;
}

.productCardImgDivMask svg{
    width: 32px;
    height: 32px;
}

/*产品图片*/
.productCardImgDiv img{
    width:100%;
    height: 100%;
    border-radius: 16px;
    object-fit: cover;
}

/*产品名称*/
.productCardName{
    align-self: stretch;
    color:#000;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    line-height: 130%;
}




/*Logos列表*/
.logosList{
    display: flex;
    align-items: flex-start;
    align-content: flex-start;
    gap: 24px;
    align-self: stretch;
    flex-wrap: wrap;
    margin-bottom:var(--medias-gap-48);
}

/*详情页*/
.medias-products-detail-main .logosList{
    display:block;
    break-inside: avoid;
    columns: 3;
}


/*Logo卡片*/
.logoCard{
    position:relative;
    display: flex;
    height: 216px;
    width: calc((var(--size-safearea) - 48px) / 3);/*减去2个间距*/
    flex-direction: column;
    align-items: center;
    gap: 16px;
    border-radius: 16px;
    background:#FFF;
    overflow: hidden;
    cursor:pointer;
}

/*详情页*/
.medias-products-detail-main .logoCard{
    height: auto;
    width: calc((var(--size-safearea) - 48px) / 3);/*减去2个间距*/
    margin-bottom:var(--medias-gap-24);
    gap: unset;
}

.logoCard:hover .logoCardImgDivMask{
    display:grid;
    opacity:1;
}

.logoCard:hover .row2[type=video] svg:last-child{
    opacity:1;
}

.logoCard:hover .otherSvg{
    opacity:0;
}

/*Logo图片容器*/
.logoCardImgDiv{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    flex: 1 0 0;
    align-self: stretch;
    /*border-radius: 16px;*/
}

/*logo列表页面+详情页*/
.medias-logos-main .logoCardImgDiv,.medias-products-detail-main .logosList[key=devices] .logoCard{
    background-image:url("https://zhiyun-website-shenzhen.oss-cn-shenzhen.aliyuncs.com/about-us-media-kit/media-kit-bg-transparent.png");
}

/*遮罩*/
.logoCardImgDivMask{
    display:grid;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    grid-auto-rows: 1fr;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.6);
    position:absolute;
    z-index:10;
    transition:all 0.25s;
    opacity:0;
}

.logoCardImgDivMask[type=video]{
    display:grid;
    opacity:0;
}
.logoCardImgDivMask[type=video] svg{
    opacity:1;
}
.logoCardImgDivMask[type=video]:hover{
    opacity:1;
}
/*.logoCardImgDivMask[type=video]:hover .otherSvg{*/
/*    display:none;*/
/*}*/
.logoCard .otherSvg{
    position: absolute;
    top: calc(50% - 25px);
    left: calc(50% - 24px);
    opacity:0.8;
    transition:all 0.25s;
}

.logoCardImgDivMask .row1,.logoCardImgDivMask .row2,.logoCardImgDivMask .row3{
    width:100%;
    cursor:pointer;
}

/*放大图标*/
.logoCard .row2 svg{
    width: 32px;
    height: 32px;
}

.logoCard .row2[type=video] svg:first-child{
    display:none;
}
.logoCard .row2[type=video] svg:last-child{
    width: 48px;
    height: 48px;
}

/*下载图标*/
.logoCard .row3 svg{
    position:absolute;
    right:16px;
    bottom:16px;
    width: 24px;
    height: 24px;
    z-index:20;
}

.logoCard .row3 .copySvg{
    right:56px
}
.copySvgTips{
    position:absolute;
    opacity:0;
    border-radius: 8px;
    background:#343434;
    color:#ffffff;
    padding: 4px 10px;
    font-size: 12px;
    width: max-content;
    transition:all 0.15s;
    z-index:10000
}

/*logo图片*/
.logoCardImgDiv img{
    width:100%;
    height: 100%;
    object-fit: cover;
}


/*联系我们*/
.prContact{
    display: flex;
    padding: var(--medias-gap-48);
    justify-content: center;
    align-items: center;
    align-self: stretch;
    border-radius: 16px;
    background: #FFF;

    color:#000;
    text-align: center;
    font-size: 32px;
    font-weight: 600;
    line-height: 130%;
    margin-bottom:var(--medias-gap-48);
}

/*跳转新闻按钮容器*/
.newsButtonContainer{
    display:flex;
    justify-content: center;
    margin-bottom:var(--medias-gap-48);
}

/*跳转新闻按钮*/
.newsButton{
    display: flex;
    padding: 12px 20px;
    justify-content: center;
    align-items: center;
    gap: 4px;
    border-radius: 16px;
    background: #FFF;
    cursor:pointer;

    color: #000;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    line-height: 130%;
    transition: all 0.25s;
}

.newsButton:hover{
    background:#000000;
    color:#ffffff;
}

.newsButton svg{
    width: 16px;
    height: 16px;
    stroke:currentColor;
}

.loadMore svg{
    width: 18px;
    height: 18px;
}

.newsButton svg path{
    stroke:currentColor;
}

/*.fullScreenMaskOuter{*/
/*    display:none;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*    width:100%;*/
/*    height:100%;*/
/*    background:rgba(0,0,0,0.9);*/

/*    position:fixed;*/
/*    top: 0;*/
/*    left: 0;*/
/*    z-index: 888888;*/
/*}*/
/*全屏弹出遮罩*/
.fullScreenMask{
    display:none;
    align-items: center;
    justify-content: center;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.9);

    position:fixed;
    top: 0;
    left: 0;
    z-index: 999999;
}

/*内容外层容器*/
.fullScreenMaskContentOutContainer{
    display: flex;
    flex-direction:column;
    justify-content: center;
    align-items: center;
}

/*遮罩内容,左右按钮+图片 容器*/
.fullScreenMaskContentContainer{
    display: flex;
    /*padding-top: 80px;*/
    justify-content: center;
    align-items: center;
    gap: 24px;
}

/*图片容器*/
.fullScreenMaskContentContainerImgDiv{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap: 24px;
    min-width:128px;
    max-width:65.625vw;
    /*padding: 0 24px;*/
}

.fullScreenMaskContentContainerImgDivMedia{
    position:relative;/*使用透明度控制*/
    display:flex;/*使用透明度控制*/
    justify-content:center;/*使用透明度控制*/
    width: 65.625vw;/*使用透明度控制*/
    height: 75vh;/*使用透明度控制*/
    justify-content: center;/*使用透明度控制*/
    align-items:center;
    border-radius:16px;
    overflow: hidden;
}

/*图片*/
.fullScreenMaskContentContainerImgDiv img{
    /*height:75vh;*/
    height: 100%;
    object-fit:contain;
}
.fullScreenMaskContentContainerImgDiv video{
    width: 100%;
    object-fit:contain;
    border-radius: 16px;
}

/*LOGO列表页面*/
.medias-logos-main .fullScreenMaskContentContainerImgDiv img,.medias-products-detail-main .fullScreenMaskContentContainerImgDiv img{
    /*width:0;使用宽度控制*/
    position:absolute;/*使用透明度控制*/
    opacity:0;/*使用透明度控制*/
    border-radius:16px;/*使用透明度控制*/
    transition:all 0.25s;
}


/*左箭头按钮容器*/
.fullScreenMaskContentContainer .arrowIconContainer{
    position:relative;
    display:flex;
    width: 56px;
    height: 56px;
    border-radius: 80px;
    align-items: center;
    justify-content: center;
    cursor:pointer;
    color: #ffffff;

    padding-bottom: 60px
}

.fullScreenMaskContentContainer .arrowIconContainer:hover {
    color:#000000;
}
.fullScreenMaskContentContainer .arrowIconContainer:hover  .arrowIcon{
    opacity: 1;
    background:#ffffff;
    color:#000000;
}

.fullScreenMaskContentContainer .arrowIcon{
    position:absolute;
    display:flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 80px;
    border: 2px solid #FFF;
    opacity: 0.1;
    transition:all 0.25s;
}

/*左箭头按钮图标*/
.fullScreenMaskContentContainer .arrowIconContainer{
    position:relative;
    /*width: 18px;*/
    /*height: 18px;*/
}
.arrowIconContainer svg{
    /*position:absolute;*/
    z-index:5;
}
.arrowIconContainer svg path{
    stroke: currentColor;
}

/*下载按钮容器*/
.fullScreenMaskDownloadContainer{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    align-self: stretch;
}

/*.medias-logos-main .fullScreenMaskDownloadContainer{*/
/*    position: fixed;*/
/*    bottom: 48px;*/
/*    width: 75vw;*/
/*}*/

.fullScreenMaskDownloadContainer .column1,.fullScreenMaskDownloadContainer .column2,.fullScreenMaskDownloadContainer .column3{
    display:flex;
    justify-content:center;
}
.fullScreenMaskDownloadContainer .column3{
    justify-content:flex-end;
    align-items:center;
    gap:16px;
    /*padding-right:100px;*/
}

/*关闭按钮容器*/
.fullScreenMaskDownloadContainer .closeButtonContainer{
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    /*margin-top: 24px;*/
    color:#ffffff;
    cursor:pointer;
}

/*关闭按钮*/
.fullScreenMaskDownloadContainer .closeButton{
    /*position:absolute;*/
    display:flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 80px;
    border: 2px solid #FFF;
    opacity: 0.1;
    overflow:hidden;
    color:#ffffff;
    cursor:pointer;
    transition:all 0.25s;
}

.fullScreenMaskDownloadContainer .closeButtonContainer:hover {
    color:#000000;
}

.fullScreenMaskDownloadContainer .closeButtonContainer:hover .closeButton{
    background:#ffffff;
    opacity: 1;
}

.fullScreenMaskDownloadContainer .closeButtonContainer svg{
    position:absolute;
    z-index:6;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}
.fullScreenMaskDownloadContainer .closeButtonContainer svg path{
    stroke:currentColor;
}

/*下载按钮*/
.mediaDownloadButton{
    /*position:absolute;*/
    z-index:5;
    display: flex;
    width:max-content;
    padding: 12px 20px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 16px;
    background: #FFF;
    cursor:pointer;

    color:#000;
    font-size: 16px;
    font-weight: 600;
    line-height: 130%;
}
.mediaDownloadButton .copySvg{
    color:#000;
    font-size: 16px;
    font-weight: 600;
    line-height: 130%;
}
.fullScreenMask .mediaDownloadButton[key=btn_copy]{
    display:none;
}

.mediaDownloadButton svg{
    width: 18px;
    height: 18px;
}

/*logo页面*/
.medias-logos-main .smallTitleContainer .mediaDownloadButton{
    position:relative;
    transition:all 0.25s;
}
.medias-logos-main .smallTitleContainer .mediaDownloadButton:hover{
    background:#000000;
    color:#ffffff;
}
.medias-logos-main .smallTitleContainer .mediaDownloadButton svg path,.mediaDownloadButton .copySvg path{
    stroke:currentColor;
}



/*下拉框*/
/*遮罩*/
.news-main-mask{
    width:100vw;
    height:100vh;
    position: absolute;
    top: 0;
    left:0;
    /*opacity: 0.4;*/
    background: rgba(0, 0, 0,0.4);
    z-index:5;
    display:none;
}

/*分类下拉外层容器*/
.selectOutContainer{
    position:relative;
}

/*分类下拉选择框----控制点*/
.selectContainer{
    position:relative;
    display: flex;
    padding: 12px 20px;
    justify-content: center;
    align-items: center;
    gap: 6px;
    border-radius: 16px;
    background: #FFF;
    cursor:pointer;
    z-index:7;
}

/*分类下拉显示*/
.selectContainer .itemShow{
    box-sizing: border-box;
    width: 100%;
    color:#000;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    line-height: 130%;
    border:none
}

.selectContainer .itemShow:focus-visible{
    outline:none
}

.selectContainer svg{
    width: 22px;
    height: 20px;
    transition:all 0.25s;
}

.selectContainer:hover >.itemShow
{
    /*color:red;*/
}
/*联动-箭头旋转*/
.selectContainer:hover > svg
{
    transform: rotate(180deg);
}

/*下拉选项列表----控制点*/
.itemList{
    position: absolute;
    right:0;
    transform: translateY(8px);
    height:0;
    width: 100%;
    display: flex;
    padding: 0px 20px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 12px;
    background: #FFF;
    border-radius: 16px;
    border:none;
    overflow:hidden;
    transition:all 0.25s;
    z-index:12;
}

/*下拉选项*/
.itemList .item{
    color:#000;
    font-family: PingFang SC;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    cursor:pointer;
}

/*下拉选项hover颜色*/
.itemList .item:hover{
    color:#C03939
}

/*下拉选项被选中的颜色*/
.itemList .activeItem{
    color:#C03939
}

/*不存在结果*/
.noResult{
    display: flex;
    /*width: 320px;*/
    height: 320px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 16px;
    margin:auto;
}

.noResult svg{
    width: 120px;
    height: 120px;
    flex-shrink: 0;
}

.noResult .tips{
    color: #000;
    text-align: center;
    font-family: PingFang SC;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; /* 18.2px */
    align-self: stretch;
    opacity:0.2;
}

@media only screen and (max-width: 1366px) {
    .medias-main {
        padding-top: 92px;
        width: calc(100% - 32px);
    }

    .productCard {
        width: calc((100vw - 32px - 48px) / 3);
    }

    .productCardImgDivMask{
        display:none !important;
    }

    .logoCard {
        /*width:calc((100vw - 32px - 24px) / 2);*/
        height:auto;
        width:calc(100vw - 32px);
        gap:unset;
    }
    .logoCard .row2 svg{
        opacity:0;
        /*width: 100%;*/
        /*height: 100vh;*/
    }
    .logoCardImgDivMask{
        display:none !important;
        opacity:0;
    }

    .logoCardImgDiv{
        height:100%;
    }

    .medias-logos-main .medias-logos-main .logoCardImgDiv{
        background:#ffffff;
    }
    .medias-logos-main .logosList:last-child .logoCardImgDiv{
        background-image: url("https://zhiyun-website-shenzhen.oss-cn-shenzhen.aliyuncs.com/about-us-media-kit/media-kit-bg-transparent.png");
    }

    .logoCardImgDiv img{
        object-fit: contain;
    }

    .medias-products-detail-main .logoCard{
        max-width: calc((var(--size-safearea) - 8px) / 2);
        margin-bottom: 8px;
        width: 100%;
    }

    .medias-products-detail-main .logoCardImgDivMask{
        display:grid !important;
        opacity:0;
    }
    .medias-products-detail-main .logoCardImgDivMask[type=video]{
        display:grid !important;
        /*opacity:0;*/
    }

    .fullScreenMaskContentContainerImgDivMedia{
        width:calc(100vw - 32px);
    }

    .fullScreenMaskContentContainerImgDiv img, .fullScreenMaskContentContainerImgDiv video{
        height: auto;
        width: 100%;
    }

    .arrowIconContainer{
        display:none !important;
    }
}

@media only screen and (max-width: 768px) {
    body{
        --medias-gap-48:24px;
        --medias-gap-24:16px;
    }
    .medias-main{
        padding-top:92px;
        width: calc(100% - 32px);
    }
    .bigTitle{
        font-size:32px
    }
    .medias-products-main .smallTitleContainer{
        flex-direction: column;
        align-items: flex-start;
    }

    .smallTitle{
        font-size:24px;
    }
    .medias-products-main .smallTitle{
        font-size:32px;
    }

    .productList{
        column-gap: 8px;
        row-gap:16px;
        margin-bottom:48px;
    }
    .productCard{
        width: calc((100vw - 32px - 8px) / 2);/*减去 外边距+间距 */
    }
    .productCard:hover .productCardImgDivMask{
        display:none;
    }
    .productCardName{
        font-size:14px;
    }

    .logosList{
        margin-bottom:48px;
    }
    .medias-products-detail-main .logosList{
        gap:8px;
        columns:2;
    }
    .medias-products-detail-main .logosList[key=videos]{
        display:flex;
        flex-direction:column;
    }
    /*.medias-products-detail-main .logoCard{*/
    /*    max-width: calc((var(--size-safearea) - 8px) / 2);*/
    /*    margin-bottom: 8px;*/
    /*    width: 100%;*/
    /*}*/

    .prContact{
        font-size:24px;
    }

    .logoCard .row2[type=video] svg:last-child{
        opacity:1
    }
    .logoCard .otherSvg{
        opacity:1
    }
    .fullScreenMaskContentContainerImgDiv{
        max-width:100%;
        width:100vw;
        gap:16px;
        padding:0 16px;
    }

    .fullScreenMaskContentContainerImgDiv img,.fullScreenMaskContentContainerImgDiv video{
        height:auto;
        width:100%;
    }

    .fullScreenMaskDownloadContainer{
        grid-template-columns: 1fr 1fr;
        width: calc(100vw - 32px);
        margin: auto;
    }

    .medias-logos-main .fullScreenMaskDownloadContainer{
        width: calc(100% - 32px);
        bottom:72px;
        margin:auto;
    }

    .fullScreenMaskDownloadContainer .column1{
        display:none;
    }

    .fullScreenMaskDownloadContainer .column2{
        justify-content:flex-start;
    }

    .fullScreenMaskDownloadContainer .column3{
        padding-right:0;
    }
    /*.medias-products-detail-main .logoCardImgDivMask{*/
    /*    display:none !important;*/
    /*}*/
    /*.medias-products-detail-main .logoCardImgDivMask[type=video]{*/
    /*    display:grid !important;*/
    /*}*/

    /*不显示文字*/
    .fullScreenMask .mediaDownloadButton div{
        display:none;
    }

    .fullScreenMaskDownloadContainer .closeButtonContainer{
        margin-top:0;
    }

    .fullScreenMaskDownloadContainer .closeButton{
        position:relative;
        width: 48px;
        height: 48px;
    }

    .mediaDownloadButton{
        position:relative;
    }

    .medias-logos-main .smallTitleContainer .mediaDownloadButton:hover{
        background:#ffffff;
        color:#000000;
    }

    /*下拉选项*/
    .selectOutContainer{
        width:100%;
    }

    .selectContainer{
        justify-content: space-between;
    }

    .selectContainer .itemShow{
        text-align:left;
    }

    .itemList{
        right:unset;
        width: calc(100% - 38px);
    }


    /*联系方式*/
    .footer-service-contact-ctn{
        display:none
    }
}