.c-goods-type {padding:100px 0 ;background:#fff;}
.c-goods-type .title {text-align:center;}
.c-goods-type .title h3 {font-size:48px;line-height:1;color:#212121;letter-spacing:1px;text-align:center;font-weight:700;}
.c-goods-type .title p {font-size:18px;color:#0a0a0a;margin:28px 0 0;}
.c-goods-type .title .more {margin:35px 0 0;display:inline-block;width:190px;height:50px;line-height:50px;color:#fff;background:#88C322;font-size:18px;}
.c-goods-type .title .more:hover {background:var(--btn-bg-hover);}
.c-goods-type ul {margin:60px auto 0;display:flex;flex-wrap:wrap;}
.c-goods-type ul li {width:50%;}
.c-goods-type ul li a {display:block;width:100%;position:relative;overflow:hidden;}
.c-goods-type ul li .pic {position:relative;}
.c-goods-type ul li .pic img {width:100%;display:block;}
.c-goods-type ul li .pic img:last-child {position:absolute;left:0;top:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;opacity:0;transition:all 0.5s ease 0s;}
.c-goods-type ul li .fun-btn {position:absolute;background:rgba(3,3,3,1);transition:background 1s;-webkit-transition:background 1s;z-index:10;top:0;bottom:0;left:0;right:0;padding:0 10%;-webkit-transition:0.5s;transition:0.5s;opacity:0;display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;}
.c-goods-type ul li .fun-btn img {display:inline-block;transition:transform 0.5s;-webkit-transition:transform 0.5s;opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px);}
.c-goods-type ul li .fun-btn h5 {font-size:32px;color:#fff;margin:50px 0 0;-webkit-transform:translateY(10px);transform:translateY(10px);transition:transform 0.5s;-webkit-transition:transform 0.5s;opacity:0;}
.c-goods-type ul li .fun-btn p {font-size:16px;color:#fff;line-height:24px;margin:10px 0 0;-webkit-transform:translateY(10px);transform:translateY(10px);transition:transform 0.5s;-webkit-transition:transform 0.5s;opacity:0;}





@media screen and (min-width:768px) {
.c-goods-type ul li:hover .pic img:last-child {opacity:1;}
.c-goods-type ul li:hover .fun-btn {opacity:1;background:rgba(3,3,3,0.53)}
.c-goods-type ul li:hover .fun-btn h5 {opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}
.c-goods-type ul li:hover .fun-btn p {opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}
.c-goods-type ul li:hover .fun-btn img {opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}
}


@media screen and (max-width:1680px){
.c-goods-type {padding:90px 0;}
.c-goods-type .title h3 {font-size:46px;}

}

@media screen and (max-width:1550px) {
.c-goods-type {padding:80px 0;}
.c-goods-type .title h3 {font-size:44px;}
}

@media screen and (max-width:1441px) {
.c-goods-type {padding:75px 0;}
.c-goods-type .title h3 {font-size:42px;}
.c-goods-type ul li .fun-btn h5 {font-size:28px;margin:40px 0 0;}
}

@media screen and (max-width:1367px) {
.c-goods-type {padding:70px 0;}
.c-goods-type .title h3 {font-size:40px;}
.c-goods-type .title .more {width:170px;height:45px;line-height:45px;font-size:17px;}
.c-goods-type ul li .fun-btn h5 {font-size:26px;margin:35px 0 0;}
}

@media screen and (max-width:1281px) {
.c-goods-type {padding:60px 0;}
.c-goods-type .title h3 {font-size:36px;}
.c-goods-type ul li .fun-btn h5 {font-size:24px;margin:30px 0 0;}
}

@media screen and (max-width:1171px) {
.c-goods-type .title h3 {font-size:34px;}
}

@media screen and (max-width:992px) {
.c-goods-type .title h3 {font-size:32px;}
.c-goods-type ul li .fun-btn h5 {font-size:24px;margin:30px 0 0;}
}

@media screen and (max-width:768px) {

.c-goods-type {padding:30px 0}
.c-goods-type .title h3 {font-size:30px;}
.c-goods-type .title .more {width:150px;height:40px;line-height:40px;font-size:16px;margin:20px 0 0;}
.c-goods-type ul li {width:50%;margin:0;padding:0}
.c-goods-type ul li .fun-btn {margin:15px 0 0;position:static;background:#fff;padding:0;opacity:1;display:block;}
.c-goods-type ul li .fun-btn img,.c-goods-type ul li .fun-btn p {display:none;}
.c-goods-type ul li .fun-btn h5 {font-size:22px;color:#333;margin:0;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}
.c-goods-type ul li:hover .pic img:last-child {opacity:1;}
.c-goods-type ul li:hover .fun-btn {opacity:1;background:rgba(3,3,3,0.53)}
.c-goods-type ul li:hover .fun-btn h5 {opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}
.c-goods-type ul li:hover .fun-btn p {opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}
.c-goods-type ul li:hover .fun-btn img {opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}
}

@media screen and (max-width:576px) {
.c-goods-type .title h3 {font-size:27px;}
}

@media screen and (max-width:480px) {
.c-goods-type .title h3 {font-size:24px;}
.c-goods-type ul li .fun-btn h5 {font-size:18px;}
}

@media screen and (max-width:420px) {
.c-goods-type .title h3 {font-size:22px;}
}