﻿.about1{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding-bottom:3%}
.about1 .home-title{text-align:left;margin-bottom:10px}
.about1 .left{width:35%}
.about1 .right{flex:1;padding-left:40px}
.about1 .right ul{display:flex;flex-wrap:wrap;justify-content:space-between;list-style:none}
.about1 .right ul li{width:47%;display:flex;align-items:flex-start}
.about1 .right ul li:nth-child(1),.about1 .right ul li:nth-child(2){margin-bottom:2em}
.about1 .right ul li .img{width:100px;height:100px;display:flex;justify-content:center;align-items:center;mask:no-repeat center;background-color:var(--color)}
.about1 .right ul li .img img{mask:#fff}
.about1 .right ul li .info{flex:1;padding-left:0}
.about1 .right ul li .p1{font-size:var(--fontsize22);font-weight:var(--fontbold6)}
.about1 .right ul li:nth-child(1) .img{mask-image:url(https://css02.v15cdn.com/m433/imgs/about-icon-1.webp)}
.about1 .right ul li:nth-child(2) .img{mask-image:url(https://css02.v15cdn.com/m433/imgs/about-icon-2.webp)}
.about1 .right ul li:nth-child(3) .img{mask-image:url(https://css02.v15cdn.com/m433/imgs/about-icon-3.webp)}
.about1 .right ul li:nth-child(4) .img{mask-image:url(https://css02.v15cdn.com/m433/imgs/about-icon-4.webp)}
.about2{position:relative;z-index:1;padding:3% 0}
.about2::before{content:"";position:absolute;left:50%;transform:translateX(-50%);top:0;width:1920px;height:100%;background:#1c1c1c;z-index:-1}
.about2 .about2-top{display:flex;flex-wrap:wrap}
.about2 .about2-top .home-icon,.about2 .about2-top .home-title{text-align:left}
.about2 .about2-top .home-title{color:#fff}
.about2 .about2-top .left{width:50%}
.about2 .about2-top .right{flex:1;padding-left:20px;color:#eee}
.about2 .about2-top .right p{margin-bottom:1em}
.about2 .about2-top .right ul{list-style:none;display:flex;flex-wrap:wrap;justify-content:space-between}
.about2 .about2-top .right ul li{width:48%;position:relative;padding-left:15px}
.about2 .about2-top .right ul li::before{content:"";position:absolute;left:0;top:11px;width:8px;height:8px;border-radius:50%;background:var(--color)}
.about2 .about2-bot ul{display:flex;justify-content:space-between;flex-wrap:wrap}
.about2 .about2-bot ul li{width:48%;position:relative;border-radius:10px;overflow:hidden}
.about2 .about2-bot ul li img{width:100%}
.about2 .about2-bot ul li .info{position:absolute;bottom:30px;left:0;width:100%;padding:0 30px;color:#fff;transition:all .2s linear}
.about2 .about2-bot ul li .info .p1{font-size:var(--fontsize22);font-weight:var(--fontbold6)}
.about2 .about2-bot ul li:hover .info{transform:translateY(-5px)}
.about3{padding:3% 0}
.about3 .list{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;list-style:none;margin-top:40px}
.about3 .list li{width:20%;text-align:center;display:flex;flex-direction:column;align-items:center}
.about3 .list li .icon{width:50px;height:50px;mask:no-repeat center;background-color:var(--color);mask-size:90%}
.about3 .list li .p1{font-size:var(--fontsize22);font-weight:var(--fontbold6);margin:20px 0 0}
.about3 .list li:nth-child(1) .icon{mask-image:url(https://css02.v15cdn.com/m433/imgs/about3-icon-1.webp)}
.about3 .list li:nth-child(2) .icon{mask-image:url(https://css02.v15cdn.com/m433/imgs/about3-icon-2.webp)}
.about3 .list li:nth-child(3) .icon{mask-image:url(https://css02.v15cdn.com/m433/imgs/about3-icon-3.webp)}
.about3 .list li:nth-child(4) .icon{mask-image:url(https://css02.v15cdn.com/m433/imgs/about3-icon-4.webp)}
.about4{display:flex;flex-wrap:wrap;align-items:center;position:relative;z-index:1;padding:3% 0;color:#fff}
.about4::before{content:"";position:absolute;left:50%;transform:translateX(-50%);top:0;width:1920px;height:100%;background:var(--color);z-index:-1}
.about4 .home-title{text-align:left}
.about4 .left{width:50%;padding-right:30px}
.about4 .left p{margin:10px 0}
.about4 .left .more{color:#fff;min-width:140px;height:45px;padding:0 20px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #fff;border-radius:30px;margin-top:20px}
.about4 .right{flex:1;display:flex;align-items:center}
.about4 .right img{width:100%}
.about5{padding:3% 0}
.about5 .list{margin-top:40px;display:flex;flex-wrap:wrap;justify-content:space-between;list-style:none}
.about5 .list>li{width:24%;box-shadow:0 10px 30px 0 rgba(10,2,4,.12);border-radius:var(--borderradius);transition:all .1s linear;aspect-ratio:4/5;position:relative;overflow:hidden}
.about5 .list>li .img{width:100%;height:100%}
.about5 .list>li .img img{width:100%;height:100%;object-fit:cover}
.about5 .list>li .info{position:absolute;left:0;bottom:0;width:100%;padding:20px;text-align:center;background:#fff;transition:all .2s linear}
.about5 .list>li .info::before{content:"";position:absolute;top:-14px;left:50%;transform:translateX(-50%);width:0;height:0;border-style:solid;border-width:0 15px 15px 15px;border-color:transparent transparent #fff transparent;transition:all .1s linear}
.about5 .list>li .info .p1{font-size:var(--fontsize22);font-weight:var(--fontbold6)}
.about5 .list>li .info .p2{color:var(--color)}
.about5 .list>li .info ul{list-style:none;display:flex;align-items:center;justify-content:center;height:0;transition:all .2s linear}
.about5 .list>li .info ul a{width:40px;height:40px;border-radius:var(--borderradius);border:1px solid #fff;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:var(--fontbold6);font-size:var(--fontsize22)}
.about5 .list>li:hover .info{background:var(--color);color:#fff}
.about5 .list>li:hover .info::before{border-color:transparent transparent var(--color) transparent}
.about5 .list>li:hover .info .p2{color:#fff}
.about5 .list>li:hover .info ul{height:50px}
.about5 .list>li:hover .info ul a{margin:5px}
.about6 .list{display:flex;flex-wrap:wrap;justify-content:space-between;list-style:none;margin-top:40px}
.about6 .list li{width:24%;overflow:hidden}
.about6 .list li img{width:100%;transition:all .2s linear}
.about6 .list li:hover img{transform:scale(.98)}
@media (max-width:1024px){.about1 .left{width:100%}
.about1 .right{padding:0;margin-top:20px}
.about3 .list li{width:49%;margin-bottom:2em}
.about5 .list>li{width:49%;margin-bottom:2em}
.about5 .list>li .info .p1{font-size:var(--fontsize18)}
.about6 .list li{width:49%;margin-bottom:2em}
}
@media (max-width:768px){.about1 .right ul li{width:100%;margin-bottom:1em!important}
.about1 .right ul li .img{width:70px;height:70px;mask-size:40px}
.about1 .right ul li .p1{font-size:var(--fontsize18)}
.about2 .about2-top{display:block}
.about2 .about2-top .left{width:100%}
.about2 .about2-top .right{padding:0;margin-top:10px}
.about2 .about2-top .right ul li{width:100%;margin-bottom:5px}
.about2 .about2-bot ul li{width:100%;margin-bottom:1em}
.about3 .list li .p1{font-size:var(--fontsize18)}
.about4{display:block}
.about4 .left{width:100%}
.about4 .right{margin-top:20px}
.about5 .list>li .info{padding:15px 10px}
.about5 .list>li .info ul a{width:30px;height:30px}
}
