@charset "UTF-8";
/*product*/
.pro_box{padding-top: 2%;padding-bottom: 2%;}
.pro_box .ctg{position: relative;}
.ctg_list{display: flex;flex-wrap: wrap;justify-content: center;}
.ctg_list li{width: calc( 100% / 6 - 1%);margin: .5%;}
.ctg_list li::after{margin-right: 0;}
.ctg_list li a{display: block;line-height: 45px;text-align: center;font-size: 16px;background-color: #6A6A6A;color: #FFF;transition: all 0.3s ease-out;}
.ctg_list li.on a,.ctg_list li:hover a{background-color: #1558a6;}
.pro_box .box{padding-top: 4%;}
.pro_box .box .list{display: flex;flex-wrap: wrap;}
.pro_box .box .list li{width: calc( 100% / 3 - 2.2%);padding: 50px 30px;margin: 0 3% 3% 0;position: relative;box-sizing: border-box;box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%);}
.pro_box .box .list li:nth-child(3n){margin-right: 0;}
.pro_box .box .list li>a{position: relative;display: block;z-index: 1;color: #333;}
.pro_box .box .list li .img{width: 100%;height: 200px;margin: auto;}
.pro_box .box .list li img{max-width: 100%;display: block;}
.pro_box .box .list li .hx{margin-top: 5%;height: 1px;background-color: #8a8a8a;}
.pro_box .box .list li .p_1{font-size: 24px;text-align: center;margin-top: 10%;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.pro_box .box .list li .p_2{font-size: 18px;text-align: center;margin-top: 3%;line-height:26px;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.pro_box .box .list li .more{margin: 0 auto;margin-top: 7%;display: block;width: 65%;padding-left: 25px;line-height: 54px;color: #FFF;border: 1px solid #6a6a6a;background: #6a6a6a url(../images/index_15.png) right 26px center no-repeat;transition: 0.5s;position: relative;z-index: 2;}
.pro_box .box .list li::before{content: "";display: block;opacity: 0;position: absolute;left: -1px;top: -1px;width: calc(100% - 2px);height: calc(100% - 2px);border: 3px solid #ea590a;transition: 0.5s;}
.pro_box .box .list li::after{content: "";display: block;opacity: 0;position: absolute;left: 9px;top: 9px;width: calc(100% - 18px);height: calc(100% - 18px);background-color: #ea590a;z-index: -1;transition: 0.5s;}
.pro_box .box .list li:hover::before{opacity: 1;}
.pro_box .box .list li:hover::after{opacity: .1;}
.pro_box .box .list li:hover .more{background-color: #ea590a;border-color: #ea590a;}
@media screen and (max-width: 1200px){
.ctg_list li{width: calc( 100% / 4 - 1%);}
.pro_box .box .list li{padding: 40px 25px;}
.pro_box .box .list li .img{height: 150px;}
.pro_box .box .list li .p_1{font-size: 22px;}
.pro_box .box .list li .p_2{font-size: 15px;}
.pro_box .box .list li .more{line-height: 40px;}}
@media screen and (max-width: 992px){
.ctg_list li a{font-size: 13px;}
.pro_box .box .list li,.pro_box .box .list li:nth-child(3n){padding: 50px 30px;margin: 0 3% 3% 0;width: calc( 100% / 2 - 1.5%);}
.pro_box .box .list li:nth-child(2n){margin-right: 0;}}
@media screen and (max-width: 640px){
.ctg_list li{width: calc( 100% / 2 - 2%);margin: 1%;}
.ctg_list li a{line-height: 40px;}
.pro_box .box .list li,.pro_box .box .list li:nth-child(3n){margin: 0;margin-bottom: 5%;width: 100%;}
.pro_box .box .list li:nth-child(2n){margin-right: 0;}}}