.banner-slider{
    height: 20rem;
}
.articleTabList{
    box-shadow: 0px 2px 5px 2px rgba(106, 146, 255, 0.13);
    background-color: rgba(245, 248, 254, 1);
    width: 12rem;
    height: 18rem;
    padding: 1.5rem 0 1.5rem 1.5rem;
    justify-content: space-between;
}
.articleTabItem{
    width: 10rem;
    height: 8.5rem;
    box-shadow: 0px 2px 10px 0px rgba(146, 149, 174, 0.15);
    cursor: pointer;
}
.articleArea{
    height: 21rem;
    box-shadow: 0px 2px 15px 2px rgba(106, 146, 255, 0.15);
    background-color: rgba(255, 255, 255, 1);
    width: calc(100% - 13.5rem);
}
.articleListArea{
    width: calc(100% - 46rem);
    height: calc(100% - 3rem);
    margin: 1.5rem;
}
.articleList{

}
.articleList .articleRow{
    height: 3rem;
    overflow-wrap: break-word;
    color: var(--text-primary);
    font-size: 1rem;
    font-family: PingFangSC-Regular;
    white-space: nowrap;
    line-height: 3rem;
    display: flex;
    justify-content: space-between;
    cursor: pointer;
}
.articleList .articleRow:hover{
    color: var(--titleTabSelect);
}
.articleList .articleRow span{

}
.articleList .artTitle{
    width: 32rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.articleList .artDate{
    overflow-wrap: break-word;
    color: var(--text-secondary);
    white-space: nowrap;
}
.articleImg{
    width: 43rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.articleImg img{
    width: 100%;
    height: 100%;
}
.articleMore{
    width: 5rem;
    display: flex;
    justify-content: center;
    border-radius: 4px;
    font-size: 1.1rem;
    color: #0061DC;
    cursor: pointer;
    transition: all 0.2s ease;
    align-items: center;
}
.articleMore img{
    margin-left: 0.75rem;
    width: 1.5rem;
    height: 0.5rem;
    margin-top: 0.35rem;
}
.mainProductAreaBgTp1{
    background-image: url(../img/mkbg1.png);
}
.mainProductAreaBgTp2{
    background-image: url(../img/mkbg2.png);
    padding-bottom: 3rem;
}
.mainProductAreaBgTp3{
    background-image: url(../img/mkbg3.png);
}
.mainProductAreaBgTp4{
    background-image: url(../img/mkbg4.png);
}
.mainProductAreaBgTp5{
    background-image: url(../img/mkbg5.png);
}
.mainProductAreaBgTp6{
    background-image: url(../img/mkbg6.png);
    background-size: 100% 100%;
}
.articleListHead{
    margin-left: 3rem;
    font-family: PingFangSC-Medium;
    font-weight: 500;
}
.articleListHeadTitle{
    height: 2.5rem;
    line-height: 2.5rem;
    font-size: 1.2rem;
    color: var(--module-title);
    margin: 0 2rem;
    cursor: pointer;
}
.seleArticleListHeadTitle{
    color: var(--text-more) !important;
    border-bottom: 2px solid var(--text-more);
}
.productContent{
    width: 100%;
    margin-top: 2rem;
}
.producGgtList{
    grid-template-columns: repeat(4,24%);
    /*grid-template-rows: 33% 33% 33% ;*/
    grid-template-rows: repeat(3, minmax(100px, 1fr));
    grid-template-areas:
    'v1 v2 v3 v4'
    ' v5 v6 v7 v8 '
    ' v9 v10 v11 v12 ';
}
.productList{
    grid-template-columns: repeat(3,32%);
    grid-template-rows: 33% 33% 33%;
    grid-template-areas:
    'v1 v2 v3 '
    'v4 v5 v6 ';
}
.productListRow{
    height: 4.5rem;
    /*overflow: hidden;*/
    cursor: pointer;
    position: relative;
}
.productListRow img{
    height: 100%;
    width: 6rem;
}
.jsjj-flag {
    background-color: #ffa33d !important;
}
.productGgListRow .proText{
    -webkit-line-clamp: 1;
    margin-bottom: 1.3rem;
    width: 11rem;
    padding-top: .4rem;
}
.productGgListRow .proKey{
    font-size: 1rem;
    color: #757785;
    width: 6rem;
}
.productGgListRow .proXqText{
    font-size: 1rem;
    color: var(--text-secondary);
    font-weight: 500;
}
.productGgListRow{
    height: 10rem;
    box-shadow: 2px 4px 15px #0000001a;
    border-radius: 4px;
    transition: all 0.3s ease;
}
.productListRow img{
    width: 7.5rem;
}
.jjgsListRow{
    width: 7.1rem;
}
.proCont{
    margin-left: 1rem;
    font-size: 1rem;
    font-family: PingFangSC-Regular;
    justify-content: space-between;
    width: calc(100% - 7rem);
}
.proText{
    line-height: 1.5rem;
    color: var(--titleTab);
    overflow-wrap: break-word;
    font-size: 1rem;
    font-family: PingFangSC-Regular;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.proDate{
    color: var(--text-secondary);
    overflow-wrap: break-word;
    font-size: 1.1rem;
    font-family: PingFangSC-Medium;
    font-weight: 500;
}
.proDate p{
    color: rgba(117, 119, 133, 1);
    font-size: .9rem;
    font-family: PingFangSC-Regular;
    margin-top: .5rem;
}
.mainArticle{

}
.articleHead{

}
.bidArea{
    width: 100%;
    margin-top: 2rem;
    display: grid;
    grid-template-columns: 3fr 2fr;
    grid-template-rows: var(--banner-height) auto;
    gap: var(--gap);
}
.bidAreaBanner{
    grid-column: 1;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.bidAreaBanner img{
    width: 100%;
    height: 100%;
}
.bidRightPanel{
    grid-column: 2;
    grid-row: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: var(--list-height) var(--list-height);
    gap: var(--gap);
}
.bidListRowRight{
    display: flex;
    flex-direction: column;
    height: 100%;
    box-shadow: 0px 2px 10px 0px rgba(146, 149, 174, 0.15);
    background-color: rgba(255, 255, 255, 1);
    transition: all 0.3s ease;
    cursor: pointer;
}
.bidListRowRight:hover{
    transform: translateY(-5px);
}
.bidBottomPanel{
    grid-column: 1 / -1;
    grid-row: 2;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: var(--gap);
}
.merged-lists{
    display: contents;
}
.bidListRowBottom{
    display: flex;
    flex-direction: column;
    box-shadow: 0px 2px 10px 0px rgba(146, 149, 174, 0.15);
    background-color: rgba(255, 255, 255, 1);
    height: var(--list-height);
    transition: all 0.3s ease;
    cursor: pointer;
}
.bidListRowBottom:hover{
    transform: translateY(-5px);
}
.zbdlCont{
    display: flex;
    flex-direction: row;
    padding: 1.5rem 0;
    height: 4rem;
    overflow: hidden;
    margin-right: 1rem;
    width: calc(100% - 2rem);
}
.zbdlCont .proText{
    line-height: 1.3rem;
    width: calc(100% - 5rem);
    overflow: hidden;
    -webkit-line-clamp: 3;
}
.zbdlCont .proDate{
    width: 5rem;
}
.mainTitleBg{
    background-image: url(../img/SketchPngbc7cd998ae5d6912d1227cfd54f4e104f0b3ee3d349df4b28cfeccf537788de2.png);
    position: relative;
}
.productHead{
    width: 100rem;
    height: 8rem;
    margin: 0 auto;
    padding-top: 3rem;
}
.bgTitleCont {
    height: 2.5rem;
    line-height: 2.5rem;
}
.bgTitleCont .mainCommonTitle{
    color: #FFFFFF;
}
.disContent{
    color: #FFFFFF;
    margin-left: 5rem;
    background-color: rgba(49, 83, 236, 1);
    height: 2.5rem;
    border: 1px;
    text-align: center;
    font-size: 1rem;
    font-family: PingFangSC-Regular;
    line-height: 2.5rem;
    padding: 0 1.5rem;
    cursor: pointer;
    position: relative;
    z-index: 11;
}
.mainTitleBg .articleMore{
    color: #FFFFFF !important;
    height: 2.5rem;
    line-height: 2.5rem;
    position: relative;
    z-index: 11;
}
.mainContentBg{
    background-color: #FFFFFF;
    margin-top: -4rem;
    padding: 2rem 0;
    position: relative;
}
.productTabList{
    height: 2rem;
    overflow-wrap: break-word;
    color: rgba(98, 103, 139, 1);
    font-size: 1.2rem;
    font-family: PingFangSC-Regular;
    white-space: nowrap;
    line-height: 2rem;
}
.productTabItem{
    margin: 0 1.5rem;
    cursor: pointer;
}
.mainContentBg .productContent{
    margin-top: 0;
}
.deviceList{
    margin: 1.5rem;
    grid-template-columns: repeat(6,15%);
    grid-template-rows: 48% 48% ;
    grid-template-areas:
    'v1 v2 v3 v4 v5 v6'
    'v7 v8 v9 v10 v11 v12';
}
.deviceListRow{
    box-shadow: 0px 2px 12px 0px rgba(146, 149, 174, 0.15);
    background-color: rgba(255, 255, 255, 1);
    border-radius: 0 0 4px 4px;
    cursor: pointer;
}
.deviceListRow img{
    width: 100%;
    height: 8.5rem;
    border-radius: 4px 4px 0 0;
    transition: transform 0.3s ease;
}
.deviceListRow:hover img {
    transform: scale(1.05); /* 放大1.05倍 */
}
.deviceText{
    height: 3.5rem;
    overflow-wrap: break-word;
    color: var(--module-title);
    font-size: 1rem;
    font-family: PingFangSC-Regular;
    white-space: nowrap;
    line-height: 3.5rem;
    margin-left: 1rem;
}
.specTitle{
    color: #FFFFFF !important;
    height: 2.5rem;
    line-height: 2.5rem;
}
.coopTabList{
    width: 17rem;
    /*margin-top: 2.5rem;*/
}
.coopTabItem{
    background-color: rgba(255, 255, 255, 1);
    height: 25rem;
    border: 1px rgba(228, 231, 236, 1);
    width: 17rem;
    line-height: 3.8rem;
    text-align: center;
    color: var(--module-title);
    font-size: 1.2rem;
    font-family: PingFangSC-Regular;
    margin: 1rem 0;
    cursor: pointer;
    background-image: url(../../ESPshop/assets/img/hzzq_mergeImage.png);
    background-size:100% 100% ;
}
.seleCoopTabItem{
    background-color: var(--text-more);
    color: #FFFFFF;
}
.coopContet{
    margin-left: 2rem;
    width: calc(100% - 19rem);
}
.coopCateList{
    margin-left: 1rem;
}
.coopCateItem{
    height: 3rem;
    overflow-wrap: break-word;
    color: rgba(255, 255, 255, 1);
    font-size: 1.2rem;
    font-family: PingFangSC-Semibold;
    font-weight: 600;
    white-space: nowrap;
    line-height: 3rem;
    margin: 0 1rem;
    cursor: pointer;
    color: #fff !important;
}
.seleCoopCateItem{
    border-bottom:3px solid rgba(48, 126, 255, 1); ;
}
.coopDeviceCont{
    margin-top: 0.5rem;
    background-color: rgba(255, 255, 255, 1);
    margin-left: 2rem;
    padding: 1rem;
    min-height: 20rem;
}
.coopDeviceRow{
    position: relative;
    margin: .5rem 1rem;
    box-shadow: 0px 2px 12px 0px rgba(146, 149, 174, 0.15);
    background-color: rgba(255, 255, 255, 1);
    border-radius: 0 0 4px 4px;
    overflow: hidden;
    flex: 1;
    cursor: pointer;
    transition: transform 0.3s ease;
}
.coopDeviceRow:hover{
    transform: translateY(-5px);
}
.proFlag{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    font-size: 0.8rem;
    color: #fff;
    padding: 0px 5px;
    display: flex;
    align-items: center;
    background-color: rgba(70, 140, 255, 1);
    border-radius: 0px;
    height: 1.8rem;
    width: auto;
}
.coopDeviceRow img{
    width: 100%;
    height: 10.5rem;
    border-radius: 4px 4px 0 0;
}
.coopDisArea{
    margin: 1rem;
}
.coopDisAreaTitle{
    height: 2rem;
    overflow-wrap: break-word;
    color: rgba(49, 56, 85, 1);
    font-size: 1rem;
    font-family: PingFangSC-Medium;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 2rem;
}
.coopText{
    width: 3.5rem;
    height: 1.5rem;
    overflow-wrap: break-word;
    color: var(--text-secondary);
    font-size: .9rem;
    font-family: PingFangSC-Regular;
    white-space: nowrap;
    line-height: 1.5rem;
}
.coopPrice{
    width: calc(100% - 3.5rem);
    height: 1.5rem;
    white-space: nowrap;
    line-height: 1.5rem;
    overflow-wrap: break-word;
    color: rgba(255, 134, 0, 1);
    font-size: 1.2rem;
    font-family: DINAlternate-Bold;
    font-weight: 700;
    text-align: right;
}
.coopDate{
    width: calc(100% - 3.5rem);
    height: 1.5rem;
    white-space: nowrap;
    line-height: 1.5rem;
    text-align: right;
    overflow-wrap: break-word;
    color: var(--module-title);
    font-size: 1rem;
    font-family: PingFangSC-Regular;
}

.platTabItem{
    height: 3.5rem;
    width: 8.5rem;
    text-align: center;
    line-height: 3.5rem;
    background-color: rgba(255, 255, 255, 1);
    border: 1px rgba(228, 231, 236, 1);
    overflow-wrap: break-word;
    color: var(--module-title);
    font-size: 1.1rem;
    font-family: PingFangSC-Regular;
    white-space: nowrap;
    cursor: pointer;
    margin: .5rem 0;
}
.platSelect{
    background-color: rgba(0, 90, 238, 1);
    color: #fff;
}
.platTabList{
    height: 29.5rem;
    background-color: rgba(255, 255, 255, 0.47);
    box-shadow: 0px 2px 15px 2px rgba(106, 146, 255, 0.15);
}
.platsaCont{
    box-shadow: 0px 2px 15px 2px rgba(106, 146, 255, 0.15);
    background-color: rgba(255, 255, 255, 0.47);
}
.platListGridStyle{
    width: calc(100% - 12rem);
    box-shadow: 0px 2px 15px 2px rgba(106, 146, 255, 0.15);
    background-color: rgba(255, 255, 255, 1);
    height: 32.5rem;
    grid-template-columns: repeat(5,19%);
    grid-template-rows: 31% 31% 31%;
    grid-template-areas:
'v1 v2 v3 v4  v5  '
'v6 v7 v8 v9 v10 '
'v11 v12 v13 v14 v15';
}
.platScaleUp{
    margin: 1rem;
    cursor: pointer;
}
.platScaleUp img{
    width: 100%;
    height: 100%;
    transition: transform 0.3s ease;
}
.platScaleUp:hover img {
    transform: scale(1.05); /* 放大1.05倍 */
}
.mainStats{
    width: 100rem;
    justify-content: space-between;
    height: 3rem;
    align-items: center;
}
.statsItem{
    width: 22%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.statsCbzy{
    align-items: center;
}
.statsNum{
    font-size: 2.1rem;
    font-family: cursive;
    color: rgba(0, 90, 238, 1);
    font-weight: 700;
}
.statsUnit{
    font-size: 1.1rem;
    margin-left: 0.5rem;
    margin-top: .2rem;
    color: rgba(0, 90, 238, 1);
    font-family: PingFangSC-Medium;
    font-weight: 500;
}
.statsKey{
    width: 100%;
    margin-top: .5rem;
    color: rgba(49, 56, 85, 1);
    font-size: 1rem;
    font-family: PingFangSC-Medium;
    font-weight: 500;
    white-space: nowrap;
    text-align: center;
}
.zbdlListHeadTitle{
    height: 2.5rem;
    line-height: 2.5rem;
    font-size: 1.2rem;
    color: var(--module-title);
    margin: 0 2rem;
    cursor: pointer;
}
.rdxwImg{
    background-image: url("../img/rdxw.png");
    background-size: contain;
    width: calc(100% - 1.5rem);
    height: calc(100% - 1.5rem);
    font-size: 1.1rem;
    font-family: PingFangSC-Medium;
    font-weight: 500;
    padding-top: 1.5rem;
    padding-left: 1.5rem;
}
.articleSelect .rdxwImg{
    background-image: url("../img/xzrdxw.png");
    background-size: contain;
    width: calc(100% - 1.5rem);
    height: calc(100% - 1.5rem);
    color: rgba(255, 255, 255, 1);
    font-size: 1.1rem;
    font-family: PingFangSC-Medium;
    font-weight: 500;
    padding-top: 1.5rem;
    padding-left: 1.5rem;
}
.ptggImg{
    background-image: url("../img/ptgg.png");
    background-size: contain;
    width: calc(100% - 1.5rem);
    height: calc(100% - 1.5rem);
    font-size: 1.1rem;
    font-family: PingFangSC-Medium;
    font-weight: 500;
    padding-top: 1.5rem;
    padding-left: 1.5rem;
}
.articleSelect .ptggImg{
    background-image: url("../img/xzptgg.png");
    background-size: contain;
    width: calc(100% - 1.5rem);
    height: calc(100% - 1.5rem);
    color: rgba(255, 255, 255, 1);
    font-size: 1.1rem;
    font-family: PingFangSC-Medium;
    font-weight: 500;
    padding-top: 1.5rem;
    padding-left: 1.5rem;
}
.border-disContent{
    border: 1px solid #fff;
}
.imgTitle{
    position: absolute;
    left: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7);
    line-height: 3.5rem;
    color: #fff;
    width: calc(100% - 3rem);
    padding: 0 1.5rem;
}
.titleImg{
    background-image: url("../img/SketchPng648db1206786ea04e9b9b7e94d4ac1044a5a32a18e3c7624e6eb90bf95d863a8.png");
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: 100% 100%;
    top: 0;
    left: 0;
}
.banner-article{
    height: 100%;
}
.disTitle{
    width: 170px;
    height: 53px;
    overflow-wrap: break-word;
    color: rgba(38, 109, 255, 1);
    font-size: 21px;
    font-family: PingFangSC-Semibold;
    font-weight: 600;
    text-align: left;
    white-space: nowrap;
    line-height: 53px;
    margin-left: 20px;
    margin-top: 3rem;
}
.disSmallTitle{
    width: 120px;
    height: 30px;
    overflow-wrap: break-word;
    color: rgba(49, 56, 85, 1);
    font-size: 18px;
    font-family: PingFangSC-Medium;
    font-weight: 500;
    text-align: left;
    white-space: nowrap;
    line-height: 30px;
    margin-top: 13px;
    margin-left: 20px;
}
.disContentSh{
    background-color: rgba(38, 109, 255, 0.07);
    border-radius: 4px;
    width: 98px;
    height: 38px;
    border: 1px rgba(255, 255, 255, 1);
    margin: 2rem 0 0 20px;
    overflow-wrap: break-word;
    color: rgba(38, 109, 255, 1);
    font-size: 16px;
    font-family: PingFangSC-Medium;
    font-weight: 500;
    text-align: left;
    white-space: nowrap;
    line-height: 38px;
    padding-left: 10px;
}
.coopTitleCont{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.proState{
    position: absolute;
    bottom: 1.25rem;
    right: 1.25rem;
}
.proState img {
    width: 3.5rem;
    transition: all 0.15s ease;
}
.jumpBtn{
    width: 8.5rem;
    height: 2.5rem;
    border: 1px solid #005AEE;
    font-weight: 400;
    font-size: 1rem;
    color: #005AEE;
    line-height: 2.5rem;
    text-align: center;
    font-style: normal;
    text-transform: none;
    cursor: pointer;
}
.jrjj-flag{
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 1;
    font-size: 0.8rem;
    color: #fff;
    padding: 0px 5px;
    display: flex;
    align-items: center;
    /*background-color: #fd3f3f;*/
    background-color: #19be79;
    border-radius: 0px;
    height: 1.8rem;
    width: auto;
}
.hnwState{
    position: absolute;
    width: 4rem;
    height: 1.5rem;
    right: 0rem;
    top: -.5rem;
}
.hnwState img{
    width: 100%;
    height: 100%;
}
.productGgListRow:hover{
    transform: translateY(-5px);
    border-color: #3498db;
}

.videoContainer {
    background: #f9f9f9;
    padding: 1rem;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.imageListContainer {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    flex: 2;
}
.imageItem {
    flex: 1;
    text-align: center;
    border: 1px solid #ddd;
    border-radius: 4px;
    height: 22rem;
}
.imageItem img {
    /*object-fit: cover;*/
    width: 100%;
    height: 15rem;
}
.imageItem p{
    height: 1.5rem;
    line-height: 1.5rem;
    margin-top: .8rem;
    font-size: 1rem;
}