@import url('sub.css');

.prdCateNav__d1Inner{position: relative;}
.prdCateNav__d1Inner::before{content:''; display: block; width: 100%; height: 1px; background:var(--border); position: absolute; left:0; bottom: 0;}


/* 力前 皋牢 */
.product_main{}
.product_main section{text-align:center;}
.product_main section:nth-child(even){background:var(--grayBg);}
/* .product_main section:first-of-type{padding-top: 100px;} */
.product_main section .title_area{padding: 0 0 60px;}
.product_main section .title_area .eng_tit{display: block; font-weight: 700; color:var(--main); text-transform: uppercase; padding-bottom: 10px;}
.product_main section .title_area h4{color:var(--black);}
.product_main section .title_area p{padding-top: 20px;}
.product_main section .title_area p br{display: none;}
.product_main section .product-cate{display: flex; justify-content: center; flex-wrap:wrap; gap:30px; margin: 0 auto;}
.product_main section .product-cate .list a{display: block; transition:transform 0.35s ease;}
.product_main section .product-cate .list a .thumb{aspect-ratio:1/1; overflow: hidden; position: relative; background:var(--white); transition:box-shadow 0.35s ease;}
.product_main section .product-cate .list a .thumb::before{content:''; display: block; width: 100%; height: 100%; box-sizing:border-box; border:1px solid var(--border); position: absolute; left:0; bottom: 0; transition:border-color 0.35s ease; z-index:1; pointer-events:none;}
.product_main section .product-cate .list a .thumb img{display: block; width: 100%; height: 100%; object-fit:contain; transition:transform 0.45s ease;}
.product_main section .product-cate .list a .desc{padding: 25px 0 0;}
.product_main section .product-cate .list a .desc h5{color:var(--black); font-weight: 600; transition:color 0.3s ease;}
.product_main section .product-cate .list a:hover{transform:translateY(-6px);}
.product_main section .product-cate .list a:hover .thumb{box-shadow:0 12px 28px rgba(1,44,123,0.12);}
.product_main section .product-cate .list a:hover .thumb::before{border-color:var(--main);}
.product_main section .product-cate .list a:hover .thumb img{transform:scale(1.05);}
.product_main section .product-cate .list a:hover .desc h5{color:var(--main);}


.product_main section .product-cate{max-width:1267px;}
.product_main section .product-cate .list{width: calc((100% - 90px)/4);}

.product_main section .product-cate.five{max-width:100%;}
.product_main section .product-cate.five .list{width: calc((100% - 120px)/5);}

.product_main section .product-cate.three{max-width:943px;}
.product_main section .product-cate.three .list{width: calc((100% - 60px)/3);}

/*******************************************************************************
    @media 1740px
*******************************************************************************/
@media all and (max-width:1740px){




}
/*******************************************************************************
    @media 1500px
*******************************************************************************/
@media all and (max-width:1500px){




}
/*******************************************************************************
    @media ~1300px
*******************************************************************************/
@media all and (max-width:1300px){

/* 力前 皋牢 */
.product_main section .product-cate .list{width: calc((100% - 90px)/4);}
.product_main section .product-cate.five{max-width:943px;}
.product_main section .product-cate.five .list{width: calc((100% - 60px)/3);}
.product_main section .product-cate.three .list{width: calc((100% - 60px)/3);}

}

/*******************************************************************************
    @media  ~980px               
*******************************************************************************/
@media all and (max-width:980px){


/* 力前 皋牢 */
.product_main{}
/* .product_main section:first-of-type{padding-top: 70px;} */
.product_main section .title_area{padding: 0 0 40px;}
.product_main section .title_area .eng_tit{padding-bottom: 6px;}
.product_main section .title_area p{padding-top: 15px;}
.product_main section .product-cate{gap:20px;}
.product_main section .product-cate .list a .desc{padding: 15px 0 0;}

.product_main section .product-cate .list{width: calc((100% - 40px)/3);}
.product_main section .product-cate.five .list{width: calc((100% - 40px)/3);}
.product_main section .product-cate.three .list{width: calc((100% - 40px)/3);}


}
/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){



/* 力前 皋牢 */
.product_main{}
/* .product_main section:first-of-type{padding-top: 50px;} */
.product_main section .title_area{padding: 0 0 30px;}
.product_main section .title_area p{padding-top: 10px;}
.product_main section .product-cate{gap:15px 10px;}
.product_main section .product-cate .list a .desc{padding: 10px 0 0;}

.product_main section .product-cate .list{width: calc((100% - 10px)/2);}
.product_main section .product-cate.five .list{width: calc((100% - 10px)/2);}
.product_main section .product-cate.three .list{width: calc((100% - 10px)/2);}


}