body{padding-top:0}
header{background:0 0;border-bottom:1px solid rgba(255, 255, 255, .2)}
.pagesbanner .pagesbanner-animate{top:55%}
.pagesbanner .pagesbanner-animate .module-dev{align-items:center}
.pagesbanner .pagesbanner-animate .moduledev-r{margin-left:0}
.pagesbanner .pagesbanner-animate .banner-text .p1{font-family:Exo2Bold;font-size:42px;font-weight:var(--fontbold7);transition:all .3s ease}
.pagesbanner .pagesbanner-animate .banner-text .p2{font-size:var(--fontsize16)}
@media (max-width:1660px){.pagesbanner .pagesbanner-animate .banner-text .p1{font-size:38px}}
@media (max-width:1440px){.pagesbanner .pagesbanner-animate .banner-text .p1{font-size:34px}
.pagesbanner .pagesbanner-animate .module-dev{margin-top:15px}
.pagesbanner .pagesbanner-animate .banner-text .p2{margin-top:10px}}
@media (max-width:1280px){.pagesbanner .pagesbanner-animate .banner-text .p1{font-size:var(--fontsize28)}
.pagesbanner .pagesbanner-animate .module-dev{margin-top:15px}
.pagesbanner .pagesbanner-animate .banner-text .p2{margin-top:10px;font-size:var(--fontsize14)}}
@media (max-width:1024px){.pagesbanner .pagesbanner-animate{top:50%;padding:0 15px}}
@media (max-width:768px){.pagesbanner .pagesbanner-animate .banner-text .p1{font-size:var(--fontsize22);line-height:1.5}
.pagesbanner .pagesbanner-animate .banner-text .p2,.pagesbanner .pagesbanner-animate .module-dev{display:none}}
.banner-inner .banner-content{display:none}
.page-main{padding:0}
.electronics .l-wrap{max-width:100%}
.page1,.page2,.page3{position:relative;padding:5% 0}
.page-wrap{width:100%;max-width:1600px;padding:0;margin:0 auto}
.title-wrap{text-align:center}
.title-wrap .page-title{text-align:center}
.title-wrap .module-dev{align-items:center}
.title-wrap .moduledev-r{margin-left:0}
.page-title{font-family:Exo2Bold;color:#000002;font-size:42px;font-weight:var(--fontbold5);line-height:1.2;text-align:left}
.page-des{margin-top:15px;color:#6a6f78;font-size:var(--fontsize20);font-weight:var(--fontbold4,400);line-height:1.5}
@media (max-width:1440px){.page-title{font-size:38px}}
@media (max-width:1366px){.page-title{font-size:32px}
.page-des{font-size:var(--fontsize18)}}
@media (max-width:1024px){.page1,.page2,.page3{padding:40px 0}
.page-title{font-size:var(--fontsize26)}
.page-des{margin-top:10px;font-size:var(--fontsize16)}}
@media (max-width:500px){.page1,.page2,.page3{padding:30px 0}
.page-title{font-size:var(--fontsize24)}}
.page1 .page-wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}
.page1 .page1-info{width:48%}
.page1 .page1-info .info{margin-top:25px;color:#6a6f78}
.page1 .page1-info .info span{color:var(--color)}
.page1 .page1-img{width:47.5%;background:#fff;box-shadow:0 20px 30px 0 rgba(11,3,6,.06)}
.page1 .page1-img img{width:100%}
@media (max-width:1024px){.page1 .page1-info .info{margin-top:10px}}
@media (max-width:768px){.page1 .page1-info{width:100%}
.page1 .page1-img{width:100%}}
@media (max-width:550px){.page1 .moduledev-l,.page1 .moduledev-r{justify-content:flex-start}
.page1 .moduledev-r{margin-left:14px}}
.page2::before{content:'';position:absolute;top:0;left:-230px;width:1920px;height:100%;background:#f0f0f2}
.page2 .page-wrap{position:relative}
.page2 .page2-list{margin-top:35px;display:flex;flex-wrap:wrap}
.page2 .page2-list li{position:relative;width:24%;margin-bottom:20px;margin-right:1.3%;overflow:hidden}
.page2 .page2-list li:nth-child(4n){margin-right:0}
.page2 .page2-list li::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);opacity:0;z-index:1;transition:all .3s ease}
.page2 .page2-list li:hover::before{opacity:1}
.page2 .page2-list img{width:100%;transition:all .3s ease}
.page2 .page2-list li:hover img{transform:scale(1.03)}
.page2 .page2-list .li-title{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;text-align:center;padding:5px 15px;color:#fff;font-size:var(--fontsize20);font-weight:var(--fontbold5,500);line-height:1.4;margin-top:30px;opacity:0;z-index:2;transition:all .3s ease}
.page2 .page2-list li:hover .li-title{margin-top:0;opacity:1}
@media (max-width:1280px){.page2 .page2-list{margin-top:20px}}
@media (max-width:1024px){.page2 .page2-list li{width:32%;margin-bottom:15px}
.page2 .page2-list li:nth-child(4n){margin-right:1%}
.page2 .page2-list li:nth-child(3n){margin-right:0}}
@media (max-width:768px){.page2 .page2-list{margin-top:10px;justify-content:space-between}
.page2 .page2-list li{width:49%;margin-right:0!important}}
@media (max-width:500px){.page2 .page2-list li{margin-bottom:10px}
.page2 .page2-list .li-title{font-size:var(--fontsize18)}}
.page3 .page3-list{margin-top:35px;display:flex;justify-content:space-between;flex-wrap:wrap}
.page3 .page3-list li{position:relative;width:32%;margin-bottom:20px;overflow:hidden}
.page3 .page3-list li::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);opacity:0;z-index:1;transition:all .3s ease}
.page3 .page3-list li:hover::before{opacity:1}
.page3 .page3-list img{width:100%;transition:all .3s ease}
.page3 .page3-list li:hover img{transform:scale(1.03)}
.page3 .page3-list .li-title{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;text-align:center;padding:5px 15px;color:#fff;font-size:var(--fontsize20);font-weight:var(--fontbold5,500);line-height:1.4;margin-top:30px;opacity:0;z-index:2;transition:all .3s ease}
.page3 .page3-list li:hover .li-title{margin-top:0;opacity:1}
@media (max-width:1280px){.page3 .page3-list{margin-top:20px}}
@media (max-width:1024px){.page3 .page3-list li{margin-bottom:15px}}
@media (max-width:768px){.page3 .page3-list{margin-top:10px}
.page3 .page3-list li{width:49%}}
@media (max-width:500px){.page3 .page3-list li{margin-bottom:10px}
.page3 .page3-list .li-title{font-size:var(--fontsize18)}}
.page4{position:relative;padding:85px 0}
.page4::before{content:'';position:absolute;top:0;left:-230px;width:1920px;height:100%;background:url(https://css02.v15cdn.com/m623/imgs/ourrd-page5-bg.webp) no-repeat;background-size:cover;background-position:bottom}
.page4 .page-wrap{position:relative;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}
.page4 .title-wrap{width:75%;text-align:left}
.page4 .title-wrap .page-title{color:#fff;text-align:left}
.page4 .title-wrap .module-dev{align-items:flex-start}
.page4 .title-wrap .moduledev-r{margin-left:14px}
.page4 .title-wrap .page4-des{margin-top:25px;color:#fff}
.page4 .more{width:280px;height:55px;font-family:Exo2;background:var(--color);border-radius:3px;color:#fff;font-weight:var(--fontbold6);display:flex;justify-content:center;align-items:center;line-height:1;text-transform:uppercase;position:relative;z-index:1;overflow:hidden}
.page4 .more::after{content:'';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(0);width:calc(100% + 20px);border-radius:50%;aspect-ratio:1/1;background:rgba(0,0,0,.4);z-index:-1;transition:transform .2s linear}
.page4 .more{text-decoration:none}
.page4 .more:hover::after{transform:translate(-50%,-50%) scale(1)}
.page4 .more em{margin:4px 0 0 20px;width:24px;height:24px;background:#19282d;border-radius:50%;color:#fff;font-size:var(--fontsize14);display:flex;justify-content:center;align-items:center;transition:transform .3s ease-in-out}
.page4 .more:hover em{transform:rotateZ(45deg)}
@media (max-width:1280px){.page4 .more{width:260px;height:50px}
.page4 .more em{margin-left:10px}}
@media (max-width:1024px){.page4{padding:50px 0}
.page4 .title-wrap{width:60%}
.page4 .title-wrap .page4-des{margin-top:10px}}
@media (max-width:990px){.page4 .title-wrap{width:65%}
.page4 .more{width:240px;height:45px;font-size:var(--fontsize15)}}
@media (max-width:768px){.page4 .title-wrap{width:100%;margin-bottom:15px}}
@media (max-width:500px){.page4{padding:30px 0}
.page4 .more{width:220px;height:40px;font-size:var(--fontsize14)}
.page4 .more em{margin-top:0;width:20px;height:20px}}