.prodback{
    display: block;
    position: fixed;
    z-index: 999;
    right: 0px;
    top: 50%;
    height: 0.4rem;
width: 0.4rem;
}
.prodback .backstr{
position: absolute;
z-index: 2000;
height: 0.4rem;
width: 0.4rem;
color: #FFF;
text-align: center;
line-height: 0.4rem;
}
.prodback .backbg{
    position: absolute;
    z-index: 1999;
    height: 0.4rem;
    width: 0.4rem;
    background-color: #F50;
    border-radius: 4px 0 0 4px;
}
/***懒加载样式开始***/
.listitemmain .lazybox {
    position: relative;
    width: 100%;
    height: 210px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.listitemmain .lazy-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.5s ease;
    opacity: 0;
}

.listitemmain .lazy-image.loaded {
    opacity: 1;
}

.listitemmain .default-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: blur(5px);
    transition: opacity 0.5s ease;
}

.listitemmain .default-image.hidden {
    opacity: 0;
    pointer-events: none;
}
/* 加载容器：核心布局 */
.listitemmain .lazybox .spinner {
    position: absolute;
    width: 80px;
    height: 16px;
    top: 66%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 10;
}

/* 所有点的基础样式：默认隐藏 */
.listitemmain .lazybox .dot {
    width: 8px;
    height: 4px;
    border-radius: 2px;
    background-color: #CCC;
    opacity: 0;
    /* 核心：7秒一个循环（6秒累加+1秒全部消失间隔） */
    animation-duration: 3s;
    animation-timing-function: step-end;
    animation-iteration-count: infinite;
    animation-name: none;
}

/* 1号点：0-6秒显示，6-7秒消失，7秒后重新显示 */
.listitemmain .lazybox .dot:nth-child(1) {
    animation-name: lazydot1;
}

/* 2号点：1-6秒显示，6-7秒消失 */
.listitemmain .lazybox .dot:nth-child(2) {
    animation-name: lazydot2;
}

/* 3号点：2-6秒显示，6-7秒消失 */
.listitemmain .lazybox .dot:nth-child(3) {
    animation-name: lazydot3;
}

/* 4号点：3-6秒显示，6-7秒消失 */
.listitemmain .lazybox .dot:nth-child(4) {
    animation-name: lazydot4;
}

/* 5号点：4-6秒显示，6-7秒消失 */
.listitemmain .lazybox .dot:nth-child(5) {
    animation-name: lazydot5;
}

/* 6号点：5-6秒显示，6-7秒消失 */
.listitemmain .lazybox .dot:nth-child(6) {
    animation-name: lazydot6;
}

/* 核心动画：精准控制点的显隐周期 */
@keyframes lazydot1 {

    0%,
    85.7% {
        opacity: 1;
    }

    /* 0-6秒显示（7秒的85.7%≈6秒） */
    85.8%,
    100% {
        opacity: 0;
    }

    /* 6-7秒消失（间隔期） */
}

@keyframes lazydot2 {

    0%,
    14.3% {
        opacity: 0;
    }

    /* 0-1秒隐藏 */
    14.4%,
    85.7% {
        opacity: 1;
    }

    /* 1-6秒显示 */
    85.8%,
    100% {
        opacity: 0;
    }

    /* 6-7秒消失 */
}

@keyframes lazydot3 {

    0%,
    28.6% {
        opacity: 0;
    }

    /* 0-2秒隐藏 */
    28.7%,
    85.7% {
        opacity: 1;
    }

    /* 2-6秒显示 */
    85.8%,
    100% {
        opacity: 0;
    }

    /* 6-7秒消失 */
}

@keyframes lazydot4 {

    0%,
    42.9% {
        opacity: 0;
    }

    /* 0-3秒隐藏 */
    43.0%,
    85.7% {
        opacity: 1;
    }

    /* 3-6秒显示 */
    85.8%,
    100% {
        opacity: 0;
    }

    /* 6-7秒消失 */
}

@keyframes lazydot5 {

    0%,
    57.2% {
        opacity: 0;
    }

    /* 0-4秒隐藏 */
    57.3%,
    85.7% {
        opacity: 1;
    }

    /* 4-6秒显示 */
    85.8%,
    100% {
        opacity: 0;
    }

    /* 6-7秒消失 */
}

@keyframes lazydot6 {

    0%,
    71.5% {
        opacity: 0;
    }

    /* 0-5秒隐藏 */
    71.6%,
    85.7% {
        opacity: 1;
    }

    /* 5-6秒显示 */
    85.8%,
    100% {
        opacity: 0;
    }

    /* 6-7秒消失 */
}

/***懒加载样式结束***/
/**************/
.clearfix::after {
    content: "";
    display: block;
    height: 0;
    visibility: hidden;
    clear: both;
}
/*******************/
.GtProdPage {
    width: 96%;
    margin: 0 auto;

}

.GtProdPage .pagenm {
    text-align: center;
    font-size: 0.23rem;
    font-weight: 700;
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
}

.GtProdPage .catlist {
    /****/
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    /* 项目之间间距，可自行修改 */
}

.GtProdPage a {
    display: block;
    position: relative;
    text-decoration: none;
    border: 1px solid #CCC;
    border-radius: 4px;
    box-sizing: border-box;
    overflow: hidden;
}

/* 所有 a 标签默认宽度：一行 2 个 */
.GtProdPage .catlist>a {
    width: calc(50% - 5px);
}

/* 重点：第一个 a 独占一行 */
.GtProdPage .catlist>a:first-child {
    width: 100%;
}

.GtProdPage .catimg {
    width: 100%;
    height: 1.6rem;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.GtProdPage img {
    display: block;
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
}

.GtProdPage .catnm {
    font-size: 0.2rem;
    color: #fff;
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    /****/
    display: flex;
    justify-content: center;
    align-items: center;
}

.GtProdPage .catnmbg {
    position: absolute;
    z-index: 1;
    background-color: #000;
    opacity: 0.5;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

/**************************/
.GtGuidePage {
    width: 96%;
    margin: 0 auto;
}

.GtGuidePage .pagenm {
    text-align: center;
    font-size: 0.23rem;
    font-weight: 700;
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
}

.GtGuidePage .prodcatul {
    width: 100%;
}

.GtGuidePage a {
    display: block;
    float: left;
    width: 49%;
    height: 1rem;
    margin-right: 2%;
    margin-bottom: 0.1rem;
    border: 1px solid #CCC;
    border-radius: 4px;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
}

.GtGuidePage a:nth-child(2n+2) {
    margin-right: 0;
}

.GtGuidePage img {
    display: block;
    width: 100%;
    height: 100%;
}

.GtGuidePage .catnm {
    font-size: 0.16rem;
    color: #fff;
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    /****/
    padding: 0 0.1rem;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.GtGuidePage .catbg {
    position: absolute;
    z-index: 1;
    background-color: #000;
    opacity: 0.5;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}
/*************************/
.GtProdListPage{
    width: 96%;
    margin: 0 auto;
}
.GtProdListPage .pagenm{
    text-align: center;
    font-size: 0.23rem;
    font-weight: 700;
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
}
.GtProdListPage .listul a{
    display: block;
    border-radius: 4px;
    overflow: hidden;
    box-sizing: border-box;
    margin-bottom: 0.2rem;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);

}
.GtProdListPage .lazybox img{
    width: 100%;

}
.GtProdListPage .lititle{
    text-align: center;
    line-height: 0.4rem;
    font-size: 0.14rem;
}
/************************/
.prodswiper{
    width: 100%;
}
.prodswiper .swiper {
    width: 100%;
    height: 100%;
}

.prodswiper .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.prodswiper .swiper-slide img {
    display: block;
    width: 100%;
}

.prodswiper .swiper-pagination-bullet {
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
    color: #000;
    opacity: 1;
    border-radius: 4px !important;
    background: rgba(0, 0, 0, 0.2);
}

.prodswiper .swiper-pagination-bullet-active {
    color: #fff;
    background: #007aff;
}

.GtProdshowPage{
    width: 96%;
    margin: 0 auto;
}
.GtProdshowPage .pnm{
    line-height: 0.4rem;
    font-size: 0.16rem;
    font-weight: 700;
}
.GtProdshowPage .tablist{
    width: 100%;
    display: flex;
    border-bottom: 1px solid #CCC;
}
.GtProdshowPage .tab{
    border-radius: 4px 4px 0 0;
    background-color: #F1F1F1;
    padding: 0.1rem;
    font-size: 0.16rem;
    color: #333;
    margin: unset;
    margin-right: 0.04rem;
}
.GtProdshowPage .tabon {
    background-color: #1e88e5;
    color: #fff;
}
.GtProdshowPage .tabcontent{
    padding: 0.2rem 0;
}
.GtProdshowPage .tabconner{
    display: none;
}
.GtProdshowPage .tabconneron{
    display: block;
}
.GtProdshowPage table {
    border-collapse: collapse;
    width: 100%;
    box-sizing: border-box;
}
.GtProdshowPage table tr td:first-child {
    min-width: 80px;
}
.GtProdshowPage td {
    border: 1px solid #ccc;
    padding: 0 10px;
    line-height: 36px;
    white-space: normal;   /* 允许换行 */
  word-break: break-all; /* 英文/数字太长时强制断开 */
  word-wrap: break-word; /* 兼容老浏览器 */
}

.GtProdshowPage a {
    display: inline-block;
    padding: 0 10px;
    line-height: 36px;
    border: 1px solid #ccc;
    border-radius: 4px;
    margin-bottom: 10px;
    text-indent: 0 !important;
}
.GtProdshowPage .tabconner img {
    display: block;
    width: 100%;
    border-radius: 4px;
    margin-bottom: 10px;
}
.GtProdshowPage a:hover {
    background-color: #1e88e5;
    color: #fff !important;
    border-color: #1e88e5;
}