:root {
    --paddings: 0 4vw;
    --padding: 4vw;
    --text-color: #000000;
    --text-color-primary: #000000;
    --text-color-secondary: #212121;
    --text-color-placeholder: #7A7A7A;
    --link-color: #000000;
    --link-hover-color: #0054A1;
    --font-size-12: 1.6vw;
    --font-size-14: 1.87vw;
    --font-size-16: 2.13vw;
    --font-size-18: 2.4vw;
    --font-size-20: 2.67vw;
    --font-size-21: 2.8vw;
    --font-size-22: 2.93vw;
    --font-size-24: 3.2vw;
    --font-size-26: 3.47vw;
    --font-size-28: 3.73vw;
    --font-size-30: 4vw;
    --font-size-32: 4.27vw;
    --font-size-34: 4.53vw;
    --font-size-36: 4.8vw;
    --font-size-38: 5.07vw;
    --font-size-40: 5.33vw;
    --font-size-42: 5.6vw;
    --font-size-44: 5.87vw;
    --font-size-46: 6.13vw;
    --font-size-48: 6.4vw
}

@media screen and (min-width: 992px) {
    :root {
        --paddings: 0 9.375vw;
        --padding: 9.375vw;
        --font-size-12: 12px;
        --font-size-14: 14px;
        --font-size-16: 14px;
        --font-size-18: 16px;
        --font-size-20: 17px;
        --font-size-21: 17.75px;
        --font-size-22: 18.5px;
        --font-size-24: 20px;
        --font-size-26: 19.5px;
        --font-size-28: 21px;
        --font-size-30: 22px;
        --font-size-32: 24px;
        --font-size-34: 25.5px;
        --font-size-36: 27px;
        --font-size-38: 28.5px;
        --font-size-40: 30px;
        --font-size-42: 31.5px;
        --font-size-44: 33px;
        --font-size-46: 34.5px;
        --font-size-48: 36px
    }
}

@media screen and (min-width: 1440px) {
    :root {
        --font-size-12: 0.729vw;
        --font-size-14: 0.729vw;
        --font-size-16: 0.9375vw;
        --font-size-18: 1.042vw;
        --font-size-20: 1.146vw;
        --font-size-21: 1.198vw;
        --font-size-22: 1.25vw;
        --font-size-24: 1.354vw;
        --font-size-26: 1.354vw;
        --font-size-28: 1.458vw;
        --font-size-30: 1.562vw;
        --font-size-32: 1.667vw;
        --font-size-34: 1.771vw;
        --font-size-36: 1.875vw;
        --font-size-38: 1.979vw;
        --font-size-40: 2.083vw;
        --font-size-42: 2.187vw;
        --font-size-44: 2.292vw;
        --font-size-46: 2.396vw;
        --font-size-48: 2.5vw
    }
}

@media screen and (min-width: 1920px) {
    :root {
        --font-size-12: 12px;
        --font-size-14: 14px;
        --font-size-16: 16px;
        --font-size-18: 18px;
        --font-size-20: 20px;
        --font-size-21: 21px;
        --font-size-22: 22px;
        --font-size-24: 24px;
        --font-size-26: 26px;
        --font-size-28: 28px;
        --font-size-30: 30px;
        --font-size-32: 32px;
        --font-size-34: 34px;
        --font-size-36: 36px;
        --font-size-38: 38px;
        --font-size-40: 40px;
        --font-size-42: 42px;
        --font-size-44: 44px;
        --font-size-46: 46px;
        --font-size-48: 48px
    }
}
.l__module-header { padding:var(--paddings) }
.l__module-header .boder .header { padding:5px 0 1px 3.2vw; border-left:2px solid #afafaf }
.l__module-header .boder .header .title { font-size:var(--font-size-28); color:var(--text-color-secondary) }
.l__module-header .boder .header .sub-title { color:var(--text-color-primary); font-size:var(--font-size-36); font-weight:bold; margin-top:0px ;font-family:"SourceHanSansbold";}
.l__module-header .boder .content { margin-top:7.6vw }
.l__applications { position:relative; padding-top:13.33vw }
.l__applications .app-swiper { margin-top:8vw; height:97.33vw }
.l__applications .app-swiper .swiper-slide { overflow:hidden }
.l__applications .app-swiper .swiper-slide img { width:100%; height:100%; object-fit:cover }
.l__applications .app-swiper .swiper-slide .content { position:absolute; top:10vw; left:9.375vw; color:#fff }
.l__applications .app-swiper .swiper-slide .content h1 { color:#fff; font-size:var(--font-size-42) }
.l__applications .app-swiper .swiper-slide .content p { width:100%; max-width:80.67vw; margin-top:3.4vw; font-size:var(--font-size-24) }
.l__applications .swiper-nav { width:100%; position:absolute; left:0; bottom:0; z-index:1; display:flex; justify-content:space-between }
.l__applications .swiper-nav .swiper { width:100% }
.l__applications .swiper-nav .swiper .swiper-slide { padding:2.93vw 0 2vw; width:33.33333vw; display:inline-flex; flex-direction:column; justify-content:center; align-items:center; cursor:pointer; transition:background-color .3s
}
.l__applications .swiper-nav .swiper .swiper-slide .icon { width:10.67vw; height:10.67vw; border-radius:50%; border:1px solid #fff; display:inline-flex; align-items:center; justify-content:center }
.l__applications .swiper-nav .swiper .swiper-slide .icon img { width:37.5%; height:37.5% }
.l__applications .swiper-nav .swiper .swiper-slide .icon .iconfont { font-size:4vw; color:#fff }
.l__applications .swiper-nav .swiper .swiper-slide .title { flex:1; font-size:var(--font-size-24); margin-top:1.93vw; color:#fff; text-align:center; line-height:1.2; display:flex; align-items:center; justify-content:center }
.l__applications .swiper-nav .swiper .swiper-slide:hover, .l__applications .swiper-nav .swiper .swiper-slide-thumb-active { background:rgba(0, 84, 161, .7) }

@media screen and (min-width: 992px) {
.l__module-header .boder {
display:flex;
align-items:flex-end;
justify-content:space-between
}
.l__module-header .boder .header {
padding:.26vw 0 1px 1.25vw
}
.l__module-header .boder .header .title {
font-size:var(--font-size-18)
}
.l__module-header .boder .header .sub-title {
margin-top:1.042vw;
font-size:var(--font-size-36)
}
.l__module-header .boder .content {
margin-top:0;
display:flex;
align-items:flex-end;
justify-content:space-between
}
.l__module-header .boder .content .detail-url .iconfont {
font-size:var(--font-size-18);
margin-left:.885vw
}
.l__applications {
padding-top:3.646vw
}
.l__applications .app-swiper {
margin-top:3.646vw;
height:auto
}
.l__applications .app-swiper .swiper-slide img {
height:auto
}
.l__applications .app-swiper .swiper-slide .content {
top:5.833vw
}
.l__applications .app-swiper .swiper-slide .content h1 {
font-size:24px
}
.l__applications .app-swiper .swiper-slide .content p {
margin-top:1.823vw;
max-width:610px;
font-size:var(--font-size-18)
}
.l__applications .swiper-nav .swiper .swiper-slide {
flex:1;
max-width:unset;
padding:1.041667vw 0 .520833vw
}
.l__applications .swiper-nav .swiper .swiper-slide .icon {
width:4.167vw;
height:4.167vw
}
.l__applications .swiper-nav .swiper .swiper-slide .icon .iconfont {
font-size:1.5625vw
}
.l__applications .swiper-nav .swiper .swiper-slide .title {
font-size:var(--font-size-16);
margin-top:1.146vw
}
}
@media screen and (min-width: 1440px) {
.l__module-header .boder .content .detail-url .iconfont {
font-size:1.042vw
}
.l__applications .app-swiper .swiper-slide .content h1 {
font-size:1.5625vw
}
}
@media screen and (min-width: 1920px) {
.l__applications .app-swiper .swiper-slide .content h1 {
font-size:30px
}
.l__applications .swiper-nav .swiper .swiper-slide {
padding:20px 0 15px
}
.l__applications .swiper-nav .swiper .swiper-slide .icon {
width:80px;
height:80px
}
.l__applications .swiper-nav .swiper .swiper-slide .icon .iconfont {
font-size:30px
}
.l__applications .swiper-nav .swiper .swiper-slide .title {
margin-top:22px
}

}