﻿@import url(https://js01.v15cdn.com/single-template/public.css); 
.wmpage139-page4 .wmpage139-page4-desc{text-align:center;color:var(--color);margin-bottom:6px}
.wmpage139-page4 .wmpage-title{text-align:center;font-weight:var(--fontbold6);line-height:1.5}
.wmpage139-page4 .wmpage139-page4-list{display:flex;justify-content:space-between;flex-wrap:wrap}
.wmpage139-page4 .wmpage139-page4-item{width:23.5%;margin-top:40px;position:relative;border-radius:5px;overflow:hidden}
.wmpage139-page4 .wmpage139-page4-item::before{content:'';position:absolute;width:100%;height:100%;left:0;top:0;background:linear-gradient(180deg,rgba(28,27,31,0) 32%,rgba(28,27,31,.9556197479) 91%);transition:all .3s ease}
.wmpage139-page4 .wmpage139-page4-item .info{position:absolute;left:0;bottom:10px;width:100%;padding:20px}
.wmpage139-page4 .wmpage139-page4-item .info .title{color:#fff;font-size:var(--wmpage-font22);font-weight:var(--fontbold5)}
.wmpage139-page4 .wmpage139-page4-item:hover::before{background:linear-gradient(180deg,rgba(28,27,31,0) 32%,var(--color) 91%)}
@media screen and (max-width:900px){.wmpage139-page4 .wmpage139-page4-item{width:48%;margin-top:25px}
}
@media screen and (max-width:500px){.wmpage139-page4 .wmpage139-page4-item{width:100%}
.wmpage139-page4 .wmpage139-page4-item .info{padding:15px;bottom:0}
.wmpage139-page4 .wmpage139-page4-item .info .title{font-size:var(--wmpage-font20)}
}

#product{margin-top:50px}
.home-about{padding:50px 0;position:relative;background:no-repeat center;background-size:cover;z-index:1;background-image:url(https://css02.v15cdn.com/m441/images/about-bg.webp)}
.home-about::after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background: linear-gradient(0deg, var(--color) 0, var(--color) 100%);opacity:.8;z-index:-1}
.home-about .aboutflex{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between}
.home-about .aboutflex .aboutimg{width:45%;border-radius:10px;overflow:hidden;position:relative}
.home-about .aboutflex .aboutimg:hover img{transform:scale(1.02)}
.home-about .aboutflex .aboutimg iframe{width:100%;height:100%}
.home-about .aboutflex .aboutimg em{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:9;background:var(--color);color:#FFFFFF;width:50px;height:50px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:32px;cursor:pointer}
.home-about .aboutflex .aboutimg em::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:100%;height:100%;border:5px solid #FFFFFF;border-radius:50%}
.home-about .aboutflex .aboutinfo{flex:1;padding-left:30px;color:#FFFFFF}
.home-about .aboutflex .aboutinfo .home-des{text-align:left;color:#FFFFFF}
.home-about .aboutflex .aboutinfo .title{text-align:left;color:#FFFFFF;font-size:46px}
.home-about .aboutflex .aboutinfo .text{line-height:2;margin-bottom:30px}
.home-about .aboutflex .aboutinfo .more-btn{background:#FFFFFF;color:var(--color)}
.home-about .aboutflex .aboutinfo .more-btn em{color:#FFFFFF}
.home-about .aboutflex .aboutinfo .more-btn:hover{background:var(--color);color:#ffffff;}
.home-about .aboutlist{display:flex;flex-wrap:wrap;justify-content:space-between;margin:40px 0 10px}
.home-about .aboutlist li{width:23%;background:#FFFFFF;border-radius:10px;overflow:hidden;display:flex;align-items:center;padding:15px 20px}
.home-about .aboutlist li:hover .icon{border-color:var(--color)}
.home-about .aboutlist li .icon{width:70px;height:70px;border:2px solid rgba(58,155,220,.42);border-radius:50%;padding:1px;display:inline-flex;align-items:center;justify-content:center;transition:all .2s linear}
.home-about .aboutlist li .info{flex:1;height:100%;padding-left:20px;display:flex;flex-direction:column;justify-content:flex-start}
.home-about .aboutlist li .info .p1{color:var(--color);font-size:30px;font-weight:var(--fontbold6)}
.home-about .aboutlist li .info .p2{color:#000;font-weight:var(--fontbold5);line-height:1.4}
@media(max-width:1280px){
.home-about .aboutflex .aboutinfo{padding:0 0 0 20px}
.home-about .aboutflex .aboutinfo .title{font-size:34px}
}
@media(max-width:1024px){
.home-about .aboutflex .aboutimg{width:100%}
.home-about .aboutflex .aboutinfo{padding:0;margin-top:20px}
.home-about .aboutlist li{width:49%;margin-bottom:20px}
}
@media(max-width:768px){
#product{margin-top:3vw}
.home-about{padding:3vw 0}
.home-about .aboutflex .aboutinfo .title{font-size:24px;font-weight:var(--fontbold6);margin:10px 0}
.home-about .aboutlist li{padding:15px;width:100%}
.home-about .aboutlist li .icon{width:50px;height:50px}
.home-about .aboutlist li .icon img{height:30px}
.home-about .aboutlist li .info .p1{font-size:24px}
}