@media screen and (min-width:769px) {.iframe-box iframe{height: 600px;}}
.pro-main .page-nav{display: none;}
@media (min-width:1025px){.procate{justify-content:space-between}}
.procate li{width:24%;margin-bottom:2em;position:relative;margin-right:1.333%;border:1px solid #EEEEEE;background:none;flex-direction:column;border-radius:0}
.procate li:nth-child(4n){margin-right:0px}
.procate li .img{overflow:hidden;width:100%}
.procate li .img img{width:100%;height:100%;object-fit:cover;transition:all .1s linear;aspect-ratio:1/1;display:block}
.procate li .info{position:absolute;left:0px;bottom:10%;background:#FFFFFF9c;width:65%;border-radius:0 50px 50px 0px;padding:20px 20px 10px 20px;transition:all .1s linear}
.procate li .info::after{content:"";position:absolute;left:20px;bottom:0px;width:70px;height:3px;background:var(--color)}
.procate li .info .title{font-size:var(--fontsize18);font-weight:var(--fontbold6);margin-bottom:10px}
.procate li .info .text{height:0px;opacity:0;transition:height .1s linear;margin:0;color:var(--headercolor);-webkit-line-clamp:3}
.procate li .info .more{position:absolute;right:0px;top:50%;transform:translateY(-50%);min-width:inherit;transition:all .1s linear;color:transparent;font-size:0px;width:50px;height:50px;background:#FFFFFF!important;border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:0}
.procate li .info .more:after{content:'+';color:var(--color);font-size:34px;position:relative;top:-4px}
.procate li:hover .img img{transform:scale(1.02)}
@media (min-width:1025px){.procate li:hover .info{background:var(--color);color:#FFFFFF;padding-bottom:30px}
.procate li:hover .info .text{height:auto;opacity:1}
.procate li:hover .info .more{animation:catemore .3s forwards;animation-delay:.2s}
.procate li:hover .info .title{color:#fff}}
@keyframes catemore{0%{opacity:0}
100%{opacity:1;right:-25px}}
@media (max-width:1280px) and (min-width:1025px){.procate li{width:32%;margin-right:2%}
.procate li:nth-child(4n){margin-right:2%}
.procate li:nth-child(3n){margin-right:0px}}
@media (max-width:1024px){.procate li{width:48%;margin-right:0}
.procate li:hover .info .title{color:#000}}
@media (max-width:768px){.procate li{width:100%;}
.procate li .info{padding:15px 25px 15px 10px}
.procate li .info .title{font-size:var(--fontsize17);margin:0}}
.pro-list.list0 li{ width: 100%;}
@media (min-width:1024px){.pro-list.list0 li .pro-img{width:25%}}

.protype-main .procate li{width:49%;margin-right:0;flex-direction:row}
.protype-main .procate li .img{width:30%}
.protype-main .procate li .info{padding:20px;width:auto;position:static;flex:1;background:#f4f4f4;border-radius:0}
.protype-main .procate li .info::after{display:none}
.protype-main .procate li .info .more{position:static;transform:none;opacity:1;min-width:120px;height:40px;padding:0 15px;font-size:var(--fontsize16);border-radius:20px;color:var(--color);border:1px solid var(--color)}
.protype-main .procate li .info .text{margin:10px 0 20px;height:auto;opacity:1;color:var(--fontcolor)}
.protype-main .procate li .info .more::after{display:none}
.protype-main .procate li:hover .info{color:var(--fontcolor);background:#f4f4f4;padding-bottom:20px}
.protype-main .procate li:hover .info .title{color:var(--color)}
.protype-main .procate li:hover .info .more{color:#fff;background:var(--color)!important;animation:none}
@media (max-width:768px){.protype-main .procate{margin-top:15px}
.protype-main .procate li{margin-bottom:1em}
.protype-main .procate li .info .more{display:none}}